feat: seperated layouts for each product line

frontend/src/layouts/SecretScanningLayout/SecretScanningLayout.tsx

@@ -0,0 +1,62 @@
+import { Link, Outlet } from "@tanstack/react-router";
+import { motion } from "framer-motion";
+
+import { Menu, MenuItem } from "@app/components/v2";
+import { useWorkspace } from "@app/context";
+
+export const SecretScanningLayout = () => {
+  const { currentWorkspace } = useWorkspace();
+
+  return (
+    <div className="dark hidden h-full w-full flex-col overflow-x-hidden md:flex">
+      <div className="flex flex-grow flex-col overflow-y-hidden md:flex-row">
+        <motion.div
+          key="menu-project-items"
+          initial={{ x: -150 }}
+          animate={{ x: 0 }}
+          exit={{ x: -150 }}
+          transition={{ duration: 0.2 }}
+          className="dark w-full border-r border-mineshaft-600 bg-gradient-to-tr from-mineshaft-700 via-mineshaft-800 to-mineshaft-900 md:w-60"
+        >
+          <nav className="items-between flex h-full flex-col overflow-y-auto dark:[color-scheme:dark]">
+            <div className="border-b border-mineshaft-600 px-4 pb-2 pt-3 text-lg text-white">
+              Secret Scanning
+            </div>
+            <div className="mt-2 flex-grow">
+              <Menu>
+                <Link
+                  to="/projects/$projectId/secret-scanning/data-sources"
+                  params={{
+                    projectId: currentWorkspace.id
+                  }}
+                >
+                  {({ isActive }) => <MenuItem isSelected={isActive}> Data Sources</MenuItem>}
+                </Link>
+                <Link
+                  to="/projects/$projectId/secret-scanning/findings"
+                  params={{
+                    projectId: currentWorkspace.id
+                  }}
+                >
+                  {({ isActive }) => <MenuItem isSelected={isActive}>Findings</MenuItem>}
+                </Link>
+                <Link
+                  to="/projects/$projectId/cert-manager/settings"
+                  params={{
+                    projectId: currentWorkspace.id
+                  }}
+                >
+                  {({ isActive }) => <MenuItem isSelected={isActive}>Settings</MenuItem>}
+                </Link>
+              </Menu>
+            </div>
+          </nav>
+        </motion.div>
+        <div className="flex-1 overflow-y-auto overflow-x-hidden bg-bunker-800 p-4 dark:[color-scheme:dark]">
+          <Outlet />
+        </div>
+      </div>
+    </div>
+  );
+};
+

frontend/src/layouts/SecretScanningLayout/index.tsx

@@ -0,0 +1 @@
+export { SecretScanningLayout } from "./SecretScanningLayout";