add device quality components

src/components/Accuracy.js

@@ -0,0 +1,15 @@
+import React, { useState } from 'react';
+import { FaInfoCircle } from "react-icons/fa";
+
+import './Accuracy.css';
+
+function Accuracy({ show }) {
+    const [showCardInfo, setShowCardInfo] = useState(false);
+
+    return (
+        <div>
+            <h1>Accuracy</h1>
+        </div>
+    );
+}
+export default Accuracy;

src/components/CurveFit.js

@@ -0,0 +1,15 @@
+import React, { useState } from 'react';
+import { FaInfoCircle } from "react-icons/fa";
+
+import './CurveFit.css';
+
+function CurveFit({ show }) {
+    const [showCardInfo, setShowCardInfo] = useState(false);
+
+    return (
+        <div>
+            <h1>Curve Fit</h1>
+        </div>
+    );
+}
+export default CurveFit;

src/components/Precision.js

@@ -0,0 +1,15 @@
+import React, { useState } from 'react';
+import { FaInfoCircle } from "react-icons/fa";
+
+import './Precision.css';
+
+function Precision({ show }) {
+    const [showCardInfo, setShowCardInfo] = useState(false);
+
+    return (
+        <div>
+            <h1>Precision</h1>
+        </div>
+    );
+}
+export default Precision;

src/routes/appRoutes.js

@@ -4,12 +4,15 @@ import AppsOutlinedIcon from '@mui/icons-material/AppsOutlined';
 import TestAnalytics from "../components/TestAnalytics";
 import HomePage from '../components/HomePage';
 import Devices from '../components/Devices';
-import { Download } from '@mui/icons-material';
+import { Download, FactCheck } from '@mui/icons-material';
 import ExportData from '../components/ExportData';
 import Registration from '../components/Registration';
-import { FaAndroid, FaFlask, FaPhone, FaSearch, FaUser } from 'react-icons/fa';
+import { FaAndroid, FaArrowCircleLeft, FaBezierCurve, FaCheck, FaFlask, FaGolfBall, FaPhone, FaSearch, FaUser } from 'react-icons/fa';
 import AppInstallation from '../components/AppInstallation';
 import Samples from '../components/Samples';
+import Precision from '../components/Precision';
+import Accuracy from '../components/Accuracy';
+import CurveFit from '../components/CurveFit';
 
 const appRoutes = [
     {
@@ -71,6 +74,33 @@ const appRoutes = [
             icon: <FaFlask />
         }
     },
+    {
+        path: "/precision",
+        element: <Precision />,
+        state: "precision",
+        sidebarProps: {
+            displayText: "Precision",
+            icon: <FaCheck />
+        }
+    },
+    {
+        path: "/accuracy",
+        element: <Accuracy />,
+        state: "accuracy",
+        sidebarProps: {
+            displayText: "Accuracy",
+            icon: <FaGolfBall />
+        }
+    },
+    {
+        path: "/curvefit",
+        element: <CurveFit />,
+        state: "curvefit",
+        sidebarProps: {
+            displayText: "Curve Fit",
+            icon: <FaBezierCurve />
+        }
+    },
 ]
 
 export default appRoutes;