import React, { useRef } from "react"; import useSWR, { useSWRConfig } from "swr"; import { AdminData } from "../api/adminsRoute.ts"; import { fetchApi, handleResponse } from "./apiClient.ts"; export function AdminsPage(props: { sessionId: string | null }) { const { sessionId } = props; const { mutate } = useSWRConfig(); const addDialogRef = useRef(null); const getSession = useSWR( sessionId ? ["sessions/{sessionId}", "GET", { params: { sessionId } }] as const : null, (args) => fetchApi(...args).then(handleResponse), ); const getUser = useSWR( getSession.data?.userId ? ["users/{userId}", "GET", { params: { userId: String(getSession.data.userId) } }] as const : null, (args) => fetchApi(...args).then(handleResponse), ); const getAdmins = useSWR( ["admins", "GET", {}] as const, (args) => fetchApi(...args).then(handleResponse), ); return ( <> {getUser.data && getAdmins.data && getAdmins.data.length === 0 && ( )} {getAdmins.data?.length ? ( ) : getAdmins.data?.length === 0 ? ( ) : getAdmins.error ?

Loading admins failed

:
} {getUser.data?.admin && ( )} ); } function AddAdminDialog(props: { dialogRef: React.RefObject; sessionId: string | null; }) { const { dialogRef, sessionId } = props; const { mutate } = useSWRConfig(); return (
{ e.preventDefault(); const data = new FormData(e.target as HTMLFormElement); mutate( (key) => Array.isArray(key) && key[0] === "admins", async () => fetchApi("admins", "POST", { query: { sessionId: sessionId! }, body: { type: "application/json", data: { tgUserId: Number(data.get("tgUserId") as string), }, }, }).then(handleResponse), { populateCache: false }, ); dialogRef.current?.close(); }} >
); } function AdminListItem(props: { admin: AdminData; sessionId: string | null }) { const { admin, sessionId } = props; const deleteDialogRef = useRef(null); const getAdminUser = useSWR( ["users/{userId}", "GET", { params: { userId: String(admin.tgUserId) } }] as const, (args) => fetchApi(...args).then(handleResponse), ); const getSession = useSWR( sessionId ? ["sessions/{sessionId}", "GET", { params: { sessionId } }] as const : null, (args) => fetchApi(...args).then(handleResponse), ); const getUser = useSWR( getSession.data?.userId ? ["users/{userId}", "GET", { params: { userId: String(getSession.data.userId) } }] as const : null, (args) => fetchApi(...args).then(handleResponse), ); return (
  • {getAdminUser.data?.first_name ?? admin.id} {getAdminUser.data?.last_name}{" "} {getAdminUser.data?.username ? ( @{getAdminUser.data.username} ) : null}

    {getAdminUser.data?.bio ? (

    {getAdminUser.data?.bio}

    ) : null} {getUser.data?.admin && (

    )}
  • ); } function DeleteAdminDialog(props: { dialogRef: React.RefObject; adminId: string; sessionId: string | null; }) { const { dialogRef, adminId, sessionId } = props; const { mutate } = useSWRConfig(); return (
    { e.preventDefault(); mutate( (key) => Array.isArray(key) && key[0] === "admins", async () => fetchApi("admins/{adminId}", "DELETE", { query: { sessionId: sessionId! }, params: { adminId: adminId }, }).then(handleResponse), { populateCache: false }, ); dialogRef.current?.close(); }} >

    Are you sure you want to delete this admin?

    ); }