KK
/
customer-dashboard
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

open store menu

master
alex 2024-01-28 09:31:45 +01:00
parent 78038d7260
commit bfa1a6796c
3 changed files with 37 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/Components/AppRoutes/index.js
View File

@ -30,7 +30,7 @@ export default function AppRoutes({ setUserSession }) {
/>
<Route
path={`${Constants.ROUTE_PATHS.STORE.SETTINGS}/:storeId`}
path={`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/:storeId/${Constants.ROUTE_PATHS.STORE.SETTINGS}`}
element={
<MySupsenseFallback>
<StoreSettings />
@ -39,7 +39,7 @@ export default function AppRoutes({ setUserSession }) {
/>
<Route
path={`${Constants.ROUTE_PATHS.STORE.EMPLOYEES}/:storeId`}
path={`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/:storeId/${Constants.ROUTE_PATHS.STORE.EMPLOYEES}`}
element={
<MySupsenseFallback>
<StoreEmployees />
@ -48,7 +48,7 @@ export default function AppRoutes({ setUserSession }) {
/>
<Route
path={`${Constants.ROUTE_PATHS.STORE.SERVICES}/:storeId`}
path={`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/:storeId/${Constants.ROUTE_PATHS.STORE.SERVICES}`}
element={
<MySupsenseFallback>
<StoreServices />
@ -57,7 +57,7 @@ export default function AppRoutes({ setUserSession }) {
/>
<Route
path={`${Constants.ROUTE_PATHS.STORE.CALENDAR}/:storeId`}
path={`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/:storeId/${Constants.ROUTE_PATHS.STORE.CALENDAR}`}
element={
<MySupsenseFallback>
<StoreCalendar />
@ -66,7 +66,7 @@ export default function AppRoutes({ setUserSession }) {
/>
<Route
path={`${Constants.ROUTE_PATHS.STORE.CALENDAR_AUTH}/:status`}
path={`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/:status/:storeId/${Constants.ROUTE_PATHS.STORE.CALENDAR_AUTH}`}
element={
<MySupsenseFallback>
<StoreCalendarAuth />
@ -75,7 +75,7 @@ export default function AppRoutes({ setUserSession }) {
/>
<Route
path={`${Constants.ROUTE_PATHS.STORE.WEBSITE}/:storeId`}
path={`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/:storeId/${Constants.ROUTE_PATHS.STORE.WEBSITE}`}
element={
<MySupsenseFallback>
<StoreWebsite />

29
src/Components/SideMenu/index.js
View File

@ -27,6 +27,7 @@ export function SideMenuContent({
const storesContext = useStoresContext();
const location = useLocation();
const [selectedKeys, setSelectedKeys] = useState("/");
const [openKeys, setOpenKeys] = useState([""]);
const { t } = useTranslation();
const navigate = useNavigate();
@ -56,13 +57,19 @@ export function SideMenuContent({
label: store.name,
icon: <ShopOutlined />,
children: [],
key: `${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}`,
};
console.warn(
"here",
`${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}`
);
if (sideBarContext.permissions.includes("settings")) {
groupStore.children.push({
label: t("sideMenu.store.settings"),
icon: <SettingOutlined />,
key: `${Constants.ROUTE_PATHS.STORE.SETTINGS}/${store.store_id}`,
key: `${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}/${Constants.ROUTE_PATHS.STORE.SETTINGS}`,
});
}
@ -70,7 +77,7 @@ export function SideMenuContent({
groupStore.children.push({
label: t("sideMenu.store.employees"),
icon: <TeamOutlined />,
key: `${Constants.ROUTE_PATHS.STORE.EMPLOYEES}/${store.store_id}`,
key: `${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}/${Constants.ROUTE_PATHS.STORE.EMPLOYEES}`,
});
}
@ -78,7 +85,7 @@ export function SideMenuContent({
groupStore.children.push({
label: t("sideMenu.store.services"),
icon: <ScissorOutlined />,
key: `${Constants.ROUTE_PATHS.STORE.SERVICES}/${store.store_id}`,
key: `${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}/${Constants.ROUTE_PATHS.STORE.SERVICES}`,
});
}
@ -86,7 +93,7 @@ export function SideMenuContent({
groupStore.children.push({
label: t("sideMenu.store.calendar"),
icon: <CalendarOutlined />,
key: `${Constants.ROUTE_PATHS.STORE.CALENDAR}/${store.store_id}`,
key: `${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}/${Constants.ROUTE_PATHS.STORE.CALENDAR}`,
});
}
@ -97,7 +104,7 @@ export function SideMenuContent({
groupStore.children.push({
label: t("sideMenu.store.website.title"),
icon: <EditOutlined />,
key: `${Constants.ROUTE_PATHS.STORE.WEBSITE}/${store.store_id}`,
key: `${Constants.ROUTE_PATHS.STORE.OVERVIEW}/${store.store_id}/${Constants.ROUTE_PATHS.STORE.WEBSITE}`,
});
}
@ -141,6 +148,13 @@ export function SideMenuContent({
setSelectedKeys(pathname);
let path = pathname.split("/");
if (path.length > 2) {
// /store/:storeId/:subPage - open the store menu
setOpenKeys([`/${path[1]}/${path[2]}`]);
}
// auto close sideMenu on mobile
// this will prevent to auto close sideMenu on first render as the useEffects will be called after the first render
if (contentFirstRender.current) {
@ -195,7 +209,10 @@ export function SideMenuContent({
theme="light"
selectedKeys={[selectedKeys]}
items={getFirstMenuItems()}
defaultOpenKeys={["/website"]}
openKeys={openKeys}
onOpenChange={(openKeys) =>
setOpenKeys(openKeys[openKeys.length - 1])
}
/>
</div>
</div>

14
src/utils.js
View File

@ -37,12 +37,14 @@ export const Constants = {
ROUTE_PATHS: {
OVERVIEW: "/",
STORE: {
SETTINGS: "/store/settings",
EMPLOYEES: "/store/employees",
SERVICES: "/store/services",
CALENDAR: "/store/calendar",
CALENDAR_AUTH: "/store/calendar/auth",
WEBSITE: "/store/website",
// schema: /store/:storeId/:subPage
OVERVIEW: "/store",
SETTINGS: "settings",
EMPLOYEES: "employees",
SERVICES: "services",
CALENDAR: "calendar",
CALENDAR_AUTH: "calendar/auth",
WEBSITE: "website",
},
FEEDBACK: "/feedback",
SUPPORT: "/support",