mirror of
https://github.com/QuivrHQ/quivr.git
synced 2024-12-16 10:02:30 +03:00
867904f19d
Issue: https://github.com/StanGirard/quivr/issues/1503 Demo: https://github.com/StanGirard/quivr/assets/63923024/fc354768-e25b-4d16-8e40-bfdbf950ddcd
93 lines
2.7 KiB
TypeScript
93 lines
2.7 KiB
TypeScript
"use client";
|
|
import Link from "next/link";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import Button from "@/lib/components/ui/Button";
|
|
import Card, { CardBody, CardHeader } from "@/lib/components/ui/Card";
|
|
import { useSupabase } from "@/lib/context/SupabaseProvider";
|
|
import { redirectToLogin } from "@/lib/router/redirectToLogin";
|
|
|
|
import { StripePricingOrManageButton, UserStatistics } from "./components";
|
|
import { ApiKeyConfig } from "./components/ApiKeyConfig";
|
|
import LanguageSelect from "./components/LanguageDropDown/LanguageSelect";
|
|
import { LogoutModal } from "./components/LogoutCard/LogoutModal";
|
|
import ThemeSelect from "./components/ThemeSelect/ThemeSelect";
|
|
|
|
const UserPage = (): JSX.Element => {
|
|
const { session } = useSupabase();
|
|
|
|
if (!session) {
|
|
redirectToLogin();
|
|
}
|
|
|
|
const { user } = session;
|
|
const { t } = useTranslation(["translation", "user", "config", "chat"]);
|
|
|
|
return (
|
|
<>
|
|
<main className="container lg:w-2/3 mx-auto py-10 px-5">
|
|
<Link href="/chat">
|
|
<Button className="mb-5" variant="primary">
|
|
{t("chat:back_to_chat")}
|
|
</Button>
|
|
</Link>
|
|
<Card className="mb-5 shadow-sm hover:shadow-none">
|
|
<CardHeader>
|
|
<h2 className="font-bold text-xl">
|
|
{t("accountSection", { ns: "config" })}
|
|
</h2>
|
|
</CardHeader>
|
|
|
|
<CardBody className="flex flex-col items-stretch max-w-max gap-2">
|
|
<div className="flex gap-5 items-center">
|
|
<p>
|
|
<strong>{t("email")}:</strong> <span>{user.email}</span>
|
|
</p>
|
|
|
|
<LogoutModal />
|
|
</div>
|
|
<StripePricingOrManageButton />
|
|
</CardBody>
|
|
</Card>
|
|
<Card className="mb-5 shadow-sm hover:shadow-none">
|
|
<CardHeader>
|
|
<h2 className="font-bold text-xl">
|
|
{t("settings", { ns: "config" })}
|
|
</h2>
|
|
</CardHeader>
|
|
|
|
<CardBody>
|
|
<LanguageSelect />
|
|
|
|
<ThemeSelect />
|
|
</CardBody>
|
|
</Card>
|
|
<Card className="mb-5 shadow-sm hover:shadow-none">
|
|
<CardHeader>
|
|
<h2 className="font-bold text-xl">
|
|
{t("brainUsage", { ns: "user" })}
|
|
</h2>
|
|
</CardHeader>
|
|
|
|
<CardBody>
|
|
<UserStatistics />
|
|
</CardBody>
|
|
</Card>
|
|
<Card className="mb-5 shadow-sm hover:shadow-none">
|
|
<CardHeader>
|
|
<h2 className="font-bold text-xl">
|
|
{t("apiKey", { ns: "config" })}
|
|
</h2>
|
|
</CardHeader>
|
|
|
|
<CardBody className="p-3 flex flex-col">
|
|
<ApiKeyConfig />
|
|
</CardBody>
|
|
</Card>
|
|
</main>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default UserPage;
|