mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-17 17:00:15 +01:00
refactor: Encrypt & Expire User Provided Keys, feat: Rate Limiting (#874)
* docs: make_your_own.md formatting fix for mkdocs * feat: add express-mongo-sanitize feat: add login/registration rate limiting * chore: remove unnecessary console log * wip: remove token handling from localStorage to encrypted DB solution * refactor: minor change to UserService * fix mongo query and add keys route to server * fix backend controllers and simplify schema/crud * refactor: rename token to key to separate from access/refresh tokens, setTokenDialog -> setKeyDialog * refactor(schemas): TEndpointOption token -> key * refactor(api): use new encrypted key retrieval system * fix(SetKeyDialog): fix key prop error * fix(abortMiddleware): pass random UUID if messageId is not generated yet for proper error display on frontend * fix(getUserKey): wrong prop passed in arg, adds error handling * fix: prevent message without conversationId from saving to DB, prevents branching on the frontend to a new top-level branch * refactor: change wording of multiple display messages * refactor(checkExpiry -> checkUserKeyExpiry): move to UserService file * fix: type imports from common * refactor(SubmitButton): convert to TS * refactor(key.ts): change localStorage map key name * refactor: add new custom tailwind classes to better match openAI colors * chore: remove unnecessary warning and catch ScreenShot error * refactor: move userKey frontend logic to hooks and remove use of localStorage and instead query the DB * refactor: invalidate correct query key, memoize userKey hook, conditionally render SetKeyDialog to avoid unnecessary calls, refactor SubmitButton props and useEffect for showing 'provide key first' * fix(SetKeyDialog): use enum-like object for expiry values feat(Dropdown): add optionsClassName to dynamically change dropdown options container classes * fix: handle edge case where user had provided a key but the server changes to env variable for keys * refactor(OpenAI/titleConvo): move titling to client to retain authorized credentials in message lifecycle for titling * fix(azure): handle user_provided keys correctly for azure * feat: send user Id to OpenAI to differentiate users in completion requests * refactor(OpenAI/titleConvo): adding tokens helps minimize LLM from using the language in title response * feat: add delete endpoint for keys * chore: remove throttling of title * feat: add 'Data controls' to Settings, add 'Revoke' keys feature in Key Dialog and Data controls * refactor: reorganize PluginsClient files in langchain format * feat: use langchain for titling convos * chore: cleanup titling convo, with fallback to original method, escape braces, use only snippet for language detection * refactor: move helper functions to appropriate langchain folders for reusability * fix: userProvidesKey handling for gptPlugins * fix: frontend handling of plugins key * chore: cleanup logging and ts-ignore SSE * fix: forwardRef misuse in DangerButton * fix(GoogleConfig/FileUpload): localize errors and simplify validation with zod * fix: cleanup google logging and fix user provided key handling * chore: remove titling from google * chore: removing logging from browser endpoint * wip: fix menu flicker * feat: useLocalStorage hook * feat: add Tooltip for UI * refactor(EndpointMenu): utilize Tooltip and useLocalStorage, remove old 'New Chat' slide-over * fix(e2e): use testId for endpoint menu trigger * chore: final touches to EndpointMenu before future refactor to declutter component * refactor(localization): change select endpoint to open menu and add translations * chore: add final prop to error message response * ci: minor edits to facilitate testing * ci: new e2e test which tests for new key setting/revoking features
This commit is contained in:
Danny Avila
GitHub
parent
64f1557852
commit
4ca43fb53d
122 changed files with 1933 additions and 966 deletions
127
client/src/components/Input/SetKeyDialog/OpenAIConfig.tsx
Normal file
127
client/src/components/Input/SetKeyDialog/OpenAIConfig.tsx
Normal file
|
|
@ -0,0 +1,127 @@
|
|||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
import React, { useEffect, useState } from 'react';
|
||||
// TODO: Temporarily remove checkbox until Plugins solution for Azure is figured out
|
||||
// import * as Checkbox from '@radix-ui/react-checkbox';
|
||||
// import { CheckIcon } from '@radix-ui/react-icons';
|
||||
import InputWithLabel from './InputWithLabel';
|
||||
import type { TConfigProps } from '~/common';
|
||||
|
||||
function isJson(str: string) {
|
||||
try {
|
||||
JSON.parse(str);
|
||||
} catch (e) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
const OpenAIConfig = ({ userKey, setUserKey, endpoint }: TConfigProps) => {
|
||||
const [showPanel, setShowPanel] = useState(endpoint === 'azureOpenAI');
|
||||
|
||||
useEffect(() => {
|
||||
if (isJson(userKey)) {
|
||||
setShowPanel(true);
|
||||
}
|
||||
setUserKey('');
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!showPanel && isJson(userKey)) {
|
||||
setUserKey('');
|
||||
}
|
||||
}, [showPanel]);
|
||||
|
||||
function getAzure(name: string) {
|
||||
if (isJson(userKey)) {
|
||||
const newKey = JSON.parse(userKey);
|
||||
return newKey[name];
|
||||
} else {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
function setAzure(name: string, value: number | string | boolean) {
|
||||
let newKey = {};
|
||||
if (isJson(userKey)) {
|
||||
newKey = JSON.parse(userKey);
|
||||
}
|
||||
newKey[name] = value;
|
||||
|
||||
setUserKey(JSON.stringify(newKey));
|
||||
}
|
||||
return (
|
||||
<>
|
||||
{!showPanel ? (
|
||||
<>
|
||||
<InputWithLabel
|
||||
id={endpoint}
|
||||
value={userKey ?? ''}
|
||||
onChange={(e: { target: { value: string } }) => setUserKey(e.target.value ?? '')}
|
||||
label={'OpenAI API Key'}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<InputWithLabel
|
||||
id={'instanceNameLabel'}
|
||||
value={getAzure('azureOpenAIApiInstanceName') ?? ''}
|
||||
onChange={(e: { target: { value: string } }) =>
|
||||
setAzure('azureOpenAIApiInstanceName', e.target.value ?? '')
|
||||
}
|
||||
label={'Azure OpenAI Instance Name'}
|
||||
/>
|
||||
|
||||
<InputWithLabel
|
||||
id={'deploymentNameLabel'}
|
||||
value={getAzure('azureOpenAIApiDeploymentName') ?? ''}
|
||||
onChange={(e: { target: { value: string } }) =>
|
||||
setAzure('azureOpenAIApiDeploymentName', e.target.value ?? '')
|
||||
}
|
||||
label={'Azure OpenAI Deployment Name'}
|
||||
/>
|
||||
|
||||
<InputWithLabel
|
||||
id={'versionLabel'}
|
||||
value={getAzure('azureOpenAIApiVersion') ?? ''}
|
||||
onChange={(e: { target: { value: string } }) =>
|
||||
setAzure('azureOpenAIApiVersion', e.target.value ?? '')
|
||||
}
|
||||
label={'Azure OpenAI API Version'}
|
||||
/>
|
||||
|
||||
<InputWithLabel
|
||||
id={'apiKeyLabel'}
|
||||
value={getAzure('azureOpenAIApiKey') ?? ''}
|
||||
onChange={(e: { target: { value: string } }) =>
|
||||
setAzure('azureOpenAIApiKey', e.target.value ?? '')
|
||||
}
|
||||
label={'Azure OpenAI API Key'}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{/* { endpoint === 'gptPlugins' && (
|
||||
<div className="flex items-center">
|
||||
<Checkbox.Root
|
||||
className="flex h-[20px] w-[20px] appearance-none items-center justify-center rounded-[4px] bg-gray-100 text-white outline-none hover:bg-gray-200 dark:bg-gray-700 dark:hover:bg-gray-900"
|
||||
id="azureOpenAI"
|
||||
checked={showPanel}
|
||||
onCheckedChange={() => setShowPanel(!showPanel)}
|
||||
>
|
||||
<Checkbox.Indicator className="flex h-[20px] w-[20px] items-center justify-center rounded-[3.5px] bg-green-600">
|
||||
<CheckIcon />
|
||||
</Checkbox.Indicator>
|
||||
</Checkbox.Root>
|
||||
|
||||
<label
|
||||
className="pl-[8px] text-[15px] leading-none dark:text-white"
|
||||
htmlFor="azureOpenAI"
|
||||
>
|
||||
Use Azure OpenAI.
|
||||
</label>
|
||||
</div>
|
||||
)} */}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default OpenAIConfig;
|
||||
Loading…
Add table
Add a link
Reference in a new issue