Fix the warning reported by the Pretteir and ESLint.

.eslintrc.json

@@ -21,7 +21,13 @@
     "prettier/react"
   ],
   "rules": {
-    "prettier/prettier": "warn",
+    "prettier/prettier": [
+      "warn",
+      {},
+      {
+        "usePrettierrc": true
+      }
+    ],
     "no-unused-vars": "warn",
     "react/prop-types": "warn"
   },

src/actions/actions.ts

@@ -137,7 +137,7 @@ export const KeydiffActions = {
 };
 
 const NotifyType = ['success', 'warning', 'error', 'info'] as const;
-export type NotificationType = typeof NotifyType[number];
+export type NotificationType = (typeof NotifyType)[number];
 export type NotificationItem = {
   key: string;
   type: NotificationType;
@@ -361,8 +361,8 @@ export const AppActions = {
 };
 
 type ActionTypes = ReturnType<
-  | typeof AppActions[keyof typeof AppActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
+  | (typeof AppActions)[keyof typeof AppActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,

src/actions/catalog.action.ts

@@ -145,10 +145,10 @@ export const CatalogKeyboardActions = {
 };
 
 type ActionTypes = ReturnType<
-  | typeof CatalogKeyboardActions[keyof typeof CatalogKeyboardActions]
-  | typeof LayoutOptionsActions[keyof typeof LayoutOptionsActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
-  | typeof AppActions[keyof typeof AppActions]
+  | (typeof CatalogKeyboardActions)[keyof typeof CatalogKeyboardActions]
+  | (typeof LayoutOptionsActions)[keyof typeof LayoutOptionsActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
+  | (typeof AppActions)[keyof typeof AppActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,
@@ -326,9 +326,10 @@ export const catalogActionsThunk = {
     ) => {
       dispatch(StorageActions.updateFirmwareBuildingTasks([]));
       const { storage } = getState();
-      const result = await storage.instance!.fetchFirmwareBuildingTasks(
-        keyboardDefinitionId
-      );
+      const result =
+        await storage.instance!.fetchFirmwareBuildingTasks(
+          keyboardDefinitionId
+        );
       if (isError(result)) {
         dispatch(NotificationActions.addError(result.error!, result.cause));
         return;

src/actions/firmware.action.ts

@@ -120,9 +120,9 @@ export const FlashFirmwareDialogActions = {
 };
 
 type ActionTypes = ReturnType<
-  | typeof LayoutOptionsActions[keyof typeof LayoutOptionsActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
-  | typeof AppActions[keyof typeof AppActions]
+  | (typeof LayoutOptionsActions)[keyof typeof LayoutOptionsActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
+  | (typeof AppActions)[keyof typeof AppActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,

src/actions/hid.action.ts

@@ -129,10 +129,10 @@ export const HidActions = {
 };
 
 type ActionTypes = ReturnType<
-  | typeof HidActions[keyof typeof HidActions]
-  | typeof KeymapActions[keyof typeof KeymapActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
-  | typeof AppActions[keyof typeof AppActions]
+  | (typeof HidActions)[keyof typeof HidActions]
+  | (typeof KeymapActions)[keyof typeof KeymapActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
+  | (typeof AppActions)[keyof typeof AppActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,
@@ -400,9 +400,8 @@ export const hidActionsThunk = {
         return;
       }
       dispatch(HidActions.updateMacroMaxCount(macroMaxCountResult.count!));
-      const macroBufferBytesResult = await keyboard.fetchMacroBuffer(
-        macroBufferSize
-      );
+      const macroBufferBytesResult =
+        await keyboard.fetchMacroBuffer(macroBufferSize);
       if (!macroBufferBytesResult.success) {
         dispatch(
           NotificationActions.addError(

src/actions/keyboards.actions.ts

@@ -458,7 +458,7 @@ export const KeyboardsEditDefinitionActions = {
 };
 
 type ActionTypes = ReturnType<
-  typeof KeyboardsAppActions[keyof typeof KeyboardsAppActions]
+  (typeof KeyboardsAppActions)[keyof typeof KeyboardsAppActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,

src/actions/macro.action.ts

@@ -54,8 +54,8 @@ export const MacroEditorActions = {
 const M0_KEY_CODE = QK_MACRO_MIN;
 
 type ActionTypes = ReturnType<
-  | typeof MacroEditorActions[keyof typeof MacroEditorActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
+  | (typeof MacroEditorActions)[keyof typeof MacroEditorActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,

src/actions/organizations.actions.ts

@@ -35,10 +35,10 @@ export const OrganizationsEditOrganizationActions = {
 };
 
 type ActionTypes = ReturnType<
-  | typeof OrganizationsAppActions[keyof typeof OrganizationsAppActions]
-  | typeof OrganizationsEditOrganizationActions[keyof typeof OrganizationsEditOrganizationActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
-  | typeof StorageActions[keyof typeof StorageActions]
+  | (typeof OrganizationsAppActions)[keyof typeof OrganizationsAppActions]
+  | (typeof OrganizationsEditOrganizationActions)[keyof typeof OrganizationsEditOrganizationActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
+  | (typeof StorageActions)[keyof typeof StorageActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,

src/actions/storage.action.ts

@@ -174,13 +174,13 @@ export const StorageActions = {
 };
 
 type ActionTypes = ReturnType<
-  | typeof AppActions[keyof typeof AppActions]
-  | typeof KeymapActions[keyof typeof KeymapActions]
-  | typeof KeycodeKeyActions[keyof typeof KeycodeKeyActions]
-  | typeof KeydiffActions[keyof typeof KeydiffActions]
-  | typeof HidActions[keyof typeof HidActions]
-  | typeof NotificationActions[keyof typeof NotificationActions]
-  | typeof StorageActions[keyof typeof StorageActions]
+  | (typeof AppActions)[keyof typeof AppActions]
+  | (typeof KeymapActions)[keyof typeof KeymapActions]
+  | (typeof KeycodeKeyActions)[keyof typeof KeycodeKeyActions]
+  | (typeof KeydiffActions)[keyof typeof KeydiffActions]
+  | (typeof HidActions)[keyof typeof HidActions]
+  | (typeof NotificationActions)[keyof typeof NotificationActions]
+  | (typeof StorageActions)[keyof typeof StorageActions]
 >;
 type ThunkPromiseAction<T> = ThunkAction<
   Promise<T>,
@@ -1040,9 +1040,8 @@ export const storageActionsThunk = {
       getState: () => RootState
     ) => {
       const { storage } = getState();
-      const result = await storage.instance!.createOrUpdateAppliedKeymap(
-        keymapData
-      );
+      const result =
+        await storage.instance!.createOrUpdateAppliedKeymap(keymapData);
       if (isError(result)) {
         console.error(result.cause);
         dispatch(
@@ -1991,9 +1990,8 @@ export const storageActionsThunk = {
       getState: () => RootState
     ) => {
       const { storage } = getState();
-      const result = await storage.instance!.fetchBuiltFirmwareFileBlob(
-        firmwareFilePath
-      );
+      const result =
+        await storage.instance!.fetchBuiltFirmwareFileBlob(firmwareFilePath);
       if (isSuccessful(result)) {
         callback(result.value.blob);
       } else {

src/components/catalog/content/Content.tsx

@@ -138,10 +138,10 @@ const CategoryKeyboardContent: React.FC<CategoryKeyboardContentProps> = ({
       phase === 'keymap'
         ? 1
         : phase === 'firmware'
-        ? 2
-        : phase === 'build'
-        ? 3
-        : 0;
+          ? 2
+          : phase === 'build'
+            ? 3
+            : 0;
     // eslint-disable-next-line no-undef
     const url = `https://remap-keys.app/catalog/${definitionDocument!.id}`;
     return (

src/components/common/flash/FlashButton.tsx

@@ -41,4 +41,4 @@ export default class FlashButton extends React.Component<
 }
 
 const FlashButtonStates = ['disable', 'enable', 'flashing', 'success'] as const;
-export type FlashButtonState = typeof FlashButtonStates[number];
+export type FlashButtonState = (typeof FlashButtonStates)[number];

src/components/configure/header/Header.tsx

@@ -259,7 +259,7 @@ export default class Header extends React.Component<HeaderProps, HeaderState> {
 }
 
 const FlashButtonStates = ['disable', 'enable', 'flashing', 'success'] as const;
-type FlashButtonState = typeof FlashButtonStates[number];
+type FlashButtonState = (typeof FlashButtonStates)[number];
 
 type IInfoDialogButton = {
   keyboardDefinitionDocument: IKeyboardDefinitionDocument | null | undefined;

src/components/configure/keycap/Keycap.tsx

@@ -136,8 +136,8 @@ export default class Keycap extends React.Component<
       ? keySwitchOperation === 'click'
         ? this.props.keymap
         : keySwitchOperation === 'cw'
-        ? this.props.cwKeymap
-        : this.props.ccwKeymap
+          ? this.props.cwKeymap
+          : this.props.ccwKeymap
       : this.props.keymap;
   }
 
@@ -148,8 +148,8 @@ export default class Keycap extends React.Component<
       ? keySwitchOperation === 'click'
         ? this.props.remap
         : keySwitchOperation === 'cw'
-        ? this.props.cwRemap
-        : this.props.ccwRemap
+          ? this.props.cwRemap
+          : this.props.ccwRemap
       : this.props.remap;
   }
 

src/components/configure/keyeventcapture/KeyEventCapture.tsx

@@ -118,14 +118,14 @@ export default class KeyEventCapture extends React.Component<
       e.location == KeyboardEvent.DOM_KEY_LOCATION_LEFT
         ? `l${e.key}`
         : e.location == KeyboardEvent.DOM_KEY_LOCATION_RIGHT
-        ? `r${e.key}`
-        : e.location == KeyboardEvent.DOM_KEY_LOCATION_NUMPAD
-        ? `kp_${e.key}`
-        : e.key === 'Delete'
-        ? `Del`
-        : e.key === ' '
-        ? `Space`
-        : e.key;
+          ? `r${e.key}`
+          : e.location == KeyboardEvent.DOM_KEY_LOCATION_NUMPAD
+            ? `kp_${e.key}`
+            : e.key === 'Delete'
+              ? `Del`
+              : e.key === ' '
+                ? `Space`
+                : e.key;
     keyString = keyString.toLowerCase();
     const keyLabels = KeyLabelLangs.getKeyLabels(this.props.labelLang!);
     let code = keyLabels.find(

src/components/keyboards/editdefinition/EditDefinition.tsx

@@ -280,12 +280,12 @@ export default function EditDefinition(props: EditKeyboardProps) {
                         props.phase === 'edit'
                           ? 0
                           : props.phase === 'catalog'
-                          ? 1
-                          : props.phase === 'firmware'
-                          ? 2
-                          : props.phase === 'build'
-                          ? 3
-                          : 4
+                            ? 1
+                            : props.phase === 'firmware'
+                              ? 2
+                              : props.phase === 'build'
+                                ? 3
+                                : 4
                       }
                       indicatorColor="primary"
                       textColor="primary"
@@ -394,14 +394,14 @@ export default function EditDefinition(props: EditKeyboardProps) {
             {confirmDialogMode === 'upload_json'
               ? 'Are you sure to update the JSON file?'
               : confirmDialogMode === 'save_as_draft'
-              ? 'Are you sure to save this new keyboard as draft?'
-              : confirmDialogMode === 'submit_for_review'
-              ? 'Are you sure to register and submit this new keyboard for review?'
-              : confirmDialogMode === 'delete'
-              ? 'Are you sure to delete?'
-              : confirmDialogMode === 'back_to_draft'
-              ? 'Are you sure to change the status to draft? A review is necessary to publish this keyboard again.'
-              : `Unknown confirmDialogMode: ${confirmDialogMode}`}
+                ? 'Are you sure to save this new keyboard as draft?'
+                : confirmDialogMode === 'submit_for_review'
+                  ? 'Are you sure to register and submit this new keyboard for review?'
+                  : confirmDialogMode === 'delete'
+                    ? 'Are you sure to delete?'
+                    : confirmDialogMode === 'back_to_draft'
+                      ? 'Are you sure to change the status to draft? A review is necessary to publish this keyboard again.'
+                      : `Unknown confirmDialogMode: ${confirmDialogMode}`}
           </DialogContentText>
         </DialogContent>
         <DialogActions>

src/components/keyboards/editdefinition/definitionform/DefinitionForm.tsx

@@ -456,10 +456,10 @@ function FirmwareCodePlaceField(props: FirmwareCodePlaceFieldProps) {
       props.firmwareCodePlace === FirmwareCodePlace.qmk
         ? 'GitHub: qmk/qmk_firmware'
         : props.firmwareCodePlace === FirmwareCodePlace.forked
-        ? 'GitHub: Your forked repository from qmk/qmk_firmware'
-        : props.firmwareCodePlace === FirmwareCodePlace.other
-        ? 'Other'
-        : 'Unknown';
+          ? 'GitHub: Your forked repository from qmk/qmk_firmware'
+          : props.firmwareCodePlace === FirmwareCodePlace.other
+            ? 'Other'
+            : 'Unknown';
     return (
       <div className="edit-definition-form-row">
         <TextField

src/services/firmware/Command.ts

@@ -19,7 +19,7 @@ export interface ICommandResponseHandler<T extends ICommandResponse> {
 
 export abstract class AbstractCommand<
   TRequest extends ICommandRequest,
-  TResponse extends ICommandResponse
+  TResponse extends ICommandResponse,
 > {
   private readonly request: TRequest | undefined;
 

src/services/firmware/caterina/CaterinaBootloader.ts

@@ -226,9 +226,8 @@ export class CaterinaBootloader implements IBootloader {
     mcu?: IMcu;
   }> {
     progress('Initialize a bootloader.');
-    const detectResult = await this.fetchAndCheckBootloaderInformation(
-      progress
-    );
+    const detectResult =
+      await this.fetchAndCheckBootloaderInformation(progress);
     if (!detectResult.success) {
       progress('Caterina bootloader is not detected.');
       return detectResult;

src/services/firmware/caterina/CaterinaCommands.ts

@@ -6,7 +6,7 @@ import { concatUint8Array } from '../../../utils/ArrayUtils';
 
 abstract class AbstractCaterinaCommand<
   TRequest extends ICommandRequest,
-  TResponse extends ICommandResponse
+  TResponse extends ICommandResponse,
 > extends AbstractCommand<TRequest, TResponse> {
   protected async verify(serial: ISerial): Promise<IResult> {
     const readResult = await serial.readBytes(1, this.getVerifyTimeout());

src/services/firmware/dfu/AbstractDfuBootloader.ts

@@ -42,7 +42,7 @@ export abstract class AbstractDfuBootloader implements IBootloader {
   abstract isSupportedDevice(): boolean;
 
   abstract read(
-  // eslint-disable-next-line no-unused-vars
+    // eslint-disable-next-line no-unused-vars
     size: number,
     // eslint-disable-next-line no-unused-vars
     progress: FirmwareWriterProgressListener,
@@ -51,7 +51,7 @@ export abstract class AbstractDfuBootloader implements IBootloader {
   ): Promise<IBootloaderReadResult>;
 
   abstract verify(
-  // eslint-disable-next-line no-unused-vars
+    // eslint-disable-next-line no-unused-vars
     bytes: Uint8Array,
     // eslint-disable-next-line no-unused-vars
     progress: FirmwareWriterProgressListener,
@@ -60,7 +60,7 @@ export abstract class AbstractDfuBootloader implements IBootloader {
   ): Promise<IResult>;
 
   abstract write(
-  // eslint-disable-next-line no-unused-vars
+    // eslint-disable-next-line no-unused-vars
     flashBytes: Uint8Array,
     // eslint-disable-next-line no-unused-vars
     eepromBytes: Uint8Array | null,

src/services/hid/Commands.ts

@@ -9,7 +9,7 @@ import { ObjectValueListType } from '../../utils/ObjectUtils';
 
 export abstract class AbstractCommand<
   TRequest extends ICommandRequest,
-  TResponse extends ICommandResponse
+  TResponse extends ICommandResponse,
 > implements ICommand
 {
   private readonly request: TRequest;

src/services/hid/Hid.ts

@@ -91,7 +91,7 @@ export const EncoderDirections = {
   counterclockwise: 'counterclockwise',
 } as const;
 export type IEncoderDirection =
-  typeof EncoderDirections[keyof typeof EncoderDirections];
+  (typeof EncoderDirections)[keyof typeof EncoderDirections];
 
 export type IEncoderKeymap = {
   clockwise: IKeymap;