Merge pull request #283 from DavitBakhutashvili/feat/add-api-key

Feat/add api key

apps/ui/.env.develop

@@ -19,6 +19,7 @@ REACT_APP_TERMS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/terms.md
 REACT_APP_PRIVACY=https://github.com/l3vels/L3AGI/blob/main/docs/privacy.md
 REACT_APP_BASICS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/basic.md
 REACT_APP_AGENTS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/agent.md
+REACT_APP_API_KEYS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/apiKeys.md
 REACT_APP_DATASOURCES_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/datasource.md
 REACT_APP_TOOLS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/toolkit.md
 

apps/ui/.env.local

@@ -22,6 +22,7 @@ REACT_APP_YOUTUBE_VIDEO_ID=i84RodECglM
 REACT_APP_TERMS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/terms.md
 REACT_APP_PRIVACY=https://github.com/l3vels/L3AGI/blob/main/docs/privacy.md
 REACT_APP_BASICS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/basic.md
+REACT_APP_API_KEYS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/apiKeys.md
 REACT_APP_AGENTS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/agent.md
 REACT_APP_DATASOURCES_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/datasource.md
 REACT_APP_TOOLS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/toolkit.md

apps/ui/.env.production

@@ -20,6 +20,7 @@ REACT_APP_TERMS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/terms.md
 REACT_APP_PRIVACY=https://github.com/l3vels/L3AGI/blob/main/docs/privacy.md
 REACT_APP_BASICS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/basic.md
 REACT_APP_AGENTS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/agent.md
+REACT_APP_API_KEYS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/apiKeys.md
 REACT_APP_DATASOURCES_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/datasource.md
 REACT_APP_TOOLS_LINK=https://github.com/l3vels/L3AGI/blob/main/docs/toolkit.md
 

apps/ui/src/@types/vite-env.d.ts

@@ -21,6 +21,7 @@ interface ImportMetaEnv {
   readonly REACT_APP_TERMS_LINK: string
   readonly REACT_APP_PRIVACY: string
   readonly REACT_APP_BASICS_LINK: string
+  readonly REACT_APP_API_KEYS_LINK: string
   readonly REACT_APP_AGENTS_LINK: string
   readonly REACT_APP_DATASOURCES_LINK: string
   readonly REACT_APP_TOOLS_LINK: string

apps/ui/src/Route.tsx

@@ -88,6 +88,8 @@ import ScheduleRunModal from 'modals/ScheduleRunModal'
 import RunLogsModal from 'modals/RunLogsModal/RunLogsModal'
 import CreateFineTuningForm from 'pages/Models/FineTuning/FineTuningForm/CreateFineTuningForm'
 import EditFineTuningForm from 'pages/Models/FineTuning/FineTuningForm/EditFineTuningForm'
+import CreateApiKeyForm from 'pages/ApiKeys/CreateApiKey/CreateApikeysForm'
+import EditApiKeyForm from 'pages/ApiKeys/EditApiKey/EditApiKeysForm'
 import Integrations from 'pages/Integrations'
 import VoiceView from 'plugins/contact/pages/Voice/VoiceView'
 import VoiceModal from 'modals/VoiceModal'
@@ -305,6 +307,19 @@ const Route = () => {
               />
             </Router>
 
+            <Router path='api-key' element={<MainRouteLayout />} key={document.location.href}>
+              <Router index element={<ApiKeys />} key={document.location.href} />
+              <Router
+                path={'create-api-key'}
+                element={<CreateApiKeyForm />}
+                key={document.location.href}
+              />
+              <Router
+                path={':apiKeyId/edit-api-key'}
+                element={<EditApiKeyForm />}
+                key={document.location.href}
+              />
+            </Router>
             {/* <Router path={'groups'} element={<MainRouteLayout />} key={document.location.href}>
               <Router index element={<Group />} key={document.location.href} />
             </Router> */}

apps/ui/src/components/AvatarDropDown.tsx

@@ -11,6 +11,7 @@ import {
 } from '@radix-ui/react-dropdown-menu'
 
 import Avatar from '@l3-lib/ui-core/dist/Avatar'
+import API from '@l3-lib/ui-core/dist/icons/API'
 import Typography from '@l3-lib/ui-core/dist/Typography'
 import styled, { css, keyframes } from 'styled-components'
 
@@ -101,9 +102,23 @@ const AvatarDropDown = () => {
             style={{ fontSize: '12px', fontStyle: 'normal', fontWeight: '500', lineHeight: '16px' }}
           />
         </StyledDropDownMenuItem>
+        <StyledDropDownMenuItem onClick={() => navigate('api-key')}>
+          <StyledAPIIcon size={20} />
+
+          <TypographyPrimary
+            value='API Keys'
+            type={Typography.types.P}
+            size={Typography.sizes.xss}
+            style={{
+              fontSize: '12px',
+              fontStyle: 'normal',
+              fontWeight: '500',
+              lineHeight: '16px',
+            }}
+          />
+        </StyledDropDownMenuItem>
         <StyledDropDownMenuItem onClick={handleLogout}>
           <StyledLogOutIcon size={20} />
-
           <TypographyPrimary
             value={t('logout')}
             type={Typography.types.P}
@@ -331,3 +346,9 @@ const StyledSettingsIcon = styled(Settings)`
     stroke: ${({ theme }) => theme.body.iconColor};
   }
 `
+
+const StyledAPIIcon = styled(API)`
+  path {
+    fill: ${({ theme }) => theme.body.iconColor};
+  }
+`

apps/ui/src/gql/apiKey/apiKeyById.gql

@@ -1,9 +1,14 @@
-query apiKeyById($id: ID!) @api(name: game) {
-  apiKeyById(id: $id) {
+query apiKeyById($id: id!) @api(name: "ai") {
+  apiKeyById(id: $id)
+    @rest(type: "ApiKeys", path: "/api-key/{args.id}", method: "GET", endpoint: "ai") {
+    id
     name
     token
-    note
-    expiration
-    games
+    description
+    is_deleted
+    account_id
+    created_on
+    created_by
+    modified_by
   }
 }

apps/ui/src/gql/apiKey/apiKeys.gql

@@ -1,15 +1,13 @@
-query apiKeys($filter: ListFilterQuery) @api(name: game) {
-  apiKeys(filter: $filter) {
-    items {
-      id
-      name
-      token
-      note
-      expiration
-      games
-      created_on
-      last_used
-    }
-    total_count
+query getApiKeys @api(name: "ai") {
+  getApiKeys @rest(type: "ApiKeys", path: "/api-key", method: "GET", endpoint: "ai") {
+    id
+    name
+    token
+    description
+    is_deleted
+    account_id
+    created_on
+    created_by
+    modified_by
   }
 }

apps/ui/src/gql/apiKey/createApiKey.gql

@@ -1,12 +1,14 @@
-mutation createApiKey($input: ApiKeyInput!) @api(name: game) {
-  createApiKey(input: $input) {
-    success
-    apiKey {
-      name
-      token
-      note
-      expiration
-      games
-    }
+mutation createApiKey($input: input!) @api(name: ai) {
+  createApiKey(input: $input)
+    @rest(type: "ApiKeys", path: "/api-key", method: "POST", bodyKey: "input", endpoint: "ai") {
+    id
+    name
+    token
+    description
+    is_deleted
+    account_id
+    created_on
+    created_by
+    modified_by
   }
 }

apps/ui/src/gql/apiKey/deleteApikeyById.gql

@@ -1,12 +1,12 @@
-mutation deleteApiKey($id: ID!) @api(name: game) {
-  deleteApiKey(id: $id) {
-    id
-    name
-    token
-    note
-    expiration
-    games
-    created_on
-    last_used
+mutation deleteApiKey($id: id!) @api(name: ai) {
+  deleteApiKey(id: $id)
+    @rest(
+      type: "ApiKeys"
+      path: "/api-key/{args.id}"
+      method: "DELETE"
+      bodyKey: "input"
+      endpoint: "ai"
+    ) {
+    agent
   }
 }

apps/ui/src/gql/apiKey/updateApiKey.gql

@@ -1,15 +1,17 @@
-mutation updateApiKey($id: ID!, $input: ApiKeyInput!) @api(name: game) {
-  updateApiKey(id: $id, input: $input) {
+mutation updateApiKey($id: id!, $input: input!) @api(name: "ai") {
+  updateApiKey(id: $id, input: $input)
+    @rest(type: "ApiKeys", path: "/api-key/{args.id}", method: "PUT", endpoint: "ai") {
     success
     apiKey {
       id
       name
       token
-      note
-      expiration
-      games
+      description
+      is_deleted
+      account_id
       created_on
-      last_used
+      created_by
+      modified_by
     }
   }
 }

apps/ui/src/i18n/locales/en.json

@@ -90,6 +90,7 @@
   "create-asset": "Create Asset",
   "create-session": "Create Session",
   "create-secret-key": "Create secret key",
+  "create-api-key": "Create Api key",
   "create-new-secret-key": "Create a new secret key",
   "createAgent": "Create Agent",
   "custom-fields": "Custom Fields",