reaviz / reagraph

🕸 WebGL Graph Visualizations for React. Maintained by @goodcodeus.
https://reagraph.dev
Apache License 2.0
657 stars 63 forks source link

Changing Theme during runtime is buggy and doesn't update all values #220

Open barrymichaeldoyle opened 5 months ago

barrymichaeldoyle commented 5 months ago

Describe the bug

When implementing a theme toggle functionality. i.e. changing from one theme to another during runtime. The graph does not update all the colors.

Steps to Reproduce the Bug or Issue

Implement a toggle feature in the app as follows (you can use the default light and dark themes)

return (
    <GraphCanvas
      actives={actives}
      draggable
      layoutType="hierarchicalLr"
      cameraMode="pan"
      edges={edges}
      nodes={nodes}
      onCanvasClick={onCanvasClick}
      onNodeClick={handleNodeClick}
      ref={graphRef}
      selections={selections}
      theme={theme === "light" ? lightTheme : darkTheme}
      edgeInterpolation="linear"
    />
)

You will see the same problem effective even if you just update the theme during development and watch it incorrectly re-render with HMR

Expected behavior

I obviously expect that updating a theme during runtime should update all theme values and not just some.

Screenshots or Videos

Light Theme Example: Screenshot 2024-04-07 at 21 18 09

Dark Theme Example: Screenshot 2024-04-07 at 21 18 53

What happens when changing from light to dark (BAD): Screenshot 2024-04-07 at 21 18 33

What happens when changing from dark to light (BAD): Screenshot 2024-04-07 at 21 20 18

Platform

Your Example Website or App

No response

Additional context

No response

optojack commented 11 hours ago

I am also having this issue