summaryrefslogtreecommitdiff
path: root/components/Tweaks/VisualsPanel.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'components/Tweaks/VisualsPanel.tsx')
-rw-r--r--components/Tweaks/VisualsPanel.tsx122
1 files changed, 0 insertions, 122 deletions
diff --git a/components/Tweaks/VisualsPanel.tsx b/components/Tweaks/VisualsPanel.tsx
deleted file mode 100644
index f364c4f..0000000
--- a/components/Tweaks/VisualsPanel.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import {
- Text,
- Accordion,
- AccordionButton,
- AccordionItem,
- Flex,
- VStack,
- AccordionIcon,
- AccordionPanel,
- MenuButton,
- Menu,
- Button,
- Box,
- Portal,
- MenuList,
- MenuItem,
-} from '@chakra-ui/react'
-import React, { useCallback } from 'react'
-import { HighlightingPanel } from './HighlightingPanel'
-import { ColorsPanel } from './ColorsPanel'
-import { initialColoring, initialVisuals } from '../config'
-import { NodesNLinksPanel } from './NodesNLinksPanel'
-import { LabelsPanel } from './LabelsPanel'
-import { CitationsPanel } from './CitationsPanel'
-import { ColorMenu } from './ColorMenu'
-import { ThemeSelect } from './ThemeSelect'
-import { GraphColorSelect } from './GraphColorSelect'
-
-export interface VisualsPanelProps {
- visuals: typeof initialVisuals
- setVisuals: any
- highlightColor: string
- setHighlightColor: any
- threeDim: boolean
- coloring: typeof initialColoring
- setColoring: any
-}
-
-export const VisualsPanel = (props: VisualsPanelProps) => {
- const {
- coloring,
- setColoring,
- visuals,
- setVisuals,
- highlightColor,
- setHighlightColor,
- threeDim,
- } = props
- const setVisualsCallback = useCallback((val) => setVisuals(val), [])
- return (
- <VStack justifyContent="flex-start" align="stretch">
- <ThemeSelect />
- <GraphColorSelect {...{ coloring, setColoring }} />
- <Accordion allowToggle defaultIndex={[0]} paddingLeft={3}>
- <AccordionItem>
- <AccordionButton>
- <Flex justifyContent="space-between" w="100%">
- <Text>Colors</Text>
- <AccordionIcon marginRight={2} />
- </Flex>
- </AccordionButton>
- <AccordionPanel>
- <ColorsPanel
- visuals={visuals}
- setVisualsCallback={setVisualsCallback}
- highlightColor={highlightColor}
- setHighlightColor={setHighlightColor}
- />
- </AccordionPanel>
- </AccordionItem>
- <AccordionItem>
- <AccordionButton>
- <Flex justifyContent="space-between" w="100%">
- <Text>Nodes & Links</Text>
- <AccordionIcon marginRight={2} />
- </Flex>
- </AccordionButton>
- <AccordionPanel>
- <NodesNLinksPanel
- visuals={visuals}
- setVisuals={setVisualsCallback}
- threeDim={threeDim}
- />
- </AccordionPanel>
- </AccordionItem>
- <AccordionItem>
- <AccordionButton>
- <Flex justifyContent="space-between" w="100%">
- <Text>Labels</Text>
- <AccordionIcon marginRight={2} />
- </Flex>
- </AccordionButton>
- <AccordionPanel>
- <LabelsPanel visuals={visuals} setVisuals={setVisualsCallback} />
- </AccordionPanel>
- </AccordionItem>
- <AccordionItem>
- <AccordionButton>
- <Flex justifyContent="space-between" w="100%">
- <Text>Highlighting</Text>
- <AccordionIcon marginRight={2} />
- </Flex>
- </AccordionButton>
- <AccordionPanel>
- <HighlightingPanel visuals={visuals} setVisuals={setVisualsCallback} />
- </AccordionPanel>
- </AccordionItem>
- <AccordionItem>
- <AccordionButton>
- <Flex justifyContent="space-between" w="100%">
- <Text>Citations</Text>
- <AccordionIcon marginRight={2} />
- </Flex>
- </AccordionButton>
- <AccordionPanel>
- <CitationsPanel visuals={visuals} setVisuals={setVisualsCallback} />
- </AccordionPanel>
- </AccordionItem>
- </Accordion>
- </VStack>
- )
-}