From 6d8f40e30eba20b564dcac264f6e8fbd5ca1aae2 Mon Sep 17 00:00:00 2001 From: Katalina Okano Date: Mon, 21 Dec 2020 05:03:38 -0500 Subject: [PATCH] feat(RolePicker): when not authed, redirect to /auth/login?r=id Signed-off-by: Katalina Okano --- src/pages/s/[id].tsx | 62 +++++++++++++++++++++++++++++++++----------- 1 file changed, 47 insertions(+), 15 deletions(-) diff --git a/src/pages/s/[id].tsx b/src/pages/s/[id].tsx index bd9628c..a321457 100644 --- a/src/pages/s/[id].tsx +++ b/src/pages/s/[id].tsx @@ -1,5 +1,6 @@ import { NextPage, NextPageContext } from 'next'; import Head from 'next/head'; +import { useRouter } from 'next/router'; import * as React from 'react'; import { Member, @@ -10,13 +11,19 @@ import { TransactionType, UserGuildPermissions, } from 'roleypoly/common/types'; -import { apiFetch } from 'roleypoly/common/utils/isomorphicFetch'; +import { apiFetch, getSessionKey } from 'roleypoly/common/utils/isomorphicFetch'; import { RolePickerTemplate } from 'roleypoly/design-system/templates/role-picker'; import { useAppShellProps } from 'roleypoly/providers/appShellData'; -type Props = { - data: PresentableGuild; -}; +type Props = + | { + data: PresentableGuild; + redirect: null; + } + | { + data: null; + redirect: string; + }; const createUpdatePayload = ( oldRoles: Role['id'][], @@ -48,6 +55,18 @@ const createUpdatePayload = ( }; const RolePickerPage: NextPage = (props) => { + const router = useRouter(); + + React.useEffect(() => { + if (props.redirect !== null) { + void router.replace(props.redirect || '/auth/login'); + } + }, [props.redirect]); + + if (!props.data) { + return null; + } + const { appShellProps } = useAppShellProps(); const [isPending, updatePending] = React.useState(false); @@ -108,19 +127,32 @@ RolePickerPage.getInitialProps = async (context: NextPageContext): Promise( - `/get-picker-data/${serverID}`, - undefined, - context - ); - - if (!pickerData) { - throw new Error('TODO: picker fetch failed'); + if (!getSessionKey()) { + return { + data: null, + redirect: `/auth/login?r=${serverID}`, + }; } - return { - data: pickerData, - }; + try { + const pickerData = await apiFetch( + `/get-picker-data/${serverID}`, + undefined, + context + ); + + if (pickerData) { + return { + data: pickerData, + redirect: null, + }; + } + } catch (e) { + return { + data: null, + redirect: `/auth/login?r=${serverID}`, + }; + } }; export default RolePickerPage;