Skip to content

Commit

Permalink
wip: layers
Browse files Browse the repository at this point in the history
  • Loading branch information
@majkshkurti
majkshkurti committed Sep 17, 2023
1 parent a458293 commit c647f8b
Show file tree
Hide file tree
Showing 20 changed files with 635 additions and 525 deletions.
20 changes: 10 additions & 10 deletions apps/web/app/[lng]/(dashboard)/content/layout.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,25 +1,25 @@
"use client";

import { makeStyles } from "@/lib/theme";
// import { makeStyles } from "@/lib/theme";

import Box from "@p4b/ui/components/Box";
// import Box from "@p4b/ui/components/Box";

interface ContentLayoutProps {
children: React.ReactNode;
}

const ContentLayout = (props: ContentLayoutProps) => {
const { children } = props;
// const { children } = props;

const { classes } = useStyles();
// const { classes } = useStyles();

return <Box className={classes.root}>{children}</Box>;
return <>{props.children}</>;
};

const useStyles = makeStyles({ name: { ContentLayout } })(() => ({
root: {
marginTop: "100px",
},
}));
// const useStyles = makeStyles({ name: { ContentLayout } })(() => ({
// root: {
// marginTop: "100px",
// },
// }));

export default ContentLayout;
5 changes: 2 additions & 3 deletions apps/web/app/[lng]/(dashboard)/content/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
"use client";

import ContentManagement from "@/app/[lng]/(dashboard)/content/ContentManagement";

// import ContentManagement from "@/app/[lng]/(dashboard)/content/ContentManagement";
export default function ContentPage() {
return <ContentManagement />;
return <></>;
}
2 changes: 1 addition & 1 deletion apps/web/app/[lng]/(dashboard)/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const DashboardLayout = ({ children }: { children: React.ReactNode }) => {
<Stack component="div" width="100%" height="100%" overflow="hidden">
<Header
height={52}
title="Dashboard"
title="Workspace"
showHambugerMenu={hidden}
onMenuIconClick={() => {
setNavVisible(!navVisible);
Expand Down
179 changes: 90 additions & 89 deletions apps/web/app/[lng]/(dashboard)/settings/layout.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,106 +1,107 @@
"use client";

import GridContainer from "@/components/grid/GridContainer";
import SingleGrid from "@/components/grid/SingleGrid";
import { makeStyles } from "@/lib/theme";
import { Text } from "@/lib/theme";
import Link from "next/link";
import { usePathname } from "next/navigation";
// import GridContainer from "@/components/grid/GridContainer";
// import SingleGrid from "@/components/grid/SingleGrid";
// import { makeStyles } from "@/lib/theme";
// import { Text } from "@/lib/theme";
// import Link from "next/link";
// import { usePathname } from "next/navigation";

import Box from "@p4b/ui/components/Box";
import { Divider } from "@p4b/ui/components/DataDisplay/Divider";
// import Box from "@p4b/ui/components/Box";
// import { Divider } from "@p4b/ui/components/DataDisplay/Divider";

interface SettingsLayoutProps {
children: React.ReactNode;
}

const Settings = (props: SettingsLayoutProps) => {
const SettingsLayout = (props: SettingsLayoutProps) => {
const { children } = props;

const pathname = usePathname();
// const pathname = usePathname();

const { classes } = useStyles();
// const { classes } = useStyles();

return (
<Box className={classes.root}>
<GridContainer>
<SingleGrid span={1}>
<div>
<Link href="/settings/organization" className={classes.link}>
<span>
<Text
typo="body 2"
className={
pathname === "/settings/organization" ? classes.selectedSidebarText : classes.SidebarText
}>
Organization
</Text>
</span>
</Link>
<Divider width="100%" color="main" className={classes.hr} />
<Link href="/settings/subscription" className={classes.link}>
<span>
<Text
typo="body 2"
className={
pathname === "/settings/subscription" ? classes.selectedSidebarText : classes.SidebarText
}>
Subscription
</Text>
</span>
</Link>
<Divider width="100%" color="main" className={classes.hr} />
<Link href="/settings/privacy-preference" className={classes.link}>
<span>
<Text
typo="body 2"
className={
pathname === "/settings/privacy-preference"
? classes.selectedSidebarText
: classes.SidebarText
}>
Privacy preferences
</Text>
</span>
</Link>
<Divider width="100%" color="main" className={classes.hr} />
</div>
</SingleGrid>
<SingleGrid span={3}>
<div>{children}</div>
</SingleGrid>
</GridContainer>
</Box>
<>{children}</>
// <Box className={classes.root}>
// <GridContainer>
// <SingleGrid span={1}>
// <div>
// <Link href="/settings/organization" className={classes.link}>
// <span>
// <Text
// typo="body 2"
// className={
// pathname === "/settings/organization" ? classes.selectedSidebarText : classes.SidebarText
// }>
// Organization
// </Text>
// </span>
// </Link>
// <Divider width="100%" color="main" className={classes.hr} />
// <Link href="/settings/subscription" className={classes.link}>
// <span>
// <Text
// typo="body 2"
// className={
// pathname === "/settings/subscription" ? classes.selectedSidebarText : classes.SidebarText
// }>
// Subscription
// </Text>
// </span>
// </Link>
// <Divider width="100%" color="main" className={classes.hr} />
// <Link href="/settings/privacy-preference" className={classes.link}>
// <span>
// <Text
// typo="body 2"
// className={
// pathname === "/settings/privacy-preference"
// ? classes.selectedSidebarText
// : classes.SidebarText
// }>
// Privacy preferences
// </Text>
// </span>
// </Link>
// <Divider width="100%" color="main" className={classes.hr} />
// </div>
// </SingleGrid>
// <SingleGrid span={3}>
// <div>{children}</div>
// </SingleGrid>
// </GridContainer>
// </Box>
);
};

const useStyles = makeStyles({ name: { Settings } })((theme) => ({
root: {
marginTop: "100px",
},
wrapper: {
display: "flex",
gap: "1%",
},
SidebarText: {
// padding: theme.spacing(1) theme.spacing(4),
padding: `${theme.spacing(1)}px ${theme.spacing(4)}px`,
cursor: "pointer",
"&:hover": {
backgroundColor: theme.colors.palette[theme.isDarkModeEnabled ? "dark" : "light"].greyVariant1 + "50",
},
},
selectedSidebarText: {
padding: `${theme.spacing(1)}px ${theme.spacing(4)}px`,
cursor: "pointer",
backgroundColor: theme.colors.palette.focus.light + "14",
},
hr: {
margin: `${theme.spacing(1)}px 0`,
},
link: {
textDecoration: "none",
},
}));
// const useStyles = makeStyles({ name: { Settings } })((theme) => ({
// root: {
// marginTop: "100px",
// },
// wrapper: {
// display: "flex",
// gap: "1%",
// },
// SidebarText: {
// // padding: theme.spacing(1) theme.spacing(4),
// padding: `${theme.spacing(1)}px ${theme.spacing(4)}px`,
// cursor: "pointer",
// "&:hover": {
// backgroundColor: theme.colors.palette[theme.isDarkModeEnabled ? "dark" : "light"].greyVariant1 + "50",
// },
// },
// selectedSidebarText: {
// padding: `${theme.spacing(1)}px ${theme.spacing(4)}px`,
// cursor: "pointer",
// backgroundColor: theme.colors.palette.focus.light + "14",
// },
// hr: {
// margin: `${theme.spacing(1)}px 0`,
// },
// link: {
// textDecoration: "none",
// },
// }));

export default Settings;
export default SettingsLayout;
7 changes: 3 additions & 4 deletions apps/web/app/[lng]/(dashboard)/settings/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import "@/styles/globals.css";
import { redirect } from "next/navigation";
// import { redirect } from "next/navigation";

export default async function Organization({}) {
// return (<p>hello</p>)
return redirect("/settings/organization");
return <p>hello</p>;
// return redirect("/settings/organization");
}
6 changes: 3 additions & 3 deletions apps/web/app/[lng]/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ import type { Metadata } from "next";
import "react-toastify/dist/ReactToastify.css";
import { Mulish } from "next/font/google";

const mullish = Mulish({
subsets: ["latin"]
const mulish = Mulish({
subsets: ["latin"],
});

export const metadata: Metadata = {
Expand All @@ -34,7 +34,7 @@ export default function RootLayout({
}) {
return (
<html lang={lng} dir={dir(lng)}>
<body className={mullish.className}>
<body className={mulish.className}>
<StoreProvider>
<AuthProvider>
<ToastProvider>
Expand Down
Loading

0 comments on commit c647f8b

Please sign in to comment.