LibreChat/client/src/hooks/useSetIndexOptions.ts
Danny Avila 29473a72db
💫 feat: Config File & Custom Endpoints (#1474)
* WIP(backend/api): custom endpoint

* WIP(frontend/client): custom endpoint

* chore: adjust typedefs for configs

* refactor: use data-provider for cache keys and rename enums and custom endpoint for better clarity and compatibility

* feat: loadYaml utility

* refactor: rename back to  from  and proof-of-concept for creating schemas from user-defined defaults

* refactor: remove custom endpoint from default endpointsConfig as it will be exclusively managed by yaml config

* refactor(EndpointController): rename variables for clarity

* feat: initial load custom config

* feat(server/utils): add simple `isUserProvided` helper

* chore(types): update TConfig type

* refactor: remove custom endpoint handling from model services as will be handled by config, modularize fetching of models

* feat: loadCustomConfig, loadConfigEndpoints, loadConfigModels

* chore: reorganize server init imports, invoke loadCustomConfig

* refactor(loadConfigEndpoints/Models): return each custom endpoint as standalone endpoint

* refactor(Endpoint/ModelController): spread config values after default (temporary)

* chore(client): fix type issues

* WIP: first pass for multiple custom endpoints
- add endpointType to Conversation schema
- add update zod schemas for both convo/presets to allow non-EModelEndpoint value as endpoint (also using type assertion)
- use `endpointType` value as `endpoint` where mapping to type is necessary using this field
- use custom defined `endpoint` value and not type for mapping to modelsConfig
- misc: add return type to `getDefaultEndpoint`
- in `useNewConvo`, add the endpointType if it wasn't already added to conversation
- EndpointsMenu: use user-defined endpoint name as Title in menu
- TODO: custom icon via custom config, change unknown to robot icon

* refactor(parseConvo): pass args as an object and change where used accordingly; chore: comment out 'create schema' code

* chore: remove unused availableModels field in TConfig type

* refactor(parseCompactConvo): pass args as an object and change where used accordingly

* feat: chat through custom endpoint

* chore(message/convoSchemas): avoid saving empty arrays

* fix(BaseClient/saveMessageToDatabase): save endpointType

* refactor(ChatRoute): show Spinner if endpointsQuery or modelsQuery are still loading, which is apparent with slow fetching of models/remote config on first serve

* fix(useConversation): assign endpointType if it's missing

* fix(SaveAsPreset): pass real endpoint and endpointType when saving Preset)

* chore: recorganize types order for TConfig, add `iconURL`

* feat: custom endpoint icon support:
- use UnknownIcon in all icon contexts
- add mistral and openrouter as known endpoints, and add their icons
- iconURL support

* fix(presetSchema): move endpointType to default schema definitions shared between convoSchema and defaults

* refactor(Settings/OpenAI): remove legacy `isOpenAI` flag

* fix(OpenAIClient): do not invoke abortCompletion on completion error

* feat: add responseSender/label support for custom endpoints:
- use defaultModelLabel field in endpointOption
- add model defaults for custom endpoints in `getResponseSender`
- add `useGetSender` hook which uses EndpointsQuery to determine `defaultModelLabel`
- include defaultModelLabel from endpointConfig in custom endpoint client options
- pass `endpointType` to `getResponseSender`

* feat(OpenAIClient): use custom options from config file

* refactor: rename `defaultModelLabel` to `modelDisplayLabel`

* refactor(data-provider): separate concerns from `schemas` into `parsers`, `config`, and fix imports elsewhere

* feat: `iconURL` and extract environment variables from custom endpoint config values

* feat: custom config validation via zod schema, rename and move to `./projectRoot/librechat.yaml`

* docs: custom config docs and examples

* fix(OpenAIClient/mistral): mistral does not allow singular system message, also add `useChatCompletion` flag to use openai-node for title completions

* fix(custom/initializeClient): extract env var and use `isUserProvided` function

* Update librechat.example.yaml

* feat(InputWithLabel): add className props, and forwardRef

* fix(streamResponse): handle error edge case where either messages or convos query throws an error

* fix(useSSE): handle errorHandler edge cases where error response is and is not properly formatted from API, especially when a conversationId is not yet provided, which ensures stream is properly closed on error

* feat: user_provided keys for custom endpoints

* fix(config/endpointSchema): do not allow default endpoint values in custom endpoint `name`

* feat(loadConfigModels): extract env variables and optimize fetching models

* feat: support custom endpoint iconURL for messages and Nav

* feat(OpenAIClient): add/dropParams support

* docs: update docs with default params, add/dropParams, and notes to use config file instead of `OPENAI_REVERSE_PROXY`

* docs: update docs with additional notes

* feat(maxTokensMap): add mistral models (32k context)

* docs: update openrouter notes

* Update ai_setup.md

* docs(custom_config): add table of contents and fix note about custom name

* docs(custom_config): reorder ToC

* Update custom_config.md

* Add note about `max_tokens` field in custom_config.md
2024-01-03 09:22:48 -05:00

174 lines
5 KiB
TypeScript

import { useRecoilValue, useSetRecoilState } from 'recoil';
import {
TPreset,
TPlugin,
tConvoUpdateSchema,
EModelEndpoint,
TConversation,
} from 'librechat-data-provider';
import type { TSetExample, TSetOption, TSetOptionsPayload } from '~/common';
import usePresetIndexOptions from './usePresetIndexOptions';
import { useChatContext } from '~/Providers/ChatContext';
import useLocalStorage from './useLocalStorage';
import store from '~/store';
type TUseSetOptions = (preset?: TPreset | boolean | null) => TSetOptionsPayload;
const useSetOptions: TUseSetOptions = (preset = false) => {
const setShowPluginStoreDialog = useSetRecoilState(store.showPluginStoreDialog);
const availableTools = useRecoilValue(store.availableTools);
const { conversation, setConversation } = useChatContext();
const [lastBingSettings, setLastBingSettings] = useLocalStorage('lastBingSettings', {});
const [lastModel, setLastModel] = useLocalStorage('lastSelectedModel', {
primaryModel: '',
secondaryModel: '',
});
const result = usePresetIndexOptions(preset);
if (result && typeof result !== 'boolean') {
return result;
}
const setOption: TSetOption = (param) => (newValue) => {
const { endpoint } = conversation ?? {};
const update = {};
update[param] = newValue;
if (param === 'model' && endpoint) {
const lastModelUpdate = { ...lastModel, [endpoint]: newValue };
setLastModel(lastModelUpdate);
} else if (param === 'jailbreak' && endpoint) {
setLastBingSettings({ ...lastBingSettings, jailbreak: newValue });
}
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
...update,
}) as TConversation,
);
};
const setExample: TSetExample = (i, type, newValue = null) => {
const update = {};
const current = conversation?.examples?.slice() || [];
const currentExample = { ...current[i] } || {};
currentExample[type] = { content: newValue };
current[i] = currentExample;
update['examples'] = current;
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
...update,
}) as TConversation,
);
};
const addExample: () => void = () => {
const update = {};
const current = conversation?.examples?.slice() || [];
current.push({ input: { content: '' }, output: { content: '' } });
update['examples'] = current;
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
...update,
}) as TConversation,
);
};
const removeExample: () => void = () => {
const update = {};
const current = conversation?.examples?.slice() || [];
if (current.length <= 1) {
update['examples'] = [{ input: { content: '' }, output: { content: '' } }];
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
...update,
}) as TConversation,
);
return;
}
current.pop();
update['examples'] = current;
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
...update,
}) as TConversation,
);
};
function checkPluginSelection(value: string) {
if (!conversation?.tools) {
return false;
}
return conversation.tools.find((el) => el.pluginKey === value) ? true : false;
}
const setAgentOption: TSetOption = (param) => (newValue) => {
const editableConvo = JSON.stringify(conversation);
const convo = JSON.parse(editableConvo);
const { agentOptions } = convo;
agentOptions[param] = newValue;
console.log('agentOptions', agentOptions, param, newValue);
if (param === 'model' && typeof newValue === 'string') {
const lastModelUpdate = { ...lastModel, [EModelEndpoint.gptPlugins]: newValue };
lastModelUpdate.secondaryModel = newValue;
setLastModel(lastModelUpdate);
}
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
agentOptions,
}) as TConversation,
);
};
const setTools: (newValue: string) => void = (newValue) => {
if (newValue === 'pluginStore') {
setShowPluginStoreDialog(true);
return;
}
const update = {};
const current = conversation?.tools || [];
const isSelected = checkPluginSelection(newValue);
const tool =
availableTools[availableTools.findIndex((el: TPlugin) => el.pluginKey === newValue)];
if (isSelected) {
update['tools'] = current.filter((el) => el.pluginKey !== newValue);
} else {
update['tools'] = [...current, tool];
}
localStorage.setItem('lastSelectedTools', JSON.stringify(update['tools']));
setConversation(
(prevState) =>
tConvoUpdateSchema.parse({
...prevState,
...update,
}) as TConversation,
);
};
return {
setOption,
setExample,
addExample,
removeExample,
setAgentOption,
checkPluginSelection,
setTools,
};
};
export default useSetOptions;