Infrastructure/zipline
1
Fork 0
Code Issues Pull requests Activity

fix: resolve multiple el in titles

Browse source
This commit is contained in:
diced 2022-10-27 21:07:44 -07:00
parent 7ac574b230
commit 4c0532006c
No known key found for this signature in database
GPG key ID: 370BD1BA142842D1
14 changed files with 111 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/pages/404.tsx
View file

@ -2,9 +2,15 @@ import React from 'react';
import { Button, Stack, Title } from '@mantine/core'; import { Button, Stack, Title } from '@mantine/core';
import Link from 'components/Link'; import Link from 'components/Link';
import MutedText from 'components/MutedText'; import MutedText from 'components/MutedText';
import Head from 'next/head';
export default function FourOhFour() { export default function FourOhFour() {
return ( return (
<>
<Head>
<title>404 Not Found</title>
</Head>
<Stack <Stack
sx={{ sx={{
display: 'flex', display: 'flex',
@ -21,7 +27,6 @@ export default function FourOhFour() {
Head to the Dashboard Head to the Dashboard
</Button> </Button>
</Stack> </Stack>
</>
); );
} }
FourOhFour.title = 'Zipline - 404';

15
src/pages/500.tsx
View file

@ -1,10 +1,16 @@
import React from 'react'; import React from 'react';
import { Button, Stack, Title } from '@mantine/core'; import { Button, Stack, Title, Tooltip } from '@mantine/core';
import Link from 'components/Link'; import Link from 'components/Link';
import MutedText from 'components/MutedText'; import MutedText from 'components/MutedText';
import Head from 'next/head';
export default function FiveHundred() { export default function FiveHundred() {
return ( return (
<>
<Head>
<title>500 Internal Server Error</title>
</Head>
<Stack <Stack
sx={{ sx={{
display: 'flex', display: 'flex',
@ -16,12 +22,13 @@ export default function FiveHundred() {
spacing='sm' spacing='sm'
> >
<Title sx={{ fontSize: 220, fontWeight: 900, lineHeight: 0.8 }}>500</Title> <Title sx={{ fontSize: 220, fontWeight: 900, lineHeight: 0.8 }}>500</Title>
<MutedText sx={{ fontSize: 40, fontWeight: 500 }}>Internal Server Error</MutedText> <Tooltip label={"Take a look at Zipline's logs and the browser console for more info"}>
<MutedText>Internal server error</MutedText>
</Tooltip>
<Button component={Link} href='/dashboard'> <Button component={Link} href='/dashboard'>
Head to the Dashboard Head to the Dashboard
</Button> </Button>
</Stack> </Stack>
</>
); );
} }
FiveHundred.title = 'Zipline - 500';

7
src/pages/_error.tsx
View file

@ -2,9 +2,15 @@ import React from 'react';
import { Button, Stack, Title } from '@mantine/core'; import { Button, Stack, Title } from '@mantine/core';
import Link from 'components/Link'; import Link from 'components/Link';
import MutedText from 'components/MutedText'; import MutedText from 'components/MutedText';
import Head from 'next/head';
export default function Error({ statusCode }) { export default function Error({ statusCode }) {
return ( return (
<>
<Head>
<title>{statusCode} Error</title>
</Head>
<Stack <Stack
sx={{ sx={{
display: 'flex', display: 'flex',
@ -21,6 +27,7 @@ export default function Error({ statusCode }) {
Head to the Dashboard Head to the Dashboard
</Button> </Button>
</Stack> </Stack>
</>
); );
} }

3
src/pages/auth/login.tsx
View file

@ -59,10 +59,11 @@ export default function Login({ title, user_registration, oauth_registration, oa
})(); })();
}, []); }, []);
const full_title = `${title} - Login`;
return ( return (
<> <>
<Head> <Head>
<title>{title} - Login</title> <title>{full_title}</title>
</Head> </Head>
<Center sx={{ height: '100vh' }}> <Center sx={{ height: '100vh' }}>
<div> <div>

5
src/pages/auth/register.tsx
View file

@ -83,12 +83,11 @@ export default function Register({ code, title, user_registration }) {
} }
}; };
const full_title = `${title} - Invite (${code || 'None'})`;
return ( return (
<> <>
<Head> <Head>
<title> <title>{title}</title>
{title} - Invite ({code})
</title>
</Head> </Head>
<Center sx={{ height: '100vh' }}> <Center sx={{ height: '100vh' }}>
<Box <Box

21
src/pages/code/[id].tsx
View file

@ -4,15 +4,17 @@ import exts from 'lib/exts';
import { streamToString } from 'lib/utils/streams'; import { streamToString } from 'lib/utils/streams';
import { GetServerSideProps } from 'next'; import { GetServerSideProps } from 'next';
import { checkPassword } from 'lib/util'; import { checkPassword } from 'lib/util';
import config from 'lib/config';
import Head from 'next/head';
type CodeProps = { export default function Code({ code, id, title }) {
code: string; const full_title = `${title} - Code (${id})`;
id: string;
};
// Code component
export default function Code({ code, id }: CodeProps) {
return ( return (
<>
<Head>
<title>{full_title}</title>
</Head>
<Prism <Prism
sx={(t) => ({ height: '100vh', backgroundColor: t.colors.dark[8] })} sx={(t) => ({ height: '100vh', backgroundColor: t.colors.dark[8] })}
withLineNumbers withLineNumbers
@ -20,11 +22,11 @@ export default function Code({ code, id }: CodeProps) {
> >
{code} {code}
</Prism> </Prism>
</>
); );
} }
// handle server-side rendering export const getServerSideProps: GetServerSideProps = async (context) => {
export const getServerSideProps: GetServerSideProps<CodeProps> = async (context) => {
if (process.env.ZIPLINE_DOCKER_BUILD) return { props: { code: '', id: '' } }; if (process.env.ZIPLINE_DOCKER_BUILD) return { props: { code: '', id: '' } };
const { default: datasource } = await import('lib/datasource'); const { default: datasource } = await import('lib/datasource');
@ -58,6 +60,7 @@ export const getServerSideProps: GetServerSideProps<CodeProps> = async (context)
props: { props: {
code: await streamToString(data), code: await streamToString(data),
id: context.params.id as string, id: context.params.id as string,
title: config.website.title,
}, },
}; };
}; };

3
src/pages/dashboard/files.tsx
View file

@ -11,10 +11,11 @@ export default function FilesPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - Files`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Files</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>

3
src/pages/dashboard/invites.tsx
View file

@ -20,10 +20,11 @@ export default function InvitesPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - Invites`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Invites</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<Invites /> <Invites />

3
src/pages/dashboard/manage.tsx
View file

@ -11,10 +11,11 @@ export default function ManagePage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - Manage User`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Manage User</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<Manage /> <Manage />

3
src/pages/dashboard/stats.tsx
View file

@ -11,10 +11,11 @@ export default function StatsPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - Statistics`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Stats</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<Stats /> <Stats />

3
src/pages/dashboard/text.tsx
View file

@ -11,10 +11,11 @@ export default function UploadTextPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - Upload Text`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Upload Text</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<UploadText /> <UploadText />

3
src/pages/dashboard/upload.tsx
View file

@ -11,10 +11,11 @@ export default function UploadPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - Upload`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Upload</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<Upload chunks={{ chunks_size: props.chunks_size, max_size: props.max_size }} /> <Upload chunks={{ chunks_size: props.chunks_size, max_size: props.max_size }} />

3
src/pages/dashboard/urls.tsx
View file

@ -11,10 +11,11 @@ export default function UrlsPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - URLs`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - URLs</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<Urls /> <Urls />

3
src/pages/dashboard/users.tsx
View file

@ -11,10 +11,11 @@ export default function UsersPage(props) {
if (loading) return <LoadingOverlay visible={loading} />; if (loading) return <LoadingOverlay visible={loading} />;
const title = `${props.title} - User`;
return ( return (
<> <>
<Head> <Head>
<title>{props.title} - Users</title> <title>{title}</title>
</Head> </Head>
<Layout props={props}> <Layout props={props}>
<Users /> <Users />