feat: add Assets page with Carbon DataTable and mock service

package.json

@@ -15,6 +15,8 @@
   ],
   "dependencies": {
     "@babel/runtime": "^7.28.6",
+    "@carbon/icons-react": "^11.74.0",
+    "@carbon/react": "^1.100.0",
     "@date-io/core": "^3.2.0",
     "@date-io/date-fns": "^3.2.1",
     "@emotion/react": "^11.14.0",

src/components/Nav/SidebarNav.js

@@ -2,7 +2,7 @@ import * as React from "react";
 import { Drawer, List } from "@mui/material";
 
 import { NavItem } from "./NavItem";
-import { BarChart, Cloud } from "@mui/icons-material";
+import { BarChart, Cloud, Inventory } from "@mui/icons-material";
 
 const logo = new URL("../../images/logo.png", import.meta.url).href;
 
@@ -25,6 +25,7 @@ const SidebarNav = ({ active }) => {
     },
     { name: "Cloud Costs", href: "/cloud", icon: <Cloud /> },
     { name: "External Costs", href: "/external-costs", icon: <Cloud /> },
+    { name: "Assets", href: "/assets", icon: <Inventory /> },
   ];
 
   return (

src/components/Page.js

@@ -8,9 +8,10 @@ const Page = (props) => {
     <div
       style={{
         display: "flex",
-        overflowY: "scroll",
+        height: "100vh",
+        overflow: "hidden",
         margin: "0px",
-        backgroundColor: "f3f3f3",
+        backgroundColor: "#f3f3f3",
       }}
     >
       <SidebarNav active={pathname} />
@@ -19,17 +20,21 @@ const Page = (props) => {
           display: "flex",
           flexFlow: "column",
           flexGrow: 1,
+          height: "100%",
+          overflow: "hidden"
         }}
       >
         <div
           style={{
             position: "relative",
-            height: "100vh",
             flexGrow: 1,
-            overflowX: "auto",
+            height: "100%",
+            overflowY: "auto",
+            overflowX: "hidden",
             paddingLeft: "2rem",
-            paddingRight: "rem",
+            paddingRight: "2rem",
             paddingTop: "2.5rem",
+            paddingBottom: "2rem"
           }}
         >
           <div

src/css/index.css

@@ -1,4 +1,5 @@
 @import "../../node_modules/material-design-icons-iconfont/dist/material-design-icons.css";
+@import "../../node_modules/@carbon/styles/css/styles.css";
 
 body {
   background-color: #f3f3f3;