diff --git a/app/javascript/StorefrontApp/components/Wrapper.tsx b/app/javascript/StorefrontApp/components/Wrapper.tsx index 904c79c..0a3e545 100644 --- a/app/javascript/StorefrontApp/components/Wrapper.tsx +++ b/app/javascript/StorefrontApp/components/Wrapper.tsx @@ -1,5 +1,6 @@ import { HTMLAttributes, ReactNode } from "react"; import { Box } from "@mui/system"; +import LogoutButton from "features/company/LogoutButton"; type HTMLDIVElementTypes = HTMLAttributes; @@ -7,11 +8,13 @@ type WrapperTypes = { children: ReactNode | string | null; fullVH?: boolean; bgColor?: "primary.main" | "primary.white"; + showLogout?: boolean } & HTMLDIVElementTypes; const Wrapper = ({ children, fullVH = false, + showLogout = false, bgColor = "primary.main", ...props }: WrapperTypes) => { @@ -23,12 +26,14 @@ const Wrapper = ({ height: fullVH ? "100vh" : "100%", overflowX: "hidden", backgroundColor: bgColor, + position: "relative", }} {...props} > {children} + {showLogout ? : <>} ); }; -export default Wrapper; +export default Wrapper diff --git a/app/javascript/StorefrontApp/features/company/LogoutButton.tsx b/app/javascript/StorefrontApp/features/company/LogoutButton.tsx new file mode 100644 index 0000000..41017cd --- /dev/null +++ b/app/javascript/StorefrontApp/features/company/LogoutButton.tsx @@ -0,0 +1,23 @@ +import { useCompany } from './companySlice'; +import OffIcon from '@mui/icons-material/PowerSettingsNewRounded' +import { IconButton } from '@mui/material'; + +const LogoutButton = () => { + const { onLogout } = useCompany(); + + return ( + onLogout()} + > + + + ); +}; +export default LogoutButton; diff --git a/app/javascript/StorefrontApp/features/customer/Onboarding.tsx b/app/javascript/StorefrontApp/features/customer/Onboarding.tsx index 0e4134b..7ee7853 100644 --- a/app/javascript/StorefrontApp/features/customer/Onboarding.tsx +++ b/app/javascript/StorefrontApp/features/customer/Onboarding.tsx @@ -48,7 +48,7 @@ export default function Onboarding() { }); return ( - +