클라이언트 상태 토글 기능 활성화 및 전역 알림 추가

devfront/src/features/clients/ClientsPage.tsx

@@ -55,7 +55,18 @@ function ClientsPage() {
   const updateStatusMutation = useMutation({
     mutationFn: (payload: { id: string; status: "active" | "inactive" }) =>
       updateClientStatus(payload.id, payload.status),
-    onSuccess: () => queryClient.invalidateQueries({ queryKey: ["clients"] }),
+    onSuccess: (_, variables) => {
+      const statusText = variables.status === "active" ? "활성화" : "비활성화";
+      toast(`클라이언트가 ${statusText}되었습니다.`);
+      queryClient.invalidateQueries({ queryKey: ["clients"] });
+    },
+    onError: (error: AxiosError<{ error?: string }>) => {
+      const errMsg =
+        error.response?.data?.error ??
+        error.message ??
+        "Failed to update client status";
+      toast(errMsg, "error");
+    },
   });
   const deleteMutation = useMutation({
     mutationFn: (clientId: string) => deleteClient(clientId),
@@ -256,6 +267,10 @@ function ClientsPage() {
                   <TableCell>
                     <div className="flex items-center gap-3">
                       <Switch
+                        disabled={
+                          updateStatusMutation.isPending &&
+                          updateStatusMutation.variables?.id === client.id
+                        }
                         checked={client.status === "active"}
                         onCheckedChange={(checked) =>
                           updateStatusMutation.mutate({

devfront/src/main.tsx

@@ -2,6 +2,7 @@ import { QueryClientProvider } from "@tanstack/react-query";
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import { RouterProvider } from "react-router-dom";
+import { Toaster } from "./components/ui/toaster";
 import { queryClient } from "./app/queryClient";
 import { router } from "./app/routes";
 import "./index.css";
@@ -16,6 +17,7 @@ createRoot(rootElement).render(
   <StrictMode>
     <QueryClientProvider client={queryClient}>
       <RouterProvider router={router} />
+      <Toaster />
     </QueryClientProvider>
   </StrictMode>,
 );