diff --git a/src/client/components/DeleteAnnouncementDialog.tsx b/src/client/components/DeleteAnnouncementDialog.tsx index 881e60f..57b23a3 100644 --- a/src/client/components/DeleteAnnouncementDialog.tsx +++ b/src/client/components/DeleteAnnouncementDialog.tsx @@ -6,25 +6,39 @@ import { DialogContentText, DialogTitle, } from "@mui/material"; +import { useCallback } from "react"; +import { useDeleteAnnouncementMutation } from "../hooks"; import type { Announcement } from "../services"; export interface DeleteAnnouncementDialogProps { isDeleteConfirmationOpen: boolean; - denyDelete(): void; - confirmDelete(): void; + closeDeleteConfirmation(): void; announcement: Announcement; } export function DeleteAnnouncementDialog({ announcement, - confirmDelete, - denyDelete, + closeDeleteConfirmation, isDeleteConfirmationOpen, }: DeleteAnnouncementDialogProps) { + const deleteAnnouncementMutation = useDeleteAnnouncementMutation(); + + const confirmDelete = useCallback(() => { + closeDeleteConfirmation(); + if (announcement === undefined) { + throw new Error("Cannot delete announcement without an attempt set."); + } + deleteAnnouncementMutation.mutate(announcement.id); + }, [ + announcement, + closeDeleteConfirmation, + deleteAnnouncementMutation.mutate, + ]); + return ( Delete announcement @@ -34,7 +48,7 @@ export function DeleteAnnouncementDialog({ {announcement.title}? - diff --git a/src/client/routes/index.tsx b/src/client/routes/index.tsx index 251d329..5fdee2a 100644 --- a/src/client/routes/index.tsx +++ b/src/client/routes/index.tsx @@ -1,11 +1,11 @@ import { Alert, Box, CircularProgress, Typography } from "@mui/material"; import { createFileRoute } from "@tanstack/react-router"; -import { useCallback, useEffect, useState } from "react"; +import { useCallback, useState } from "react"; import { AnnouncementTable } from "../components/AnnouncementTable"; import { DeleteAnnouncementDialog } from "../components/DeleteAnnouncementDialog"; import { RouterButton } from "../components/RouterButton"; import { useBoolean } from "../components/use-boolean"; -import { useAnnouncementsQuery, useDeleteAnnouncementMutation } from "../hooks"; +import { useAnnouncementsQuery } from "../hooks"; import type { Announcement } from "../services"; export const Route = createFileRoute("/")({ @@ -15,8 +15,6 @@ export const Route = createFileRoute("/")({ function RouteComponent() { const announcementsQuery = useAnnouncementsQuery(); - const deleteAnnouncementMutation = useDeleteAnnouncementMutation(); - // delete confirmation dialog status const [ isDeleteConfirmationOpen, @@ -39,18 +37,6 @@ function RouteComponent() { [openDeleteConfirmationDialog], ); - const confirmDelete = useCallback(() => { - closeDeleteConfirmation(); - if (announcementForLatestDeleteAttempt === undefined) { - throw new Error("Cannot delete announcement without an attempt set."); - } - deleteAnnouncementMutation.mutate(announcementForLatestDeleteAttempt?.id); - }, [ - announcementForLatestDeleteAttempt, - closeDeleteConfirmation, - deleteAnnouncementMutation.mutate, - ]); - // handle loading / error / show values return ( @@ -75,8 +61,7 @@ function RouteComponent() { {announcementForLatestDeleteAttempt && ( )}