hot refactor

src/routes/ProcessModelShow.tsx

@@ -7,6 +7,60 @@ import HttpService from '../services/HttpService';
 import ErrorContext from '../contexts/ErrorContext';
 import { RecentProcessModel } from '../interfaces';
 
+const storeRecentProcessModelInLocalStorage = (
+  processModelForStorage: any,
+  params: any
+) => {
+  if (
+    params.process_group_id === undefined ||
+    params.process_model_id === undefined
+  ) {
+    return;
+  }
+  // All values stored in localStorage are strings.
+  // Grab our recentProcessModels string from localStorage.
+  const stringFromLocalStorage = window.localStorage.getItem(
+    'recentProcessModels'
+  );
+
+  // adapted from https://stackoverflow.com/a/59424458/6090676
+  // If that value is null (meaning that we've never saved anything to that spot in localStorage before), use an empty array as our array. Otherwise, use the value we parse out.
+  let array: RecentProcessModel[] = [];
+  if (stringFromLocalStorage !== null) {
+    // Then parse that string into an actual value.
+    array = JSON.parse(stringFromLocalStorage);
+  }
+
+  // Here's the value we want to add
+  const value = {
+    processGroupIdentifier: processModelForStorage.process_group_id,
+    processModelIdentifier: processModelForStorage.id,
+    processModelDisplayName: processModelForStorage.display_name,
+  };
+
+  // If our parsed/empty array doesn't already have this value in it...
+  const matchingItem = array.find(
+    (item) =>
+      item.processGroupIdentifier === value.processGroupIdentifier &&
+      item.processModelIdentifier === value.processModelIdentifier
+  );
+  if (matchingItem === undefined) {
+    // add the value to the beginning of the array
+    array.unshift(value);
+
+    // Keep the array to 3 items
+    if (array.length > 3) {
+      array.pop();
+    }
+
+    // turn the array WITH THE NEW VALUE IN IT into a string to prepare it to be stored in localStorage
+    const stringRepresentingArray = JSON.stringify(array);
+
+    // and store it in localStorage as "recentProcessModels"
+    window.localStorage.setItem('recentProcessModels', stringRepresentingArray);
+  }
+};
+
 export default function ProcessModelShow() {
   const params = useParams();
   const setErrorMessage = (useContext as any)(ErrorContext)[1];
@@ -16,66 +70,10 @@ export default function ProcessModelShow() {
   const [reloadModel, setReloadModel] = useState(false);
 
   useEffect(() => {
-    const storeRecentProcessModelInLocalStorage = (
-      processModelForStorage: any
-    ) => {
-      if (
-        params.process_group_id === undefined ||
-        params.process_model_id === undefined
-      ) {
-        return;
-      }
-      // All values stored in localStorage are strings.
-      // Grab our recentProcessModels string from localStorage.
-      const stringFromLocalStorage = window.localStorage.getItem(
-        'recentProcessModels'
-      );
-
-      // adapted from https://stackoverflow.com/a/59424458/6090676
-      // If that value is null (meaning that we've never saved anything to that spot in localStorage before), use an empty array as our array. Otherwise, use the value we parse out.
-      let array: RecentProcessModel[] = [];
-      if (stringFromLocalStorage !== null) {
-        // Then parse that string into an actual value.
-        array = JSON.parse(stringFromLocalStorage);
-      }
-
-      // Here's the value we want to add
-      const value = {
-        processGroupIdentifier: processModelForStorage.process_group_id,
-        processModelIdentifier: processModelForStorage.id,
-        processModelDisplayName: processModelForStorage.display_name,
-      };
-
-      // If our parsed/empty array doesn't already have this value in it...
-      const matchingItem = array.find(
-        (item) =>
-          item.processGroupIdentifier === value.processGroupIdentifier &&
-          item.processModelIdentifier === value.processModelIdentifier
-      );
-      if (matchingItem === undefined) {
-        // add the value to the beginning of the array
-        array.unshift(value);
-
-        // Keep the array to 3 items
-        if (array.length > 3) {
-          array.pop();
-        }
-
-        // turn the array WITH THE NEW VALUE IN IT into a string to prepare it to be stored in localStorage
-        const stringRepresentingArray = JSON.stringify(array);
-
-        // and store it in localStorage as "recentProcessModels"
-        window.localStorage.setItem(
-          'recentProcessModels',
-          stringRepresentingArray
-        );
-      }
-    };
-
     const processResult = (result: object) => {
       setProcessModel(result);
       setReloadModel(false);
-      storeRecentProcessModelInLocalStorage(result);
+      storeRecentProcessModelInLocalStorage(result, params);
     };
     HttpService.makeCallToBackend({
       path: `/process-models/${params.process_group_id}/${params.process_model_id}`,