update: header footer customization support added

getdokan · Oct 18, 2024 · e931d06 · e931d06
1 parent a2701f5
commit e931d06
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 63 deletions.
diff --git a/src/Dashboard/index.tsx b/src/Dashboard/index.tsx
@@ -12,13 +12,9 @@ const App = () => {
  const routes = getRoutes();
 
  const mapedRoutes = routes.map((route) => {
-
-
- // TODO add Parent route support.
-
  return {
  path: route.path,
- element: <Layout route={route} title={route.title}>{route.element}</Layout>,
+ element: <Layout headerComponent={route?.header} footerComponent={route?.footer} route={route} title={route?.title}>{route.element}</Layout>,
  }
  });
 

diff --git a/src/Layout/Header.tsx b/src/Layout/Header.tsx
@@ -6,8 +6,7 @@ const Header = ( { title = '' } ) => {
  <>
  <Slot name="dokan-before-header" />
  <div className="dokan-header-title">
- <h1 className="mb-4 text-3xl font-extrabold text-gray-900 dark:text-white md:text-5xl lg:text-6xl"><span
- className="text-transparent bg-clip-text bg-gradient-to-r to-emerald-600 from-sky-400">{title}</span> </h1>
+ <h1 className="mb-4 text-3xl font-extrabold text-gray-900 dark:text-white md:text-5xl lg:text-6xl">{title}</h1>
  </div>
  <div className="dokan-header-actions">
  <Slot name="dokan-header-actions"/>

diff --git a/src/Layout/index.tsx b/src/Layout/index.tsx
@@ -26,6 +26,8 @@ export type DokanRoute = {
  title?: string;
  icon?: JSX.Element | React.ReactNode;
  element: JSX.Element | React.ReactNode;
+ header?: JSX.Element | React.ReactNode;
+ footer?: JSX.Element | React.ReactNode;
  path: string;
  exact?: boolean;
  order?: number;
@@ -36,8 +38,8 @@ interface LayoutProps {
  children: React.ReactNode;
  route: DokanRoute;
  title?: string;
- headerComponent?: JSX.Element;
- footerComponent?: JSX.Element;
+ headerComponent?: JSX.Element|React.ReactNode;
+ footerComponent?: JSX.Element|React.ReactNode;
 }
 
 // Create a Layout component that uses the ThemeProvider

diff --git a/src/Routing/index.tsx b/src/Routing/index.tsx
@@ -5,29 +5,6 @@ import {DokanRoute} from "../Layout";
 const getRoutes = () => {
  let routes : Array<DokanRoute> = [];
 
- // routes.push(
- // {
- // id: 'dokan-seller-settings',
- // title: __( 'Settings', 'dokan-lite' ),
- // icon: <SettingsIcon />,
- // element: <SellerSettings/>
- // path: '/settings',
- // exact: true,
- // order: 1,
- // parent: 'dokan-dashboard',
- // }
- // );
-
- routes.push(
- {
- id: 'dokan-kola',
- title: __( 'Kola bagan', 'dokan-lite' ),
- element: <h1>asdasd</h1>,
- path: '/kola',
- exact: true,
- order: 10,
- }
- );
  routes.push(
  {
  id: 'dokan-base',
@@ -38,36 +15,9 @@ const getRoutes = () => {
  order: 10,
  }
  );
- routes.push(
- {
- id: 'dokan-settings',
- title: __( 'Settings', 'dokan-lite' ),
- element: <h1>Settings body</h1>,
- path: 'settings',
- exact: true,
- order: 10,
- }
- );
-
- routes.push(
- {
- id: 'dokan-store-settings',
- title: __( 'Store Settings', 'dokan-lite' ),
- element: <h1>Store Settings body</h1>,
- path: 'store',
- exact: true,
- order: 10,
- parent: 'settings',
- }
- );
-
-
-
-
-
 
  // @ts-ignore
- routes = wp.hooks.applyFilters('dokan-frontend-routes', routes) as Array<DokanRoute>;
+ routes = wp.hooks.applyFilters('dokan-dashboard-routes', routes) as Array<DokanRoute>;
  routes.push(
  {
  id: 'dokan-404',
@@ -76,9 +26,7 @@ const getRoutes = () => {
  }
  );
 
- console.log(routes);
-
- return routes;
+ return routes;
 }
 
 export default getRoutes;