85 lines
2.3 KiB
TypeScript
85 lines
2.3 KiB
TypeScript
import React from "react";
|
|
import {
|
|
makeVar,
|
|
Reference,
|
|
useMutation,
|
|
useReactiveVar,
|
|
} from "@apollo/client";
|
|
import DialogSimple from "./DialogSimple";
|
|
import { useSnackbar } from "notistack";
|
|
import {
|
|
DELETE_CATEGORY,
|
|
DeleteCategoryResponse,
|
|
DeleteCategoryVariables,
|
|
} from "../backend/mutations/category";
|
|
|
|
export const dialogDeleteCategoryId = makeVar<string>("");
|
|
export const dialogDeleteCategoryTitle = makeVar<string>("");
|
|
export const dialogDeleteCategoryOpen = makeVar<boolean>(false);
|
|
|
|
export default function DialogDeleteCategory(): React.ReactElement {
|
|
const { enqueueSnackbar } = useSnackbar();
|
|
const [deleteCategory, { loading }] = useMutation<
|
|
DeleteCategoryResponse,
|
|
DeleteCategoryVariables
|
|
>(DELETE_CATEGORY, {
|
|
onError: (e) =>
|
|
enqueueSnackbar(`Ein Fehler ist aufgetreten: ${e.message}`, {
|
|
variant: "error",
|
|
}),
|
|
onCompleted: (response) => {
|
|
if (response.deleteCategory) {
|
|
enqueueSnackbar("Kategorie erfolgreich gelöscht.", {
|
|
variant: "success",
|
|
});
|
|
dialogDeleteCategoryOpen(false);
|
|
} else {
|
|
enqueueSnackbar("Ein Fehler ist aufgetreten, versuche es erneut.", {
|
|
variant: "error",
|
|
});
|
|
}
|
|
},
|
|
update: (cache, { data }) => {
|
|
const idToRemove = data?.deleteCategory?.category.id;
|
|
cache.modify({
|
|
fields: {
|
|
allCategories(
|
|
existingCategoriesRef: { nodes: Array<Reference> } = { nodes: [] },
|
|
{ readField }
|
|
) {
|
|
return {
|
|
nodes: existingCategoriesRef.nodes.filter(
|
|
(categoryRef) => readField("id", categoryRef) !== idToRemove
|
|
),
|
|
};
|
|
},
|
|
},
|
|
});
|
|
},
|
|
});
|
|
|
|
const open = useReactiveVar(dialogDeleteCategoryOpen);
|
|
const title = useReactiveVar(dialogDeleteCategoryTitle);
|
|
const id = useReactiveVar(dialogDeleteCategoryId);
|
|
|
|
const handleConfirmButtonClick = () => {
|
|
deleteCategory({
|
|
variables: {
|
|
id,
|
|
},
|
|
});
|
|
};
|
|
|
|
return (
|
|
<DialogSimple
|
|
open={open}
|
|
title={"Kategorie löschen?"}
|
|
description={`Möchtest du die Kategorie "${title}" wirklich löschen?`}
|
|
confirmButtonText={"Löschen"}
|
|
onConfirmButtonClick={handleConfirmButtonClick}
|
|
onClose={() => dialogDeleteCategoryOpen(false)}
|
|
loading={loading}
|
|
/>
|
|
);
|
|
}
|