From ddd199965e79c0c8e333ec0b83cc1d4b214097c5 Mon Sep 17 00:00:00 2001 From: David Dal Busco Date: Mon, 7 Feb 2022 12:27:53 +0100 Subject: [PATCH] build: organize imports in ts and spec files with prettier (#404) # Motivation To ease the review of PR and to improve our DX, automatically organize and sort the `import` # Changes - add [prettier-plugin-organize-imports](https://github.com/simonhaenisch/prettier-plugin-organize-imports) # Note - the plugin does not organize imports in `.svelte` [yet](https://github.com/simonhaenisch/prettier-plugin-organize-imports/issues/39) but will do so in all other files (all `.ts` and `.spec.ts` files) --- frontend/svelte/package-lock.json | 18 ++++++++++++++++++ frontend/svelte/package.json | 1 + frontend/svelte/rollup.config.js | 12 ++++++------ frontend/svelte/scripts/i18n.types.mjs | 4 ++-- frontend/svelte/src/lib/stores/auth.store.ts | 2 +- frontend/svelte/src/lib/stores/i18n.ts | 1 - .../svelte/src/lib/utils/accounts.utils.ts | 2 +- frontend/svelte/src/tests/App.spec.ts | 8 ++++---- .../components/accounts/AccountCard.spec.ts | 4 ++-- .../tests/lib/components/common/Guard.spec.ts | 2 +- .../src/tests/lib/components/ic/ICP.spec.ts | 4 ++-- .../src/tests/lib/components/ui/Toast.spec.ts | 2 +- .../tests/lib/modals/VotingFilterModal.spec.ts | 2 +- .../src/tests/lib/stores/auth.store.spec.ts | 4 ++-- .../src/tests/lib/utils/accounts.utils.spec.ts | 2 +- .../src/tests/lib/utils/auth.utils.spec.ts | 2 +- .../src/tests/lib/utils/route.utils.spec.ts | 2 +- .../src/tests/mocks/accounts.store.mock.ts | 2 +- .../svelte/src/tests/mocks/auth.store.mock.ts | 2 +- .../svelte/src/tests/routes/Accounts.spec.ts | 10 +++++----- .../svelte/src/tests/routes/Neurons.spec.ts | 2 +- .../svelte/src/tests/routes/Proposals.spec.ts | 3 +-- 22 files changed, 54 insertions(+), 37 deletions(-) diff --git a/frontend/svelte/package-lock.json b/frontend/svelte/package-lock.json index bf5223c181d..6ecc80dd133 100644 --- a/frontend/svelte/package-lock.json +++ b/frontend/svelte/package-lock.json @@ -32,6 +32,7 @@ "postcss": "^8.4.5", "postcss-load-config": "^3.1.1", "prettier": "^2.5.0", + "prettier-plugin-organize-imports": "^2.3.4", "prettier-plugin-svelte": "^2.5.0", "rollup": "^2.3.4", "rollup-plugin-css-only": "^3.1.0", @@ -6342,6 +6343,16 @@ "node": ">=10.13.0" } }, + "node_modules/prettier-plugin-organize-imports": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/prettier-plugin-organize-imports/-/prettier-plugin-organize-imports-2.3.4.tgz", + "integrity": "sha512-R8o23sf5iVL/U71h9SFUdhdOEPsi3nm42FD/oDYIZ2PQa4TNWWuWecxln6jlIQzpZTDMUeO1NicJP6lLn2TtRw==", + "dev": true, + "peerDependencies": { + "prettier": ">=2.0", + "typescript": ">=2.9" + } + }, "node_modules/prettier-plugin-svelte": { "version": "2.5.0", "resolved": "https://registry.npmjs.org/prettier-plugin-svelte/-/prettier-plugin-svelte-2.5.0.tgz", @@ -12558,6 +12569,13 @@ "integrity": "sha512-FM/zAKgWTxj40rH03VxzIPdXmj39SwSjwG0heUcNFwI+EMZJnY93yAiKXM3dObIKAM5TA88werc8T/EwhB45eg==", "dev": true }, + "prettier-plugin-organize-imports": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/prettier-plugin-organize-imports/-/prettier-plugin-organize-imports-2.3.4.tgz", + "integrity": "sha512-R8o23sf5iVL/U71h9SFUdhdOEPsi3nm42FD/oDYIZ2PQa4TNWWuWecxln6jlIQzpZTDMUeO1NicJP6lLn2TtRw==", + "dev": true, + "requires": {} + }, "prettier-plugin-svelte": { "version": "2.5.0", "resolved": "https://registry.npmjs.org/prettier-plugin-svelte/-/prettier-plugin-svelte-2.5.0.tgz", diff --git a/frontend/svelte/package.json b/frontend/svelte/package.json index f102a055ef6..271656c3c58 100644 --- a/frontend/svelte/package.json +++ b/frontend/svelte/package.json @@ -30,6 +30,7 @@ "postcss": "^8.4.5", "postcss-load-config": "^3.1.1", "prettier": "^2.5.0", + "prettier-plugin-organize-imports": "^2.3.4", "prettier-plugin-svelte": "^2.5.0", "rollup": "^2.3.4", "rollup-plugin-css-only": "^3.1.0", diff --git a/frontend/svelte/rollup.config.js b/frontend/svelte/rollup.config.js index 84ccfb040ee..aa8d704f8a4 100644 --- a/frontend/svelte/rollup.config.js +++ b/frontend/svelte/rollup.config.js @@ -1,14 +1,14 @@ -import svelte from "rollup-plugin-svelte"; import commonjs from "@rollup/plugin-commonjs"; +import inject from "@rollup/plugin-inject"; +import json from "@rollup/plugin-json"; import resolve from "@rollup/plugin-node-resolve"; -import livereload from "rollup-plugin-livereload"; -import { terser } from "rollup-plugin-terser"; -import sveltePreprocess from "svelte-preprocess"; import replace from "@rollup/plugin-replace"; import typescript from "@rollup/plugin-typescript"; import css from "rollup-plugin-css-only"; -import inject from "@rollup/plugin-inject"; -import json from "@rollup/plugin-json"; +import livereload from "rollup-plugin-livereload"; +import svelte from "rollup-plugin-svelte"; +import { terser } from "rollup-plugin-terser"; +import sveltePreprocess from "svelte-preprocess"; const production = !process.env.ROLLUP_WATCH; diff --git a/frontend/svelte/scripts/i18n.types.mjs b/frontend/svelte/scripts/i18n.types.mjs index c704ed13e5f..24e9aac6f62 100644 --- a/frontend/svelte/scripts/i18n.types.mjs +++ b/frontend/svelte/scripts/i18n.types.mjs @@ -1,8 +1,8 @@ #!/usr/bin/env node -import en from "../src/lib/i18n/en.json"; -import prettier from "prettier"; import { writeFileSync } from "fs"; +import prettier from "prettier"; +import en from "../src/lib/i18n/en.json"; /** * Generate the TypeScript interfaces from the english translation file. diff --git a/frontend/svelte/src/lib/stores/auth.store.ts b/frontend/svelte/src/lib/stores/auth.store.ts index 3f03e7eb40a..00aeb7c03b1 100644 --- a/frontend/svelte/src/lib/stores/auth.store.ts +++ b/frontend/svelte/src/lib/stores/auth.store.ts @@ -1,6 +1,6 @@ -import { writable } from "svelte/store"; import { AuthClient } from "@dfinity/auth-client"; import type { Principal } from "@dfinity/principal"; +import { writable } from "svelte/store"; export interface AuthStore { principal: Principal | undefined | null; diff --git a/frontend/svelte/src/lib/stores/i18n.ts b/frontend/svelte/src/lib/stores/i18n.ts index 07d012150f1..ac4e576d36e 100644 --- a/frontend/svelte/src/lib/stores/i18n.ts +++ b/frontend/svelte/src/lib/stores/i18n.ts @@ -1,5 +1,4 @@ import { readable } from "svelte/store"; - import en from "../i18n/en.json"; export const i18n = readable({ diff --git a/frontend/svelte/src/lib/utils/accounts.utils.ts b/frontend/svelte/src/lib/utils/accounts.utils.ts index 5d2db3c9217..063b28dd973 100644 --- a/frontend/svelte/src/lib/utils/accounts.utils.ts +++ b/frontend/svelte/src/lib/utils/accounts.utils.ts @@ -1,5 +1,5 @@ -import type { Principal } from "@dfinity/principal"; import { AccountIdentifier, ICP, LedgerCanister } from "@dfinity/nns"; +import type { Principal } from "@dfinity/principal"; import type { AccountsStore } from "../stores/accounts.store"; export const loadAccounts = async ({ diff --git a/frontend/svelte/src/tests/App.spec.ts b/frontend/svelte/src/tests/App.spec.ts index 7854e2f1bbc..fe945104f3c 100644 --- a/frontend/svelte/src/tests/App.spec.ts +++ b/frontend/svelte/src/tests/App.spec.ts @@ -2,16 +2,16 @@ * @jest-environment jsdom */ +import type { Principal } from "@dfinity/principal"; +import { render, waitFor } from "@testing-library/svelte"; +import App from "../App.svelte"; +import { accountsStore } from "../lib/stores/accounts.store"; import { AuthStore, authStore } from "../lib/stores/auth.store"; import { authStoreMock, mockPrincipal, mutableMockAuthStoreSubscribe, } from "./mocks/auth.store.mock"; -import { accountsStore } from "../lib/stores/accounts.store"; -import { render, waitFor } from "@testing-library/svelte"; -import App from "../App.svelte"; -import type { Principal } from "@dfinity/principal"; describe("App", () => { let accountsStoreMock; diff --git a/frontend/svelte/src/tests/lib/components/accounts/AccountCard.spec.ts b/frontend/svelte/src/tests/lib/components/accounts/AccountCard.spec.ts index 21a9b60ed03..0f6969ef1c7 100644 --- a/frontend/svelte/src/tests/lib/components/accounts/AccountCard.spec.ts +++ b/frontend/svelte/src/tests/lib/components/accounts/AccountCard.spec.ts @@ -2,11 +2,11 @@ * @jest-environment jsdom */ -import type { Account } from "../../../../lib/types/account"; -import { mockMainAccount } from "../../../mocks/accounts.store.mock"; import { render } from "@testing-library/svelte"; import AccountCard from "../../../../lib/components/accounts/AccountCard.svelte"; +import type { Account } from "../../../../lib/types/account"; import { formatICP } from "../../../../lib/utils/icp.utils"; +import { mockMainAccount } from "../../../mocks/accounts.store.mock"; describe("AccountCard", () => { const props: { account: Account } = { account: mockMainAccount }; diff --git a/frontend/svelte/src/tests/lib/components/common/Guard.spec.ts b/frontend/svelte/src/tests/lib/components/common/Guard.spec.ts index be244313a5c..fcabb3b61e4 100644 --- a/frontend/svelte/src/tests/lib/components/common/Guard.spec.ts +++ b/frontend/svelte/src/tests/lib/components/common/Guard.spec.ts @@ -2,9 +2,9 @@ * @jest-environment jsdom */ -import { authStore } from "../../../../lib/stores/auth.store"; import { render } from "@testing-library/svelte"; import Guard from "../../../../lib/components/common/Guard.svelte"; +import { authStore } from "../../../../lib/stores/auth.store"; describe("Guard", () => { it("should render a spinner while loading", () => { diff --git a/frontend/svelte/src/tests/lib/components/ic/ICP.spec.ts b/frontend/svelte/src/tests/lib/components/ic/ICP.spec.ts index 2e701a02a4d..3d892d8c6d3 100644 --- a/frontend/svelte/src/tests/lib/components/ic/ICP.spec.ts +++ b/frontend/svelte/src/tests/lib/components/ic/ICP.spec.ts @@ -2,11 +2,11 @@ * @jest-environment jsdom */ -import { mockMainAccount } from "../../../mocks/accounts.store.mock"; import type { ICP as ICPModel } from "@dfinity/nns"; import { render } from "@testing-library/svelte"; -import { formatICP } from "../../../../lib/utils/icp.utils"; import ICP from "../../../../lib/components/ic/ICP.svelte"; +import { formatICP } from "../../../../lib/utils/icp.utils"; +import { mockMainAccount } from "../../../mocks/accounts.store.mock"; describe("ICP", () => { const props: { icp: ICPModel } = { icp: mockMainAccount.balance }; diff --git a/frontend/svelte/src/tests/lib/components/ui/Toast.spec.ts b/frontend/svelte/src/tests/lib/components/ui/Toast.spec.ts index 04fde47db72..dfc81f18987 100644 --- a/frontend/svelte/src/tests/lib/components/ui/Toast.spec.ts +++ b/frontend/svelte/src/tests/lib/components/ui/Toast.spec.ts @@ -2,8 +2,8 @@ * @jest-environment jsdom */ -import Toast from "../../../../lib/components/ui/Toast.svelte"; import { render } from "@testing-library/svelte"; +import Toast from "../../../../lib/components/ui/Toast.svelte"; import type { ToastMsg } from "../../../../lib/stores/toasts.store"; describe("Toast", () => { diff --git a/frontend/svelte/src/tests/lib/modals/VotingFilterModal.spec.ts b/frontend/svelte/src/tests/lib/modals/VotingFilterModal.spec.ts index a9b11f2baa9..1ac1443d234 100644 --- a/frontend/svelte/src/tests/lib/modals/VotingFilterModal.spec.ts +++ b/frontend/svelte/src/tests/lib/modals/VotingFilterModal.spec.ts @@ -2,9 +2,9 @@ * @jest-environment jsdom */ -import { Topics, VotingFilterModalProps } from "../../../lib/types/voting"; import { fireEvent, render } from "@testing-library/svelte"; import VotingFilterModal from "../../../lib/modals/VotingFilterModal.svelte"; +import { Topics, VotingFilterModalProps } from "../../../lib/types/voting"; const en = require("../../../lib/i18n/en.json"); diff --git a/frontend/svelte/src/tests/lib/stores/auth.store.spec.ts b/frontend/svelte/src/tests/lib/stores/auth.store.spec.ts index 8ac6ea93ece..302f01ca85e 100644 --- a/frontend/svelte/src/tests/lib/stores/auth.store.spec.ts +++ b/frontend/svelte/src/tests/lib/stores/auth.store.spec.ts @@ -1,7 +1,7 @@ -import { AuthClient } from "@dfinity/auth-client"; import type { Identity } from "@dfinity/agent"; -import { mockPrincipal } from "../../mocks/auth.store.mock"; +import { AuthClient } from "@dfinity/auth-client"; import { authStore } from "../../../lib/stores/auth.store"; +import { mockPrincipal } from "../../mocks/auth.store.mock"; class MockAuthClient extends AuthClient { constructor() { diff --git a/frontend/svelte/src/tests/lib/utils/accounts.utils.spec.ts b/frontend/svelte/src/tests/lib/utils/accounts.utils.spec.ts index ba8fe2711bc..dc58840106f 100644 --- a/frontend/svelte/src/tests/lib/utils/accounts.utils.spec.ts +++ b/frontend/svelte/src/tests/lib/utils/accounts.utils.spec.ts @@ -1,5 +1,5 @@ -import { AccountIdentifier, LedgerCanister } from "@dfinity/nns"; import type { ICP } from "@dfinity/nns"; +import { AccountIdentifier, LedgerCanister } from "@dfinity/nns"; import { loadAccounts } from "../../../lib/utils/accounts.utils"; import { mockPrincipal } from "../../mocks/auth.store.mock"; diff --git a/frontend/svelte/src/tests/lib/utils/auth.utils.spec.ts b/frontend/svelte/src/tests/lib/utils/auth.utils.spec.ts index 362907d9020..faf46efd090 100644 --- a/frontend/svelte/src/tests/lib/utils/auth.utils.spec.ts +++ b/frontend/svelte/src/tests/lib/utils/auth.utils.spec.ts @@ -1,6 +1,6 @@ +import type { Principal } from "@dfinity/principal"; import { isSignedIn } from "../../../lib/utils/auth.utils"; import { mockPrincipal } from "../../mocks/auth.store.mock"; -import type { Principal } from "@dfinity/principal"; describe("auth-utils", () => { it("should not be signed in", () => { diff --git a/frontend/svelte/src/tests/lib/utils/route.utils.spec.ts b/frontend/svelte/src/tests/lib/utils/route.utils.spec.ts index 172adf882db..513151907c9 100644 --- a/frontend/svelte/src/tests/lib/utils/route.utils.spec.ts +++ b/frontend/svelte/src/tests/lib/utils/route.utils.spec.ts @@ -2,6 +2,7 @@ * @jest-environment jsdom */ +import * as routeUtils from "../../../lib/utils/route.utils"; import { baseHref, pushHistory, @@ -9,7 +10,6 @@ import { routeContext, routePath, } from "../../../lib/utils/route.utils"; -import * as routeUtils from "../../../lib/utils/route.utils"; describe("route-utils", () => { describe("base href", () => { diff --git a/frontend/svelte/src/tests/mocks/accounts.store.mock.ts b/frontend/svelte/src/tests/mocks/accounts.store.mock.ts index a19b73675ad..16c0eea2cd2 100644 --- a/frontend/svelte/src/tests/mocks/accounts.store.mock.ts +++ b/frontend/svelte/src/tests/mocks/accounts.store.mock.ts @@ -1,7 +1,7 @@ +import { ICP } from "@dfinity/nns"; import type { Subscriber } from "svelte/store"; import type { AccountsStore } from "../../lib/stores/accounts.store"; import type { Account } from "../../lib/types/account"; -import { ICP } from "@dfinity/nns"; export const mockMainAccount: Account = { identifier: diff --git a/frontend/svelte/src/tests/mocks/auth.store.mock.ts b/frontend/svelte/src/tests/mocks/auth.store.mock.ts index 14a304a80ea..f401827c2ab 100644 --- a/frontend/svelte/src/tests/mocks/auth.store.mock.ts +++ b/frontend/svelte/src/tests/mocks/auth.store.mock.ts @@ -1,6 +1,6 @@ +import { Principal } from "@dfinity/principal"; import type { Subscriber } from "svelte/store"; import type { AuthStore } from "../../lib/stores/auth.store"; -import { Principal } from "@dfinity/principal"; export const mockPrincipal = Principal.fromText( "xlmdg-vkosz-ceopx-7wtgu-g3xmd-koiyc-awqaq-7modz-zf6r6-364rh-oqe" diff --git a/frontend/svelte/src/tests/routes/Accounts.spec.ts b/frontend/svelte/src/tests/routes/Accounts.spec.ts index 67681344d3b..a3adf2abf3b 100644 --- a/frontend/svelte/src/tests/routes/Accounts.spec.ts +++ b/frontend/svelte/src/tests/routes/Accounts.spec.ts @@ -2,16 +2,16 @@ * @jest-environment jsdom */ +import { render } from "@testing-library/svelte"; +import { accountsStore } from "../../lib/stores/accounts.store"; import { authStore } from "../../lib/stores/auth.store"; -import { mockAuthStoreSubscribe } from "../mocks/auth.store.mock"; +import { formatICP } from "../../lib/utils/icp.utils"; +import Accounts from "../../routes/Accounts.svelte"; import { mockAccountsStoreSubscribe, mockMainAccount, } from "../mocks/accounts.store.mock"; -import { accountsStore } from "../../lib/stores/accounts.store"; -import { render } from "@testing-library/svelte"; -import Accounts from "../../routes/Accounts.svelte"; -import { formatICP } from "../../lib/utils/icp.utils"; +import { mockAuthStoreSubscribe } from "../mocks/auth.store.mock"; describe("Accounts", () => { let authStoreMock, accountsStoreMock; diff --git a/frontend/svelte/src/tests/routes/Neurons.spec.ts b/frontend/svelte/src/tests/routes/Neurons.spec.ts index 41b355c8cd1..4dc9157f8b8 100644 --- a/frontend/svelte/src/tests/routes/Neurons.spec.ts +++ b/frontend/svelte/src/tests/routes/Neurons.spec.ts @@ -3,8 +3,8 @@ */ import { render } from "@testing-library/svelte"; -import Neurons from "../../routes/Neurons.svelte"; import { authStore } from "../../lib/stores/auth.store"; +import Neurons from "../../routes/Neurons.svelte"; import { mockAuthStoreSubscribe, mockPrincipal, diff --git a/frontend/svelte/src/tests/routes/Proposals.spec.ts b/frontend/svelte/src/tests/routes/Proposals.spec.ts index 87b945341bb..7caac59fd94 100644 --- a/frontend/svelte/src/tests/routes/Proposals.spec.ts +++ b/frontend/svelte/src/tests/routes/Proposals.spec.ts @@ -4,9 +4,8 @@ import { render } from "@testing-library/svelte"; import { authStore } from "../../lib/stores/auth.store"; -import { mockAuthStoreSubscribe } from "../mocks/auth.store.mock"; import Proposals from "../../routes/Proposals.svelte"; -import { Topics } from "../../lib/types/voting"; +import { mockAuthStoreSubscribe } from "../mocks/auth.store.mock"; describe("Proposals", () => { let authStoreMock;