feat: improve structure and error handling

app/[lang]/(live)/(protected)/my-pages/[...path]/page.tsx

@@ -13,25 +13,14 @@ import type { LangParams, PageArgs } from "@/types/params"
 export default async function MyPages({
   params,
 }: PageArgs<LangParams & { path: string[] }>) {
-  const baseUrl = myPages[params.lang].replace(`/${params.lang}`, "")
-  const pathUrl = params.path.join("/")
-
-  const accountPage = await serverClient().contentstack.accountPage.get({
-    url: `${baseUrl}/${pathUrl}`,
-    lang: params.lang,
-  })
-
-  const breadcrumbs = await serverClient().contentstack.breadcrumbs.get({
-    href: `${baseUrl}/${pathUrl}`,
-    locale: params.lang,
-  })
+  const accountPage = await serverClient().contentstack.accountPage.get()
 
   return (
     <>
-      <Breadcrumbs breadcrumbs={breadcrumbs} />
+      <Breadcrumbs />
 
       <div className={styles.content}>
-        <Sidebar lang={params.lang} />
+        <Sidebar />
         <MaxWidth className={styles.blocks} tag="main">
           {accountPage.content.length ? (
             <Content lang={params.lang} content={accountPage.content} />

app/[lang]/(live)/(protected)/my-pages/[[...uri]]/layout.module.css

@@ -0,0 +1,18 @@
+.content {
+  display: grid;
+  padding-bottom: 7.7rem;
+  padding-left: 0;
+  padding-right: 0;
+  position: relative;
+}
+
+@media screen and (min-width: 950px) {
+  .content {
+    gap: 10rem;
+    grid-template-columns: 25rem 1fr;
+    padding-bottom: 17.5rem;
+    padding-left: 2.4rem;
+    padding-right: 2.4rem;
+    padding-top: 5.8rem;
+  }
+}

app/[lang]/(live)/(protected)/my-pages/[[...uri]]/layout.tsx

@@ -0,0 +1,21 @@
+import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
+import Sidebar from "@/components/MyPages/Sidebar"
+
+import styles from "./layout.module.css"
+
+import { LangParams, LayoutArgs, UriParams } from "@/types/params"
+
+export default async function MyPagesURILayout({
+  children,
+}: React.PropsWithChildren<LayoutArgs<LangParams & UriParams>>) {
+  return (
+    <>
+      <Breadcrumbs />
+
+      <div className={styles.content}>
+        <Sidebar />
+        {children}
+      </div>
+    </>
+  )
+}

app/[lang]/(live)/(protected)/my-pages/_constants.ts

@@ -1,16 +0,0 @@
-export const breadcrumbs = {
-  "/my-pages": [
-    {
-      title: "My Pages",
-    },
-  ],
-  "/my-pages/profile": [
-    {
-      href: "/my-pages",
-      title: "My Pages",
-    },
-    {
-      title: "My Profile",
-    },
-  ],
-}

app/[lang]/(live)/(protected)/my-pages/layout.tsx

@@ -1,19 +1,16 @@
 import { firaMono, firaSans } from "@/app/[lang]/(live)/fonts"
-import Header from "@/components/MyPages/Header"
 
 import styles from "./layout.module.css"
 
-import type { MyPagesLayoutProps } from "@/types/components/myPages/layout"
+import { LangParams, LayoutArgs } from "@/types/params"
 
 export default async function MyPagesLayout({
   children,
-  params,
-}: React.PropsWithChildren<MyPagesLayoutProps>) {
+}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
   return (
     <div
       className={`${firaMono.variable} ${firaSans.variable} ${styles.layout}`}
     >
-      <Header lang={params.lang} />
       {children}
     </div>
   )