diff options
author | Thomas F. K. Jorna <[email protected]> | 2021-09-25 16:11:31 +0200 |
---|---|---|
committer | Thomas F. K. Jorna <[email protected]> | 2021-09-25 16:11:31 +0200 |
commit | ee8539a9351374a719c9026f85d85e7b4ea6e8f5 (patch) | |
tree | f9220fd304bd3669523df39ddaa0992919ccc4a6 /components/FilterPanel.tsx | |
parent | 075d3831ffae63f128bcaabf9fc5e70ade41ad33 (diff) |
chore: move tweaks to separate subfolder
Diffstat (limited to 'components/FilterPanel.tsx')
-rw-r--r-- | components/FilterPanel.tsx | 171 |
1 files changed, 0 insertions, 171 deletions
diff --git a/components/FilterPanel.tsx b/components/FilterPanel.tsx deleted file mode 100644 index 871c3d6..0000000 --- a/components/FilterPanel.tsx +++ /dev/null @@ -1,171 +0,0 @@ -import { ChevronDownIcon } from '@chakra-ui/icons' -import { - Text, - Box, - Button, - Flex, - Menu, - MenuButton, - StackDivider, - VStack, - Portal, - MenuList, - MenuItem, - Switch, - Accordion, - AccordionItem, - AccordionButton, - AccordionIcon, - AccordionPanel, -} from '@chakra-ui/react' -import React from 'react' -import { TagPanel } from './TagPanel' -import { initialFilter, TagColors } from './config' -import { TagColorPanel } from './TagColorPanel' - -export interface FilterPanelProps { - filter: typeof initialFilter - setFilter: any - tagColors: TagColors - setTagColors: any - highlightColor: string - colorList: string[] - tags: string[] -} - -const FilterPanel = (props: FilterPanelProps) => { - const { filter, setFilter, tagColors, setTagColors, highlightColor, colorList, tags } = props - return ( - <Box> - <VStack - spacing={2} - justifyContent="flex-start" - divider={<StackDivider borderColor="gray.500" />} - align="stretch" - paddingLeft={7} - color="gray.800" - > - <Flex alignItems="center" justifyContent="space-between"> - <Text>Link children to...</Text> - <Menu isLazy placement="right"> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />} colorScheme="" color="black"> - {(() => { - switch (filter.parent) { - case 'parent': - return <Text>File</Text> - case 'heading': - return <Text>Heading</Text> - default: - return <Text>Nothing</Text> - } - })()} - </MenuButton> - <Portal> - {' '} - <MenuList bgColor="gray.200" zIndex="popover"> - <MenuItem - onClick={() => - setFilter((curr: typeof initialFilter) => ({ ...curr, parent: '' })) - } - > - Nothing - </MenuItem> - <MenuItem - onClick={() => - setFilter((curr: typeof initialFilter) => ({ - ...curr, - parent: 'parent', - })) - } - > - Parent file node - </MenuItem> - <MenuItem - onClick={() => - setFilter((curr: typeof initialFilter) => ({ - ...curr, - parent: 'heading', - })) - } - > - Next highest heading node - </MenuItem> - </MenuList> - </Portal> - </Menu> - </Flex> - <Flex justifyContent="space-between"> - <Text>Orphans</Text> - <Switch - onChange={() => { - setFilter((curr: typeof initialFilter) => { - return { ...curr, orphans: !curr.orphans } - }) - }} - isChecked={filter.orphans} - ></Switch> - </Flex> - <Flex justifyContent="space-between"> - <Text>Citations without note files</Text> - <Switch - onChange={() => { - setFilter({ ...filter, filelessCites: !filter.filelessCites }) - }} - isChecked={filter.filelessCites} - ></Switch> - </Flex> - <Flex justifyContent="space-between"> - <Text>Non-existant nodes</Text> - <Switch - onChange={() => { - setTagColors({ ...tagColors, bad: 'white' }) - setFilter({ ...filter, bad: !filter.bad }) - }} - isChecked={filter.bad} - ></Switch> - </Flex> - </VStack> - <Accordion padding={0} allowToggle allowMultiple paddingLeft={3}> - <AccordionItem> - <AccordionButton> - Tag filters - <AccordionIcon /> - </AccordionButton> - <AccordionPanel pr={0} mr={0}> - <TagPanel - highlightColor={highlightColor} - filter={filter} - setFilter={setFilter} - tags={tags} - mode="blacklist" - /> - <TagPanel - highlightColor={highlightColor} - filter={filter} - setFilter={setFilter} - tags={tags} - mode="whitelist" - /> - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - Tag Colors - <AccordionIcon /> - </AccordionButton> - <AccordionPanel pr={0} mr={0}> - <TagColorPanel - tags={tags} - colorList={colorList} - tagColors={tagColors} - setTagColors={setTagColors} - highlightColor={highlightColor} - /> - </AccordionPanel> - </AccordionItem> - </Accordion> - </Box> - ) -} - -export default FilterPanel |