mirror of
https://github.com/danny-avila/LibreChat.git
synced 2026-01-23 18:56:12 +01:00
* feat: add timer duration to showToast, show toast for preset selection * refactor: replace old /chat/ route with /c/. e2e tests will fail here * refactor: move typedefs to root of /api/ and add a few to assistant types in TS * refactor: reorganize data-provider imports, fix dependency cycle, strategize new plan to separate react dependent packages * feat: add dataService for uploading images * feat(data-provider): add mutation keys * feat: file resizing and upload * WIP: initial API image handling * fix: catch JSON.parse of localStorage tools * chore: experimental: use module-alias for absolute imports * refactor: change temp_file_id strategy * fix: updating files state by using Map and defining react query callbacks in a way that keeps them during component unmount, initial delete handling * feat: properly handle file deletion * refactor: unexpose complete filepath and resize from server for higher fidelity * fix: make sure resized height, width is saved, catch bad requests * refactor: use absolute imports * fix: prevent setOptions from being called more than once for OpenAIClient, made note to fix for PluginsClient * refactor: import supportsFiles and models vars from schemas * fix: correctly replace temp file id * refactor(BaseClient): use absolute imports, pass message 'opts' to buildMessages method, count tokens for nested objects/arrays * feat: add validateVisionModel to determine if model has vision capabilities * chore(checkBalance): update jsdoc * feat: formatVisionMessage: change message content format dependent on role and image_urls passed * refactor: add usage to File schema, make create and updateFile, correctly set and remove TTL * feat: working vision support TODO: file size, type, amount validations, making sure they are styled right, and making sure you can add images from the clipboard/dragging * feat: clipboard support for uploading images * feat: handle files on drop to screen, refactor top level view code to Presentation component so the useDragHelpers hook has ChatContext * fix(Images): replace uploaded images in place * feat: add filepath validation to protect sensitive files * fix: ensure correct file_ids are push and not the Map key values * fix(ToastContext): type issue * feat: add basic file validation * fix(useDragHelpers): correct context issue with `files` dependency * refactor: consolidate setErrors logic to setError * feat: add dialog Image overlay on image click * fix: close endpoints menu on click * chore: set detail to auto, make note for configuration * fix: react warning (button desc. of button) * refactor: optimize filepath handling, pass file_ids to images for easier re-use * refactor: optimize image file handling, allow re-using files in regen, pass more file metadata in messages * feat: lazy loading images including use of upload preview * fix: SetKeyDialog closing, stopPropagation on Dialog content click * style(EndpointMenuItem): tighten up the style, fix dark theme showing in lightmode, make menu more ux friendly * style: change maxheight of all settings textareas to 138px from 300px * style: better styling for textarea and enclosing buttons * refactor(PresetItems): swap back edit and delete icons * feat: make textarea placeholder dynamic to endpoint * style: show user hover buttons only on hover when message is streaming * fix: ordered list not going past 9, fix css * feat: add User/AI labels; style: hide loading spinner * feat: add back custom footer, change original footer text * feat: dynamic landing icons based on endpoint * chore: comment out assistants route * fix: autoScroll to newest on /c/ view * fix: Export Conversation on new UI * style: match message style of official more closely * ci: fix api jest unit tests, comment out e2e tests for now as they will fail until addressed * feat: more file validation and use blob in preview field, not filepath, to fix temp deletion * feat: filefilter for multer * feat: better AI labels based on custom name, model, and endpoint instead of `ChatGPT`
494 lines
13 KiB
TypeScript
494 lines
13 KiB
TypeScript
import {
|
|
UseQueryOptions,
|
|
useQuery,
|
|
useMutation,
|
|
useQueryClient,
|
|
UseMutationResult,
|
|
QueryObserverResult,
|
|
} from '@tanstack/react-query';
|
|
import * as t from './types';
|
|
import * as s from './schemas';
|
|
import * as dataService from './data-service';
|
|
import request from './request';
|
|
import { QueryKeys } from './keys';
|
|
|
|
export const useAbortRequestWithMessage = (): UseMutationResult<
|
|
void,
|
|
Error,
|
|
{ endpoint: string; abortKey: string; message: string }
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(
|
|
({ endpoint, abortKey, message }) =>
|
|
dataService.abortRequestWithMessage(endpoint, abortKey, message),
|
|
{
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.balance]);
|
|
},
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useGetUserQuery = (
|
|
config?: UseQueryOptions<t.TUser>,
|
|
): QueryObserverResult<t.TUser> => {
|
|
return useQuery<t.TUser>([QueryKeys.user], () => dataService.getUser(), {
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
retry: false,
|
|
...config,
|
|
});
|
|
};
|
|
|
|
export const useGetMessagesByConvoId = <TData = s.TMessage[]>(
|
|
id: string,
|
|
config?: UseQueryOptions<s.TMessage[], unknown, TData>,
|
|
): QueryObserverResult<TData> => {
|
|
return useQuery<s.TMessage[], unknown, TData>(
|
|
[QueryKeys.messages, id],
|
|
() => dataService.getMessagesByConvoId(id),
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useGetUserBalance = (
|
|
config?: UseQueryOptions<string>,
|
|
): QueryObserverResult<string> => {
|
|
return useQuery<string>([QueryKeys.balance], () => dataService.getUserBalance(), {
|
|
refetchOnWindowFocus: true,
|
|
refetchOnReconnect: true,
|
|
refetchOnMount: true,
|
|
...config,
|
|
});
|
|
};
|
|
|
|
export const useGetConversationByIdQuery = (
|
|
id: string,
|
|
config?: UseQueryOptions<s.TConversation>,
|
|
): QueryObserverResult<s.TConversation> => {
|
|
return useQuery<s.TConversation>(
|
|
[QueryKeys.conversation, id],
|
|
() => dataService.getConversationById(id),
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
/* like above, but first try the convos query data */
|
|
export const useGetConvoIdQuery = (
|
|
id: string,
|
|
config?: UseQueryOptions<s.TConversation>,
|
|
): QueryObserverResult<s.TConversation> => {
|
|
const queryClient = useQueryClient();
|
|
return useQuery<s.TConversation>(
|
|
[QueryKeys.conversation, id],
|
|
() => {
|
|
const defaultQuery = () => dataService.getConversationById(id);
|
|
|
|
const convosQueryKey = [QueryKeys.allConversations, { pageNumber: '1', active: true }];
|
|
const convosQuery = queryClient.getQueryData<t.TGetConversationsResponse>(convosQueryKey);
|
|
|
|
if (!convosQuery) {
|
|
return defaultQuery();
|
|
}
|
|
|
|
const convo = convosQuery.conversations?.find((c) => c.conversationId === id);
|
|
if (convo) {
|
|
return convo;
|
|
}
|
|
|
|
return defaultQuery();
|
|
},
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
//This isn't ideal because its just a query and we're using mutation, but it was the only way
|
|
//to make it work with how the Chat component is structured
|
|
export const useGetConversationByIdMutation = (id: string): UseMutationResult<s.TConversation> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(() => dataService.getConversationById(id), {
|
|
// onSuccess: (res: s.TConversation) => {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.conversation, id]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useUpdateConversationMutation = (
|
|
id: string,
|
|
): UseMutationResult<
|
|
t.TUpdateConversationResponse,
|
|
unknown,
|
|
t.TUpdateConversationRequest,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(
|
|
(payload: t.TUpdateConversationRequest) => dataService.updateConversation(payload),
|
|
{
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.conversation, id]);
|
|
queryClient.invalidateQueries([QueryKeys.allConversations]);
|
|
},
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useUpdateMessageMutation = (
|
|
id: string,
|
|
): UseMutationResult<unknown, unknown, t.TUpdateMessageRequest, unknown> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: t.TUpdateMessageRequest) => dataService.updateMessage(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.messages, id]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useUpdateUserKeysMutation = (): UseMutationResult<
|
|
t.TUser,
|
|
unknown,
|
|
t.TUpdateUserKeyRequest,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: t.TUpdateUserKeyRequest) => dataService.updateUserKey(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.name]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useDeleteConversationMutation = (
|
|
id?: string,
|
|
): UseMutationResult<
|
|
t.TDeleteConversationResponse,
|
|
unknown,
|
|
t.TDeleteConversationRequest,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(
|
|
(payload: t.TDeleteConversationRequest) => dataService.deleteConversation(payload),
|
|
{
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.conversation, id]);
|
|
queryClient.invalidateQueries([QueryKeys.allConversations]);
|
|
},
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useClearConversationsMutation = (): UseMutationResult<unknown> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(() => dataService.clearAllConversations(), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.allConversations]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useRevokeUserKeyMutation = (name: string): UseMutationResult<unknown> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(() => dataService.revokeUserKey(name), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.name]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useRevokeAllUserKeysMutation = (): UseMutationResult<unknown> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(() => dataService.revokeAllUserKeys(), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.name]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useGetConversationsQuery = (
|
|
pageNumber: string,
|
|
config?: UseQueryOptions<t.TGetConversationsResponse>,
|
|
): QueryObserverResult<t.TGetConversationsResponse> => {
|
|
return useQuery<t.TGetConversationsResponse>(
|
|
[QueryKeys.allConversations, { pageNumber, active: true }],
|
|
() => dataService.getConversations(pageNumber),
|
|
{
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
retry: 1,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useGetSearchEnabledQuery = (
|
|
config?: UseQueryOptions<boolean>,
|
|
): QueryObserverResult<boolean> => {
|
|
return useQuery<boolean>([QueryKeys.searchEnabled], () => dataService.getSearchEnabled(), {
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
});
|
|
};
|
|
|
|
export const useGetEndpointsQuery = <TData = t.TEndpointsConfig>(
|
|
config?: UseQueryOptions<t.TEndpointsConfig, unknown, TData>,
|
|
): QueryObserverResult<TData> => {
|
|
return useQuery<t.TEndpointsConfig, unknown, TData>(
|
|
[QueryKeys.endpoints],
|
|
() => dataService.getAIEndpoints(),
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useGetModelsQuery = (
|
|
config?: UseQueryOptions<t.TModelsConfig>,
|
|
): QueryObserverResult<t.TModelsConfig> => {
|
|
return useQuery<t.TModelsConfig>([QueryKeys.models], () => dataService.getModels(), {
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
});
|
|
};
|
|
|
|
export const useCreatePresetMutation = (): UseMutationResult<
|
|
s.TPreset[],
|
|
unknown,
|
|
s.TPreset,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: s.TPreset) => dataService.createPreset(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.presets]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useUpdatePresetMutation = (): UseMutationResult<
|
|
s.TPreset[],
|
|
unknown,
|
|
s.TPreset,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: s.TPreset) => dataService.updatePreset(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.presets]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useGetPresetsQuery = (
|
|
config?: UseQueryOptions<s.TPreset[]>,
|
|
): QueryObserverResult<s.TPreset[], unknown> => {
|
|
return useQuery<s.TPreset[]>([QueryKeys.presets], () => dataService.getPresets(), {
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
});
|
|
};
|
|
|
|
export const useDeletePresetMutation = (): UseMutationResult<
|
|
s.TPreset[],
|
|
unknown,
|
|
s.TPreset | object,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: s.TPreset | object) => dataService.deletePreset(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.presets]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useSearchQuery = (
|
|
searchQuery: string,
|
|
pageNumber: string,
|
|
config?: UseQueryOptions<t.TSearchResults>,
|
|
): QueryObserverResult<t.TSearchResults> => {
|
|
return useQuery<t.TSearchResults>(
|
|
[QueryKeys.searchResults, pageNumber, searchQuery],
|
|
() => dataService.searchConversations(searchQuery, pageNumber),
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useUpdateTokenCountMutation = (): UseMutationResult<
|
|
t.TUpdateTokenCountResponse,
|
|
unknown,
|
|
{ text: string },
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(({ text }: { text: string }) => dataService.updateTokenCount(text), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.tokenCount]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useLoginUserMutation = (): UseMutationResult<
|
|
t.TLoginResponse,
|
|
unknown,
|
|
t.TLoginUser,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: t.TLoginUser) => dataService.login(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.user]);
|
|
},
|
|
onMutate: () => {
|
|
queryClient.invalidateQueries([QueryKeys.models]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useRegisterUserMutation = (): UseMutationResult<
|
|
unknown,
|
|
unknown,
|
|
t.TRegisterUser,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: t.TRegisterUser) => dataService.register(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.user]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useLogoutUserMutation = (): UseMutationResult<unknown> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(() => dataService.logout(), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.user]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useRefreshTokenMutation = (): UseMutationResult<
|
|
t.TRefreshTokenResponse,
|
|
unknown,
|
|
unknown,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation(() => request.refreshToken(), {
|
|
onMutate: () => {
|
|
queryClient.invalidateQueries([QueryKeys.models]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useUserKeyQuery = (
|
|
name: string,
|
|
config?: UseQueryOptions<t.TCheckUserKeyResponse>,
|
|
): QueryObserverResult<t.TCheckUserKeyResponse> => {
|
|
return useQuery<t.TCheckUserKeyResponse>(
|
|
[QueryKeys.name, name],
|
|
() => {
|
|
if (!name) {
|
|
return Promise.resolve({ expiresAt: '' });
|
|
}
|
|
return dataService.userKeyQuery(name);
|
|
},
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
retry: false,
|
|
...config,
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useRequestPasswordResetMutation = (): UseMutationResult<
|
|
t.TRequestPasswordResetResponse,
|
|
unknown,
|
|
t.TRequestPasswordReset,
|
|
unknown
|
|
> => {
|
|
return useMutation((payload: t.TRequestPasswordReset) =>
|
|
dataService.requestPasswordReset(payload),
|
|
);
|
|
};
|
|
|
|
export const useResetPasswordMutation = (): UseMutationResult<
|
|
unknown,
|
|
unknown,
|
|
t.TResetPassword,
|
|
unknown
|
|
> => {
|
|
return useMutation((payload: t.TResetPassword) => dataService.resetPassword(payload));
|
|
};
|
|
|
|
export const useAvailablePluginsQuery = (): QueryObserverResult<s.TPlugin[]> => {
|
|
return useQuery<s.TPlugin[]>(
|
|
[QueryKeys.availablePlugins],
|
|
() => dataService.getAvailablePlugins(),
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
},
|
|
);
|
|
};
|
|
|
|
export const useUpdateUserPluginsMutation = (): UseMutationResult<
|
|
t.TUser,
|
|
unknown,
|
|
t.TUpdateUserPlugins,
|
|
unknown
|
|
> => {
|
|
const queryClient = useQueryClient();
|
|
return useMutation((payload: t.TUpdateUserPlugins) => dataService.updateUserPlugins(payload), {
|
|
onSuccess: () => {
|
|
queryClient.invalidateQueries([QueryKeys.user]);
|
|
},
|
|
});
|
|
};
|
|
|
|
export const useGetStartupConfig = (): QueryObserverResult<t.TStartupConfig> => {
|
|
return useQuery<t.TStartupConfig>(
|
|
[QueryKeys.startupConfig],
|
|
() => dataService.getStartupConfig(),
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
refetchOnReconnect: false,
|
|
refetchOnMount: false,
|
|
},
|
|
);
|
|
};
|