1 files changed, 14 insertions, 2 deletions
diff --git a/components/Tweaks/VisualsPanel.tsx b/components/Tweaks/VisualsPanel.tsx
index 23ba41f..f364c4f 100644
--- a/components/Tweaks/VisualsPanel.tsx
+++ b/components/Tweaks/VisualsPanel.tsx
@@ -18,12 +18,13 @@ import {
 import React, { useCallback } from 'react'
 import { HighlightingPanel } from './HighlightingPanel'
 import { ColorsPanel } from './ColorsPanel'
-import { initialVisuals } from '../config'
+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
@@ -31,14 +32,25 @@ export interface VisualsPanelProps {
   highlightColor: string
   setHighlightColor: any
   threeDim: boolean
+  coloring: typeof initialColoring
+  setColoring: any
 }
 
 export const VisualsPanel = (props: VisualsPanelProps) => {
-  const { visuals, setVisuals, highlightColor, setHighlightColor, threeDim } = props
+  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>