From 490f29e2fdee71807726479c4183a170bcb65735 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dafydd=20Ll=C5=B7r=20Pearson?= <DafyddLlyr@gmail.com> Date: Wed, 25 Oct 2023 19:09:46 +0100 Subject: [PATCH] fix: initUserStore() is not a function bug --- editor.planx.uk/src/components/Header.tsx | 48 ++++++++----------- .../src/routes/views/authenticated.tsx | 2 + 2 files changed, 23 insertions(+), 27 deletions(-) diff --git a/editor.planx.uk/src/components/Header.tsx b/editor.planx.uk/src/components/Header.tsx index 6b1b62f9a0..0c5b233672 100644 --- a/editor.planx.uk/src/components/Header.tsx +++ b/editor.planx.uk/src/components/Header.tsx @@ -6,7 +6,6 @@ import Visibility from "@mui/icons-material/Visibility"; import AppBar from "@mui/material/AppBar"; import Avatar from "@mui/material/Avatar"; import Box from "@mui/material/Box"; -import ButtonBase from "@mui/material/ButtonBase"; import Container from "@mui/material/Container"; import IconButton from "@mui/material/IconButton"; import Link from "@mui/material/Link"; @@ -193,23 +192,28 @@ const TeamLogo: React.FC = () => { ); }; -const Breadcrumbs: React.FC<{ - handleClick?: (href: string) => void; -}> = ({ handleClick }) => { +const Breadcrumbs: React.FC = () => { const route = useCurrentRoute(); - const team = useStore((state) => state.getTeam()); + const [team, isStandalone] = useStore((state) => [ + state.getTeam(), + state.previewEnvironment === "standalone", + ]); return ( <BreadcrumbsRoot> - <ButtonBase - component="span" - color="#999" - onClick={() => handleClick && handleClick("/")} + <Link + style={{ + color: "#fff", + textDecoration: "none", + }} + component={ReactNaviLink} + href={"/"} + prefetch={false} + {...(isStandalone && { target: "_blank" })} > Planâś• - </ButtonBase> - - {team && ( + </Link> + {team.slug && ( <> {" / "} <Link @@ -220,6 +224,7 @@ const Breadcrumbs: React.FC<{ component={ReactNaviLink} href={`/${team.slug}`} prefetch={false} + {...(isStandalone && { target: "_blank" })} > {team.slug} </Link> @@ -303,7 +308,6 @@ const NavBar: React.FC = () => { const PublicToolbar: React.FC<{ showResetButton?: boolean; }> = ({ showResetButton = true }) => { - const { navigate } = useNavigation(); const [path, id, teamTheme] = useStore((state) => [ state.path, state.id, @@ -346,11 +350,7 @@ const PublicToolbar: React.FC<{ <Container maxWidth={false}> <InnerContainer> <LeftBox> - {teamTheme?.logo ? ( - <TeamLogo /> - ) : ( - <Breadcrumbs handleClick={navigate} /> - )} + {teamTheme?.logo ? <TeamLogo /> : <Breadcrumbs />} </LeftBox> {showCentredServiceTitle && <ServiceTitle />} <RightBox> @@ -396,23 +396,17 @@ const EditorToolbar: React.FC<{ headerRef: React.RefObject<HTMLElement>; route: Route; }> = ({ headerRef, route }) => { + const { navigate } = useNavigation(); const [open, setOpen] = useState(false); const [togglePreview, user] = useStore((state) => [ state.togglePreview, state.getUser(), ]); - const { navigate } = useNavigation(); - const handleClose = () => { setOpen(false); }; - const handleClick = (href?: string) => { - if (href) navigate(href); - setOpen(false); - }; - const handleMenuToggle = () => { setOpen(!open); }; @@ -423,7 +417,7 @@ const EditorToolbar: React.FC<{ <Container maxWidth={false}> <InnerContainer> <LeftBox> - <Breadcrumbs handleClick={handleClick}></Breadcrumbs> + <Breadcrumbs /> </LeftBox> <RightBox> {user && ( @@ -502,7 +496,7 @@ const EditorToolbar: React.FC<{ {route.data.flow && ( <MenuItem onClick={() => - handleClick([rootFlowPath(true), "settings"].join("/")) + navigate([rootFlowPath(true), "settings"].join("/")) } > Settings diff --git a/editor.planx.uk/src/routes/views/authenticated.tsx b/editor.planx.uk/src/routes/views/authenticated.tsx index 24b8470f78..e621d788aa 100644 --- a/editor.planx.uk/src/routes/views/authenticated.tsx +++ b/editor.planx.uk/src/routes/views/authenticated.tsx @@ -16,6 +16,8 @@ export const authenticatedView = async () => { await useStore.getState().initUserStore(jwt); + useStore.getState().setPreviewEnvironment("editor"); + return ( <AuthenticatedLayout> <View />