diff --git a/packages/server/src/index.ts b/packages/server/src/index.ts
index ba6c3ce0..4307946b 100644
--- a/packages/server/src/index.ts
+++ b/packages/server/src/index.ts
@@ -1135,28 +1135,50 @@ export class App {
// API Keys
// ----------------------------------------
+ const addChatflowsCount = async (keys: any, res: Response) => {
+ if (keys) {
+ const updatedKeys: any[] = []
+ //iterate through keys and get chatflows
+ for (const key of keys) {
+ const chatflows = await this.AppDataSource.getRepository(ChatFlow)
+ .createQueryBuilder('cf')
+ .where('cf.apikeyid = :apikeyid', { apikeyid: key.id })
+ .getMany()
+ const linkedChatFlows: any[] = []
+ chatflows.map((cf) => {
+ linkedChatFlows.push({
+ flowName: cf.name
+ })
+ })
+ key.chatFlows = linkedChatFlows
+ updatedKeys.push(key)
+ }
+ return res.json(updatedKeys)
+ }
+ return res.json(keys)
+ }
// Get api keys
this.app.get('/api/v1/apikey', async (req: Request, res: Response) => {
const keys = await getAPIKeys()
- return res.json(keys)
+ return addChatflowsCount(keys, res)
})
// Add new api key
this.app.post('/api/v1/apikey', async (req: Request, res: Response) => {
const keys = await addAPIKey(req.body.keyName)
- return res.json(keys)
+ return addChatflowsCount(keys, res)
})
// Update api key
this.app.put('/api/v1/apikey/:id', async (req: Request, res: Response) => {
const keys = await updateAPIKey(req.params.id, req.body.keyName)
- return res.json(keys)
+ return addChatflowsCount(keys, res)
})
// Delete new api key
this.app.delete('/api/v1/apikey/:id', async (req: Request, res: Response) => {
const keys = await deleteAPIKey(req.params.id)
- return res.json(keys)
+ return addChatflowsCount(keys, res)
})
// Verify api key
diff --git a/packages/ui/src/views/apikey/index.js b/packages/ui/src/views/apikey/index.js
index a2b2e639..226baaee 100644
--- a/packages/ui/src/views/apikey/index.js
+++ b/packages/ui/src/views/apikey/index.js
@@ -6,6 +6,7 @@ import { enqueueSnackbar as enqueueSnackbarAction, closeSnackbar as closeSnackba
import {
Button,
Box,
+ Chip,
Stack,
Table,
TableBody,
@@ -37,7 +38,7 @@ import useConfirm from 'hooks/useConfirm'
import useNotifier from 'utils/useNotifier'
// Icons
-import { IconTrash, IconEdit, IconCopy, IconX, IconPlus, IconEye, IconEyeOff } from '@tabler/icons'
+import { IconTrash, IconEdit, IconCopy, IconCornerDownRight, IconX, IconPlus, IconEye, IconEyeOff } from '@tabler/icons'
import APIEmptySVG from 'assets/images/api_empty.svg'
// ==============================|| APIKey ||============================== //
@@ -106,7 +107,10 @@ const APIKey = () => {
const deleteKey = async (key) => {
const confirmPayload = {
title: `Delete`,
- description: `Delete key ${key.keyName}?`,
+ description:
+ key.chatFlows.length === 0
+ ? `Delete key [${key.keyName}] ? `
+ : `Delete key [${key.keyName}] ?\n There are ${key.chatFlows.length} chatflows using this key.`,
confirmButtonName: 'Delete',
cancelButtonName: 'Cancel'
}
@@ -193,6 +197,7 @@ const APIKey = () => {
Key Name
API Key
+ Usage
Created
@@ -200,65 +205,78 @@ const APIKey = () => {
{apiKeys.map((key, index) => (
-
-
- {key.keyName}
-
-
- {showApiKeys.includes(key.apiKey)
- ? key.apiKey
- : `${key.apiKey.substring(0, 2)}${'•'.repeat(18)}${key.apiKey.substring(
- key.apiKey.length - 5
- )}`}
- {
- navigator.clipboard.writeText(key.apiKey)
- setAnchorEl(event.currentTarget)
- setTimeout(() => {
- handleClosePopOver()
- }, 1500)
- }}
- >
-
-
- onShowApiKeyClick(key.apiKey)}>
- {showApiKeys.includes(key.apiKey) ? : }
-
-
-
+
+
+ {key.keyName}
+
+
+ {showApiKeys.includes(key.apiKey)
+ ? key.apiKey
+ : `${key.apiKey.substring(0, 2)}${'•'.repeat(18)}${key.apiKey.substring(
+ key.apiKey.length - 5
+ )}`}
+ {
+ navigator.clipboard.writeText(key.apiKey)
+ setAnchorEl(event.currentTarget)
+ setTimeout(() => {
+ handleClosePopOver()
+ }, 1500)
+ }}
>
- Copied!
-
-
-
- {key.createdAt}
-
- edit(key)}>
-
-
-
-
- deleteKey(key)}>
-
-
-
-
+
+
+ onShowApiKeyClick(key.apiKey)}>
+ {showApiKeys.includes(key.apiKey) ? : }
+
+
+
+ Copied!
+
+
+
+ {key.chatFlows.length}
+ {key.createdAt}
+
+ edit(key)}>
+
+
+
+
+ deleteKey(key)}>
+
+
+
+
+ {key.chatFlows.length > 0 && (
+
+
+ {' '}
+ {key.chatFlows.map((flow, index) => (
+
+ ))}
+
+
+ )}
+ >
))}