Refactor the way TABS and VIEWS are handeled, now derived inside viewKeys.js

client/src/components/Canvas/views/Volcano.jsx

@@ -1,7 +1,7 @@
-import { Box, Text, Heading, DataList, HStack, Tabs } from '@chakra-ui/react';
+import { Box, Text, Heading, DataList, Flex, HStack, Tabs } from '@chakra-ui/react';
 import { MapContainer, TileLayer, Marker, Popup } from "react-leaflet";
 import { CanvasHeaderTabs } from '../CanvasComponents/CanvasHeaderTabs';
-import { VOLCANO_VIEWS } from '@/constants/viewKeys';
+import { VOLCANO_TABS } from '@/constants/viewKeys';
 import { VolcanoHome } from './VolcanoTabs/VolcanoHome';
 import { PartnerData } from './VolcanoTabs/PartnerData';
 import { Reports } from './VolcanoTabs/Reports';
@@ -15,7 +15,6 @@ export default function Volcano({ view, onChangeView }) {
         <Tabs.Root
             key={view}
             value={view}
-            // onValueChange={(e) => onChangeView(e.value)}
             variant="line"
             width="100%"
             height="100%"
@@ -25,9 +24,27 @@ export default function Volcano({ view, onChangeView }) {
                 const nextView = e.value;
                 onChangeView(nextView); 
             }}
-        >        
-            {/* HEADER */}
-            <CanvasHeaderTabs tabs={VOLCANO_VIEWS} />
+        >       
+            <Flex 
+                as="header"
+                position="sticky"
+                top="0"
+                zIndex="dropdown" // zIndex: 1100
+                bg="base200"
+                pl={5}
+                pr={2}
+                pt={3}
+                align="center"
+                justify="space-between"
+                width="100%"
+            > 
+                {/* HEADER */}
+                <CanvasHeaderTabs tabs={VOLCANO_TABS} />
+                <HStack width="258px" justifyContent="flex-end">
+                    <SearchBar />
+                    <SettingsButton />
+                </HStack>
+            </Flex>
             
             {/* CANVAS */}
             <Tabs.Content value="volcanohome">