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 ? ( return !isAuthenticated ? (
<span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"> <span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2">
<Link href="/login" className="outline-none"> <Link href="/login" className="outline-none">
Log in or create account Log in
</Link> </Link>
</span> </span>
) : ( ) : (
<span className="font-light px-2"> <span className="font-light px-2">
{userinfo?.email} (
<span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px]"> <span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px]">
<Link href="/logout" className="outline-none"> <Link href="/logout" className="outline-none">
Log out Log out
</Link> </Link>
</span> </span>
)
</span> </span>
); );
} }

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

@@ -57,59 +57,64 @@ export default function TranscriptBrowser() {
/> />
</div> </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 /** center and max 900px wide */ className="mx-auto max-w-[900px]">
<div className="grid grid-cols-1 gap-2 lg:gap-4 h-full"> <div className="grid grid-cols-1 gap-2 lg:gap-4 h-full">
{isLoading ? ( {results?.items.map((item: GetTranscript) => (
<FontAwesomeIcon <div
icon={faGear} key={item.id}
className="animate-spin-slow h-14 w-14 md:h-20 md:w-20" 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">
{results === null ? ( <Link
<div className="text-gray-500">No transcripts found.</div> 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}
{results?.items.map((item: GetTranscript) => ( </Link>
<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 ? ( {item.locked ? (
<div className="inline-block bg-red-500 text-white px-2 py-1 rounded-full text-xs font-semibold"> <div className="inline-block bg-red-500 text-white px-2 py-1 rounded-full text-xs font-semibold">
Locked Locked
</div> </div>
) : ( ) : (
<></> <></>
)} )}
{item.sourceLanguage ? ( {item.sourceLanguage ? (
<div className="inline-block bg-blue-500 text-white px-2 py-1 rounded-full text-xs font-semibold"> <div className="inline-block bg-blue-500 text-white px-2 py-1 rounded-full text-xs font-semibold">
{item.sourceLanguage} {item.sourceLanguage}
</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 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> </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 Link from "next/link";
import About from "./(aboutAndPrivacy)/about"; import About from "./(aboutAndPrivacy)/about";
import Privacy from "./(aboutAndPrivacy)/privacy"; 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"] }); const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] });
@@ -60,6 +60,7 @@ export const metadata: Metadata = {
}; };
export default function RootLayout({ children }) { export default function RootLayout({ children }) {
const requireLogin = featRequireLogin();
return ( return (
<html lang="en"> <html lang="en">
<body className={poppins.className + " h-screen relative"}> <body className={poppins.className + " h-screen relative"}>
@@ -117,6 +118,14 @@ export default function RootLayout({ children }) {
) : ( ) : (
<></> <></>
)} )}
{requireLogin ? (
<>
&nbsp;·&nbsp;
<UserInfo />
</>
) : (
<></>
)}
</div> </div>
</header> </header>