update select/index.js

Signed-off-by: Vivek Vishal <[email protected]>

Author: Vivek Vishal

src/sections/Projects/Sistent/components/select/index.js

@@ -21,12 +21,46 @@ const SistentSelect = () => {
     let agesList = event.target.value;
     setMultipleAges(agesList);
   };
+  const location = useLocation();
 
   return (
     <SistentLayout title="Select">
       <div className="content">
-        <Header />
-        <SectionNav />
+        <a id="Identity">
+          <h2>Select</h2>
+        </a>
+        <p>
+        Select component is a dropdown menu for selecting an option from a list.
+        </p>
+        <div className="filterBtns">
+          <TabButton
+            className={
+              location.pathname === "/projects/sistent/components/select"
+                ? "active"
+                : ""
+            }
+            onClick={() => navigate("/projects/sistent/components/select")}
+            title="Overview"
+          />
+          <TabButton
+            className={
+              location.pathname === "/projects/sistent/components/select/guidance"
+                ? "active"
+                : ""
+            }
+            onClick={() => navigate("/projects/sistent/components/select/guidance")}
+            title="Guidance"
+          />
+          <TabButton
+            className={
+              location.pathname === "/projects/sistent/components/select/code"
+                ? "active"
+                : ""
+            }
+            onClick={() => navigate("/projects/sistent/components/select/code")}
+            title="Code"
+          />
+        </div>
         <div className="main-content">
           <p>
             The Select component is a versatile and customizable element
@@ -224,52 +258,5 @@ const SistentSelect = () => {
   );
 };
 
-export function SectionNav() {
-  const location = useLocation();
-  return (
-    <div className="filterBtns">
-      <TabButton
-        className={
-          location.pathname === "/projects/sistent/components/select"
-            ? "active"
-            : ""
-        }
-        onClick={() => navigate("/projects/sistent/components/select")}
-        title="Overview"
-      />
-      <TabButton
-        className={
-          location.pathname === "/projects/sistent/components/select/guidance"
-            ? "active"
-            : ""
-        }
-        onClick={() => navigate("/projects/sistent/components/select/guidance")}
-        title="Guidance"
-      />
-      <TabButton
-        className={
-          location.pathname === "/projects/sistent/components/select/code"
-            ? "active"
-            : ""
-        }
-        onClick={() => navigate("/projects/sistent/components/select/code")}
-        title="Code"
-      />
-    </div>
-  );
-}
-
-export function Header() {
-  return (
-    <>
-      <a id="Identity">
-        <h2>Select</h2>
-      </a>
-      <p>
-        Select component is a dropdown menu for selecting an option from a list.
-      </p>
-    </>
-  );
-}
 
 export default SistentSelect;