refactor: replace eslint default import sort with a plugin (it is autofixable now)

Author: notwindstone

bun.lockb

@@ -1,13 +1,15 @@
+import { fileURLToPath } from "node:url";
+
 import { includeIgnoreFile } from "@eslint/compat";
-import { globalIgnores } from "eslint/config";
-import { defineConfigWithVueTs, vueTsConfigs } from "@vue/eslint-config-typescript";
 import stylistic from "@stylistic/eslint-plugin";
+import unocss from "@unocss/eslint-config/flat";
+import { defineConfigWithVueTs, vueTsConfigs } from "@vue/eslint-config-typescript";
 import vueRequireID from "@vue-require-id/eslint-plugin";
+import { globalIgnores } from "eslint/config";
+import simpleImportSort from "eslint-plugin-simple-import-sort";
 import eslintPluginUnicorn from "eslint-plugin-unicorn";
 import pluginVue from "eslint-plugin-vue";
-import unocss from "@unocss/eslint-config/flat";
 import globals from "globals";
-import { fileURLToPath } from "node:url";
 
 // Get the absolute path of a '.gitignore' file
 const gitIgnorePath = fileURLToPath(
@@ -35,8 +37,9 @@ export default defineConfigWithVueTs(
       },
     },
     "plugins": {
-      "@stylistic"     : stylistic,
-      "@vue-require-id": vueRequireID,
+      "@stylistic"        : stylistic,
+      "@vue-require-id"   : vueRequireID,
+      "simple-import-sort": simpleImportSort,
     },
     "rules": {
 
@@ -65,13 +68,9 @@ export default defineConfigWithVueTs(
 
       /* ESLint */
       "capitalized-comments": ["warn", "always"],
-      "sort-imports"        : ["warn", {
-        "allowSeparatedGroups" : false,
-        "ignoreCase"           : false,
-        "ignoreDeclarationSort": false,
-        "ignoreMemberSort"     : false,
-        "memberSyntaxSortOrder": ["multiple", "single", "all", "none"],
-      }],
+
+      /* Simple Import Sort */
+      "simple-import-sort/imports": "warn",
 
       // Element IDs simplify styling for plugins
       "@vue-require-id/require-id": ["warn", {

eslint.config.js

@@ -48,6 +48,7 @@
     "@vue/eslint-config-typescript": "^14.6.0",
     "@vue/tsconfig": "^0.7.0",
     "eslint": "^9.34.0",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
     "eslint-plugin-unicorn": "^60.0.0",
     "eslint-plugin-vue": "^10.4.0",
     "globals": "^16.3.0",

package.json

@@ -1,26 +1,28 @@
 <script setup lang="ts">
+import { defineAsyncComponent, nextTick, provide, shallowReactive } from "vue";
+
+import ErrorBoundary from "@/components/handlers/ErrorBoundary.vue";
 import Layout from "@/components/layout/Layout.vue";
 import Router from "@/components/layout/Router.vue";
-import ErrorBoundary from "@/components/handlers/ErrorBoundary.vue";
-import GlobalError from "@/components/statuses/GlobalError.vue";
-import ExtensionsError from "@/components/statuses/ExtensionsError.vue";
 import NonBundledClasses from "@/components/misc/NonBundledClasses.vue";
-import { defineAsyncComponent, nextTick, provide, shallowReactive } from "vue";
+import ExtensionsError from "@/components/statuses/ExtensionsError.vue";
+import GlobalError from "@/components/statuses/GlobalError.vue";
 import {
-  ApplicationNamespace, ContextMenuItems,
+  ApplicationNamespace,
+  ContextMenuItems,
   GlobalStatesChangerContextKey,
   GlobalStatesContextKey,
 } from "@/constants/application.ts";
+import { HookMappings } from "@/constants/mappings.ts";
+import { RouteItems } from "@/constants/routes.ts";
+import { log } from "@/lib/handlers/log.ts";
+import { capitalize } from "@/lib/helpers/capitalize.ts";
 import type {
   ContextGlobalStatesType,
   GlobalStatesChangerType,
   GlobalStatesType,
 } from "@/types/application/global-states.type.ts";
-import { HookMappings } from "@/constants/mappings.ts";
 import type { ExtensionStatusType } from "@/types/extensions/hook-return.type.ts";
-import { RouteItems } from "@/constants/routes.ts";
-import { capitalize } from "@/lib/helpers/capitalize.ts";
-import { log } from "@/lib/handlers/log.ts";
 
 const LogViewer = defineAsyncComponent(
   () => import("@/components/logging/LogViewer.vue"),

src/App.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
-import Sidebar from "@/components/layout/Sidebar.vue";
-import ErrorBoundary from "@/components/handlers/ErrorBoundary.vue";
+import { useEventListener } from "@vueuse/core";
 import { ref } from "vue";
+
+import ErrorBoundary from "@/components/handlers/ErrorBoundary.vue";
 import ContextMenu from "@/components/layout/ContextMenu.vue";
-import { useEventListener } from "@vueuse/core";
+import Sidebar from "@/components/layout/Sidebar.vue";
 import { ApplicationNamespace } from "@/constants/application.ts";
 import type { RouteType } from "@/types/application/route.type.ts";
 

src/components/layout/Layout.vue

@@ -1,12 +1,3 @@
-import type { ConfigType } from "@/types/config/config.schema.ts";
-import type { log } from "@/lib/handlers/log.ts";
-import type { extractError } from "@/lib/helpers/extract-error.ts";
-import type { getRelativeDate } from "@/lib/helpers/get-relative-date.ts";
-import type { getConfigFile } from "@/lib/main/get-config-file.ts";
-import type { getDefaultConfig } from "@/lib/main/get-default-config.ts";
-import type { initializeConfigFile } from "@/lib/main/initialize-config-file.ts";
-import type { HookReturnType } from "@/types/extensions/hook-return.type.ts";
-import type { RouteType } from "@/types/application/route.type.ts";
 import * as TauriApi from "@tauri-apps/api";
 import * as TauriDialog from "@tauri-apps/plugin-dialog";
 import * as TauriFs from "@tauri-apps/plugin-fs";
@@ -18,7 +9,17 @@ import * as TauriShell from "@tauri-apps/plugin-shell";
 import * as TauriUpload from "@tauri-apps/plugin-upload";
 import * as TauriDiscordRpc from "tauri-plugin-drpc";
 import * as TauriDiscordRpcClasses from "tauri-plugin-drpc/activity";
+
+import type { log } from "@/lib/handlers/log.ts";
+import type { extractError } from "@/lib/helpers/extract-error.ts";
+import type { getRelativeDate } from "@/lib/helpers/get-relative-date.ts";
+import type { getConfigFile } from "@/lib/main/get-config-file.ts";
+import type { getDefaultConfig } from "@/lib/main/get-default-config.ts";
+import type { initializeConfigFile } from "@/lib/main/initialize-config-file.ts";
 import type { GlobalStatesChangerType, GlobalStatesType } from "@/types/application/global-states.type.ts";
+import type { RouteType } from "@/types/application/route.type.ts";
+import type { ConfigType } from "@/types/config/config.schema.ts";
+import type { HookReturnType } from "@/types/extensions/hook-return.type.ts";
 
 declare global {
   interface Window {

src/declarations.ts

@@ -1,13 +1,14 @@
+import * as DiscordRPC from "tauri-plugin-drpc";
+import * as DiscordRPCClasses from "tauri-plugin-drpc/activity.ts";
+
 import { ApplicationNamespace } from "@/constants/application.ts";
-import { getDefaultConfig } from "@/lib/main/get-default-config.ts";
 import { log } from "@/lib/handlers/log.ts";
 import { extractError } from "@/lib/helpers/extract-error.ts";
 import { getRelativeDate } from "@/lib/helpers/get-relative-date.ts";
 import { getConfigFile } from "@/lib/main/get-config-file.ts";
+import { getDefaultConfig } from "@/lib/main/get-default-config.ts";
 import { initializeConfigFile } from "@/lib/main/initialize-config-file.ts";
 import type { GlobalStatesType } from "@/types/application/global-states.type.ts";
-import * as DiscordRPC from "tauri-plugin-drpc";
-import * as DiscordRPCClasses from "tauri-plugin-drpc/activity.ts";
 
 export function declareWindow(): void {
   window.__TAURI_PLUGINS_COMMUNITY__ = {

src/lib/main/declare-window.ts

@@ -1,8 +1,9 @@
-import { log } from "@/lib/handlers/log.ts";
+import { BaseDirectory, exists, readTextFile } from "@tauri-apps/plugin-fs";
+
 import { ApplicationNamespace, ConfigFilename } from "@/constants/application.ts";
+import { log } from "@/lib/handlers/log.ts";
 import { getDefaultConfig } from "@/lib/main/get-default-config.ts";
 import { initializeConfigFile } from "@/lib/main/initialize-config-file.ts";
-import { BaseDirectory, exists, readTextFile } from "@tauri-apps/plugin-fs";
 import { type ConfigType, ConfigValidator } from "@/types/config/config.schema.ts";
 
 export async function getConfigFile(): Promise<ConfigType> {

src/lib/main/get-config-file.ts

@@ -1,8 +1,9 @@
-import type { ConfigType } from "@/types/config/config.schema.ts";
-import { log } from "@/lib/handlers/log.ts";
-import { ApplicationNamespace } from "@/constants/application.ts";
 import { getCurrentWindow } from "@tauri-apps/api/window";
 
+import { ApplicationNamespace } from "@/constants/application.ts";
+import { log } from "@/lib/handlers/log.ts";
+import type { ConfigType } from "@/types/config/config.schema.ts";
+
 export async function getDefaultConfig(): Promise<ConfigType> {
   const hooksArray = window[ApplicationNamespace].hooks.getDefaultConfig.before;
 

src/lib/main/get-default-config.ts

@@ -1,18 +1,21 @@
-import App from "@/App.vue";
-import { ApplicationRootID } from "@/constants/application";
-import { createApp } from "vue";
-import { declareWindow } from "@/lib/main/declare-window.ts";
-import { initializeLauncher } from "@/lib/main/initialize-launcher.ts";
-import { log } from "@/lib/handlers/log.ts";
-import { prepareLogFile } from "@/lib/main/prepare-log-file.ts";
 // Import UnoCSS essentials
 import "virtual:uno.css";
 // Reset all CSS styles in a Tailwind style
 import "@unocss/reset/tailwind.css";
+// Import custom CSS styles
 import "@/globals.css";
 // Import styles that are necessary for Material You ripple effect
 import "m3ripple-vue/style.css";
 
+import { createApp } from "vue";
+
+import App from "@/App.vue";
+import { ApplicationRootID } from "@/constants/application";
+import { log } from "@/lib/handlers/log.ts";
+import { declareWindow } from "@/lib/main/declare-window.ts";
+import { initializeLauncher } from "@/lib/main/initialize-launcher.ts";
+import { prepareLogFile } from "@/lib/main/prepare-log-file.ts";
+
 await prepareLogFile().catch((error: unknown) => {
   log.error("Failed to prepare a log file:", JSON.stringify(error));
 });