Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 | import { TabPanel } from "@mui/lab"; import { Button, styled } from "@mui/material"; import Alert from "components/Alert"; import CenteredSpinner from "components/CenteredSpinner/CenteredSpinner"; import HtmlMeta from "components/HtmlMeta"; import { ProfileUserProvider } from "features/profile/hooks/useProfileUser"; import UserCard from "features/profile/view/UserCard"; import UserOverview from "features/profile/view/UserOverview"; import { StyledProfileRoot } from "features/profile/view/UserPage"; import { useTranslation } from "i18n"; import { GLOBAL, MOD } from "i18n/namespaces"; import Link from "next/link"; import { useRouter } from "next/router"; import { UserDetails } from "proto/admin_pb"; import { adminPanelUserLink, routeToModUser, UserTab } from "routes"; import useUserWithDetails from "./hooks"; import ModPanel from "./ModPanel"; import { ModUserDetails } from "./useModUserDetails"; const StyledBanDelBanner = styled("h1")(({ theme }) => ({ marginBottom: "0", color: "red", textAlign: "center", textTransform: "uppercase", })); function AdminActions({ username }: { username: string }) { const { t } = useTranslation([GLOBAL, MOD]); return ( <> <Link href={adminPanelUserLink(username)} passHref legacyBehavior> <Button component="a" variant="outlined"> {t("mod:actions.open_in_console")} </Button> </Link> </> ); } function BanDeleteBanner({ userDetails, }: { userDetails: UserDetails.AsObject; }) { const { t } = useTranslation(MOD); let status = ""; Iif (userDetails.banned || userDetails.deleted) { status = " " + [ userDetails.deleted && t("mod:deleted"), userDetails.banned && t("mod:banned"), ] .filter(Boolean) .join(" + "); } return ( <StyledBanDelBanner> {status ? `☠️ ${status} ☠️` : t("mod:title")} </StyledBanDelBanner> ); } export default function ModUserPage({ username, tab = "about", }: { username: string; tab?: UserTab; }) { const router = useRouter(); const { user, userDetails, isLoading, error } = useUserWithDetails(username); return ( <> <HtmlMeta title={user?.name} /> {error && <Alert severity="error">{error}</Alert>} {isLoading ? ( <CenteredSpinner /> ) : user && userDetails ? ( <ModUserDetails userDetails={userDetails}> <ProfileUserProvider user={user}> <BanDeleteBanner userDetails={userDetails} /> <StyledProfileRoot> <UserOverview showHostAndMeetAvailability actions={<AdminActions username={user.username} />} /> <UserCard tab={tab} modPanel={ <TabPanel value="mod"> <ModPanel user={user} userDetails={userDetails} /> </TabPanel> } onTabChange={(newTab) => { router.push(routeToModUser(user.username, newTab)); }} /> </StyledProfileRoot> </ProfileUserProvider> </ModUserDetails> ) : null} </> ); } |