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

Show fullscreen room

Browse Source
This commit is contained in:
Sergey Mankovsky
2024-09-01 01:26:15 +02:00
parent b019e81b9b
commit 2b157c7c8a
3 changed files with 121 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
www/app/(app)/layout.tsx Normal file
View File

@@ -0,0 +1,119 @@
import { Container, Flex, Link } from "@chakra-ui/layout";
import { getConfig } from "../lib/edgeConfig";
import NextLink from "next/link";
import Image from "next/image";
import About from "../(aboutAndPrivacy)/about";
import Privacy from "../(aboutAndPrivacy)/privacy";
import UserInfo from "../(auth)/userInfo";
export default async function AppLayout({
children,
}: {
children: React.ReactNode;
}) {
const hostname = new URL(process.env.NEXT_PUBLIC_SITE_URL!).hostname;
const config = await getConfig(hostname);
const { requireLogin, privacy, browse, rooms } = config.features;
return (
<Container
minW="100vw"
maxH="100vh"
minH="100vh"
maxW="container.xl"
display="grid"
gridTemplateRows="auto minmax(0,1fr)"
>
<Flex
as="header"
justify="space-between"
alignItems="center"
w="100%"
py="2"
px="0"
>
{/* Logo on the left */}
<Link
as={NextLink}
href="/"
className="flex outline-blue-300 md:outline-none focus-visible:underline underline-offset-2 decoration-[.5px] decoration-gray-500"
>
<Image
src="/reach.png"
width={16}
height={16}
className="h-10 w-auto"
alt="Reflector"
/>
<div className="hidden flex-col ml-2 md:block">
<h1 className="text-[38px] font-bold tracking-wide leading-tight">
Reflector
</h1>
<p className="text-gray-500 text-xs tracking-tighter">
Capture the signal, not the noise
</p>
</div>
</Link>
<div>
{/* Text link on the right */}
<Link
as={NextLink}
href="/transcripts/new"
className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
>
Create
</Link>
{browse ? (
<>
&nbsp;·&nbsp;
<Link
href="/browse"
as={NextLink}
className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
prefetch={false}
>
Browse
</Link>
</>
) : (
<></>
)}
{rooms ? (
<>
&nbsp;·&nbsp;
<Link
href="/rooms"
as={NextLink}
className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
prefetch={false}
>
Rooms
</Link>
</>
) : (
<></>
)}
&nbsp;·&nbsp;
<About buttonText="About" />
{privacy ? (
<>
&nbsp;·&nbsp;
<Privacy buttonText="Privacy" />
</>
) : (
<></>
)}
{requireLogin ? (
<>
&nbsp;·&nbsp;
<UserInfo />
</>
) : (
<></>
)}
</div>
</Flex>
{children}
</Container>
);
}

2
www/app/[roomName]/page.tsx
View File

@@ -25,7 +25,7 @@ export default function Room(details: RoomDetails) {
<whereby-embed <whereby-embed
ref={wherebyRef} ref={wherebyRef}
room={roomUrl} room={roomUrl}
style={{ width: "100%", height: "98%" }} style={{ width: "100vw", height: "100vh" }}
/> />
)} )}
</> </>

110
www/app/layout.tsx
View File

@@ -2,20 +2,14 @@ import "./styles/globals.scss";
import { Poppins } from "next/font/google"; import { Poppins } from "next/font/google";
import { Metadata, Viewport } from "next"; import { Metadata, Viewport } from "next";
import FiefWrapper from "./(auth)/fiefWrapper"; import FiefWrapper from "./(auth)/fiefWrapper";
import UserInfo from "./(auth)/userInfo";
import { ErrorProvider } from "./(errors)/errorContext"; import { ErrorProvider } from "./(errors)/errorContext";
import ErrorMessage from "./(errors)/errorMessage"; import ErrorMessage from "./(errors)/errorMessage";
import Image from "next/image";
import About from "./(aboutAndPrivacy)/about";
import Privacy from "./(aboutAndPrivacy)/privacy";
import { DomainContextProvider } from "./domainContext"; import { DomainContextProvider } from "./domainContext";
import { getConfig } from "./lib/edgeConfig"; import { getConfig } from "./lib/edgeConfig";
import { ErrorBoundary } from "@sentry/nextjs"; import { ErrorBoundary } from "@sentry/nextjs";
import { cookies } from "next/dist/client/components/headers"; import { cookies } from "next/dist/client/components/headers";
import { SESSION_COOKIE_NAME } from "./lib/fief"; import { SESSION_COOKIE_NAME } from "./lib/fief";
import { Providers } from "./providers"; import { Providers } from "./providers";
import NextLink from "next/link";
import { Container, Flex, Link } from "@chakra-ui/react";
const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] }); const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] });
@@ -74,7 +68,6 @@ export default async function RootLayout({
}) { }) {
const hostname = new URL(process.env.NEXT_PUBLIC_SITE_URL!).hostname; const hostname = new URL(process.env.NEXT_PUBLIC_SITE_URL!).hostname;
const config = await getConfig(hostname); const config = await getConfig(hostname);
const { requireLogin, privacy, browse, rooms } = config.features;
const hasAuthCookie = !!cookies().get(SESSION_COOKIE_NAME); const hasAuthCookie = !!cookies().get(SESSION_COOKIE_NAME);
return ( return (
@@ -89,108 +82,7 @@ export default async function RootLayout({
<ErrorBoundary fallback={<p>"something went really wrong"</p>}> <ErrorBoundary fallback={<p>"something went really wrong"</p>}>
<ErrorProvider> <ErrorProvider>
<ErrorMessage /> <ErrorMessage />
<Providers> <Providers>{children}</Providers>
<Container
minW="100vw"
maxH="100vh"
minH="100vh"
maxW="container.xl"
display="grid"
gridTemplateRows="auto minmax(0,1fr)"
>
<Flex
as="header"
justify="space-between"
alignItems="center"
w="100%"
py="2"
px="0"
>
{/* Logo on the left */}
<Link
as={NextLink}
href="/"
className="flex outline-blue-300 md:outline-none focus-visible:underline underline-offset-2 decoration-[.5px] decoration-gray-500"
>
<Image
src="/reach.png"
width={16}
height={16}
className="h-10 w-auto"
alt="Reflector"
/>
<div className="hidden flex-col ml-2 md:block">
<h1 className="text-[38px] font-bold tracking-wide leading-tight">
Reflector
</h1>
<p className="text-gray-500 text-xs tracking-tighter">
Capture the signal, not the noise
</p>
</div>
</Link>
<div>
{/* Text link on the right */}
<Link
as={NextLink}
href="/transcripts/new"
className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
>
Create
</Link>
{browse ? (
<>
&nbsp;·&nbsp;
<Link
href="/browse"
as={NextLink}
className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
prefetch={false}
>
Browse
</Link>
</>
) : (
<></>
)}
{rooms ? (
<>
&nbsp;·&nbsp;
<Link
href="/rooms"
as={NextLink}
className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
prefetch={false}
>
Rooms
</Link>
</>
) : (
<></>
)}
&nbsp;·&nbsp;
<About buttonText="About" />
{privacy ? (
<>
&nbsp;·&nbsp;
<Privacy buttonText="Privacy" />
</>
) : (
<></>
)}
{requireLogin ? (
<>
&nbsp;·&nbsp;
<UserInfo />
</>
) : (
<></>
)}
</div>
</Flex>
{children}
</Container>
</Providers>
</ErrorProvider> </ErrorProvider>
</ErrorBoundary> </ErrorBoundary>
</DomainContextProvider> </DomainContextProvider>