Bump prettier and pretty-quick

.stylelintrc

@@ -30,15 +30,6 @@
         ],
       }
     ],
-    "block-closing-brace-newline-after": [
-      "always",
-      {
-        "ignoreAtRules": [
-          "if",
-          "else"
-        ],
-      }
-    ],
     "color-function-notation": null,
     "declaration-colon-newline-after": null,
     "function-disallowed-list": [
@@ -68,6 +59,7 @@
         ]
       }
     ],
+    "scss/dollar-variable-colon-space-after": "always-single-line",
     "scss/dollar-variable-pattern": null,
     "scss/no-global-function-names": null,
     "selector-class-pattern": "^([a-zA-Z][a-zA-Z0-9]*)([-[a-zA-Z0-9]+|--[a-zA-Z0-9]+])*$",
@@ -77,4 +69,4 @@
     "value-list-comma-newline-after": null,
     "selector-not-notation": "simple"
   }
-}
+}

bin/regenerate_font.js

@@ -13,7 +13,7 @@ function getUnicodeRangeFromFile(file) {
 }
 
 function regenerateFonts() {
-  import('characterset').then((characterset) => {
+  import('characterset').then(async (characterset) => {
 
     const CharacterSet = characterset.default;
 
@@ -90,12 +90,12 @@ function regenerateFonts() {
   unicode-range: ${characterSetFromFile.toHexRangeString()};
 }
 `;
-  const runPrettierWithConfig = (text) => {
-    const filePath = prettier.resolveConfigFile.sync();
-    const options = prettier.resolveConfig.sync(filePath);
+  const runPrettierWithConfig = async (text) => {
+    const filePath = await prettier.resolveConfigFile();
+    const options = await prettier.resolveConfig(filePath);
     return prettier.format(text, { ...options, parser: 'scss' });
   };
-  fs.writeFileSync(`src/fonts/${cssFile}`, runPrettierWithConfig(cssContents));
+  fs.writeFileSync(`src/fonts/${cssFile}`, await runPrettierWithConfig(cssContents));
 
   console.info('Generating html...');
   const htmlContents = `<meta charset="utf-8" /><style>

docs/experiments.md

@@ -7,11 +7,9 @@ AMO has the ability to run experiments, automatically dividing users into branch
 The following are the steps to add an experiment to AMO:
 
 1. Create a config file for the experiment in `amo/experiments`.
-
    - The file should be named with the `experimentId`, e.g., `20210714_amo_vpn_promo.js`.
    - `experimentId` must be in the format `YYYYMMDD_amo_experimentName`. We generally use the date that the code was written for the YYYYMMDD portion.
    - The config file should export a `EXPERIMENT_CONFIG` variable, which is an object containing:
-
      - `id`, which is the same as the `experimentId`, above.
      - `variants`, which is an array of possible branches to which a user might be assigned. Each item in this array is an object with an `id` (which ends up being the experiment branch/variation) and a `percentage`, which is used to automatically allocate users to branches, and is expressed as number less than 1 (e.g., `0.5` means 50%). The sum total of all `percentage`s in the array must equal `1` or an error will be thrown. There is a special variant, `NOT_IN_EXPERIMENT`, which can be imported from `amo/withExperiment`, and any users allocated to that branch will be treated as not being enrolled in the experiment.
      - optionally a `shouldExcludeUser` function, which accepts a single object argument `{ state }` and returns a boolean. If this function returns `true` then the user will be excluded from the experiment. If this property is missing, then no users will be excluded.
@@ -59,7 +57,6 @@ The following are the steps to add an experiment to AMO:
    The example `shouldExcludeUser` function returns the result of the internal `shouldExcludeUser` function, which uses `clientApp` and `regionCode` from `state.api` to exclude users on the `android` site, as well as any users with a region other than `US`, `DE` or `FR`.
 
 2. Update AMO's config to enable the experiment.
-
    - The default config file, `config/default.js`, contains an `experiments` property, which lists existing experiments along with their current enabled status. To enable an experiment, add it to the `experiments` object, using the `experimentId` as the key, and set the value to `true`. For example:
 
    ```js

docs/moz-addon-manager.md

@@ -59,7 +59,6 @@ It is possible to serve the local development version of this project with HTTPS
    ```
 
 4. In a custom Firefox profile, go to `about:config`, accept the risk, and set these prefs. Afterwards, restart Firefox for them to take effect.
-
    - set `extensions.webapi.testing` to `true` [to turn on `mozAddonManager`](#turning-on-mozaddonmanager-in--dev-and--stage-environments)
    - set `xpinstall.signatures.dev-root` to `true` [to install add-ons](#install-add-ons-in--dev-and--stage-environments)
 

package.json

@@ -305,8 +305,8 @@
     "po2json": "mikeedwards/po2json#51e2310485bbe35e9e57f2eee238185459ca0eab",
     "postcss": "^8.5.6",
     "postcss-loader": "^8.2.0",
-    "prettier": "2.8.8",
-    "pretty-quick": "3.3.1",
+    "prettier": "3.6.2",
+    "pretty-quick": "4.2.2",
     "react-hot-loader": "^4.13.1",
     "redux-saga-tester": "^1.0.372",
     "rimraf": "^6.0.1",

src/amo/components/AMInstallButton/index.js

@@ -253,8 +253,7 @@ export class AMInstallButtonBase extends React.Component<InternalProps> {
   }
 }
 
-const AMInstallButton: React.ComponentType<Props> = compose(translate())(
-  AMInstallButtonBase,
-);
+const AMInstallButton: React.ComponentType<Props> =
+  compose(translate())(AMInstallButtonBase);
 
 export default AMInstallButton;

src/amo/components/AddonAdminLinks/index.js

@@ -110,8 +110,7 @@ export class AddonAdminLinksBase extends React.Component<InternalProps> {
   }
 }
 
-const AddonAdminLinks: React.ComponentType<Props> = compose(translate())(
-  AddonAdminLinksBase,
-);
+const AddonAdminLinks: React.ComponentType<Props> =
+  compose(translate())(AddonAdminLinksBase);
 
 export default AddonAdminLinks;

src/amo/components/Button/styles.scss

@@ -25,7 +25,9 @@ $micro-font-size: $font-size-xs;
   margin: 0;
   padding: 0 8px;
   text-decoration: none;
-  transition-duration: all $transition-long, padding $transition-short;
+  transition-duration:
+    all $transition-long,
+    padding $transition-short;
   transition-property: background-color border-color color;
   transition-timing-function: $easing-curve;
 

src/amo/components/ContributeCard/index.js

@@ -121,8 +121,7 @@ export const ContributeCardBase = ({
   );
 };
 
-const ContributeCard: React.ComponentType<Props> = compose(translate())(
-  ContributeCardBase,
-);
+const ContributeCard: React.ComponentType<Props> =
+  compose(translate())(ContributeCardBase);
 
 export default ContributeCard;

src/amo/components/Errors/NotAuthorized/index.js

@@ -48,8 +48,7 @@ export class NotAuthorizedBase extends React.Component<InternalProps> {
   }
 }
 
-const NotAuthorized: React.ComponentType<Props> = compose(translate())(
-  NotAuthorizedBase,
-);
+const NotAuthorized: React.ComponentType<Props> =
+  compose(translate())(NotAuthorizedBase);
 
 export default NotAuthorized;

src/amo/components/Errors/ServerError/index.js

@@ -44,8 +44,7 @@ export class ServerErrorBase extends React.Component<InternalProps> {
   }
 }
 
-const ServerError: React.ComponentType<Props> = compose(translate())(
-  ServerErrorBase,
-);
+const ServerError: React.ComponentType<Props> =
+  compose(translate())(ServerErrorBase);
 
 export default ServerError;

src/amo/components/HostPermissions/index.js

@@ -151,8 +151,7 @@ export class HostPermissionsBase extends React.Component<InternalProps> {
   }
 }
 
-const HostPermissions: React.ComponentType<Props> = compose(translate())(
-  HostPermissionsBase,
-);
+const HostPermissions: React.ComponentType<Props> =
+  compose(translate())(HostPermissionsBase);
 
 export default HostPermissions;

src/amo/components/PermissionsCard/index.js

@@ -145,8 +145,7 @@ export class PermissionsCardBase extends React.Component<InternalProps> {
   }
 }
 
-const PermissionsCard: React.ComponentType<Props> = compose(translate())(
-  PermissionsCardBase,
-);
+const PermissionsCard: React.ComponentType<Props> =
+  compose(translate())(PermissionsCardBase);
 
 export default PermissionsCard;

src/amo/components/SearchResults/index.js

@@ -81,8 +81,7 @@ export class SearchResultsBase extends React.Component<InternalProps> {
   }
 }
 
-const SearchResults: React.ComponentType<Props> = compose(translate())(
-  SearchResultsBase,
-);
+const SearchResults: React.ComponentType<Props> =
+  compose(translate())(SearchResultsBase);
 
 export default SearchResults;

src/amo/components/SectionLinks/styles.scss

@@ -37,7 +37,8 @@
     display: block;
     height: 3px;
     margin: auto;
-    transition: width $transition-short ease,
+    transition:
+      width $transition-short ease,
       background-color $transition-short ease;
     width: 0;
   }

src/amo/components/SignedInUser/index.js

@@ -35,8 +35,7 @@ const SignedInUserBase = (props: InternalProps) => (
   </div>
 );
 
-const SignedInUser: React.ComponentType<Props> = compose(translate())(
-  SignedInUserBase,
-);
+const SignedInUser: React.ComponentType<Props> =
+  compose(translate())(SignedInUserBase);
 
 export default SignedInUser;

src/amo/components/UserCollection/index.js

@@ -64,8 +64,7 @@ export const UserCollectionBase = (props: InternalProps): React.Node => {
   );
 };
 
-const UserCollection: React.ComponentType<Props> = compose(translate())(
-  UserCollectionBase,
-);
+const UserCollection: React.ComponentType<Props> =
+  compose(translate())(UserCollectionBase);
 
 export default UserCollection;

src/amo/components/UserReview/index.js

@@ -109,8 +109,7 @@ export const UserReviewBase = (props: InternalProps): React.Node => {
   );
 };
 
-const UserReview: React.ComponentType<Props> = compose(translate())(
-  UserReviewBase,
-);
+const UserReview: React.ComponentType<Props> =
+  compose(translate())(UserReviewBase);
 
 export default UserReview;

src/amo/components/VPNPromoBanner/styles.scss

@@ -31,7 +31,9 @@ $cta-alternate-color: #f9f7fd;
     padding: 0.5rem 1rem;
     position: relative;
     text-decoration: none;
-    transition: background-color 0.15s ease, color 0.15s ease;
+    transition:
+      background-color 0.15s ease,
+      color 0.15s ease;
   }
 
   a:hover,

src/amo/css/inc/mixins.scss

@@ -56,7 +56,9 @@
 /* Shared mixins. Bear in mind changes here impact *all* apps. */
 
 @mixin focus() {
-  box-shadow: 0 0 0 1px $blue-50 inset, 0 0 0 1px $blue-50,
+  box-shadow:
+    0 0 0 1px $blue-50 inset,
+    0 0 0 1px $blue-50,
     0 0 0 4px transparentize($blue-50, 0.7);
   outline: none;
 }

src/amo/css/inc/vars.scss

@@ -118,5 +118,6 @@ $header-text-not-active-color: transparentize($white, 0.5);
 // Category Colors
 // There are currently 12 colors and this number must be kept in sync with
 // `src/amo/components/Categories/index.js`.
-$category-colors: $teal-70, $red-60, $magenta-60, $orange-60, $blue-50,
-  $green-70, $magenta-70, $red-50, $purple-40, $orange-70, $blue-60, $yellow-70;
+$category-colors:
+  $teal-70, $red-60, $magenta-60, $orange-60, $blue-50, $green-70, $magenta-70,
+  $red-50, $purple-40, $orange-70, $blue-60, $yellow-70;

src/amo/errorHandler.js

@@ -2,12 +2,12 @@ import * as React from 'react';
 import { compose } from 'redux';
 import { connect } from 'react-redux';
 import { oneLine } from 'common-tags';
+import PropTypes from 'prop-types';
 
 import log from 'amo/logger';
 import { normalizeFileNameId } from 'amo/utils';
 import ErrorList from 'amo/components/ErrorList';
 import { clearError, setError, setErrorMessage } from 'amo/reducers/errors';
-import type { ErrorHandlerType } from 'amo/types/errorHandler';
 
 function generateHandlerId({ name = '' } = {}) {
   return `${name}-${Math.random().toString(36).substr(2, 9)}`;
@@ -222,12 +222,8 @@ export const withFixedErrorHandler = ({ fileName, extractId }) => {
  * )(SomeComponent);
  */
 export function withRenderedErrorHandler({ name, id } = {}) {
-  type ErrorBannerProps = {|
-    errorHandler: ErrorHandlerType,
-  |};
-
   return (WrappedComponent) => {
-    function ErrorBanner(props: ErrorBannerProps) {
+    function ErrorBanner(props) {
       const { errorHandler } = props;
 
       if (errorHandler.hasError()) {
@@ -242,6 +238,10 @@ export function withRenderedErrorHandler({ name, id } = {}) {
       return <WrappedComponent {...props} />;
     }
 
+    ErrorBanner.propTypes = {
+      errorHandler: PropTypes.object.isRequired,
+    };
+
     return compose(withErrorHandler({ name, id }))(ErrorBanner);
   };
 }

src/fonts/inter-subset.scss

@@ -6,10 +6,11 @@
   font-weight: 300 600; /* We only need those weights */
   src: url('woff2/Inter-roman-subset-en_de_fr_ru_es_pt_pl_it.var.woff2')
     format('woff2');
-  unicode-range: U+20-7E, U+A0, U+A1, U+A3, U+A7, U+A9, U+AB, U+AE, U+B0-B5,
-    U+BB, U+BF-C4, U+C6-CF, U+D1-D7, U+D9-DC, U+DF-E4, U+E6-EF, U+F1-F7, U+F9-FD,
-    U+FF, U+104-107, U+10D, U+118, U+119, U+11B, U+141-144, U+152, U+153,
-    U+159-15B, U+161, U+178-17C, U+17E, U+401, U+410-44F, U+451, U+2010-2015,
-    U+2018-201A, U+201C-201E, U+2024, U+2026, U+202F, U+2032, U+2033, U+2080,
-    U+20AC, U+2122, U+2192, U+2605, U+2665;
+  unicode-range:
+    U+20-7E, U+A0, U+A1, U+A3, U+A7, U+A9, U+AB, U+AE, U+B0-B5, U+BB, U+BF-C4,
+    U+C6-CF, U+D1-D7, U+D9-DC, U+DF-E4, U+E6-EF, U+F1-F7, U+F9-FD, U+FF,
+    U+104-107, U+10D, U+118, U+119, U+11B, U+141-144, U+152, U+153, U+159-15B,
+    U+161, U+178-17C, U+17E, U+401, U+410-44F, U+451, U+2010-2015, U+2018-201A,
+    U+201C-201E, U+2024, U+2026, U+202F, U+2032, U+2033, U+2080, U+20AC, U+2122,
+    U+2192, U+2605, U+2665;
 }

src/fonts/inter.scss

@@ -5,12 +5,13 @@
   font-style: normal;
   font-weight: 300 600; /* We only need those weights */
   src: url('woff2/Inter-roman.var.woff2') format('woff2');
-  unicode-range: U+20-7E, U+A0-148, U+14A-1C3, U+1C5-31E, U+321-362, U+370-377,
-    U+37A-37F, U+384-38A, U+38C, U+38E-3A1, U+3A3-3E1, U+3F0-49D, U+4A0-4FF,
-    U+52F, U+1D43, U+1D47-1D49, U+1D4D, U+1D4F, U+1D50, U+1D52, U+1D56-1D58,
-    U+1D5B, U+1D62-1D65, U+1D9C, U+1DA0, U+1DBB, U+1DBF, U+1E00-1F15,
-    U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D,
-    U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF,
+  unicode-range:
+    U+20-7E, U+A0-148, U+14A-1C3, U+1C5-31E, U+321-362, U+370-377, U+37A-37F,
+    U+384-38A, U+38C, U+38E-3A1, U+3A3-3E1, U+3F0-49D, U+4A0-4FF, U+52F, U+1D43,
+    U+1D47-1D49, U+1D4D, U+1D4F, U+1D50, U+1D52, U+1D56-1D58, U+1D5B,
+    U+1D62-1D65, U+1D9C, U+1DA0, U+1DBB, U+1DBF, U+1E00-1F15, U+1F18-1F1D,
+    U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D,
+    U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF,
     U+1FF2-1FF4, U+1FF6-1FFE, U+2000-200B, U+2010-2027, U+202F-205F, U+2080,
     U+20A0-20BF, U+2100, U+2101, U+2103, U+2105, U+2106, U+2109, U+2113, U+2116,
     U+2117, U+211E-2123, U+2126, U+212A, U+212B, U+212E, U+2132, U+213B, U+214D,

tests/unit/amo/pages/TestAddon.js

@@ -1941,9 +1941,8 @@ describe(__filename, () => {
         renderWithAddon();
 
         expect(screen.getByText('Permissions and data')).toBeInTheDocument();
-        const learnMoreLink = within(getPermissionsCard()).getByText(
-          'Learn more',
-        );
+        const learnMoreLink =
+          within(getPermissionsCard()).getByText('Learn more');
         expect(learnMoreLink).toHaveAttribute(
           'href',
           'https://support.mozilla.org/kb/permission-request-messages-firefox-extensions',

tests/unit/amo/reducers/test_addonsByAuthors.js

@@ -334,10 +334,8 @@ describe(__filename, () => {
       );
 
       expect(state.loadingFor).toMatchObject({
-        [joinAuthorIdsAndAddonType(
-          [randomAuthorId1],
-          ADDON_TYPE_STATIC_THEME,
-        )]: true,
+        [joinAuthorIdsAndAddonType([randomAuthorId1], ADDON_TYPE_STATIC_THEME)]:
+          true,
       });
     });
   });
@@ -515,10 +513,8 @@ describe(__filename, () => {
       );
 
       expect(state.loadingFor).toMatchObject({
-        [joinAuthorIdsAndAddonType(
-          [randomAuthorId1],
-          ADDON_TYPE_STATIC_THEME,
-        )]: false,
+        [joinAuthorIdsAndAddonType([randomAuthorId1], ADDON_TYPE_STATIC_THEME)]:
+          false,
       });
     });
 

tests/unit/amo/test_errorHandler.js

@@ -27,7 +27,7 @@ class SomeComponentBase extends React.Component {
     errorHandler: PropTypes.object,
   };
 
-  handleError: () => void = () => {
+  handleError = () => {
     this.props.errorHandler.handle(new Error());
   };