import React, { ReactNode, useState } from "react"; import useSWR from "swr"; import { cx } from "twind/core"; import { fetchApi, handleResponse } from "./apiClient.tsx"; export function SettingsPage(props: { sessionId: string }) { const { sessionId } = props; const session = useSWR( sessionId ? ["sessions/{sessionId}", "GET", { params: { sessionId } }] as const : null, (args) => fetchApi(...args).then(handleResponse), ); const user = useSWR( session.data?.userId ? ["users/{userId}", "GET", { params: { userId: String(session.data.userId) } }] as const : null, (args) => fetchApi(...args).then(handleResponse), ); const params = useSWR( ["settings/params", "GET", {}] as const, (args) => fetchApi(...args).then(handleResponse), ); const [changedParams, setChangedParams] = useState>({}); const [error, setError] = useState(); return (
{ e.preventDefault(); params.mutate(() => fetchApi("settings/params", "PATCH", { query: { sessionId }, body: { type: "application/json", data: changedParams ?? {} }, }).then(handleResponse) ) .then(() => setChangedParams({})) .catch((e) => setError(String(e))); }} >