scaffolder: memo methods in DryRunProvider

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

plugins/scaffolder/src/components/TemplateEditorPage/DryRunContext.tsx

@@ -20,6 +20,7 @@ import { JsonObject } from '@backstage/types';
 import React, {
   createContext,
   ReactNode,
+  useCallback,
   useContext,
   useMemo,
   useRef,
@@ -64,67 +65,76 @@ export function DryRunProvider(props: DryRunProviderProps) {
   });
   const idRef = useRef(1);
 
+  const selectResult = useCallback((id: number) => {
+    setState(prevState => {
+      const result = prevState.results.find(r => r.id === id);
+      if (result === prevState.selectedResult) {
+        return prevState;
+      }
+      return {
+        results: prevState.results,
+        selectedResult: result,
+      };
+    });
+  }, []);
+
+  const deleteResult = useCallback((id: number) => {
+    setState(prevState => {
+      const index = prevState.results.findIndex(r => r.id === id);
+      if (index === -1) {
+        return prevState;
+      }
+      const newResults = prevState.results.slice();
+      const [deleted] = newResults.splice(index, 1);
+      return {
+        results: newResults,
+        selectedResult:
+          prevState.selectedResult?.id === deleted.id
+            ? newResults[0]
+            : prevState.selectedResult,
+      };
+    });
+  }, []);
+
+  const execute = useCallback(
+    async (options: DryRunOptions) => {
+      if (!scaffolderApi.dryRun) {
+        throw new Error('Scaffolder API does not support dry-run');
+      }
+
+      const parsed = yaml.parse(options.templateContent);
+
+      const response = await scaffolderApi.dryRun({
+        template: parsed,
+        values: options.values,
+        secrets: {},
+        content: options.files.map(file => ({
+          path: file.path,
+          base64Content: btoa(file.content),
+        })),
+      });
+
+      const result = {
+        ...response,
+        id: idRef.current++,
+      };
+
+      setState(prevState => ({
+        results: [...prevState.results, result],
+        selectedResult: prevState.selectedResult ?? result,
+      }));
+    },
+    [scaffolderApi],
+  );
+
   const dryRun = useMemo(
     () => ({
       ...state,
-      selectResult: (id: number) => {
-        setState(prevState => {
-          const result = prevState.results.find(r => r.id === id);
-          if (result === prevState.selectedResult) {
-            return prevState;
-          }
-          return {
-            results: prevState.results,
-            selectedResult: result,
-          };
-        });
-      },
-      deleteResult: (id: number) => {
-        setState(prevState => {
-          const index = prevState.results.findIndex(r => r.id === id);
-          if (index === -1) {
-            return prevState;
-          }
-          const newResults = prevState.results.slice();
-          const [deleted] = newResults.splice(index, 1);
-          return {
-            results: newResults,
-            selectedResult:
-              prevState.selectedResult?.id === deleted.id
-                ? newResults[0]
-                : prevState.selectedResult,
-          };
-        });
-      },
-      execute: async (options: DryRunOptions) => {
-        if (!scaffolderApi.dryRun) {
-          throw new Error('Scaffolder API does not support dry-run');
-        }
-
-        const parsed = yaml.parse(options.templateContent);
-
-        const response = await scaffolderApi.dryRun({
-          template: parsed,
-          values: options.values,
-          secrets: {},
-          content: options.files.map(file => ({
-            path: file.path,
-            base64Content: btoa(file.content),
-          })),
-        });
-
-        const result = {
-          ...response,
-          id: idRef.current++,
-        };
-
-        setState(prevState => ({
-          results: [...prevState.results, result],
-          selectedResult: prevState.selectedResult ?? result,
-        }));
-      },
+      selectResult,
+      deleteResult,
+      execute,
     }),
-    [scaffolderApi, state],
+    [state, selectResult, deleteResult, execute],
   );
 
   return (