diff --git a/frontend/src/ts/collections/results.ts b/frontend/src/ts/collections/results.ts index e3841319f411..a224008a34d4 100644 --- a/frontend/src/ts/collections/results.ts +++ b/frontend/src/ts/collections/results.ts @@ -24,16 +24,16 @@ import { queryOptions } from "@tanstack/solid-query"; import { Accessor } from "solid-js"; import Ape from "../ape"; import { SnapshotResult } from "../constants/default-snapshot"; +import { createEffectOn } from "../hooks/effects"; import { queryClient } from "../queries"; import { baseKey } from "../queries/utils/keys"; +import { isAuthenticated } from "../states/core"; +import { getLastResult, setLastResult } from "../states/snapshot"; import { - __nonReactive as tagsNonReactive, reconcileLocalTagPB, saveLocalTagPB, + __nonReactive as tagsNonReactive, } from "./tags"; -import { isAuthenticated } from "../states/core"; -import { createEffectOn } from "../hooks/effects"; -import { getLastResult, setLastResult } from "../states/snapshot"; import { applyIdWorkaround } from "./utils/misc"; export type ResultsQueryState = { @@ -260,6 +260,9 @@ type ActionType = { insertLocalResult: { result: SnapshotResult; }; + deleteLocalTag: { + tagId: string; + }; }; const actions = { @@ -313,11 +316,28 @@ const actions = { }), insertLocalResult: createOptimisticAction({ onMutate: ({ result }) => { - resultsCollection.insert(result); - }, - mutationFn: async ({ result }) => { resultsCollection.utils.writeInsert(normalizeResult(result)); }, + mutationFn: async () => { + //we don't sync the changes back to the backend here, it is done already + return; + }, + }), + deleteLocalTag: createOptimisticAction({ + onMutate: ({ tagId }) => { + for (const result of [...resultsCollection.values()].filter((it) => + it.tags.includes(tagId), + )) { + resultsCollection.utils.writeUpdate({ + ...result, + tags: result.tags.filter((it) => it !== tagId), + }); + } + }, + mutationFn: async () => { + //we do not sync the changes back to the backend + return; + }, }), }; // --- Public API --- @@ -382,6 +402,17 @@ export async function insertLocalResult( await transaction.isPersisted.promise; } +export async function deleteLocalTag( + params: ActionType["deleteLocalTag"], +): Promise { + if (!resultsCollection.isReady()) { + //not loaded yet, don't need to update + return; + } + const transaction = actions.deleteLocalTag(params); + await transaction.isPersisted.promise; +} + // oxlint-disable-next-line typescript/explicit-function-return-type export function buildResultsQuery(state: ResultsQueryState) { const applyMode2Filter = ( @@ -622,21 +653,6 @@ function buildSettingsResultsQuery( return query; } -export function deleteLocalTag(tagId: string): void { - resultsCollection.utils.writeBatch(() => { - for (const result of [...resultsCollection.values()]) { - if (!result.tags.includes(tagId)) { - continue; - } - - resultsCollection.utils.writeUpdate({ - ...result, - tags: result.tags.filter((it) => it !== tagId), - }); - } - }); -} - export function isResultsReady(): boolean { return resultsCollection.isReady(); } diff --git a/frontend/src/ts/components/pages/settings/custom-setting/Tags.tsx b/frontend/src/ts/components/pages/settings/custom-setting/Tags.tsx index 81ef11e42366..74fdf79658bb 100644 --- a/frontend/src/ts/components/pages/settings/custom-setting/Tags.tsx +++ b/frontend/src/ts/components/pages/settings/custom-setting/Tags.tsx @@ -1,6 +1,7 @@ import { TagNameSchema } from "@monkeytype/schemas/users"; import { JSXElement, For } from "solid-js"; +import { deleteLocalTag } from "../../../../collections/results"; import { clearTagPBs, deleteTag, @@ -112,6 +113,7 @@ export function Tags(): JSXElement { execFn: async () => { showLoaderBar(); await deleteTag({ tagId: tag._id }); + await deleteLocalTag({ tagId: tag._id }); hideLoaderBar(); return { status: "success",