mockup menu actions

add buttons for upcoming actions
- collapse all
- expand all
- goto selected

client/src/common/components/buttons/CollapseBtn.jsx

@@ -0,0 +1,18 @@
+import { Button } from '@chakra-ui/button';
+import { FiChevronsUp } from 'react-icons/fi';
+
+export default function CollapseBtn(props) {
+  const { clickhandler } = props;
+  return (
+    <Button
+      size={props.size || 'xs'}
+      leftIcon={<FiChevronsUp />}
+      colorScheme='whiteAlpha'
+      variant='outline'
+      onClick={clickhandler}
+      _focus={{ boxShadow: 'none' }}
+    >
+      Collapse All
+    </Button>
+  );
+}

client/src/common/components/buttons/CollapseIconBtn.jsx

@@ -1,17 +0,0 @@
-import { IconButton } from '@chakra-ui/button';
-import { FiArrowDownCircle } from 'react-icons/fi';
-
-export default function CollapseIconBtn(props) {
-  const { clickhandler, active, ...rest } = props;
-  return (
-    <IconButton
-      size={props.size || 'xs'}
-      icon={<FiArrowDownCircle />}
-      colorScheme='orange'
-      variant={active ? 'solid' : 'outline'}
-      onClick={clickhandler}
-      _focus={{ boxShadow: 'none' }}
-      {...rest}
-    />
-  );
-}

client/src/common/components/buttons/CurrentBtn.jsx

@@ -0,0 +1,18 @@
+import { Button } from '@chakra-ui/button';
+import { FiTarget } from 'react-icons/fi';
+
+export default function CurrentBtn(props) {
+  const { clickhandler } = props;
+  return (
+    <Button
+      size={props.size || 'xs'}
+      leftIcon={<FiTarget />}
+      colorScheme='whiteAlpha'
+      variant='outline'
+      onClick={clickhandler}
+      _focus={{ boxShadow: 'none' }}
+    >
+      Goto Current
+    </Button>
+  );
+}

client/src/common/components/buttons/ExpandBtn.jsx

@@ -0,0 +1,18 @@
+import { Button } from '@chakra-ui/button';
+import { FiChevronsDown } from 'react-icons/fi';
+
+export default function ExpandBtn(props) {
+  const { clickhandler } = props;
+  return (
+    <Button
+      size={props.size || 'xs'}
+      leftIcon={<FiChevronsDown />}
+      colorScheme='whiteAlpha'
+      variant='outline'
+      onClick={clickhandler}
+      _focus={{ boxShadow: 'none' }}
+    >
+      Expand All
+    </Button>
+  );
+}