Bump prettier to 3.3.3 and reformat files (#9503)

.pre-commit-config.yaml

@@ -21,6 +21,12 @@ repos:
     rev: v3.1.0
     hooks:
       - id: prettier
+        additional_dependencies:
+          # mirrors-prettier won't receive updates after v3.1.0 because prettier changed their
+          # plugin system: "prettier made some changes that breaks plugins entirely"
+          # See: https://github.com/pre-commit/pre-commit/issues/3133
+          # The additional_dependencies aren't updated with `pre-commit autoupdate`
+          - [email protected]
   # TODO: restore in https://github.com/pixiebrix/pixiebrix-extension/issues/9441
   # - repo: local
   #   hooks:

.prettierignore

@@ -4,7 +4,7 @@ coverage
 
 # ignore libraries
 node_modules
-public/mockServiceWorker.js
+**/public/mockServiceWorker.js
 
 # ignore snapshots
 **/*-snapshots/**

applications/browser-extension/src/analysis/analysisVisitors/varAnalysis/varAnalysis.ts

@@ -225,7 +225,7 @@ function setVarsFromSchema({
       const nodePath = [...parentPath, key];
 
       const existence =
-        existenceOverride ?? required?.includes(key)
+        (existenceOverride ?? required?.includes(key))
           ? VarExistence.DEFINITELY
           : VarExistence.MAYBE;
 
@@ -254,7 +254,7 @@ function setVarsFromSchema({
       });
     } else if (propertySchema.type === "array") {
       const existence =
-        existenceOverride ?? required?.includes(key)
+        (existenceOverride ?? required?.includes(key))
           ? VarExistence.DEFINITELY
           : VarExistence.MAYBE;
 
@@ -295,7 +295,7 @@ function setVarsFromSchema({
         source,
         path: [...parentPath, key],
         existence:
-          existenceOverride ?? required?.includes(key)
+          (existenceOverride ?? required?.includes(key))
             ? VarExistence.DEFINITELY
             : VarExistence.MAYBE,
       });

applications/browser-extension/src/background/auth/partnerIntegrations/launchAuthIntegration.ts

@@ -135,7 +135,7 @@ export async function launchAuthIntegration({
       "Integration did not return an OAuth2 context",
     );
 
-    const refreshUrl = refreshToken ? oAuth2Context.tokenUrl ?? null : null;
+    const refreshUrl = refreshToken ? (oAuth2Context.tokenUrl ?? null) : null;
 
     console.info("Setting partner auth for Control Room %s", controlRoomUrl);
 

applications/browser-extension/src/components/MarketplaceListingIcon.tsx

@@ -69,7 +69,7 @@ const MarketplaceListingIcon: React.FC<{
       color={
         inheritColor
           ? "inherit"
-          : listing?.icon_color ?? DEFAULT_TEXT_ICON_COLOR
+          : (listing?.icon_color ?? DEFAULT_TEXT_ICON_COLOR)
       }
       className={faIconClass}
       size={size}

applications/browser-extension/src/components/fields/schemaFields/integrations/IntegrationDependencyWidget.tsx

@@ -94,8 +94,8 @@ function lookupAuthId(
 
   return dependency == null
     ? null
-    : authOptions.find(({ value }) => value === dependency.configId)?.value ??
-        null;
+    : (authOptions.find(({ value }) => value === dependency.configId)?.value ??
+        null);
 }
 
 /**

applications/browser-extension/src/components/fields/schemaFields/widgets/DatabaseCreateModal.tsx

@@ -71,15 +71,14 @@ const initialValues: DatabaseConfig = {
 
 function getOrganizationOptions(organizations: Team[]) {
   const organizationOptions = (organizations ?? [])
-    .filter(
-      (organization) =>
-        organization.memberships?.some(
-          (member) =>
-            // If the current user is an admin of the organization, then all of the members are listed for the organization
-            // Otherwise, only the current user is listed for the organization
-            // So if any listed member is an admin, the current user is an admin
-            member.role === UserRole.admin,
-        ),
+    .filter((organization) =>
+      organization.memberships?.some(
+        (member) =>
+          // If the current user is an admin of the organization, then all of the members are listed for the organization
+          // Otherwise, only the current user is listed for the organization
+          // So if any listed member is an admin, the current user is an admin
+          member.role === UserRole.admin,
+      ),
     )
     .map((organization) => ({
       label: organization.teamName,

applications/browser-extension/src/components/fields/schemaFields/widgets/DatabaseWidget.tsx

@@ -49,7 +49,9 @@ const DatabaseWidget: React.FunctionComponent<SchemaFieldProps> = ({
   // eslint-disable-next-line react-hooks/exhaustive-deps -- only run on mount
   const initialFieldValue = useMemo(() => fieldValue, []);
   const fullDatabaseOptions = useMemo(() => {
-    const loadedOptions = isLoadingDatabaseOptions ? [] : databaseOptions ?? [];
+    const loadedOptions = isLoadingDatabaseOptions
+      ? []
+      : (databaseOptions ?? []);
 
     // If the schema format is 'preview', and the initial field value is a string, use that string
     // as the auto-created database name, and add it as an option to the database dropdown at the

applications/browser-extension/src/components/fields/schemaFields/widgets/ObjectWidget.tsx

@@ -121,8 +121,8 @@ const ObjectFieldRow: React.FunctionComponent<RowProps> = ({
     // As of v3, we allow object props of any type, not just string
     const defaultSchema: Schema = {};
     const rawSchema = defined
-      ? parentSchema.properties?.[property] ?? defaultSchema
-      : parentSchema.additionalProperties ?? defaultSchema;
+      ? (parentSchema.properties?.[property] ?? defaultSchema)
+      : (parentSchema.additionalProperties ?? defaultSchema);
 
     return typeof rawSchema === "boolean" ? defaultSchema : rawSchema;
   }, [

applications/browser-extension/src/components/fields/schemaFields/widgets/varPopup/SourceLabel.tsx

@@ -41,8 +41,9 @@ const SourceLabel: React.FunctionComponent<SourceLabelProps> = ({
     }
 
     default: {
-      const brickConfig = nodes.find((node) => node.path === source)
-        ?.blockConfig;
+      const brickConfig = nodes.find(
+        (node) => node.path === source,
+      )?.blockConfig;
       if (brickConfig == null) {
         label = source;
       } else {

applications/browser-extension/src/components/form/widgets/RemoteMultiSelectWidget.tsx

@@ -90,8 +90,8 @@ const RemoteMultiSelectWidget = <TOption extends Option<TOption["value"]>>({
     } as ChangeEvent<MultiSelectLike<TOption>>);
   };
 
-  const selectedOptions = options.filter(
-    (option: Option) => value?.includes(option.value),
+  const selectedOptions = options.filter((option: Option) =>
+    value?.includes(option.value),
   );
 
   return (

applications/browser-extension/src/extensionConsole/pages/packageEditor/useSubmitPackage.ts

@@ -118,9 +118,10 @@ function useSubmitPackage({ create = false }: SubmitOptions): SubmitCallbacks {
       const { kind, metadata } = unsavedPackageJson;
 
       try {
-        const data = await (create
-          ? createPackage({ ...values, kind })
-          : updatePackage({ ...values, kind })
+        const data = await (
+          create
+            ? createPackage({ ...values, kind })
+            : updatePackage({ ...values, kind })
         ).unwrap();
 
         // We attach the handler below, and don't want it to block the save

applications/browser-extension/src/pageEditor/store/runtime/runtimeSelectors.ts

@@ -38,7 +38,7 @@ export const selectActiveModComponentTraces: EditorSelector<TraceRecord[]> =
     (activeModComponentId, modComponentTraces) =>
       activeModComponentId
         ? // eslint-disable-next-line security/detect-object-injection -- UUID
-          modComponentTraces[activeModComponentId] ?? []
+          (modComponentTraces[activeModComponentId] ?? [])
         : [],
   );
 

applications/browser-extension/src/store/sidebar/sidebarSlice.ts

@@ -203,7 +203,7 @@ const sidebarSlice = createSlice({
             -- Immer Draft<T> type resolution can't handle JsonObject (recursive) types properly
             See: https://github.com/immerjs/immer/issues/839 */
             // @ts-ignore-error -- SidebarEntries.panels --> PanelEntry.actions --> PanelButton.detail is JsonObject
-            initialEventKey ?? defaultEventKey(state, state.closedTabs);
+            (initialEventKey ?? defaultEventKey(state, state.closedTabs));
     },
     selectTab(state, action: PayloadAction<string>) {
       // We were seeing some automatic calls to selectTab with a stale event key...

applications/browser-extension/src/testUtils/permissionsMock.ts

@@ -75,14 +75,12 @@ browser.permissions = {
   remove: jest
     .fn()
     .mockImplementation(async (toRemove: Permissions.AnyPermissions) => {
-      remove(
-        extensionPermissions.permissions,
-        (permission) => toRemove.permissions?.includes(permission),
+      remove(extensionPermissions.permissions, (permission) =>
+        toRemove.permissions?.includes(permission),
       );
       // XXX: only handles exact matches
-      remove(
-        extensionPermissions.origins,
-        (permission) => toRemove.origins?.includes(permission),
+      remove(extensionPermissions.origins, (permission) =>
+        toRemove.origins?.includes(permission),
       );
 
       for (const listener of removeListeners) {

package.json

@@ -25,9 +25,9 @@
     "npm": "10.5.0"
   },
   "devDependencies": {
-    "knip": "^5.36.7",
-    "prettier": "3.1.0",
     "@sindresorhus/tsconfig": "^6.0.0",
-    "nx": "20.1.0"
+    "knip": "^5.36.7",
+    "nx": "20.1.0",
+    "prettier": "3.3.3"
   }
 }