Merge remote-tracking branch 'origin/main' into F/mv3/sidePanel-4

pixiebrix · Jan 24, 2024 · 20cd48d · 20cd48d
2 parents 4a5f655 + 8e850bb
commit 20cd48d
Show file tree

Hide file tree

Showing 11 changed files with 75 additions and 93 deletions.
diff --git a/src/bricks/transformers/ephemeralForm/formTransformer.ts b/src/bricks/transformers/ephemeralForm/formTransformer.ts
@@ -149,7 +149,8 @@ export class FormTransformer extends TransformerABC {
     // Pre-registering the form also allows the sidebar to know a form will be shown in computing the default
     // tab to show during sidebar initialization.
     const formPromise = registerForm({
-      extensionId: logger.context.extensionId,
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-unnecessary-type-assertion -- TODO: Review MessageContext types/usage
+      extensionId: logger.context.extensionId!,
       nonce: formNonce,
       definition: formDefinition,
       blueprintId: logger.context.blueprintId,
@@ -160,7 +161,8 @@ export class FormTransformer extends TransformerABC {
       await showSidebar();
 
       await showSidebarForm({
-        extensionId: logger.context.extensionId,
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-unnecessary-type-assertion -- TODO: Review MessageContext types/usage
+        extensionId: logger.context.extensionId!,
         blueprintId: logger.context.blueprintId,
         nonce: formNonce,
         form: formDefinition,

diff --git a/src/components/addBlockModal/addBlockModalHelpers.ts b/src/components/addBlockModal/addBlockModalHelpers.ts
@@ -37,7 +37,7 @@ export function getItemKey({
   columnIndex,
   data: { blockOptions },
   rowIndex,
-}: ItemKeyInput): RegistryId | number {
+}: ItemKeyInput): RegistryId | number | undefined {
   const resultIndex = getFlatArrayIndex({ rowIndex, columnIndex });
   // Number of bricks for the last Grid row could be less than the number of columns
   // Returning the index here, ItemRenderer will render an empty cell

diff --git a/src/components/imagePlaceholder/ImagePlaceholder.tsx b/src/components/imagePlaceholder/ImagePlaceholder.tsx
@@ -23,7 +23,7 @@ const ImagePlaceholder: React.VoidFunctionComponent<{
   height: number | string;
   width: number | string;
 }> = ({ height, width }) => {
-  const imageRef = useRef();
+  const imageRef = useRef<HTMLImageElement>(null);
 
   useEffect(() => {
     runHolder({

diff --git a/src/contentScript/ephemeralFormProtocol.ts b/src/contentScript/ephemeralFormProtocol.ts
@@ -22,6 +22,7 @@ import pDefer, { type DeferredPromise } from "p-defer";
 import { CancelError } from "@/errors/businessErrors";
 import { type FormPanelEntry } from "@/types/sidebarTypes";
 import { type RegistryId } from "@/types/registryTypes";
+import { type Nullishable } from "@/utils/nullishUtils";
 
 export type RegisteredForm = {
   /**
@@ -30,7 +31,7 @@ export type RegisteredForm = {
   extensionId: UUID;
   definition: FormDefinition;
   registration: DeferredPromise<unknown>;
-  blueprintId: RegistryId | null;
+  blueprintId: Nullishable<RegistryId>;
 };
 
 // eslint-disable-next-line local-rules/persistBackgroundData -- Unused there
@@ -69,7 +70,7 @@ export async function registerForm({
   extensionId: UUID;
   nonce: UUID;
   definition: FormDefinition;
-  blueprintId: RegistryId | null;
+  blueprintId: Nullishable<RegistryId>;
 }): Promise<unknown> {
   expectContext("contentScript");
 

diff --git a/src/extensionConsole/pages/activateMod/UrlPermissionsList.tsx b/src/extensionConsole/pages/activateMod/UrlPermissionsList.tsx
@@ -16,7 +16,7 @@
  */
 
 import React, { useMemo } from "react";
-import { isEmpty, uniq } from "lodash";
+import { uniq } from "lodash";
 import { selectOptionalPermissions } from "@/permissions/permissionsUtils";
 import { Col, Row } from "react-bootstrap";
 import useReportError from "@/hooks/useReportError";
@@ -44,7 +44,7 @@ const UrlPermissionsList: React.FunctionComponent<
         // `selectOptionalPermissions` never returns any origins because we request *://*
         permissionsList: uniq([
           ...selectOptionalPermissions(permissions.permissions),
-          ...permissions.origins,
+          ...(permissions.origins ?? []),
         ]),
       }),
     ),
@@ -63,13 +63,11 @@ const UrlPermissionsList: React.FunctionComponent<
       );
     }
 
-    if (permissionsList.length === 0) {
+    if (!permissionsList?.length) {
       return <p>No special permissions required</p>;
     }
 
-    const { hasPermissions } = data;
-
-    if (hasPermissions) {
+    if (data?.hasPermissions) {
       return (
         <p>
           PixieBrix already has the permissions required for the bricks
@@ -91,7 +89,7 @@ const UrlPermissionsList: React.FunctionComponent<
       <Row>
         <Col>{helpText}</Col>
       </Row>
-      {!isEmpty(permissionsList) && (
+      {permissionsList?.length ? (
         // Use Table single column table instead of ListGroup to more closely match style on other wizard tabs
         <Row>
           <Col>
@@ -103,7 +101,7 @@ const UrlPermissionsList: React.FunctionComponent<
             </ul>
           </Col>
         </Row>
-      )}
+      ) : null}
     </>
   );
 };

diff --git a/src/pageEditor/sidebar/ActionMenu.tsx b/src/pageEditor/sidebar/ActionMenu.tsx
@@ -30,6 +30,7 @@ import styles from "./ActionMenu.module.scss";
 import EllipsisMenu, {
   type EllipsisMenuItem,
 } from "@/components/ellipsisMenu/EllipsisMenu";
+import { type IconProp } from "@fortawesome/fontawesome-svg-core";
 
 type ActionMenuProps = {
   onSave: () => Promise<void>;
@@ -43,6 +44,17 @@ type ActionMenuProps = {
   disabled?: boolean;
 };
 
+const Title: React.FC<{
+  icon: IconProp;
+  text: string;
+  iconClassName?: string;
+}> = ({ icon, text, iconClassName }) => (
+  <>
+    <FontAwesomeIcon icon={icon} fixedWidth className={iconClassName} />
+    {text}
+  </>
+);
+
 const ActionMenu: React.FC<ActionMenuProps> = ({
   onSave,
   onDelete,
@@ -55,82 +67,49 @@ const ActionMenu: React.FC<ActionMenuProps> = ({
   disabled,
 }) => {
   const menuItems: EllipsisMenuItem[] = [
-    {
-      title: (
-        <>
-          <FontAwesomeIcon icon={faHistory} fixedWidth /> Reset
-        </>
-      ),
-      hide: !onReset,
+    onReset && {
+      title: <Title icon={faHistory} text="Reset" />,
       action: onReset,
       disabled: !isDirty || disabled,
     },
-    {
+    onAddToRecipe && {
       title: (
-        <>
-          <FontAwesomeIcon
-            icon={faFileImport}
-            fixedWidth
-            className={styles.addIcon}
-          />{" "}
-          Add to mod
-        </>
+        <Title
+          icon={faFileImport}
+          iconClassName={styles.addIcon}
+          text="Add to mod"
+        />
       ),
-      hide: !onAddToRecipe,
       action: onAddToRecipe,
       disabled,
     },
-    {
+    onRemoveFromRecipe && {
       title: (
-        <>
-          <FontAwesomeIcon
-            icon={faFileExport}
-            fixedWidth
-            className={styles.removeIcon}
-          />{" "}
-          Move from mod
-        </>
+        <Title
+          icon={faFileExport}
+          iconClassName={styles.removeIcon}
+          text="Move from mod"
+        />
       ),
-      hide: !onRemoveFromRecipe,
       action: onRemoveFromRecipe,
       disabled,
     },
     {
-      title: (
-        <>
-          <FontAwesomeIcon icon={faClone} fixedWidth /> Make a copy
-        </>
-      ),
+      title: <Title icon={faClone} text="Make a copy" />,
       action: onClone,
       disabled,
     },
-    ...(onDelete
-      ? [
-          {
-            title: (
-              <>
-                <FontAwesomeIcon icon={faTrash} fixedWidth /> Delete
-              </>
-            ),
-            action: onDelete,
-            disabled,
-          },
-        ]
-      : []),
-    ...(onDeactivate
-      ? [
-          {
-            title: (
-              <>
-                <FontAwesomeIcon icon={faTimes} fixedWidth /> Deactivate
-              </>
-            ),
-            action: onDeactivate,
-            disabled,
-          },
-        ]
-      : []),
-  ];
+    onDelete && {
+      title: <Title icon={faTrash} text="Delete" />,
+      action: onDelete,
+      disabled,
+    },
+    onDeactivate && {
+      title: <Title icon={faTimes} text="Deactivate" />,
+      action: onDeactivate,
+      disabled,
+    },
+  ].filter(Boolean);
 
   return (
     <div className={styles.root}>

diff --git a/src/pageEditor/slices/editorSlice.ts b/src/pageEditor/slices/editorSlice.ts
@@ -474,21 +474,6 @@ export const editorSlice = createSlice({
     setBetaUIEnabled(state, action: PayloadAction<boolean>) {
       state.isBetaUI = action.payload;
     },
-    removeElementNodeUIState(
-      state,
-      action: PayloadAction<{
-        nodeIdToRemove: UUID;
-        newActiveNodeId?: UUID;
-      }>,
-    ) {
-      const elementUIState = state.elementUIStates[state.activeElementId];
-      const { nodeIdToRemove, newActiveNodeId } = action.payload;
-
-      const activeNodeId = newActiveNodeId ?? FOUNDATION_NODE_ID;
-      setActiveNodeId(state, activeNodeId);
-
-      delete elementUIState.nodeUIStates[nodeIdToRemove];
-    },
     setElementActiveNodeId(state, action: PayloadAction<UUID>) {
       setActiveNodeId(state, action.payload);
     },

diff --git a/src/pageScript/frameworks/component.ts b/src/pageScript/frameworks/component.ts
@@ -24,7 +24,7 @@ export function traverse<T = unknown>(
   source: T,
   count: number,
 ): T | null {
-  let current = source;
+  let current: T | null = source;
   for (let i = 0; i < count && current; i++) {
     current = next(current);
   }

diff --git a/src/testUtils/testHelpers.tsx b/src/testUtils/testHelpers.tsx
@@ -91,7 +91,7 @@ type WrapperResult<
   /**
    * Get the current form values
    */
-  getFormState(): FormikValues;
+  getFormState(): FormikValues | null;
 
   /**
    * Update the formik state without interacting with the UI
@@ -125,7 +125,7 @@ export function createRenderWithWrappers(configureStore: ConfigureStore) {
 
     setupRedux(store.dispatch, { store });
 
-    let formValues: FormikValues = null;
+    let formValues: FormikValues | null = null;
 
     let updateFormState: (
       newValues: React.SetStateAction<FormikValues>,
@@ -207,7 +207,7 @@ type HookWrapperResult<
   /**
    * Get the current form values
    */
-  getFormState(): FormikValues;
+  getFormState(): FormikValues | null;
 };
 
 export function createRenderHookWithWrappers(configureStore: ConfigureStore) {
@@ -224,7 +224,7 @@ export function createRenderHookWithWrappers(configureStore: ConfigureStore) {
 
     setupRedux(store.dispatch, { store });
 
-    let formValues: FormikValues = null;
+    let formValues: FormikValues | null = null;
 
     const ExtraWrapper: WrapperComponent<TProps> =
       wrapper ?? (({ children }) => <>{children}</>);

diff --git a/src/tsconfig.strictNullChecks.json b/src/tsconfig.strictNullChecks.json
@@ -17,6 +17,22 @@
     "./__mocks__/@/utils/injectScriptTag.ts",
     "./__mocks__/@/utils/injectStylesheet.ts",
     "./__mocks__/@uipath/robot.ts",
+    "./validators/formValidator.ts",
+    "./pageEditor/sidebar/ActionMenu.tsx",
+    "./pageScript/frameworks/component.ts",
+    "./testUtils/testHelpers.tsx",
+    "./components/addBlockModal/addBlockModalHelpers.ts",
+    "./components/imagePlaceholder/ImagePlaceholder.tsx",
+    "./extensionConsole/pages/mods/gridView/GridCardErrorBoundary.tsx",
+    "./extensionConsole/pages/mods/listView/ListItemErrorBoundary.tsx",
+    "./bricks/transformers/ephemeralForm/formTransformer.ts",
+    "./store/extensionsUtils.ts",
+    "./permissions/useRequestPermissionsCallback.ts",
+    "./components/errors/getErrorDetails.tsx",
+    "./extensionConsole/pages/activateMod/UrlPermissionsList.tsx",
+    "./components/paginatedTable/PaginatedTable.tsx",
+    "./extensionConsole/pages/mods/emptyView/EmptyView.tsx",
+    "./types/reactTableConfig.d.ts",
     "./activation/ActivationLink.tsx",
     "./activation/activateLinkClickHandler.ts",
     "./contentScript/setExtensionIdInApp.ts",

diff --git a/src/types/reactTableConfig.d.ts b/src/types/reactTableConfig.d.ts
@@ -48,6 +48,7 @@ declare module "react-table" {
     extends UseExpandedOptions<D>,
       UseFiltersOptions<D>,
       UseGlobalFiltersOptions<D>,
+      UsePaginationOptions<D>,
       UseGroupByOptions<D>,
       UseSortByOptions<D>,
       ActionOptions<D> {}