Fixed global variables disappearing after refresh (#1954)

src/frontend/src/components/inputGlobalComponent/index.tsx

@@ -34,6 +34,7 @@ export default function InputGlobalComponent({
   useEffect(() => {
     if (data.node?.template[name])
       if (
+        globalVariablesEntries &&
         !globalVariablesEntries.includes(data.node?.template[name].value) &&
         data.node?.template[name].load_from_db
       ) {
@@ -138,6 +139,7 @@ export default function InputGlobalComponent({
       )}
       selectedOption={
         data?.node?.template[name].load_from_db &&
+        globalVariablesEntries &&
         globalVariablesEntries.includes(data?.node?.template[name].value ?? "")
           ? data?.node?.template[name].value
           : ""

src/frontend/src/pages/SettingsPage/pages/GlobalVariablesPage/index.tsx

@@ -16,13 +16,13 @@ import { cn } from "../../../../utils/utils";
 
 export default function GlobalVariablesPage() {
   const globalVariablesEntries = useGlobalVariablesStore(
-    (state) => state.globalVariablesEntries
+    (state) => state.globalVariablesEntries,
   );
   const removeGlobalVariable = useGlobalVariablesStore(
-    (state) => state.removeGlobalVariable
+    (state) => state.removeGlobalVariable,
   );
   const globalVariables = useGlobalVariablesStore(
-    (state) => state.globalVariables
+    (state) => state.globalVariables,
   );
   const setErrorData = useAlertStore((state) => state.setErrorData);
   const getVariableId = useGlobalVariablesStore((state) => state.getVariableId);
@@ -55,6 +55,7 @@ export default function GlobalVariablesPage() {
       name: string;
       default_fields: string | undefined;
     }> = [];
+    if (globalVariablesEntries === undefined) return;
     globalVariablesEntries.forEach((entrie) => {
       const globalVariableObj = globalVariables[entrie];
       rows.push({
@@ -156,7 +157,7 @@ export default function GlobalVariablesPage() {
             <IconComponent
               name="Trash2"
               className={cn(
-                "h-5 w-5 text-destructive group-disabled:text-primary"
+                "h-5 w-5 text-destructive group-disabled:text-primary",
               )}
             />
           </Button>
@@ -176,7 +177,7 @@ export default function GlobalVariablesPage() {
               overlayNoRowsTemplate="No data available"
               onSelectionChanged={(event: SelectionChangedEvent) => {
                 setSelectedRows(
-                  event.api.getSelectedRows().map((row) => row.name)
+                  event.api.getSelectedRows().map((row) => row.name),
                 );
               }}
               rowSelection="multiple"

src/frontend/src/stores/globalVariables.ts

@@ -13,7 +13,7 @@ export const useGlobalVariablesStore = create<GlobalVariablesStore>(
       delete newFields[field];
       set({ unavaliableFields: newFields });
     },
-    globalVariablesEntries: [],
+    globalVariablesEntries: undefined,
     globalVariables: {},
     setGlobalVariables: (variables) => {
       set({
@@ -45,5 +45,5 @@ export const useGlobalVariablesStore = create<GlobalVariablesStore>(
     getVariableId: (name) => {
       return get().globalVariables[name]?.id;
     },
-  })
+  }),
 );

src/frontend/src/types/zustand/globalVariables/index.ts

@@ -1,5 +1,5 @@
 export type GlobalVariablesStore = {
-  globalVariablesEntries: Array<string>;
+  globalVariablesEntries: Array<string> | undefined;
   globalVariables: {
     [name: string]: {
       id: string;