diff --git a/src/pages/forwarding/Create.tsx b/src/pages/forwarding/Create.tsx index c90353f9febfd7512fa9585c0f618cf80f1d31d8..a1d9a56e6604adfd44eed42c59a5990b90ab8fad 100644 --- a/src/pages/forwarding/Create.tsx +++ b/src/pages/forwarding/Create.tsx @@ -25,7 +25,7 @@ const formSchema = z.object({ export default function ForwardingCreate() { const navigate = useNavigate(); - const { selectedProject } = useAuthStore(); + const { authFetch, selectedProject } = useAuthStore(); const form = useForm<z.infer<typeof formSchema>>({ resolver: zodResolver(formSchema), defaultValues: { @@ -38,7 +38,7 @@ export default function ForwardingCreate() { async function onSubmit(values: z.infer<typeof formSchema>) { const { name, serverPort, instanceIp } = values; - const response = await fetch(`/api/forwarding?projectId=${selectedProject?.id}`, { + const response = await authFetch(`/api/forwarding?projectId=${selectedProject?.id}`, { method: 'POST', headers: { 'Content-Type': 'application/json', diff --git a/src/pages/forwarding/List.tsx b/src/pages/forwarding/List.tsx index 5855dfcb3cd4fa7c2da96c3adcc8fd2133f4a4fc..3fa1999d9691a1ac653dc02ca6eb6d0032490d4f 100644 --- a/src/pages/forwarding/List.tsx +++ b/src/pages/forwarding/List.tsx @@ -22,12 +22,12 @@ import { } from '@/components/ui/alert-dialog'; export default function ForwardingList() { - const { selectedProject } = useAuthStore(); + const { authFetch, selectedProject } = useAuthStore(); const [forwardings, setForwardings] = useState<Forwarding[] | null>(null); const [selectedForwarding, setSelectedForwarding] = useState<Forwarding | null>(null); useEffect(() => { - fetch(`/api/forwardings?projectId=${selectedProject?.id}`) + authFetch(`/api/forwardings?projectId=${selectedProject?.id}`) .then((response) => { if (!response.ok) { toast.error('포트포워딩 정보를 조회할 수 없습니다.'); @@ -39,12 +39,12 @@ export default function ForwardingList() { .then(({ contents }) => { setForwardings(contents); }); - }, [selectedProject]); + }, [authFetch, selectedProject]); const handleDelete = () => { if (selectedForwarding === null) throw Error('selectedForwarding is null'); - fetch(`/api/forwarding?forwardingId=${selectedForwarding.id}`, { + authFetch(`/api/forwarding?forwardingId=${selectedForwarding.id}`, { method: 'DELETE', }).then((response) => { if (!response.ok) { diff --git a/src/stores/authStore.ts b/src/stores/authStore.ts index ff8324c132bfb42eb8d3a1d339bb017e71dd5135..a44616f305e2f6deb593f8bca69ccdf200e001e0 100644 --- a/src/stores/authStore.ts +++ b/src/stores/authStore.ts @@ -9,6 +9,7 @@ export interface AuthStore { projects: Project[]; selectedProject: (Project & { role?: string }) | null; setSelectedProject: (project: Project) => Promise<void>; + authFetch: (input: RequestInfo, init?: RequestInit) => Promise<Response>; login: (username: string, password: string) => void; logout: () => void; } @@ -38,6 +39,11 @@ export const useAuthStore = create<AuthStore>()( console.log(role); }, + authFetch: async (input, init) => + fetch(input, { + ...init, + headers: { ...init?.headers, 'X-Subject-Token': get().token! }, + }), login: async (username, password) => { const response = await fetch('/api/auth/login', { method: 'POST',