chore(ci): fixes relative imports for src/lib files (#6146)

# Motivation

This is the first of a series of PRs aimed at replacing relative imports
in our codebase with absolute imports using aliases. This change will
help prevent future issues related to how different tools sort Svelte
imports.

The PRs include:
* Fixing `src/test` files #6143
* Fixing `src/routes` files - Not possible as SvelteKit doesn't like
using the `$` within its domain
* Fixing `src/lib` files #6146
* Introducing a new step in our CI to check for relative imports and
fail if any are present.

# Changes

- Replaced relative imports with absolute imports and aliases for the
`src/lib` directory.
- Run `./scripts/fmt-frontend` to sort imports based on rules
- Run `./scripts/sort-svelte-imports`

# Tests

- Should work as before

# Todos

- [ ] Add entry to changelog (if necessary).
Not necessary

frontend/src/lib/api/accounts.api.ts

@@ -1,7 +1,7 @@
+import { nnsDappCanister } from "$lib/api/nns-dapp.api";
 import type { AccountIdentifierString } from "$lib/canisters/nns-dapp/nns-dapp.types";
 import { hashCode, logWithTimestamp } from "$lib/utils/dev.utils";
 import type { Identity } from "@dfinity/agent";
-import { nnsDappCanister } from "./nns-dapp.api";
 
 export const createSubAccount = async ({
   name,

frontend/src/lib/api/canisters.api.ts

@@ -1,4 +1,6 @@
 import { createAgent } from "$lib/api/agent.api";
+import { sendICP } from "$lib/api/icp-ledger.api";
+import { nnsDappCanister } from "$lib/api/nns-dapp.api";
 import { ICManagementCanister } from "$lib/canisters/ic-management/ic-management.canister";
 import type {
   CanisterDetails,
@@ -30,8 +32,6 @@ import { CMCCanister, ProcessingError, type Cycles } from "@dfinity/cmc";
 import { AccountIdentifier, SubAccount } from "@dfinity/ledger-icp";
 import type { Principal } from "@dfinity/principal";
 import { nonNullish, principalToSubAccount } from "@dfinity/utils";
-import { sendICP } from "./icp-ledger.api";
-import { nnsDappCanister } from "./nns-dapp.api";
 
 // This way, TS understands that if it's invalid, then the name is a string
 type LongName = string;

frontend/src/lib/api/dev.api.ts

@@ -1,3 +1,6 @@
+import { createAgent } from "$lib/api/agent.api";
+import { governanceCanister } from "$lib/api/governance.api";
+import { wrapper } from "$lib/api/sns-wrapper.api";
 import { LEDGER_CANISTER_ID } from "$lib/constants/canister-ids.constants";
 import { HOST, IS_TESTNET } from "$lib/constants/environment.constants";
 import type { Account } from "$lib/types/account";
@@ -22,9 +25,6 @@ import {
   createAgent as createAgentUtils,
   toNullable,
 } from "@dfinity/utils";
-import { createAgent } from "./agent.api";
-import { governanceCanister } from "./governance.api";
-import { wrapper } from "./sns-wrapper.api";
 
 export const testAccountPrincipal =
   "jg6qm-uw64t-m6ppo-oluwn-ogr5j-dc5pm-lgy2p-eh6px-hebcd-5v73i-nqe";

frontend/src/lib/api/governace-test.api.ts

@@ -1,8 +1,8 @@
+import { createAgent } from "$lib/api/agent.api";
 import { GOVERNANCE_CANISTER_ID } from "$lib/constants/canister-ids.constants";
 import { HOST } from "$lib/constants/environment.constants";
 import type { Identity } from "@dfinity/agent";
 import { GovernanceTestCanister, type Neuron } from "@dfinity/nns";
-import { createAgent } from "./agent.api";
 
 const governanceTestCanister = async (identity: Identity) => {
   const agent = await createAgent({

frontend/src/lib/api/governance.api.ts

@@ -1,4 +1,5 @@
 import { createAgent } from "$lib/api/agent.api";
+import { ledgerCanister as getLedgerCanister } from "$lib/api/icp-ledger.api";
 import type { SubAccountArray } from "$lib/canisters/nns-dapp/nns-dapp.types";
 import { GOVERNANCE_CANISTER_ID } from "$lib/constants/canister-ids.constants";
 import { HOST } from "$lib/constants/environment.constants";
@@ -20,7 +21,6 @@ import {
   type RewardEvent,
 } from "@dfinity/nns";
 import type { Principal } from "@dfinity/principal";
-import { ledgerCanister as getLedgerCanister } from "./icp-ledger.api";
 
 /**
  * COMMON TYPES

frontend/src/lib/api/icp-index.api.ts

@@ -1,3 +1,4 @@
+import { createAgent } from "$lib/api/agent.api";
 import { INDEX_CANISTER_ID } from "$lib/constants/canister-ids.constants";
 import { HOST } from "$lib/constants/environment.constants";
 import { logWithTimestamp } from "$lib/utils/dev.utils";
@@ -7,7 +8,6 @@ import {
   type GetAccountIdentifierTransactionsResponse,
 } from "@dfinity/ledger-icp";
 import { fromNullable } from "@dfinity/utils";
-import { createAgent } from "./agent.api";
 
 export interface GetTransactionsParams {
   identity: Identity;

frontend/src/lib/api/icrc-index.api.ts

@@ -1,3 +1,4 @@
+import { createAgent } from "$lib/api/agent.api";
 import { HOST } from "$lib/constants/environment.constants";
 import type { Agent, Identity } from "@dfinity/agent";
 import {
@@ -7,7 +8,6 @@ import {
 } from "@dfinity/ledger-icrc";
 import type { Principal } from "@dfinity/principal";
 import { fromNullable } from "@dfinity/utils";
-import { createAgent } from "./agent.api";
 
 export interface GetTransactionsParams {
   identity: Identity;

frontend/src/lib/api/proposals.api.ts

@@ -1,4 +1,5 @@
 import { createAgent } from "$lib/api/agent.api";
+import { nnsDappCanister } from "$lib/api/nns-dapp.api";
 import { DEFAULT_LIST_PAGINATION_LIMIT } from "$lib/constants/constants";
 import { HOST } from "$lib/constants/environment.constants";
 import { hashCode, logWithTimestamp } from "$lib/utils/dev.utils";
@@ -13,7 +14,6 @@ import {
   type ProposalId,
   type ProposalInfo,
 } from "@dfinity/nns";
-import { nnsDappCanister } from "./nns-dapp.api";
 
 export const queryProposals = async ({
   beforeProposal,

frontend/src/lib/api/sns-governance.api.ts

@@ -1,3 +1,4 @@
+import { wrapper } from "$lib/api/sns-wrapper.api";
 import { logWithTimestamp } from "$lib/utils/dev.utils";
 import { subaccountToHexString } from "$lib/utils/sns-neuron.utils";
 import type { Identity } from "@dfinity/agent";
@@ -12,7 +13,6 @@ import type {
   SnsProposalId,
   SnsVote,
 } from "@dfinity/sns";
-import { wrapper } from "./sns-wrapper.api";
 
 export const querySnsNeurons = async ({
   identity,

frontend/src/lib/api/sns-sale.api.ts

@@ -1,4 +1,5 @@
 import { createAgent } from "$lib/api/agent.api";
+import { wrapper } from "$lib/api/sns-wrapper.api";
 import { HOST } from "$lib/constants/environment.constants";
 import { logWithTimestamp } from "$lib/utils/dev.utils";
 import { isMethodNotSupportedError } from "$lib/utils/error.utils";
@@ -11,7 +12,6 @@ import type {
 } from "@dfinity/sns";
 import { SnsSwapCanister } from "@dfinity/sns";
 import { toNullable } from "@dfinity/utils";
-import { wrapper } from "./sns-wrapper.api";
 
 export const getOpenTicket = async ({
   identity,

frontend/src/lib/api/sns.api.ts

@@ -1,3 +1,4 @@
+import { wrapper, wrappers } from "$lib/api/sns-wrapper.api";
 import type { SnsSwapCommitment } from "$lib/types/sns";
 import type {
   QueryRootCanisterId,
@@ -16,7 +17,6 @@ import type {
   SnsSwapBuyerState,
   SnsWrapper,
 } from "@dfinity/sns";
-import { wrapper, wrappers } from "./sns-wrapper.api";
 
 export const queryAllSnsMetadata = async ({
   identity,

frontend/src/lib/canisters/ic-management/converters.ts

@@ -1,7 +1,7 @@
+import type { CanisterDetails } from "$lib/canisters/ic-management/ic-management.canister.types";
+import { CanisterStatus } from "$lib/canisters/ic-management/ic-management.canister.types";
 import type { CanisterStatusResponse } from "@dfinity/ic-management";
 import type { Principal } from "@dfinity/principal";
-import type { CanisterDetails } from "./ic-management.canister.types";
-import { CanisterStatus } from "./ic-management.canister.types";
 
 const getCanisterStatus = (
   status:

frontend/src/lib/canisters/ic-management/ic-management.canister.ts

@@ -1,15 +1,15 @@
+import { toCanisterDetails } from "$lib/canisters/ic-management/converters";
+import { mapError } from "$lib/canisters/ic-management/ic-management.errors";
 import type { ICManagementCanisterOptions } from "@dfinity/ic-management";
 import {
   ICManagementCanister as ICMgmtCanister,
   type CanisterStatusResponse,
 } from "@dfinity/ic-management";
 import type { Principal } from "@dfinity/principal";
-import { toCanisterDetails } from "./converters";
 import type {
   CanisterDetails,
   CanisterSettings,
 } from "./ic-management.canister.types";
-import { mapError } from "./ic-management.errors";
 
 /**
  * The ICManagementCanister was initially implemented here, but it has since been moved to ic-js and packaged as a standalone library.

frontend/src/lib/canisters/nns-dapp/nns-dapp.canister.ts

@@ -1,10 +1,12 @@
+import type { NNSDappCanisterOptions } from "$lib/canisters/nns-dapp/nns-dapp.canister.types";
+import { idlFactory as certifiedIdlFactory } from "$lib/canisters/nns-dapp/nns-dapp.certified.idl";
+import type { NNSDappService } from "$lib/canisters/nns-dapp/nns-dapp.idl";
+import { idlFactory } from "$lib/canisters/nns-dapp/nns-dapp.idl";
 import { Actor } from "@dfinity/agent";
 import { AccountIdentifier } from "@dfinity/ledger-icp";
 import type { ProposalId } from "@dfinity/nns";
 import type { Principal } from "@dfinity/principal";
 import { nonNullish, toNullable } from "@dfinity/utils";
-import type { NNSDappCanisterOptions } from "./nns-dapp.canister.types";
-import { idlFactory as certifiedIdlFactory } from "./nns-dapp.certified.idl";
 import {
   AccountNotFoundError,
   CanisterAlreadyAttachedError,
@@ -20,8 +22,6 @@ import {
   TooManyImportedTokensError,
   UnknownProposalPayloadError,
 } from "./nns-dapp.errors";
-import type { NNSDappService } from "./nns-dapp.idl";
-import { idlFactory } from "./nns-dapp.idl";
 import type {
   AccountDetails,
   CanisterDetails,

frontend/src/lib/canisters/nns-dapp/nns-dapp.canister.types.ts

@@ -1,6 +1,6 @@
+import type { NNSDappService } from "$lib/canisters/nns-dapp/nns-dapp.idl";
 import type { Agent } from "@dfinity/agent";
 import type { Principal } from "@dfinity/principal";
-import type { NNSDappService } from "./nns-dapp.idl";
 
 export interface NNSDappCanisterOptions {
   // The agent to use when communicating with the governance canister.

frontend/src/lib/canisters/nns-dapp/nns-dapp.idl.d.ts

@@ -1,5 +1,5 @@
+import _SERVICE from "$lib/canisters/nns-dapp/nns-dapp.types";
 import type { IDL } from "@dfinity/candid";
-import _SERVICE from "./nns-dapp.types";
 export const idlFactory: IDL.InterfaceFactory;
 
 export { _SERVICE as NNSDappService };

frontend/src/lib/canisters/tvl/tvl.canister.ts

@@ -3,11 +3,11 @@ import type {
   GetTVLResult,
   TVLCanisterOptions,
 } from "$lib/canisters/tvl/tvl.canister.types";
+import { idlFactory as certifiedIdlFactory } from "$lib/canisters/tvl/tvl.certified.idl";
+import { idlFactory } from "$lib/canisters/tvl/tvl.idl";
+import type { _SERVICE as TVLService } from "$lib/canisters/tvl/tvl.types";
 import { Actor } from "@dfinity/agent";
 import { Canister, nonNullish, toNullable } from "@dfinity/utils";
-import { idlFactory as certifiedIdlFactory } from "./tvl.certified.idl";
-import { idlFactory } from "./tvl.idl";
-import type { _SERVICE as TVLService } from "./tvl.types";
 
 export class TVLCanister extends Canister<TVLService> {
   public static create(options: TVLCanisterOptions): TVLCanister {

frontend/src/lib/components/accounts/AddSubAccount.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
+  import TextInputForm from "$lib/components/common/TextInputForm.svelte";
   import { addSubAccount } from "$lib/services/icp-accounts.services";
   import { startBusy, stopBusy } from "$lib/stores/busy.store";
   import { i18n } from "$lib/stores/i18n";
   import {
     ADD_ACCOUNT_CONTEXT_KEY,
     type AddAccountContext,
   } from "$lib/types/add-account.context";
-  import TextInputForm from "../common/TextInputForm.svelte";
   import { busy } from "@dfinity/gix-components";
   import { createEventDispatcher, getContext } from "svelte";
 

frontend/src/lib/components/accounts/HardwareWalletConnect.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import HardwareWalletConnectAction from "$lib/components/accounts/HardwareWalletConnectAction.svelte";
   import { LedgerConnectionState } from "$lib/constants/ledger.constants";
   import type { LedgerIdentity } from "$lib/identities/ledger.identity";
   import { registerHardwareWalletProxy } from "$lib/proxy/icp-ledger.services.proxy";
@@ -9,7 +10,6 @@
     ADD_ACCOUNT_CONTEXT_KEY,
     type AddAccountContext,
   } from "$lib/types/add-account.context";
-  import HardwareWalletConnectAction from "./HardwareWalletConnectAction.svelte";
   import { busy } from "@dfinity/gix-components";
   import { createEventDispatcher, getContext } from "svelte";
 

frontend/src/lib/components/accounts/HardwareWalletConnectAction.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
+  import HardwareWalletInfo from "$lib/components/accounts/HardwareWalletInfo.svelte";
   import { LedgerConnectionState } from "$lib/constants/ledger.constants";
   import type { LedgerIdentity } from "$lib/identities/ledger.identity";
   import { connectToHardwareWalletProxy } from "$lib/proxy/icp-ledger.services.proxy";
   import { i18n } from "$lib/stores/i18n";
-  import HardwareWalletInfo from "./HardwareWalletInfo.svelte";
   import { Spinner } from "@dfinity/gix-components";
 
   export let connectionState: LedgerConnectionState =

frontend/src/lib/components/accounts/HardwareWalletNeurons.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
+  import HardwareWalletNeuronAddHotkeyButton from "$lib/components/accounts/HardwareWalletNeuronAddHotkeyButton.svelte";
   import { i18n } from "$lib/stores/i18n";
   import type {
     HardwareWalletNeuronInfo,
     WalletContext,
   } from "$lib/types/wallet.context";
   import { WALLET_CONTEXT_KEY } from "$lib/types/wallet.context";
   import { formatTokenE8s } from "$lib/utils/token.utils";
-  import HardwareWalletNeuronAddHotkeyButton from "./HardwareWalletNeuronAddHotkeyButton.svelte";
   import { getContext } from "svelte";
 
   const context: WalletContext = getContext<WalletContext>(WALLET_CONTEXT_KEY);

frontend/src/lib/components/accounts/IcrcWalletPage.svelte

@@ -1,6 +1,8 @@
 <script lang="ts">
   import { goto } from "$app/navigation";
   import IcrcBalancesObserver from "$lib/components/accounts/IcrcBalancesObserver.svelte";
+  import ImportTokenRemoveConfirmation from "$lib/components/accounts/ImportTokenRemoveConfirmation.svelte";
+  import WalletMorePopover from "$lib/components/accounts/WalletMorePopover.svelte";
   import WalletPageHeader from "$lib/components/accounts/WalletPageHeader.svelte";
   import WalletPageHeading from "$lib/components/accounts/WalletPageHeading.svelte";
   import SignInGuard from "$lib/components/common/SignInGuard.svelte";
@@ -26,8 +28,6 @@
   } from "$lib/utils/accounts.utils";
   import { replacePlaceholders } from "$lib/utils/i18n.utils";
   import { isImportedToken as checkImportedToken } from "$lib/utils/imported-tokens.utils";
-  import ImportTokenRemoveConfirmation from "./ImportTokenRemoveConfirmation.svelte";
-  import WalletMorePopover from "./WalletMorePopover.svelte";
   import { IconDots, Island, Spinner, Tag } from "@dfinity/gix-components";
   import type { Principal } from "@dfinity/principal";
   import { TokenAmountV2, isNullish, nonNullish } from "@dfinity/utils";

frontend/src/lib/components/accounts/LedgerNeuronHotkeyWarning.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
   import { browser } from "$app/environment";
+  import TestIdWrapper from "$lib/components/common/TestIdWrapper.svelte";
+  import Banner from "$lib/components/ui/Banner.svelte";
+  import BannerIcon from "$lib/components/ui/BannerIcon.svelte";
   import { i18n } from "$lib/stores/i18n";
   import { IconInfo } from "@dfinity/gix-components";
-  import Banner from "../ui/Banner.svelte";
-  import BannerIcon from "../ui/BannerIcon.svelte";
-  import TestIdWrapper from "../common/TestIdWrapper.svelte";
 
   const LOCAL_STORAGE_KEY = "isLedgerNeuronHotkeyWarningDisabled";
 

frontend/src/lib/components/accounts/RenameSubAccountAction.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import TextInputForm from "$lib/components/common/TextInputForm.svelte";
   import { renameSubAccount } from "$lib/services/icp-accounts.services";
   import { startBusy, stopBusy } from "$lib/stores/busy.store";
   import { i18n } from "$lib/stores/i18n";
@@ -7,7 +8,6 @@
     WALLET_CONTEXT_KEY,
     type WalletContext,
   } from "$lib/types/wallet.context";
-  import TextInputForm from "../common/TextInputForm.svelte";
   import { busy } from "@dfinity/gix-components";
   import { createEventDispatcher, getContext } from "svelte";
 

frontend/src/lib/components/accounts/SelectAccountDropdown.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
+  import TestIdWrapper from "$lib/components/common/TestIdWrapper.svelte";
   import { universesAccountsStore } from "$lib/derived/universes-accounts.derived";
   import { i18n } from "$lib/stores/i18n";
   import type { Account } from "$lib/types/account";
   import {
     getAccountByRootCanister,
     getAccountsByRootCanister,
   } from "$lib/utils/accounts.utils";
-  import TestIdWrapper from "../common/TestIdWrapper.svelte";
   import { Dropdown, DropdownItem, Spinner } from "@dfinity/gix-components";
   import type { Principal } from "@dfinity/principal";
   import { isNullish } from "@dfinity/utils";

frontend/src/lib/components/accounts/SelectDestinationAddress.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+  import AddressInput from "$lib/components/accounts/AddressInput.svelte";
+  import SelectAccountDropdown from "$lib/components/accounts/SelectAccountDropdown.svelte";
   import { universesAccountsStore } from "$lib/derived/universes-accounts.derived";
   import { i18n } from "$lib/stores/i18n";
   import type { Account } from "$lib/types/account";
@@ -11,8 +13,6 @@
     getAccountsByRootCanister,
     invalidAddress,
   } from "$lib/utils/accounts.utils";
-  import AddressInput from "./AddressInput.svelte";
-  import SelectAccountDropdown from "./SelectAccountDropdown.svelte";
   import { Toggle } from "@dfinity/gix-components";
   import type { Principal } from "@dfinity/principal";
   import { nonNullish } from "@dfinity/utils";

frontend/src/lib/components/accounts/TransactionCard.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import TransactionIcon from "$lib/components/accounts/TransactionIcon.svelte";
   import AmountDisplay from "$lib/components/ic/AmountDisplay.svelte";
   import ColumnRow from "$lib/components/ui/ColumnRow.svelte";
   import DateSeconds from "$lib/components/ui/DateSeconds.svelte";
@@ -8,7 +9,6 @@
     TransactionIconType,
     UiTransaction,
   } from "$lib/types/transaction";
-  import TransactionIcon from "./TransactionIcon.svelte";
   import { KeyValuePair } from "@dfinity/gix-components";
   import {
     nonNullish,

frontend/src/lib/components/accounts/UiTransactionsList.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
   // TODO: Rename to TransactionList once we remove the old one.
+  import NoTransactions from "$lib/components/accounts/NoTransactions.svelte";
+  import TransactionCard from "$lib/components/accounts/TransactionCard.svelte";
+  import SkeletonCard from "$lib/components/ui/SkeletonCard.svelte";
   import type { UiTransaction } from "$lib/types/transaction";
-  import SkeletonCard from "../ui/SkeletonCard.svelte";
-  import NoTransactions from "./NoTransactions.svelte";
-  import TransactionCard from "./TransactionCard.svelte";
   import { InfiniteScroll, Spinner } from "@dfinity/gix-components";
   import { flip } from "svelte/animate";
 

frontend/src/lib/components/accounts/WalletMorePopover.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
   import TestIdWrapper from "$lib/components/common/TestIdWrapper.svelte";
   import LinkToDashboardCanister from "$lib/components/tokens/LinkToDashboardCanister.svelte";
+  import Separator from "$lib/components/ui/Separator.svelte";
   import { i18n } from "$lib/stores/i18n";
-  import Separator from "../ui/Separator.svelte";
   import { IconBin, Popover } from "@dfinity/gix-components";
   import type { Principal } from "@dfinity/principal";
   import { nonNullish } from "@dfinity/utils";