From 30ec5decde971cdc78eac040a99a99241416a1c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Magalh=C3=A3es?= Date: Tue, 27 Aug 2024 18:16:59 +0100 Subject: [PATCH] chore: better imports structure Made use of eslint and prettier plugins to format imports in the code and make it more readable. --- frontends/web/.eslintrc.js | 16 +++++++++- frontends/web/.prettierrc | 1 + frontends/web/index.ts | 1 + frontends/web/package.json | 2 ++ .../react/components/audio-gb/audio-gb.tsx | 5 ++-- .../web/react/components/debug/debug.tsx | 5 ++-- .../components/registers-gb/registers-gb.tsx | 1 + .../serial-section/serial-section.tsx | 3 +- .../components/test-section/test-section.tsx | 2 +- .../react/components/tiles-gb/tiles-gb.tsx | 2 +- frontends/web/ts/gb.ts | 29 ++++++++++--------- 11 files changed, 45 insertions(+), 22 deletions(-) diff --git a/frontends/web/.eslintrc.js b/frontends/web/.eslintrc.js index cfb72711..3fe69aa7 100644 --- a/frontends/web/.eslintrc.js +++ b/frontends/web/.eslintrc.js @@ -2,10 +2,24 @@ module.exports = { extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"], parser: "@typescript-eslint/parser", - plugins: ["@typescript-eslint", "react-hooks"], + plugins: ["@typescript-eslint", "react-hooks", "import"], rules: { "react-hooks/rules-of-hooks": "error", "react-hooks/exhaustive-deps": "warn", + "import/order": [ + "error", + { + groups: [ + "builtin", + "external", + "internal", + "parent", + "sibling", + "index" + ], + "newlines-between": "always" + } + ], "no-constant-condition": [ "error", { diff --git a/frontends/web/.prettierrc b/frontends/web/.prettierrc index 6afb0378..51eac517 100644 --- a/frontends/web/.prettierrc +++ b/frontends/web/.prettierrc @@ -1,4 +1,5 @@ { + "plugins": ["prettier-plugin-organize-imports"], "semi": true, "trailingComma": "none", "singleQuote": false, diff --git a/frontends/web/index.ts b/frontends/web/index.ts index 9817cda7..013103b1 100644 --- a/frontends/web/index.ts +++ b/frontends/web/index.ts @@ -1,4 +1,5 @@ import { startApp } from "emukit"; + import { GameboyEmulator } from "./ts"; const BACKGROUNDS = [ diff --git a/frontends/web/package.json b/frontends/web/package.json index 0a4b78eb..ff6ff355 100644 --- a/frontends/web/package.json +++ b/frontends/web/package.json @@ -26,11 +26,13 @@ "buffer": "^6.0.3", "emukit": "^0.10.9", "eslint": "^8.57.0", + "eslint-plugin-import": "^2.29.1", "eslint-plugin-react-hooks": "^4.6.2", "jszip": "^3.10.1", "nodemon": "^3.1.4", "parcel": "^2.12.0", "prettier": "^3.3.3", + "prettier-plugin-organize-imports": "^4.0.0", "process": "^0.11.10", "react": "^18.3.1", "react-dom": "^18.3.1", diff --git a/frontends/web/react/components/audio-gb/audio-gb.tsx b/frontends/web/react/components/audio-gb/audio-gb.tsx index 5d9bbd02..f46ecd1e 100644 --- a/frontends/web/react/components/audio-gb/audio-gb.tsx +++ b/frontends/web/react/components/audio-gb/audio-gb.tsx @@ -1,3 +1,4 @@ +import { Canvas, CanvasStructure, PixelFormat } from "emukit"; import React, { FC, useCallback, @@ -6,8 +7,8 @@ import React, { useRef, useState } from "react"; -import { Canvas, CanvasStructure, PixelFormat } from "emukit"; -import { WebglPlot, WebglLine, ColorRGBA } from "webgl-plot"; +import { ColorRGBA, WebglLine, WebglPlot } from "webgl-plot"; + import { GameboyEmulator } from "../../../ts"; import "./audio-gb.css"; diff --git a/frontends/web/react/components/debug/debug.tsx b/frontends/web/react/components/debug/debug.tsx index f37ae556..864c7108 100644 --- a/frontends/web/react/components/debug/debug.tsx +++ b/frontends/web/react/components/debug/debug.tsx @@ -1,9 +1,10 @@ -import React, { FC, useCallback, useEffect, useState } from "react"; import { ButtonSwitch, Info, Pair } from "emukit"; +import React, { FC, useCallback, useEffect, useState } from "react"; + +import { GameboyEmulator } from "../../../ts"; import { AudioGB } from "../audio-gb/audio-gb"; import { RegistersGB } from "../registers-gb/registers-gb"; import { TilesGB } from "../tiles-gb/tiles-gb"; -import { GameboyEmulator } from "../../../ts"; import "./debug.css"; diff --git a/frontends/web/react/components/registers-gb/registers-gb.tsx b/frontends/web/react/components/registers-gb/registers-gb.tsx index 21f2f5b9..a8945e96 100644 --- a/frontends/web/react/components/registers-gb/registers-gb.tsx +++ b/frontends/web/react/components/registers-gb/registers-gb.tsx @@ -1,4 +1,5 @@ import React, { FC, useEffect, useMemo, useState } from "react"; + import { GameBoySpeed } from "../../../lib/boytacean"; import "./registers-gb.css"; diff --git a/frontends/web/react/components/serial-section/serial-section.tsx b/frontends/web/react/components/serial-section/serial-section.tsx index 47bfdc43..1b13450c 100644 --- a/frontends/web/react/components/serial-section/serial-section.tsx +++ b/frontends/web/react/components/serial-section/serial-section.tsx @@ -1,5 +1,6 @@ -import React, { FC, useEffect, useMemo, useRef, useState } from "react"; import { ButtonSwitch, Emulator, Info, Pair, PanelTab } from "emukit"; +import React, { FC, useEffect, useMemo, useRef, useState } from "react"; + import { GameboyEmulator, SerialDevice, bufferToDataUrl } from "../../../ts"; import "./serial-section.css"; diff --git a/frontends/web/react/components/test-section/test-section.tsx b/frontends/web/react/components/test-section/test-section.tsx index 8474eacf..f6cae3d8 100644 --- a/frontends/web/react/components/test-section/test-section.tsx +++ b/frontends/web/react/components/test-section/test-section.tsx @@ -1,5 +1,5 @@ -import React, { FC, useMemo } from "react"; import { TextInput } from "emukit"; +import React, { FC, useMemo } from "react"; import "./test-section.css"; diff --git a/frontends/web/react/components/tiles-gb/tiles-gb.tsx b/frontends/web/react/components/tiles-gb/tiles-gb.tsx index 78d10a58..260327c3 100644 --- a/frontends/web/react/components/tiles-gb/tiles-gb.tsx +++ b/frontends/web/react/components/tiles-gb/tiles-gb.tsx @@ -1,5 +1,5 @@ -import React, { FC, useCallback, useEffect, useMemo, useRef } from "react"; import { Canvas, CanvasStructure, PixelFormat } from "emukit"; +import React, { FC, useCallback, useEffect, useMemo, useRef } from "react"; import "./tiles-gb.css"; diff --git a/frontends/web/ts/gb.ts b/frontends/web/ts/gb.ts index 99c7daa0..688ef9e5 100644 --- a/frontends/web/ts/gb.ts +++ b/frontends/web/ts/gb.ts @@ -1,4 +1,3 @@ -import { loadAsync } from "jszip"; import { AudioSpecs, base64ToBuffer, @@ -20,29 +19,31 @@ import { SectionInfo, Size } from "emukit"; -import { PALETTES, PALETTES_MAP } from "./palettes"; -import { - DebugAudio, - DebugGeneral, - DebugSettings, - HelpFaqs, - HelpKeyboard, - SerialSection, - TestSection -} from "../react"; +import { loadAsync } from "jszip"; import { - Cartridge, default as _wasm, + Cartridge, + ClockFrame, GameBoy, GameBoyMode, GameBoySpeed, Info, PadKey, - StateManager, - ClockFrame + StateManager } from "../lib/boytacean"; import info from "../package.json"; +import { + DebugAudio, + DebugGeneral, + DebugSettings, + HelpFaqs, + HelpKeyboard, + SerialSection, + TestSection +} from "../react"; + +import { PALETTES, PALETTES_MAP } from "./palettes"; // eslint-disable-next-line @typescript-eslint/no-explicit-any declare const require: any;