Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-20 10:20:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

🎛️ fix: Improve Frontend Practices for Audio Settings (#3624)

Browse source 
* refactor: do not call await inside useCallbacks, rely on updates for dropdown

* fix: remember last selected voice

* refactor: Update Speech component to use TypeScript in useCallback

* refactor: Update Dropdown component styles to match header theme
This commit is contained in:
Danny Avila 2024-08-13 02:42:49 -04:00 • committed by GitHub
parent 8cbb6ba166
commit 05696233a9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
20 changed files with 436 additions and 367 deletions
Download patch file Download diff file Expand all files Collapse all files

24
client/src/components/Input/SetKeyDialog/SetKeyDialog.tsx
View file

@ -35,13 +35,13 @@ const formSet: Set<string> = new Set([
]);
const EXPIRY = {
THIRTY_MINUTES: { display: 'in 30 minutes', value: 30 * 60 * 1000 },
TWO_HOURS: { display: 'in 2 hours', value: 2 * 60 * 60 * 1000 },
TWELVE_HOURS: { display: 'in 12 hours', value: 12 * 60 * 60 * 1000 },
ONE_DAY: { display: 'in 1 day', value: 24 * 60 * 60 * 1000 },
ONE_WEEK: { display: 'in 7 days', value: 7 * 24 * 60 * 60 * 1000 },
ONE_MONTH: { display: 'in 30 days', value: 30 * 24 * 60 * 60 * 1000 },
NEVER: { display: 'never', value: 0 },
THIRTY_MINUTES: { label: 'in 30 minutes', value: 30 * 60 * 1000 },
TWO_HOURS: { label: 'in 2 hours', value: 2 * 60 * 60 * 1000 },
TWELVE_HOURS: { label: 'in 12 hours', value: 12 * 60 * 60 * 1000 },
ONE_DAY: { label: 'in 1 day', value: 24 * 60 * 60 * 1000 },
ONE_WEEK: { label: 'in 7 days', value: 7 * 24 * 60 * 60 * 1000 },
ONE_MONTH: { label: 'in 30 days', value: 30 * 24 * 60 * 60 * 1000 },
NEVER: { label: 'never', value: 0 },
};
const SetKeyDialog = ({
@ -72,7 +72,7 @@ const SetKeyDialog = ({
const [userKey, setUserKey] = useState('');
const { data: endpointsConfig } = useGetEndpointsQuery();
const [expiresAtLabel, setExpiresAtLabel] = useState(EXPIRY.TWELVE_HOURS.display);
const [expiresAtLabel, setExpiresAtLabel] = useState(EXPIRY.TWELVE_HOURS.label);
const { getExpiry, saveUserKey } = useUserKey(endpoint);
const { showToast } = useToastContext();
const localize = useLocalize();
@ -84,7 +84,7 @@ const SetKeyDialog = ({
};
const submit = () => {
const selectedOption = expirationOptions.find((option) => option.display === expiresAtLabel);
const selectedOption = expirationOptions.find((option) => option.label === expiresAtLabel);
let expiresAt;
if (selectedOption?.value === 0) {
@ -170,14 +170,14 @@ const SetKeyDialog = ({
{expiryTime === 'never'
? localize('com_endpoint_config_key_never_expires')
: `${localize('com_endpoint_config_key_encryption')} ${new Date(
expiryTime,
expiryTime ?? 0,
).toLocaleString()}`}
</small>{' '}
<Dropdown
label="Expires "
value={expiresAtLabel}
onChange={handleExpirationChange}
options={expirationOptions.map((option) => option.display)}
options={expirationOptions.map((option) => option.label)}
sizeClasses="w-[185px]"
/>
<FormProvider {...methods}>
@ -185,7 +185,7 @@ const SetKeyDialog = ({
userKey={userKey}
setUserKey={setUserKey}
endpoint={
endpoint === EModelEndpoint.gptPlugins && config?.azure
endpoint === EModelEndpoint.gptPlugins && (config?.azure ?? false)
? EModelEndpoint.azureOpenAI
: endpoint
}