Merge pull request #1374 from pau-tomas/feat/variables-improvements

Look up for global variable uses in custom events

CHANGELOG.md

@@ -23,6 +23,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Updated Polish localisation. [@ReptiIe](https://github.com/ReptiIe)
+- Update Variable Uses sidebar to include any uses within Scripts [@pau-tomas](https://github.com/pau-tomas)
 
 ### Fixed
 

src/components/editors/VariableEditor.tsx

@@ -1,6 +1,7 @@
 import React, { FC, RefObject, useCallback, useEffect, useState } from "react";
 import {
   actorSelectors,
+  customEventSelectors,
   sceneSelectors,
   scriptEventSelectors,
   triggerSelectors,
@@ -32,6 +33,7 @@ import {
 import l10n, { getL10NData } from "shared/lib/lang/l10n";
 import { selectScriptEventDefs } from "store/features/scriptEventDefs/scriptEventDefsState";
 import { useAppDispatch, useAppSelector } from "store/hooks";
+import { CodeIcon } from "ui/icons/Icons";
 
 const worker = new VariableUsesWorker();
 
@@ -72,6 +74,9 @@ export const VariableEditor: FC<VariableEditorProps> = ({ id }) => {
   const scriptEventsLookup = useAppSelector((state) =>
     scriptEventSelectors.selectEntities(state)
   );
+  const customEventsLookup = useAppSelector((state) =>
+    customEventSelectors.selectEntities(state)
+  );
   const [showSymbols, setShowSymbols] = useState(false);
 
   const scriptEventDefs = useAppSelector((state) =>
@@ -107,6 +112,7 @@ export const VariableEditor: FC<VariableEditorProps> = ({ id }) => {
       triggersLookup,
       scriptEventsLookup,
       scriptEventDefs,
+      customEventsLookup,
       l10NData: getL10NData(),
     });
   }, [
@@ -116,6 +122,7 @@ export const VariableEditor: FC<VariableEditorProps> = ({ id }) => {
     id,
     scriptEventsLookup,
     scriptEventDefs,
+    customEventsLookup,
   ]);
 
   const onRename = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -137,20 +144,22 @@ export const VariableEditor: FC<VariableEditorProps> = ({ id }) => {
   };
 
   const setSelectedId = (id: string, item: VariableUse) => {
-    dispatch(editorActions.editSearchTerm(""));
-    dispatch(editorActions.editSearchTerm(item.sceneId));
-    if (item.type === "actor") {
+    if (item.type === "scene") {
+      dispatch(editorActions.selectScene({ sceneId: id }));
+      dispatch(editorActions.setFocusSceneId(item.sceneId));
+    } else if (item.type === "actor") {
       dispatch(
         editorActions.selectActor({ actorId: id, sceneId: item.sceneId })
       );
+      dispatch(editorActions.setFocusSceneId(item.sceneId));
     } else if (item.type === "trigger") {
       dispatch(
         editorActions.selectTrigger({ triggerId: id, sceneId: item.sceneId })
       );
-    } else {
-      dispatch(editorActions.selectScene({ sceneId: id }));
+      dispatch(editorActions.setFocusSceneId(item.sceneId));
+    } else if (item.type === "custom") {
+      dispatch(editorActions.selectCustomEvent({ customEventId: id }));
     }
-    dispatch(editorActions.setFocusSceneId(item.sceneId));
   };
 
   const selectSidebar = () => {
@@ -211,17 +220,28 @@ export const VariableEditor: FC<VariableEditorProps> = ({ id }) => {
                   items={variableUses}
                   height={height - 30}
                   setSelectedId={setSelectedId}
-                  children={({ item }) =>
-                    item.type === "scene" ? (
-                      <EntityListItem item={item} type={item.type} />
-                    ) : (
-                      <EntityListItem
-                        item={item}
-                        type={item.type}
-                        nestLevel={1}
-                      />
-                    )
-                  }
+                  children={({ item }) => {
+                    switch (item.type) {
+                      case "scene":
+                        return <EntityListItem item={item} type={item.type} />;
+                      case "custom":
+                        return (
+                          <EntityListItem
+                            item={item}
+                            type={item.type}
+                            icon={<CodeIcon />}
+                          />
+                        );
+                      default:
+                        return (
+                          <EntityListItem
+                            item={item}
+                            type={item.type}
+                            nestLevel={1}
+                          />
+                        );
+                    }
+                  }}
                 />
               ) : (
                 <UseMessage>{l10n("FIELD_VARIABLE_NOT_USED")}</UseMessage>

src/components/editors/VariableUses.worker.ts

@@ -1,12 +1,14 @@
 import { Dictionary } from "@reduxjs/toolkit";
 import {
   actorName,
+  customEventName,
   isUnionValue,
   sceneName,
   triggerName,
 } from "shared/lib/entities/entitiesHelpers";
 import {
   ActorNormalized,
+  CustomEventNormalized,
   SceneNormalized,
   ScriptEventNormalized,
   TriggerNormalized,
@@ -16,33 +18,43 @@ import {
   ScriptEventDefs,
   isVariableField,
 } from "shared/lib/scripts/scriptDefHelpers";
-import { walkNormalizedScenesScripts } from "shared/lib/scripts/walk";
+import {
+  walkNormalizedCustomEventScripts,
+  walkNormalizedScenesScripts,
+} from "shared/lib/scripts/walk";
 
 export type VariableUse = {
   id: string;
   name: string;
-  sceneId: string;
-  scene: SceneNormalized;
-  sceneIndex: number;
   event: ScriptEventNormalized;
 } & (
   | {
       type: "scene";
+      sceneId: string;
+      scene: SceneNormalized;
+      sceneIndex: number;
     }
   | {
       type: "actor";
       actor: ActorNormalized;
       actorIndex: number;
+      sceneId: string;
       scene: SceneNormalized;
       sceneIndex: number;
     }
   | {
       type: "trigger";
       trigger: TriggerNormalized;
       triggerIndex: number;
+      sceneId: string;
       scene: SceneNormalized;
       sceneIndex: number;
     }
+  | {
+      type: "custom";
+      customEvent: CustomEventNormalized;
+      customEventIndex: number;
+    }
 );
 
 export interface VariableUseResult {
@@ -62,6 +74,8 @@ workerCtx.onmessage = async (evt) => {
   const actorsLookup: Dictionary<ActorNormalized> = evt.data.actorsLookup;
   const triggersLookup: Dictionary<TriggerNormalized> = evt.data.triggersLookup;
   const scriptEventDefs: ScriptEventDefs = evt.data.scriptEventDefs;
+  const customEventsLookup: Dictionary<CustomEventNormalized> =
+    evt.data.customEventsLookup;
   const l10NData: L10NLookup = evt.data.l10NData;
 
   setL10NData(l10NData);
@@ -153,6 +167,51 @@ workerCtx.onmessage = async (evt) => {
     }
   );
 
+  Object.values(customEventsLookup).forEach((customEvent, customEventIndex) => {
+    if (!customEvent) return;
+    walkNormalizedCustomEventScripts(
+      customEvent,
+      scriptEventsLookup,
+      undefined,
+      (scriptEvent: ScriptEventNormalized) => {
+        for (const arg in scriptEvent.args) {
+          if (
+            !isVariableField(
+              scriptEvent.command,
+              arg,
+              scriptEvent.args,
+              scriptEventDefs
+            )
+          ) {
+            continue;
+          }
+
+          const argValue = scriptEvent.args[arg];
+          const isVariableId =
+            argValue === variableId ||
+            (isUnionValue(argValue) &&
+              argValue.type === "variable" &&
+              argValue.value === variableId);
+
+          if (!isVariableId) {
+            continue;
+          }
+
+          if (!useLookup[customEvent.id])
+            uses.push({
+              id: customEvent.id,
+              name: customEventName(customEvent, customEventIndex),
+              event: scriptEvent,
+              type: "custom",
+              customEvent,
+              customEventIndex: customEventIndex,
+            });
+          useLookup[customEvent.id] = true;
+        }
+      }
+    );
+  });
+
   workerCtx.postMessage({ id, uses } as VariableUseResult);
 };