feat(web): add page titles

This commit is contained in:
41666 2021-03-13 21:01:44 -05:00
parent 2d9d70734b
commit 8cec641ecb
6 changed files with 51 additions and 18 deletions

View file

@ -2,6 +2,7 @@ import { AuthLogin } from '@roleypoly/design-system/templates/auth-login';
import { GuildSlug } from '@roleypoly/types'; import { GuildSlug } from '@roleypoly/types';
import React from 'react'; import React from 'react';
import { useApiContext } from '../../contexts/api/ApiContext'; import { useApiContext } from '../../contexts/api/ApiContext';
import { Title } from '../../utils/metaTitle';
const Login = () => { const Login = () => {
const { apiUrl, fetch } = useApiContext(); const { apiUrl, fetch } = useApiContext();
@ -39,11 +40,14 @@ const Login = () => {
} }
return ( return (
<AuthLogin <>
guildSlug={guildSlug} <Title title={'Login to Roleypoly'} />
onSendSecretCode={() => {}} <AuthLogin
discordOAuthLink={oauthLink} guildSlug={guildSlug}
/> onSendSecretCode={() => {}}
discordOAuthLink={oauthLink}
/>
</>
); );
}; };

View file

@ -3,6 +3,7 @@ import { LandingTemplate } from '@roleypoly/design-system/templates/landing';
import * as React from 'react'; import * as React from 'react';
import { useAppShellProps } from '../contexts/app-shell/AppShellContext'; import { useAppShellProps } from '../contexts/app-shell/AppShellContext';
import { useSessionContext } from '../contexts/session/SessionContext'; import { useSessionContext } from '../contexts/session/SessionContext';
import { Title } from '../utils/metaTitle';
const Landing = () => { const Landing = () => {
const { isAuthenticated } = useSessionContext(); const { isAuthenticated } = useSessionContext();
@ -12,7 +13,12 @@ const Landing = () => {
return <Redirect to="/servers" />; return <Redirect to="/servers" />;
} }
return <LandingTemplate {...appShellProps} />; return (
<>
<Title title={`Roleypoly - Tame your Discord roles.`} />
<LandingTemplate {...appShellProps} />
</>
);
}; };
export default Landing; export default Landing;

View file

@ -1,4 +1,5 @@
import * as React from 'react'; import * as React from 'react';
import { Title } from '../../utils/metaTitle';
const NewSession = () => { const NewSession = () => {
React.useEffect(() => { React.useEffect(() => {
@ -12,7 +13,12 @@ const NewSession = () => {
} }
}); });
return <div>Redirecting you...</div>; return (
<>
<Title title="Logging you into Roleypoly..." />
<div>Redirecting you...</div>
</>
);
}; };
export default NewSession; export default NewSession;

View file

@ -6,6 +6,7 @@ import * as React from 'react';
import { useAppShellProps } from '../contexts/app-shell/AppShellContext'; import { useAppShellProps } from '../contexts/app-shell/AppShellContext';
import { useRecentGuilds } from '../contexts/recent-guilds/RecentGuildsContext'; import { useRecentGuilds } from '../contexts/recent-guilds/RecentGuildsContext';
import { useSessionContext } from '../contexts/session/SessionContext'; import { useSessionContext } from '../contexts/session/SessionContext';
import { Title } from '../utils/metaTitle';
import { makeRoleTransactions } from '../utils/roleTransactions'; import { makeRoleTransactions } from '../utils/roleTransactions';
type PickerProps = { type PickerProps = {
@ -95,16 +96,19 @@ const Picker = (props: PickerProps) => {
}; };
return ( return (
<RolePickerTemplate <>
activeGuildId={props.serverID} <Title title={`${pickerData.guild.name} - Roleypoly`} />
{...appShellProps} <RolePickerTemplate
guild={pickerData.guild} activeGuildId={props.serverID}
guildData={pickerData.data} {...appShellProps}
member={pickerData.member} guild={pickerData.guild}
roles={pickerData.roles} guildData={pickerData.data}
editable={pickerData.guild.permissionLevel > UserGuildPermissions.User} member={pickerData.member}
onSubmit={onSubmit} roles={pickerData.roles}
/> editable={pickerData.guild.permissionLevel > UserGuildPermissions.User}
onSubmit={onSubmit}
/>
</>
); );
}; };

View file

@ -3,6 +3,7 @@ import { ServersTemplate } from '@roleypoly/design-system/templates/servers';
import * as React from 'react'; import * as React from 'react';
import { useAppShellProps } from '../contexts/app-shell/AppShellContext'; import { useAppShellProps } from '../contexts/app-shell/AppShellContext';
import { useSessionContext } from '../contexts/session/SessionContext'; import { useSessionContext } from '../contexts/session/SessionContext';
import { Title } from '../utils/metaTitle';
const ServersPage = () => { const ServersPage = () => {
const { isAuthenticated, session } = useSessionContext(); const { isAuthenticated, session } = useSessionContext();
@ -11,7 +12,12 @@ const ServersPage = () => {
return <Redirect to="/" />; return <Redirect to="/" />;
} }
return <ServersTemplate {...appShellProps} />; return (
<>
<Title title={'Your Guilds - Roleypoly'} />
<ServersTemplate {...appShellProps} />
</>
);
}; };
export default ServersPage; export default ServersPage;

View file

@ -0,0 +1,7 @@
import Head from 'react-helmet';
export const Title = (props: { title: string }) => (
<Head>
<title>{props.title}</title>
</Head>
);