From 25c39bd7dabb1652749e080ce7c59ba0dde676ee Mon Sep 17 00:00:00 2001 From: Debanjum Date: Sat, 11 Jan 2025 13:33:25 +0700 Subject: [PATCH 1/6] Extract api keys setting card into separate component on web app --- src/interface/web/app/settings/page.tsx | 157 +++++++++++------------- 1 file changed, 70 insertions(+), 87 deletions(-) diff --git a/src/interface/web/app/settings/page.tsx b/src/interface/web/app/settings/page.tsx index cd419e40..20c979a5 100644 --- a/src/interface/web/app/settings/page.tsx +++ b/src/interface/web/app/settings/page.tsx @@ -490,6 +490,75 @@ const useApiKeys = () => { }; }; +function ApiKeyCard() { + const { apiKeys, generateAPIKey, copyAPIKey, deleteAPIKey } = useApiKeys(); + const { toast } = useToast(); + + return ( + + + + + API Keys + + + + +

+ Access Khoj from the{" "} + + Desktop + + , Obsidian,{" "} + Emacs apps and more. +

+ + + {apiKeys.map((key) => ( + + {key.name} + + + {`${key.token.slice(0, 6)}...${key.token.slice(-4)}`} + +
+ { + toast({ + title: `🔑 Copied API Key: ${key.name}`, + description: `Set this API key in the Khoj apps you want to connect to this Khoj account`, + }); + copyAPIKey(key.token); + }} + /> + { + toast({ + title: `🔑 Deleted API Key: ${key.name}`, + description: `Apps using this API key will no longer connect to this Khoj account`, + }); + deleteAPIKey(key.token); + }} + /> +
+ + + ))} + +
+ + + + ); +} + enum PhoneNumberValidationState { Setup = "setup", SendOTP = "otp", @@ -498,7 +567,6 @@ enum PhoneNumberValidationState { } export default function SettingsView() { - const { apiKeys, generateAPIKey, copyAPIKey, deleteAPIKey } = useApiKeys(); const { userConfig: initialUserConfig } = useUserConfig(true); const [userConfig, setUserConfig] = useState(null); const [name, setName] = useState(undefined); @@ -1333,92 +1401,7 @@ export default function SettingsView() { Clients
- {!userConfig.anonymous_mode && ( - - - - - API Keys - - - - -

- Access Khoj from the{" "} - - Desktop - - ,{" "} - - Obsidian - - ,{" "} - - Emacs - {" "} - apps and more. -

- - - {apiKeys.map((key) => ( - - - {key.name} - - - - {`${key.token.slice(0, 6)}...${key.token.slice(-4)}`} - -
- { - toast({ - title: `🔑 Copied API Key: ${key.name}`, - description: `Set this API key in the Khoj apps you want to connect to this Khoj account`, - }); - copyAPIKey( - key.token, - ); - }} - /> - { - toast({ - title: `🔑 Deleted API Key: ${key.name}`, - description: `Apps using this API key will no longer connect to this Khoj account`, - }); - deleteAPIKey( - key.token, - ); - }} - /> -
- - - ))} - -
- - - - )} + {!userConfig.anonymous_mode && } From 9e8b8dc5a2575f8347d17b8709de69df3878bf66 Mon Sep 17 00:00:00 2001 From: Debanjum Date: Sat, 11 Jan 2025 13:38:39 +0700 Subject: [PATCH 2/6] Toggle showing api key on web settings page via a visibility toggle - Background Access to the clipboard API is disabled by certain browsers in non localhost http scenarios for security reasons. So the copy API key button doesn't work when khoj is self-hosted with authentication enabled at a non localhost domain - Change This change enables copying API keys by manual text highlight + copy if copy button is disabled Resolves #1070 --- src/interface/web/app/settings/page.tsx | 32 +++++++++++++++++++++++-- 1 file changed, 30 insertions(+), 2 deletions(-) diff --git a/src/interface/web/app/settings/page.tsx b/src/interface/web/app/settings/page.tsx index 20c979a5..5c9b72b3 100644 --- a/src/interface/web/app/settings/page.tsx +++ b/src/interface/web/app/settings/page.tsx @@ -59,6 +59,8 @@ import { Check, CaretDown, Waveform, + EyeSlash, + Eye, } from "@phosphor-icons/react"; import Loading from "../components/loading/loading"; @@ -492,6 +494,7 @@ const useApiKeys = () => { function ApiKeyCard() { const { apiKeys, generateAPIKey, copyAPIKey, deleteAPIKey } = useApiKeys(); + const [visibleApiKeys, setVisibleApiKeys] = useState>(new Set()); const { toast } = useToast(); return ( @@ -521,10 +524,35 @@ function ApiKeyCard() { {key.name} - - {`${key.token.slice(0, 6)}...${key.token.slice(-4)}`} + + {visibleApiKeys.has(key.token) + ? key.token + : `${key.token.slice(0, 6)}...${key.token.slice(-4)}`}
+ {visibleApiKeys.has(key.token) ? ( + + setVisibleApiKeys((prev) => { + const next = new Set(prev); + next.delete(key.token); + return next; + }) + } + /> + ) : ( + + setVisibleApiKeys( + new Set([...visibleApiKeys, key.token]), + ) + } + /> + )} Date: Sat, 11 Jan 2025 14:39:02 +0700 Subject: [PATCH 3/6] Add contrast to setting card inputs in dark mode on web app --- src/interface/web/app/settings/page.tsx | 4 ++-- src/interface/web/app/settings/settings.module.css | 1 + 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/interface/web/app/settings/page.tsx b/src/interface/web/app/settings/page.tsx index 5c9b72b3..38481ad5 100644 --- a/src/interface/web/app/settings/page.tsx +++ b/src/interface/web/app/settings/page.tsx @@ -523,7 +523,7 @@ function ApiKeyCard() { {apiKeys.map((key) => ( {key.name} - + {visibleApiKeys.has(key.token) ? key.token @@ -611,7 +611,7 @@ export default function SettingsView() { const title = "Settings"; const cardClassName = - "w-full lg:w-5/12 grid grid-flow-column border border-gray-300 shadow-md rounded-lg border dark:border-none dark:bg-muted border-opacity-50"; + "w-full lg:w-5/12 grid grid-flow-column border border-gray-300 shadow-md rounded-lg border dark:border-none border-opacity-50 dark:bg-muted"; useEffect(() => { setUserConfig(initialUserConfig); diff --git a/src/interface/web/app/settings/settings.module.css b/src/interface/web/app/settings/settings.module.css index 5cb41e51..195b6b4c 100644 --- a/src/interface/web/app/settings/settings.module.css +++ b/src/interface/web/app/settings/settings.module.css @@ -23,6 +23,7 @@ div.phoneInput input { width: 100%; padding: 0.5rem; border: 1px solid hsla(var(--border)); + background-color: hsla(var(--background)); border-radius: 0.25rem; } From 6bd9f6bb6196adb48b18be1fe7b48033cc882dc6 Mon Sep 17 00:00:00 2001 From: Debanjum Date: Sun, 12 Jan 2025 10:52:34 +0700 Subject: [PATCH 4/6] Give a shorter, simpler name to github workflow to deploy docs --- .github/workflows/github_pages_deploy.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/github_pages_deploy.yml b/.github/workflows/github_pages_deploy.yml index 13d15269..9e02c97f 100644 --- a/.github/workflows/github_pages_deploy.yml +++ b/.github/workflows/github_pages_deploy.yml @@ -1,4 +1,4 @@ -name: build and deploy github pages for documentation +name: deploy documentation on: push: branches: From 96e3d0a7b901edd9b76bfbf4592ec63a0627f3f0 Mon Sep 17 00:00:00 2001 From: Osama Ata <370095+osama-ata@users.noreply.github.com> Date: Sun, 12 Jan 2025 14:06:01 +0300 Subject: [PATCH 5/6] Fix stale lmstudio documentation to set ai model api via admin panel (#1075) Use new name `Ai Model API` instead of `OpenAI Processor Conversation Config` --- documentation/docs/advanced/lmstudio.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/documentation/docs/advanced/lmstudio.md b/documentation/docs/advanced/lmstudio.md index 1ecd7f06..59eb0592 100644 --- a/documentation/docs/advanced/lmstudio.md +++ b/documentation/docs/advanced/lmstudio.md @@ -14,14 +14,14 @@ LM Studio can expose an [OpenAI API compatible server](https://lmstudio.ai/docs/ ## Setup 1. Install [LM Studio](https://lmstudio.ai/) and download your preferred Chat Model 2. Go to the Server Tab on LM Studio, Select your preferred Chat Model and Click the green Start Server button -3. Create a new [OpenAI Processor Conversation Config](http://localhost:42110/server/admin/database/openaiprocessorconversationconfig/add) on your Khoj admin panel +3. Create a new [Add ai model api](http://localhost:42110/server/admin/database/aimodelapi/add/) on your Khoj admin panel - Name: `proxy-name` - Api Key: `any string` - Api Base Url: `http://localhost:1234/v1/` (default for LMStudio) 4. Create a new [Chat Model](http://localhost:42110/server/admin/database/chatmodel/add) on your Khoj admin panel. - Name: `llama3.1` (replace with the name of your local model) - Model Type: `Openai` - - Openai Config: `` + - Ai model api: `` - Max prompt size: `20000` (replace with the max prompt size of your model) - Tokenizer: *Do not set for OpenAI, mistral, llama3 based models* 5. Go to [your config](http://localhost:42110/settings) and select the model you just created in the chat model dropdown. From 7f329e7e9d379d9957c6d299db06a90ee6f59da8 Mon Sep 17 00:00:00 2001 From: sabaimran Date: Sun, 12 Jan 2025 22:37:08 -0800 Subject: [PATCH 6/6] Fix configuration of name field for chatmodel options during initalization --- src/khoj/utils/initialization.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/khoj/utils/initialization.py b/src/khoj/utils/initialization.py index a4864dcc..83062a21 100644 --- a/src/khoj/utils/initialization.py +++ b/src/khoj/utils/initialization.py @@ -267,7 +267,7 @@ def initialization(interactive: bool = True): ) # Remove models that are no longer available - existing_models.exclude(chat_model__in=available_models).delete() + existing_models.exclude(name__in=available_models).delete() except Exception as e: logger.warning(f"Failed to update models for {config.name}: {str(e)}")