From dad03e3be5b0a7c1159e0207cce11540ca830359 Mon Sep 17 00:00:00 2001
From: "Thomas F. K. Jorna" <hello@tefkah.com>
Date: Mon, 3 Jan 2022 17:21:18 +0100
Subject: feat(filter): add option to filter by subdirectory (#190)

---
 components/Tweaks/Visual/ThemeSelect.tsx | 63 ++++++++++++++++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 components/Tweaks/Visual/ThemeSelect.tsx

(limited to 'components/Tweaks/Visual/ThemeSelect.tsx')

diff --git a/components/Tweaks/Visual/ThemeSelect.tsx b/components/Tweaks/Visual/ThemeSelect.tsx
new file mode 100644
index 0000000..eed6daf
--- /dev/null
+++ b/components/Tweaks/Visual/ThemeSelect.tsx
@@ -0,0 +1,63 @@
+import React, { useContext } from 'react'
+import {
+  Box,
+  Button,
+  Flex,
+  Menu,
+  MenuButton,
+  MenuItem,
+  MenuList,
+  Portal,
+  Text,
+} from '@chakra-ui/react'
+
+import { themes } from '../../themes'
+import { ChevronDownIcon } from '@chakra-ui/icons'
+import { ThemeContext } from '../../../util/themecontext'
+
+export const ThemeSelect = () => {
+  type Theme = { [key: string]: string }
+  const { emacsTheme, setEmacsTheme, highlightColor } = useContext(ThemeContext)
+  return (
+    <Flex alignItems="center" justifyContent="space-between" pl={7} pr={2}>
+      <Text>Theme</Text>
+      <Menu isLazy placement="bottom" closeOnSelect={false}>
+        <MenuButton
+          as={Button}
+          size="sm"
+          colorScheme=""
+          color="black"
+          rightIcon={<ChevronDownIcon />}
+        >
+          {emacsTheme[0]}
+        </MenuButton>
+        <MenuList minW={10} zIndex="popover" bgColor="gray.200">
+          <MenuItem
+            onClick={() => ''}
+            justifyContent="space-between"
+            alignItems="center"
+            display="flex"
+          >
+            <Box height={6} width={6}></Box>
+          </MenuItem>
+          {Object.keys(themes).map((theme: string, i: number) => (
+            <MenuItem
+              key={theme}
+              onClick={() => setEmacsTheme([theme, themes[theme]])}
+              justifyContent="space-between"
+              alignItems="center"
+              display="flex"
+            >
+              <Text>{theme}</Text>
+              <Flex height={6} width={20} flexDirection="column" flexWrap="wrap">
+                {Object.values(themes[theme as string]).map((color: string) => {
+                  return <Box key={color} bgColor={color} flex="1 1 8px"></Box>
+                })}
+              </Flex>
+            </MenuItem>
+          ))}
+        </MenuList>
+      </Menu>
+    </Flex>
+  )
+}
-- 
cgit v1.2.3

