Reclamation

.eslintrc.json

@@ -3,22 +3,17 @@
     "browser": true,
     "es2021": true
   },
-  "extends": ["plugin:react/recommended", "prettier"],
+  "extends": ["plugin:react/recommended"],
   "parserOptions": {
     "ecmaFeatures": {
       "jsx": true
     },
     "ecmaVersion": 12,
     "sourceType": "module"
   },
-  "plugins": ["react", "prettier"],
+  "plugins": ["react"],
   "rules": {
-    "prettier/prettier": [
-      "error",
-      {
-        "endOfLine": "auto"
-      }
-    ],
+
     "react/display-name": "off",
     "default-param-last": "off",
     "react/react-in-jsx-scope": "off",

README.md

@@ -13,6 +13,7 @@ This free MUI & React Dashboard is coming with prebuilt design blocks, so the de
 switching from our pages to the real website is very easy to be done.
 
 Special thanks go to:
+
 - [Nepcha Analytics](https://nepcha.com?ref=readme) for the analytics tool. Nepcha is already integrated with Material Dashboard React. You can use it to gain insights into your sources of traffic.
 
 **Documentation built by Developers**

package.json

@@ -18,8 +18,10 @@
     "@emotion/styled": "11.10.8",
     "@mui/icons-material": "5.11.16",
     "@mui/material": "5.12.3",
+    "axios": "^1.6.0",
     "chart.js": "4.3.0",
     "chroma-js": "2.4.2",
+    "cross-env": "^7.0.3",
     "prop-types": "15.8.1",
     "react": "18.2.0",
     "react-chartjs-2": "5.2.0",
@@ -33,8 +35,10 @@
     "yup": "1.1.1"
   },
   "scripts": {
-    "start": "GENERATE_SOURCEMAP=false react-scripts start",
-    "build": "GENERATE_SOURCEMAP=false react-scripts build",
+
+    "start": "cross-env GENERATE_SOURCEMAP=false react-scripts start",
+    "build": "cross-env GENERATE_SOURCEMAP=false react-scripts build",
+
     "test": "react-scripts test",
     "eject": "react-scripts eject",
     "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start"

src/App.js

@@ -155,7 +155,7 @@ export default function App() {
             <Sidenav
               color={sidenavColor}
               brand={(transparentSidenav && !darkMode) || whiteSidenav ? brandDark : brandWhite}
-              brandName="Material Dashboard 2"
+              brandName="Co-share"
               routes={routes}
               onMouseEnter={handleOnMouseEnter}
               onMouseLeave={handleOnMouseLeave}
@@ -167,7 +167,7 @@ export default function App() {
         {layout === "vr" && <Configurator />}
         <Routes>
           {getRoutes(routes)}
-          <Route path="*" element={<Navigate to="/dashboard" />} />
+          <Route path="*" element={<Navigate to="/reclamation" />} />
         </Routes>
       </ThemeProvider>
     </CacheProvider>
@@ -179,7 +179,7 @@ export default function App() {
           <Sidenav
             color={sidenavColor}
             brand={(transparentSidenav && !darkMode) || whiteSidenav ? brandDark : brandWhite}
-            brandName="Material Dashboard 2"
+            brandName="Co-share"
             routes={routes}
             onMouseEnter={handleOnMouseEnter}
             onMouseLeave={handleOnMouseLeave}
@@ -191,7 +191,7 @@ export default function App() {
       {layout === "vr" && <Configurator />}
       <Routes>
         {getRoutes(routes)}
-        <Route path="*" element={<Navigate to="/dashboard" />} />
+        <Route path="*" element={<Navigate to="/reclamation" />} />
       </Routes>
     </ThemeProvider>
   );

src/examples/Footer/index.js

@@ -63,13 +63,14 @@ function Footer({ company, links }) {
         © {new Date().getFullYear()}, made with
         <MDBox fontSize={size.md} color="text" mb={-0.5} mx={0.25}>
           <Icon color="inherit" fontSize="inherit">
-            favorite
+            Co-lance
           </Icon>
         </MDBox>
         by
         <Link href={href} target="_blank">
           <MDTypography variant="button" fontWeight="medium">
-            &nbsp;{name}&nbsp;
+            {" "}
+            4Twin 2 Co-lance Team{" "}
           </MDTypography>
         </Link>
         for a better web.
@@ -90,9 +91,7 @@ function Footer({ company, links }) {
             mt: 0,
           },
         })}
-      >
-        {renderLinks()}
-      </MDBox>
+      ></MDBox>
     </MDBox>
   );
 }

src/examples/Sidenav/index.js

@@ -179,19 +179,6 @@ function Sidenav({ color, brand, brandName, routes, ...rest }) {
         }
       />
       <List>{renderRoutes}</List>
-      <MDBox p={2} mt="auto">
-        <MDButton
-          component="a"
-          href="https://www.creative-tim.com/product/material-dashboard-pro-react"
-          target="_blank"
-          rel="noreferrer"
-          variant="gradient"
-          color={sidenavColor}
-          fullWidth
-        >
-          upgrade to pro
-        </MDButton>
-      </MDBox>
     </SidenavRoot>
   );
 }

src/layouts/products/data/productsTableData.js

@@ -0,0 +1,56 @@
+import MDBox from "components/MDBox";
+import MDTypography from "components/MDTypography";
+import MDBadge from "components/MDBadge";
+import PropTypes from 'prop-types';
+
+export default function productsTableData(products) {
+  const ProductInfo = ({ name, category, description, user }) => (
+    <MDBox lineHeight={1} textAlign="left">
+      <MDTypography display="block" variant="button" fontWeight="medium">
+        {name}
+      </MDTypography>
+      <MDTypography variant="caption">{category}</MDTypography>
+      <MDTypography variant="caption">{description}</MDTypography>
+      <MDTypography variant="caption">{user}</MDTypography>
+    </MDBox>
+  );
+  ProductInfo.propTypes = {
+    name: PropTypes.string.isRequired,
+    category: PropTypes.string.isRequired,
+    description: PropTypes.string.isRequired,
+    user: PropTypes.string.isRequired,
+  };
+
+  const randomStatus = () => {
+    const statuses = ["Available", "Pending", "Sold"];
+    return statuses[Math.floor(Math.random() * statuses.length)];
+  };
+
+  const formatRows = products.map(product => ({
+    productInfo: <ProductInfo
+      name={product.name}
+      category={product.category}
+      description={product.description}
+      user={product.user}
+    />,
+    status: (
+      <MDBox ml={-1}>
+        <MDBadge badgeContent={randomStatus()} color="success" variant="gradient" size="sm" />
+      </MDBox>
+    ),
+    action: (
+      <MDTypography component="a" href="#" variant="caption" color="text" fontWeight="medium">
+        Edit
+      </MDTypography>
+    ),
+  }));
+
+  return {
+    columns: [
+      { Header: "product", accessor: "productInfo", width: "45%", align: "left" },
+      { Header: "status", accessor: "status", align: "center" },
+      { Header: "action", accessor: "action", align: "center" },
+    ],
+    rows: formatRows,
+  };
+}

src/layouts/products/data/productsTableDataRelations.js

@@ -0,0 +1,71 @@
+import MDBox from "components/MDBox";
+import MDTypography from "components/MDTypography";
+import MDBadge from "components/MDBadge";
+import PropTypes from 'prop-types';
+
+export default function productsTableDataRelations(products) {
+    const ProductInfo = ({ name, category, description }) => (
+        <MDBox lineHeight={1} textAlign="left">
+            <MDTypography display="block" variant="button" fontWeight="medium">
+                {name}
+            </MDTypography>
+            <MDTypography variant="caption">{category}</MDTypography>
+            <MDTypography variant="caption">{description}</MDTypography>
+        </MDBox>
+    );
+    ProductInfo.propTypes = {
+        name: PropTypes.string.isRequired,
+        category: PropTypes.string.isRequired,
+        description: PropTypes.string.isRequired,
+    };
+
+    const OwnerInfo = ({ userName, userEmail }) => (
+        <MDBox lineHeight={1} textAlign="left">
+            <MDTypography display="block" variant="caption" fontWeight="medium">
+                {userName}
+            </MDTypography>
+            <MDTypography variant="caption">{userEmail}</MDTypography>
+        </MDBox>
+    );
+    OwnerInfo.propTypes = {
+        userName: PropTypes.string.isRequired,
+        userEmail: PropTypes.string.isRequired,
+    };
+
+    const randomStatus = () => {
+        const statuses = ["Available", "Pending", "Sold"];
+        return statuses[Math.floor(Math.random() * statuses.length)];
+    };
+
+    const formatRows = products.map(product => ({
+        productInfo: <ProductInfo
+            name={product.name}
+            category={product.category}
+            description={product.description}
+        />,
+        owner: <OwnerInfo
+            userName={product.userName}
+            userEmail={product.userEmail}
+        />,
+        status: (
+            <MDBox ml={-1}>
+                <MDBadge badgeContent={randomStatus()} color="success" variant="gradient" size="sm" />
+            </MDBox>
+        ),
+        action: (
+            <MDTypography component="a" href="#" variant="caption" color="text" fontWeight="medium">
+                Edit
+            </MDTypography>
+        ),
+    }));
+
+    return {
+        columns: [
+            { Header: "product", accessor: "productInfo", width: "30%", align: "left" },
+            { Header: "owner", accessor: "owner", width: "30%", align: "left" },
+            { Header: "status", accessor: "status", align: "center" },
+            { Header: "action", accessor: "action", align: "center" },
+        ],
+        rows: formatRows,
+    };
+}