fix: hedgehog mode meets dark mode badly (#17369)

frontend/src/lib/components/HedgehogBuddy/HedgehogBuddy.stories.tsx

@@ -19,6 +19,7 @@ export const TheHedgehog: StoryFn<typeof HedgehogBuddy> = () => {
                     // eslint-disable-next-line no-console
                     console.log('should close')
                 }}
+                isDarkModeOn={false}
             />
         </div>
     )

frontend/src/lib/components/HedgehogBuddy/HedgehogBuddy.tsx

@@ -390,17 +390,18 @@ export function HedgehogBuddy({
     onClick: _onClick,
     onPositionChange,
     popoverOverlay,
+    isDarkModeOn,
 }: {
     actorRef?: MutableRefObject<HedgehogActor | undefined>
     onClose: () => void
     onClick?: () => void
     onPositionChange?: (actor: HedgehogActor) => void
     popoverOverlay?: React.ReactNode
+    // passed in because toolbar needs to check this differently than the app
+    isDarkModeOn: boolean
 }): JSX.Element {
     const actorRef = useRef<HedgehogActor>()
 
-    const { isDarkModeOn } = useValues(themeLogic)
-
     if (!actorRef.current) {
         actorRef.current = new HedgehogActor()
         if (_actorRef) {
@@ -538,6 +539,11 @@ export function HedgehogBuddy({
 export function HedgehogBuddyWithLogic(): JSX.Element {
     const { hedgehogModeEnabled } = useValues(hedgehogbuddyLogic)
     const { setHedgehogModeEnabled } = useActions(hedgehogbuddyLogic)
+    const { isDarkModeOn } = useValues(themeLogic)
 
-    return hedgehogModeEnabled ? <HedgehogBuddy onClose={() => setHedgehogModeEnabled(false)} /> : <></>
+    return hedgehogModeEnabled ? (
+        <HedgehogBuddy onClose={() => setHedgehogModeEnabled(false)} isDarkModeOn={isDarkModeOn} />
+    ) : (
+        <></>
+    )
 }

frontend/src/toolbar/button/HedgehogButton.tsx

@@ -45,6 +45,7 @@ export function HedgehogButton(): JSX.Element {
                     onPositionChange={(actor) => {
                         saveDragPosition(actor.x + SPRITE_SIZE * 0.5, -actor.y - SPRITE_SIZE * 0.5)
                     }}
+                    isDarkModeOn={false}
                 />
             )}
         </>