Add mutationKey everywhere

This commit is contained in:
Gregory Schier
2024-06-21 09:25:25 -07:00
parent 3b784378bf
commit 146fc133f0
44 changed files with 67 additions and 26 deletions

46
package-lock.json generated
View File

@@ -55,7 +55,7 @@
},
"devDependencies": {
"@tailwindcss/nesting": "^0.0.0-insiders.565cd3e",
"@tanstack/react-query-devtools": "^5.35.5",
"@tanstack/react-query-devtools": "^5.45.1",
"@tauri-apps/cli": ">=2.0.0-beta.0",
"@types/node": "^18.7.10",
"@types/papaparse": "^5.3.7",
@@ -2290,10 +2290,19 @@
"postcss": "^8.2.15"
}
},
"node_modules/@tanstack/query-core": {
"version": "5.45.0",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.45.0.tgz",
"integrity": "sha512-RVfIZQmFUTdjhSAAblvueimfngYyfN6HlwaJUPK71PKd7yi43Vs1S/rdimmZedPWX/WGppcq/U1HOj7O7FwYxw==",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
}
},
"node_modules/@tanstack/query-devtools": {
"version": "5.32.1",
"resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.32.1.tgz",
"integrity": "sha512-7Xq57Ctopiy/4atpb0uNY5VRuCqRS/1fi/WBCKKX6jHMa6cCgDuV/AQuiwRXcKARbq2OkVAOrW2v4xK9nTbcCA==",
"version": "5.37.1",
"resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.37.1.tgz",
"integrity": "sha512-XcG4IIHIv0YQKrexTqo2zogQWR1Sz672tX2KsfE9kzB+9zhx44vRKH5si4WDILE1PIWQpStFs/NnrDQrBAUQpg==",
"dev": true,
"funding": {
"type": "github",
@@ -2301,11 +2310,11 @@
}
},
"node_modules/@tanstack/react-query": {
"version": "5.35.5",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.35.5.tgz",
"integrity": "sha512-sppX7L+PVn5GBV3In6zzj0zcKfnZRKhXbX1MfIfKo1OjIq2GMaopvAFOP0x1bRYTUk2ikrdYcQYOozX7PWkb8A==",
"version": "5.45.1",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.45.1.tgz",
"integrity": "sha512-mYYfJujKg2kxmkRRjA6nn4YKG3ITsKuH22f1kteJ5IuVQqgKUgbaSQfYwVP0gBS05mhwxO03HVpD0t7BMN7WOA==",
"dependencies": {
"@tanstack/query-core": "5.35.5"
"@tanstack/query-core": "5.45.0"
},
"funding": {
"type": "github",
@@ -2316,29 +2325,20 @@
}
},
"node_modules/@tanstack/react-query-devtools": {
"version": "5.35.5",
"resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.35.5.tgz",
"integrity": "sha512-4Xll14B9uhgEJ+uqZZ5tqZ7G1LDR7wGYgb+NOZHGn11TTABnlV8GWon7zDMqdaHeR5mjjuY1UFo9pbz39kuZKQ==",
"version": "5.45.1",
"resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.45.1.tgz",
"integrity": "sha512-4mrbk1g5jqlqh0pifZNsKzy7FtgeqgwzMICL4d6IJGayrrcrKq9K4N/OzRNbgRWrTn6YTY63qcAcKo+NJU2QMw==",
"dev": true,
"dependencies": {
"@tanstack/query-devtools": "5.32.1"
"@tanstack/query-devtools": "5.37.1"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"@tanstack/react-query": "^5.35.5",
"react": "^18.0.0"
}
},
"node_modules/@tanstack/react-query/node_modules/@tanstack/query-core": {
"version": "5.35.5",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.35.5.tgz",
"integrity": "sha512-OMWvlEqG01RfGj+XZb/piDzPp0eZkkHWSDHt2LvE/fd1zWburP/xwm0ghk6Iv8cuPlP+ACFkZviKXK0OVt6lhg==",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
"@tanstack/react-query": "^5.45.1",
"react": "^18 || ^19"
}
},
"node_modules/@tauri-apps/api": {

View File

@@ -76,7 +76,7 @@
},
"devDependencies": {
"@tailwindcss/nesting": "^0.0.0-insiders.565cd3e",
"@tanstack/react-query-devtools": "^5.35.5",
"@tanstack/react-query-devtools": "^5.45.1",
"@tauri-apps/cli": ">=2.0.0-beta.0",
"@types/node": "^18.7.10",
"@types/papaparse": "^5.3.7",

View File

@@ -20,7 +20,7 @@ const queryClient = new QueryClient({
export function App() {
return (
<QueryClientProvider client={queryClient}>
<ReactQueryDevtools initialIsOpen={false} />
<ReactQueryDevtools buttonPosition="bottom-left" />
<MotionConfig transition={{ duration: 0.1 }}>
<HelmetProvider>
<DndProvider backend={HTML5Backend}>

View File

@@ -4,6 +4,7 @@ import { trackEvent } from '../lib/analytics';
export function useCancelHttpResponse(id: string | null) {
return useMutation<void>({
mutationKey: ['cancel_http_response', id],
mutationFn: () => event.emit(`cancel_http_response_${id}`),
onSettled: () => trackEvent('http_response', 'cancel'),
});

View File

@@ -9,6 +9,7 @@ export function useCheckForUpdates() {
const alert = useAlert();
const appInfo = useAppInfo();
return useMutation({
mutationKey: ['check_for_updates'],
mutationFn: async () => {
const hasUpdate: boolean = await minPromiseMillis(invokeCmd('cmd_check_for_updates'), 500);
if (!hasUpdate) {

View File

@@ -12,6 +12,7 @@ export function useCreateCookieJar() {
const prompt = usePrompt();
return useMutation<CookieJar>({
mutationKey: ['create_cookie_jar'],
mutationFn: async () => {
if (workspaceId === null) {
throw new Error("Cannot create cookie jar when there's no active workspace");

View File

@@ -14,6 +14,7 @@ export function useCreateEnvironment() {
const queryClient = useQueryClient();
return useMutation<Environment, unknown, void>({
mutationKey: ['create_environment'],
mutationFn: async () => {
const name = await prompt({
id: 'new-environment',

View File

@@ -14,6 +14,7 @@ export function useCreateFolder() {
const prompt = usePrompt();
return useMutation<Folder, unknown, Partial<Pick<Folder, 'name' | 'sortPriority' | 'folderId'>>>({
mutationKey: ['create_folder'],
mutationFn: async (patch) => {
if (workspaceId === null) {
throw new Error("Cannot create folder when there's no active workspace");

View File

@@ -18,6 +18,7 @@ export function useCreateGrpcRequest() {
unknown,
Partial<Pick<GrpcRequest, 'name' | 'sortPriority' | 'folderId'>>
>({
mutationKey: ['create_grpc_request'],
mutationFn: (patch) => {
if (workspaceId === null) {
throw new Error("Cannot create grpc request when there's no active workspace");

View File

@@ -14,6 +14,7 @@ export function useCreateHttpRequest() {
const routes = useAppRoutes();
return useMutation<HttpRequest, unknown, Partial<HttpRequest>>({
mutationKey: ['create_http_request'],
mutationFn: (patch = {}) => {
if (workspaceId === null) {
throw new Error("Cannot create request when there's no active workspace");

View File

@@ -8,6 +8,7 @@ export function useCreateWorkspace() {
const routes = useAppRoutes();
const prompt = usePrompt();
return useMutation<Workspace, void, void>({
mutationKey: ['create_workspace'],
mutationFn: async () => {
const name = await prompt({
id: 'new-workspace',

View File

@@ -13,6 +13,7 @@ export function useDeleteAnyGrpcRequest() {
const confirm = useConfirm();
return useMutation<GrpcRequest | null, string, string>({
mutationKey: ['delete_any_grpc_request'],
mutationFn: async (id) => {
const request = await getGrpcRequest(id);
if (request == null) return null;

View File

@@ -14,6 +14,7 @@ export function useDeleteAnyHttpRequest() {
const confirm = useConfirm();
return useMutation<HttpRequest | null, string, string>({
mutationKey: ['delete_any_http_request'],
mutationFn: async (id) => {
const request = await getHttpRequest(id);
if (request == null) return null;

View File

@@ -11,6 +11,7 @@ export function useDeleteCookieJar(cookieJar: CookieJar | null) {
const confirm = useConfirm();
return useMutation<CookieJar | null, string>({
mutationKey: ['delete_cookie_jar', cookieJar?.id],
mutationFn: async () => {
const confirmed = await confirm({
id: 'delete-cookie-jar',

View File

@@ -11,6 +11,7 @@ export function useDeleteEnvironment(environment: Environment | null) {
const confirm = useConfirm();
return useMutation<Environment | null, string>({
mutationKey: ['delete_environment', environment?.id],
mutationFn: async () => {
const confirmed = await confirm({
id: 'delete-environment',

View File

@@ -13,6 +13,7 @@ export function useDeleteFolder(id: string | null) {
const confirm = useConfirm();
return useMutation<Folder | null, string>({
mutationKey: ['delete_folder', id],
mutationFn: async () => {
const folder = await getFolder(id);
const confirmed = await confirm({

View File

@@ -7,6 +7,7 @@ import { grpcConnectionsQueryKey } from './useGrpcConnections';
export function useDeleteGrpcConnection(id: string | null) {
const queryClient = useQueryClient();
return useMutation<GrpcConnection>({
mutationKey: ['delete_grpc_connection', id],
mutationFn: async () => {
return await invokeCmd('cmd_delete_grpc_connection', { id: id });
},

View File

@@ -6,6 +6,7 @@ import { grpcConnectionsQueryKey } from './useGrpcConnections';
export function useDeleteGrpcConnections(requestId?: string) {
const queryClient = useQueryClient();
return useMutation({
mutationKey: ['delete_grpc_connections', requestId],
mutationFn: async () => {
if (requestId === undefined) return;
await invokeCmd('cmd_delete_all_grpc_connections', { requestId });

View File

@@ -7,6 +7,7 @@ import { httpResponsesQueryKey } from './useHttpResponses';
export function useDeleteHttpResponse(id: string | null) {
const queryClient = useQueryClient();
return useMutation<HttpResponse>({
mutationKey: ['delete_http_response', id],
mutationFn: async () => {
return await invokeCmd('cmd_delete_http_response', { id: id });
},

View File

@@ -6,6 +6,7 @@ import { httpResponsesQueryKey } from './useHttpResponses';
export function useDeleteHttpResponses(requestId?: string) {
const queryClient = useQueryClient();
return useMutation({
mutationKey: ['delete_http_responses', requestId],
mutationFn: async () => {
if (requestId === undefined) return;
await invokeCmd('cmd_delete_all_http_responses', { requestId });

View File

@@ -7,6 +7,7 @@ export function useDeleteRequest(id: string | null) {
const deleteAnyGrpcRequest = useDeleteAnyGrpcRequest();
return useMutation<void, string>({
mutationKey: ['delete_request', id],
mutationFn: async () => {
if (id == null) return;
// We don't know what type it is based on the ID, so just try deleting both

View File

@@ -16,6 +16,7 @@ export function useDeleteWorkspace(workspace: Workspace | null) {
const confirm = useConfirm();
return useMutation<Workspace | null, string>({
mutationKey: ['delete_workspace', workspace?.id],
mutationFn: async () => {
const confirmed = await confirm({
id: 'delete-workspace',

View File

@@ -20,6 +20,7 @@ export function useDuplicateGrpcRequest({
const routes = useAppRoutes();
const protoFiles = useGrpcProtoFiles(id);
return useMutation<GrpcRequest, string>({
mutationKey: ['duplicate_grpc_request', id],
mutationFn: async () => {
if (id === null) throw new Error("Can't duplicate a null grpc request");
return invokeCmd('cmd_duplicate_grpc_request', { id });

View File

@@ -17,6 +17,7 @@ export function useDuplicateHttpRequest({
const activeEnvironmentId = useActiveEnvironmentId();
const routes = useAppRoutes();
return useMutation<HttpRequest, string>({
mutationKey: ['duplicate_http_request', id],
mutationFn: async () => {
if (id === null) throw new Error("Can't duplicate a null request");
return invokeCmd('cmd_duplicate_http_request', { id });

View File

@@ -14,6 +14,7 @@ export function useExportData() {
const toast = useToast();
return useMutation({
mutationKey: ['export_data'],
onError: (err: string) => {
alert({ id: 'export-failed', title: 'Export Failed', body: err });
},

View File

@@ -21,12 +21,14 @@ export function useGrpc(
const environmentId = useActiveEnvironmentId();
const go = useMutation<void, string>({
mutationKey: ['grpc_go', conn?.id],
mutationFn: async () =>
await invokeCmd('cmd_grpc_go', { requestId, environmentId, protoFiles }),
onSettled: () => trackEvent('grpc_request', 'send'),
});
const send = useMutation({
mutationKey: ['grpc_send', conn?.id],
mutationFn: async ({ message }: { message: string }) =>
await emit(`grpc_client_msg_${conn?.id ?? 'none'}`, { Message: message }),
onSettled: () => trackEvent('grpc_connection', 'send'),

View File

@@ -16,6 +16,7 @@ export function useImportCurl({ clearClipboard }: { clearClipboard?: boolean } =
const [, setClipboardText] = useClipboardText();
return useMutation({
mutationKey: ['import_curl'],
mutationFn: async ({ requestId, command }: { requestId: string | null; command: string }) => {
const request: Record<string, unknown> = await invokeCmd('cmd_curl_to_request', {
command,

View File

@@ -77,6 +77,7 @@ export function useImportData() {
};
return useMutation({
mutationKey: ['import_data'],
onError: (err: string) => {
alert({
id: 'import-failed',

View File

@@ -32,6 +32,7 @@ export function useKeyValue<T extends Object | null>({
});
const mutate = useMutation<void, unknown, T>({
mutationKey: ['set_key_value', namespace, key],
mutationFn: (value) => setKeyValue<T>({ namespace, key, value }),
// k/v should be as fast as possible, so optimistically update the cache
onMutate: (value) => queryClient.setQueryData<T>(keyValueQueryKey({ namespace, key }), value),

View File

@@ -12,7 +12,7 @@ export function useMoveToWorkspace(id: string) {
const activeWorkspaceId = useActiveWorkspaceId();
return useMutation<void, unknown>({
mutationKey: ['moveWorkspace'],
mutationKey: ['move_workspace', id],
mutationFn: async () => {
if (request == null || activeWorkspaceId == null) return;

View File

@@ -8,6 +8,7 @@ export function useOpenWorkspace() {
const routes = useAppRoutes();
return useMutation({
mutationKey: ['open_workspace'],
mutationFn: async ({
workspaceId,
inNewWindow,

View File

@@ -13,6 +13,7 @@ export function useSaveResponse(response: HttpResponse) {
const toast = useToast();
return useMutation({
mutationKey: ['save_response', response.id],
mutationFn: async () => {
const request = await getHttpRequest(response.requestId);
if (request == null) return null;

View File

@@ -14,6 +14,7 @@ export function useSendAnyRequest(options: { download?: boolean } = {}) {
const alert = useAlert();
const { activeCookieJar } = useActiveCookieJar();
return useMutation<HttpResponse | null, string, string | null>({
mutationKey: ['send_any_request'],
mutationFn: async (id) => {
const request = await getHttpRequest(id);
if (request == null) {

View File

@@ -4,6 +4,7 @@ import { useSendAnyRequest } from './useSendAnyRequest';
export function useSendManyRequests() {
const sendAnyRequest = useSendAnyRequest();
return useMutation<void, string, string[]>({
mutationKey: ['send_many_requests'],
mutationFn: async (requestIds: string[]) => {
for (const id of requestIds) {
sendAnyRequest.mutate(id);

View File

@@ -5,6 +5,7 @@ import { useSendAnyRequest } from './useSendAnyRequest';
export function useSendRequest(id: string | null, options: { download?: boolean } = {}) {
const sendAnyRequest = useSendAnyRequest(options);
return useMutation<HttpResponse | null, string>({
mutationKey: ['send_http_request', id],
mutationFn: () => sendAnyRequest.mutateAsync(id),
});
}

View File

@@ -8,6 +8,7 @@ export function useUpdateAnyFolder() {
const queryClient = useQueryClient();
return useMutation<void, unknown, { id: string; update: (r: Folder) => Folder }>({
mutationKey: ['update_any_folder'],
mutationFn: async ({ id, update }) => {
const folder = await getFolder(id);
if (folder === null) {

View File

@@ -12,6 +12,7 @@ export function useUpdateAnyGrpcRequest() {
unknown,
{ id: string; update: Partial<GrpcRequest> | ((r: GrpcRequest) => GrpcRequest) }
>({
mutationKey: ['update_any_grpc_request'],
mutationFn: async ({ id, update }) => {
const request = await getGrpcRequest(id);
if (request === null) {

View File

@@ -12,6 +12,7 @@ export function useUpdateAnyHttpRequest() {
unknown,
{ id: string; update: Partial<HttpRequest> | ((r: HttpRequest) => HttpRequest) }
>({
mutationKey: ['update_any_http_request'],
mutationFn: async ({ id, update }) => {
const request = await getHttpRequest(id);
if (request === null) {

View File

@@ -7,6 +7,7 @@ import { cookieJarsQueryKey } from './useCookieJars';
export function useUpdateCookieJar(id: string | null) {
const queryClient = useQueryClient();
return useMutation<void, unknown, Partial<CookieJar> | ((j: CookieJar) => CookieJar)>({
mutationKey: ['update_cookie_jar', id],
mutationFn: async (v) => {
const cookieJar = await getCookieJar(id);
if (cookieJar == null) {

View File

@@ -7,6 +7,7 @@ import { environmentsQueryKey } from './useEnvironments';
export function useUpdateEnvironment(id: string | null) {
const queryClient = useQueryClient();
return useMutation<void, unknown, Partial<Environment> | ((r: Environment) => Environment)>({
mutationKey: ['update_environment', id],
mutationFn: async (v) => {
const environment = await getEnvironment(id);
if (environment == null) {

View File

@@ -5,6 +5,7 @@ import { useUpdateAnyGrpcRequest } from './useUpdateAnyGrpcRequest';
export function useUpdateGrpcRequest(id: string | null) {
const updateAnyGrpcRequest = useUpdateAnyGrpcRequest();
return useMutation<void, unknown, Partial<GrpcRequest> | ((r: GrpcRequest) => GrpcRequest)>({
mutationKey: ['update_grpc_request', id],
mutationFn: async (update) => {
return updateAnyGrpcRequest.mutateAsync({ id: id ?? 'n/a', update });
},

View File

@@ -5,6 +5,7 @@ import { useUpdateAnyHttpRequest } from './useUpdateAnyHttpRequest';
export function useUpdateHttpRequest(id: string | null) {
const updateAnyRequest = useUpdateAnyHttpRequest();
return useMutation<void, unknown, Partial<HttpRequest> | ((r: HttpRequest) => HttpRequest)>({
mutationKey: ['update_http_request', id],
mutationFn: async (update) => updateAnyRequest.mutateAsync({ id: id ?? 'n/a', update }),
});
}

View File

@@ -7,6 +7,7 @@ export function useUpdateSettings() {
const settings = useSettings();
return useMutation<void, unknown, Partial<Settings>>({
mutationKey: ['update_settings'],
mutationFn: async (patch) => {
if (settings == null) return;
const newSettings: Settings = { ...settings, ...patch };

View File

@@ -7,6 +7,7 @@ import { workspacesQueryKey } from './useWorkspaces';
export function useUpdateWorkspace(id: string | null) {
const queryClient = useQueryClient();
return useMutation<void, unknown, Partial<Workspace> | ((w: Workspace) => Workspace)>({
mutationKey: ['update_workspace', id],
mutationFn: async (v) => {
const workspace = await getWorkspace(id);
if (workspace == null) {