fix(striker-ui): run 'set validity on first render' in useEffect

striker-ui/components/InputWithRef.tsx

@@ -5,6 +5,7 @@ import {
   forwardRef,
   ReactElement,
   useCallback,
+  useEffect,
   useImperativeHandle,
   useMemo,
   useState,
@@ -166,15 +167,24 @@ const InputWithRef = forwardRef(
       [initOnFocus, inputTestBatch],
     );
 
-    if (isFirstRender) {
+    /**
-      const isValid =
+     * Using any setState function synchronously in the render function
-        testInput?.call(null, {
+     * directly will trigger the 'cannot update a component while readering a
-          inputs: { [INPUT_TEST_ID]: { value: inputValue } },
+     * different component' warning. This can be solved by wrapping the
-          isIgnoreOnCallbacks: true,
+     * setState call(s) in a useEffect hook because it executes **after** the
-        }) ?? false;
+     * render function completes.
-
+     */
-      onFirstRender?.call(null, { isValid });
+    useEffect(() => {
-    }
+      if (isFirstRender) {
+        const isValid =
+          testInput?.call(null, {
+            inputs: { [INPUT_TEST_ID]: { value: inputValue } },
+            isIgnoreOnCallbacks: true,
+          }) ?? false;
+
+        onFirstRender?.call(null, { isValid });
+      }
+    }, [input.props.id, inputValue, isFirstRender, onFirstRender, testInput]);
 
     useImperativeHandle(
       ref,

striker-ui/components/ManageUps/AddUpsInputGroup.tsx

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode, useMemo, useState } from 'react';
+import { ReactElement, ReactNode, useEffect, useMemo, useState } from 'react';
 
 import { BLACK } from '../../lib/consts/DEFAULT_THEME';
 
@@ -142,11 +142,13 @@ const AddUpsInputGroup = <
     ],
   );
 
-  if (isFirstRender) {
+  useEffect(() => {
-    buildInputFirstRenderFunction(INPUT_ID_UPS_TYPE)({
+    if (isFirstRender) {
-      isValid: Boolean(inputUpsTypeIdValue),
+      buildInputFirstRenderFunction(INPUT_ID_UPS_TYPE)({
-    });
+        isValid: Boolean(inputUpsTypeIdValue),
-  }
+      });
+    }
+  }, [buildInputFirstRenderFunction, inputUpsTypeIdValue, isFirstRender]);
 
   return content;
 };