selfhostyourtech/reflector
2
0
Fork 0
mirror of https://github.com/Monadical-SAS/reflector.git synced 2025-12-20 20:29:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

www: add login on layout and fixes browse

Browse Source
This commit is contained in:
Mathieu Virbel
2023-10-18 19:52:03 +02:00
committed by Mathieu Virbel
parent 81dc9458ae
commit 220b9811af
3 changed files with 63 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
www/app/(auth)/userInfo.tsx
View File

@@ -12,18 +12,16 @@ export default function UserInfo() {
return !isAuthenticated ? (
<span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2">
<Link href="/login" className="outline-none">
Log in or create account
Log in
</Link>
</span>
) : (
<span className="font-light px-2">
{userinfo?.email} (
<span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px]">
<Link href="/logout" className="outline-none">
Log out
</Link>
</span>
)
</span>
);
}

99
www/app/browse/page.tsx
View File

@@ -57,59 +57,64 @@ export default function TranscriptBrowser() {
/>
</div>
{isLoading && (
<div className="full-screen flex flex-col items-center justify-center">
<FontAwesomeIcon
icon={faGear}
className="animate-spin-slow h-14 w-14 md:h-20 md:w-20"
/>
</div>
)}
{!isLoading && !results ? (
<div className="text-gray-500">
No transcripts found, but you can&nbsp;
<Link href="/transcripts/new" className="underline">
record a meeting
</Link>
&nbsp;to get started.
</div>
) : (
<></>
)}
<div /** center and max 900px wide */ className="mx-auto max-w-[900px]">
<div className="grid grid-cols-1 gap-2 lg:gap-4 h-full">
{isLoading ? (
<FontAwesomeIcon
icon={faGear}
className="animate-spin-slow h-14 w-14 md:h-20 md:w-20"
/>
) : (
<>
{results === null ? (
<div className="text-gray-500">No transcripts found.</div>
) : (
<></>
)}
{results?.items.map((item: GetTranscript) => (
<div
key={item.id}
className="flex flex-col bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4"
>
<div className="flex flex-col">
<div className="flex flex-row gap-2 items-start">
<Link
href={`/transcripts/${item.id}`}
className="text-1xl font-semibold flex-1 pl-0 hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
>
{item.title || item.name}
</Link>
{results?.items.map((item: GetTranscript) => (
<div
key={item.id}
className="flex flex-col bg-blue-400/20 rounded-lg md:rounded-xl p-2 md:px-4"
>
<div className="flex flex-col">
<div className="flex flex-row gap-2 items-start">
<Link
href={`/transcripts/${item.id}`}
className="text-1xl font-semibold flex-1 pl-0 hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
>
{item.title || item.name}
</Link>
{item.locked ? (
<div className="inline-block bg-red-500 text-white px-2 py-1 rounded-full text-xs font-semibold">
Locked
</div>
) : (
<></>
)}
{item.locked ? (
<div className="inline-block bg-red-500 text-white px-2 py-1 rounded-full text-xs font-semibold">
Locked
</div>
) : (
<></>
)}
{item.sourceLanguage ? (
<div className="inline-block bg-blue-500 text-white px-2 py-1 rounded-full text-xs font-semibold">
{item.sourceLanguage}
</div>
) : (
<></>
)}
{item.sourceLanguage ? (
<div className="inline-block bg-blue-500 text-white px-2 py-1 rounded-full text-xs font-semibold">
{item.sourceLanguage}
</div>
<div className="text-xs text-gray-700">
{new Date(item.createdAt).toLocaleDateString("en-US")}
</div>
<div className="text-sm">{item.shortSummary}</div>
</div>
) : (
<></>
)}
</div>
))}
</>
)}
<div className="text-xs text-gray-700">
{new Date(item.createdAt).toLocaleDateString("en-US")}
</div>
<div className="text-sm">{item.shortSummary}</div>
</div>
</div>
))}
</div>
</div>
</div>

11
www/app/layout.tsx
View File

@@ -9,7 +9,7 @@ import Image from "next/image";
import Link from "next/link";
import About from "./(aboutAndPrivacy)/about";
import Privacy from "./(aboutAndPrivacy)/privacy";
import { featPrivacy } from "./lib/utils";
import { featPrivacy, featRequireLogin } from "./lib/utils";
const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] });
@@ -60,6 +60,7 @@ export const metadata: Metadata = {
};
export default function RootLayout({ children }) {
const requireLogin = featRequireLogin();
return (
<html lang="en">
<body className={poppins.className + " h-screen relative"}>
@@ -117,6 +118,14 @@ export default function RootLayout({ children }) {
) : (
<></>
)}
{requireLogin ? (
<>
&nbsp;·&nbsp;
<UserInfo />
</>
) : (
<></>
)}
</div>
</header>