Menu

apps/dashboard/src/app/[locale]/@dashboard/(root)/invoices/page.tsx

@@ -1,3 +1,20 @@
+import { Icons } from "@midday/ui/icons";
+
 export default function Invoice() {
-  return null;
+  return (
+    <div className="h-[calc(100vh-300px)] flex items-center justify-center">
+      <div className="flex flex-col items-center">
+        <Icons.WorkInProgress className="mb-4 w-[35px] h-[35px]" />
+        <div className="text-center mb-6 space-y-2">
+          <h2 className="font-medium text-lg">Work in progress</h2>
+          <p className="text-[#606060] text-sm">
+            Nunc sit amet lectus quis mi vehicula lacinia nec
+            <br /> non purus. Aliquam id rutrum magna. Duis
+            <br /> convallis orci odio, sit amet vehicula tortor
+            <br /> tincidunt quis.
+          </p>
+        </div>
+      </div>
+    </div>
+  );
 }

apps/dashboard/src/app/[locale]/@dashboard/(root)/timer/page.tsx

@@ -0,0 +1,20 @@
+import { Icons } from "@midday/ui/icons";
+
+export default function Timer() {
+  return (
+    <div className="h-[calc(100vh-300px)] flex items-center justify-center">
+      <div className="flex flex-col items-center">
+        <Icons.WorkInProgress className="mb-4 w-[35px] h-[35px]" />
+        <div className="text-center mb-6 space-y-2">
+          <h2 className="font-medium text-lg">Work in progress</h2>
+          <p className="text-[#606060] text-sm">
+            Nunc sit amet lectus quis mi vehicula lacinia nec
+            <br /> non purus. Aliquam id rutrum magna. Duis
+            <br /> convallis orci odio, sit amet vehicula tortor
+            <br /> tincidunt quis.
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

apps/dashboard/src/components/command-menu.tsx

@@ -30,6 +30,16 @@ const navigation = [
     path: "/transactions",
     icon: () => <Icons.Transactions size={20} />,
   },
+  {
+    name: "Invoices",
+    path: "/invoices",
+    icon: Icons.Invoice,
+  },
+  {
+    name: "Timer",
+    path: "/timer",
+    icon: Icons.Timer,
+  },
   {
     name: "Vault",
     path: "/vault",

apps/dashboard/src/components/main-menu.tsx

@@ -20,6 +20,16 @@ export function MainMenu() {
       name: "Transactions",
       icon: () => <Icons.Transactions size={22} />,
     },
+    {
+      path: "/invoices",
+      name: "Invoices",
+      icon: () => <Icons.Invoice size={22} />,
+    },
+    {
+      path: "/timer",
+      name: "Timer",
+      icon: () => <Icons.Timer size={22} />,
+    },
     {
       path: "/vault",
       name: "Vault",

packages/ui/src/components/icons.tsx

@@ -30,12 +30,14 @@ import {
   MdOutlineDescription,
   MdOutlineDifference,
   MdOutlineFileDownload,
+  MdOutlineHandyman,
   MdOutlineInsertPhoto,
   MdOutlineIntegrationInstructions,
   MdOutlineInventory2,
   MdOutlineListAlt,
   MdOutlineNotificationsNone,
   MdOutlineOpenInFull,
+  MdOutlineTimer,
   MdOutlineTune,
   MdPayments,
   MdPeople,
@@ -423,4 +425,6 @@ export const Icons = {
   Image: MdOutlineInsertPhoto,
   Security: MdSecurity,
   AI: MdAutoAwesome,
+  Timer: MdOutlineTimer,
+  WorkInProgress: MdOutlineHandyman,
 };