[#37] fix lint errors

.storybook/main.ts

@@ -1,8 +1,8 @@
-const fs = require("fs");
-const path = require('path');
+import fs from 'node:fs';
+import path from 'node:path';
 
-//storybook-tailwind-dark-mode
-const config = {
+// storybook-tailwind-dark-mode
+const storyConfig = {
   stories: [
     "../stories/**/*.stories.mdx",
     "../stories/**/*.stories.@(js|jsx|ts|tsx)",
@@ -42,4 +42,4 @@ const config = {
 
 };
 
-export default config;
+export default storyConfig;

.storybook/preview.ts

@@ -1,11 +1,11 @@
-import {createPinia} from 'pinia';
 import { setup } from '@storybook/vue3';
+import type { Preview } from '@storybook/vue3'
+import {createPinia} from 'pinia';
 import "../src/assets/index.css";
 import "../src/assets/vendor";
 import "./stories.css"
 import SfdumpWrap from "../src/shared/lib/vendor/dumper";
 import 'tailwindcss/tailwind.css'
-import type { Preview } from '@storybook/vue3'
 
 const preview: Preview = {
   decorators: [

app.vue

@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import "./src/assets/index.css";
-import "./src/assets/vendor";
-import { useSettingsStore } from "~/src/shared/stores";
+import './src/assets/index.css';
+import './src/assets/vendor';
+import { useSettingsStore } from '~/src/shared/stores';
 
 useSettingsStore().initialize();
 </script>

error.vue

@@ -18,11 +18,11 @@
 </template>
 
 <script lang="ts" setup>
-import "./src/assets/tailwind.css";
-import "highlight.js/lib/common";
-import { clearError } from "#app";
+import './src/assets/tailwind.css';
+import 'highlight.js/lib/common';
+import { clearError } from '#app';
 
-const handleError = () => clearError({ redirect: "/" });
+const handleError = () => clearError({ redirect: '/' });
 </script>
 
 <style lang="scss" scoped>

eslint.config.js

@@ -9,10 +9,9 @@ import ts from 'typescript-eslint';
 import vueParser from 'vue-eslint-parser';
 import airBnbRules from './.eslint/index.js';
 
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
+const baseDirectory = path.dirname(fileURLToPath(import.meta.url));
 const compat = new FlatCompat({
-  baseDirectory: __dirname,
+  baseDirectory,
   recommendedConfig: js.configs.recommended,
   allConfig: js.configs.all,
 });
@@ -30,7 +29,7 @@ export default ts.config(
       parser: typescriptParser,
       parserOptions: {
         extraFileExtensions: ['.vue'],
-        project: true,
+        project: false,
         tsconfigRootDir: './tsconfig.json',
         parser: {
           ts: '@typescript-eslint/parser',

layouts/default.vue

@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { onMounted } from "vue";
-import { LayoutSidebar } from "~/src/widgets/ui";
-import { useEvents } from "~/src/shared/lib/use-events";
-import SfdumpWrap from "~/src/shared/lib/vendor/dumper";
+import { onMounted } from 'vue';
+import { LayoutSidebar } from '~/src/widgets/ui';
+import { useEvents } from '~/src/shared/lib/use-events';
+import SfdumpWrap from '~/src/shared/lib/vendor/dumper';
 
 SfdumpWrap(window.document);
 

package.json

@@ -30,31 +30,23 @@
   },
   "devDependencies": {
     "@conarti/eslint-plugin-feature-sliced": "^1.0.5",
-    "@eslint/eslintrc": "^3.1.0",
-    "@eslint/js": "^9.6.0",
     "@nuxtjs/eslint-config-typescript": "^12.0.0",
     "@nuxtjs/storybook": "^8.1.1",
     "@nuxtjs/tailwindcss": "^6.2.0",
-    "@sentry/types": "^8.15.0",
     "@storybook-vue/nuxt": "0.2.1",
     "@storybook/addon-actions": "^8.1.11",
     "@storybook/addon-essentials": "^8.1.11",
     "@storybook/addon-interactions": "^8.1.11",
     "@storybook/addon-links": "^8.1.11",
-    "@storybook/vue3": "^8.1.11",
     "@types/cytoscape-dagre": "^2.3.1",
     "@types/downloadjs": "^1.4.3",
     "@types/lodash.debounce": "^4.0.7",
     "@types/node": "^20.14.9",
     "@types/pluralize": "^0.0.33",
     "@typescript-eslint/parser": "^7.13.0",
-    "autoprefixer": "^10.4.0",
-    "confusing-browser-globals": "^1.0.11",
     "eslint": "^9.6.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-airbnb-typescript": "^18.0.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-vue": "^9.9.0",
     "husky": "^9.0.11",
     "lint-staged": "^15.2.7",
     "nuxi": "^3.3.1",
@@ -65,26 +57,34 @@
     "sass": "^1.57.1",
     "storybook": "^8.1.11",
     "typescript": "^5.1.6",
-    "typescript-eslint": "^7.15.0",
-    "vue-eslint-parser": "^9.1.0"
+    "typescript-eslint": "^7.15.0"
   },
   "dependencies": {
+    "@eslint/eslintrc": "^3.1.0",
+    "@eslint/js": "^9.6.0",
     "@highlightjs/vue-plugin": "^2.1.2",
     "@hpcc-js/wasm": "^2.8.0",
     "@pinia/nuxt": "^0.5.1",
+    "@sentry/types": "^8.15.0",
     "@storybook/addon-actions": "^8.1.11",
+    "@storybook/vue3": "^8.1.11",
     "@types/lodash": "^4.14.200",
     "@vue/shared": "^3.2.45",
     "@vueuse/core": "^10.11.0",
+    "autoprefixer": "^10.4.19",
     "centrifuge": "^5.2.2",
+    "confusing-browser-globals": "^1.0.11",
     "cytoscape": "^3.26.0",
     "cytoscape-dagre": "^2.5.0",
     "d3-graphviz": "^5.0.2",
     "d3-selection": "^3.0.0",
     "downloadjs": "^1.4.7",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-vue": "^9.27.0",
     "flame-chart-js": "^3.0",
     "highlight.js": "^11.7.0",
     "html-to-image": "^1.11.4",
+    "lodash": "^4.17.21",
     "lodash.debounce": "^4.0.8",
     "lodash.isstring": "^4.0.1",
     "lodash.pick": "^4.4.0",
@@ -94,6 +94,7 @@
     "pluralize": "^8.0.0",
     "tailwindcss": "^3.2.4",
     "vue": "^3.2.45",
+    "vue-eslint-parser": "^9.4.3",
     "vue3-tabs-component": "^1.2.0"
   }
 }

pages/http-dump/[id].vue

@@ -1,13 +1,15 @@
 <script lang="ts" setup>
-import { useTitle } from "@vueuse/core";
-import { computed, onMounted, ref } from "vue";
-import { useFetch, useRoute, useRouter, useNuxtApp } from "#app"; // eslint-disable-line @conarti/feature-sliced/layers-slices
-import { PageEventHeader } from "~/src/widgets/ui";
-import { useHttpDump } from "~/src/entities/http-dump";
-import type { HttpDumpServer } from "~/src/entities/http-dump/types";
-import { useEvents } from "~/src/shared/lib/use-events";
-import type { EventId, ServerEvent } from "~/src/shared/types";
-import { HttpDumpPage } from "~/src/screens/http-dump";
+import { useTitle } from '@vueuse/core';
+import { computed, onMounted, ref } from 'vue';
+import {
+  useFetch, useRoute, useRouter, useNuxtApp,
+} from '#app'; // eslint-disable-line @conarti/feature-sliced/layers-slices
+import { PageEventHeader } from '~/src/widgets/ui';
+import { useHttpDump } from '~/src/entities/http-dump';
+import type { HttpDumpServer } from '~/src/entities/http-dump/types';
+import { useEvents } from '~/src/shared/lib/use-events';
+import type { EventId, ServerEvent } from '~/src/shared/types';
+import { HttpDumpPage } from '~/src/screens/http-dump';
 
 const { normalizeHttpDumpEvent } = useHttpDump();
 
@@ -23,17 +25,15 @@ const { $authToken } = useNuxtApp();
 const isLoading = ref(false);
 const serverEvent = ref<Event | null>(null);
 
-const event = computed(() =>
-  serverEvent.value
-    ? normalizeHttpDumpEvent(
-        serverEvent.value as unknown as ServerEvent<HttpDumpServer>
-      )
-    : null
-);
+const event = computed(() => (serverEvent.value
+  ? normalizeHttpDumpEvent(
+    serverEvent.value as unknown as ServerEvent<HttpDumpServer>,
+  )
+  : null));
 
 const getEvent = async () => {
   await useFetch(events.getUrl(eventId), {
-    headers: { "X-Auth-Token": $authToken.token || "" },
+    headers: { 'X-Auth-Token': $authToken.token || '' },
     onRequest() {
       isLoading.value = true;
     },
@@ -42,10 +42,10 @@ const getEvent = async () => {
       isLoading.value = false;
     },
     onResponseError() {
-      router.push("/404");
+      router.push('/404');
     },
     onRequestError() {
-      router.push("/404");
+      router.push('/404');
     },
   });
 };

pages/http-dump/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { PageHeader, PageLayout } from "~/src/widgets/ui";
-import { PAGE_TYPES } from "~/src/shared/constants";
+import { PageHeader, PageLayout } from '~/src/widgets/ui';
+import { PAGE_TYPES } from '~/src/shared/constants';
 </script>
 
 <template>

pages/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { PageHeader, PageLayout } from "~/src/widgets/ui"; // eslint-disable-line @conarti/feature-sliced/public-api
-import { PAGE_TYPES } from "~/src/shared/constants";
+import { PageHeader, PageLayout } from '~/src/widgets/ui'; // eslint-disable-line @conarti/feature-sliced/public-api
+import { PAGE_TYPES } from '~/src/shared/constants';
 </script>
 
 <template>

pages/inspector/[id].vue

@@ -1,13 +1,15 @@
 <script lang="ts" setup>
-import { useTitle } from "@vueuse/core";
-import { onMounted, computed, ref } from "vue";
-import { useFetch, useRoute, useRouter, useNuxtApp } from "#app"; // eslint-disable-line @conarti/feature-sliced/layers-slices
-import { PageEventHeader } from "~/src/widgets/ui";
-import { useInspector } from "~/src/entities/inspector";
-import type { Inspector } from "~/src/entities/inspector/types";
-import { useEvents } from "~/src/shared/lib/use-events";
-import type { EventId, ServerEvent } from "~/src/shared/types";
-import { InspectorPage } from "~/src/screens/inspector";
+import { useTitle } from '@vueuse/core';
+import { onMounted, computed, ref } from 'vue';
+import {
+  useFetch, useRoute, useRouter, useNuxtApp,
+} from '#app'; // eslint-disable-line @conarti/feature-sliced/layers-slices
+import { PageEventHeader } from '~/src/widgets/ui';
+import { useInspector } from '~/src/entities/inspector';
+import type { Inspector } from '~/src/entities/inspector/types';
+import { useEvents } from '~/src/shared/lib/use-events';
+import type { EventId, ServerEvent } from '~/src/shared/types';
+import { InspectorPage } from '~/src/screens/inspector';
 
 const { normalizeInspectorEvent } = useInspector();
 
@@ -23,28 +25,26 @@ const { events } = useEvents();
 const isLoading = ref(false);
 const serverEvent = ref<Event | null>(null);
 
-const event = computed(() =>
-  serverEvent.value
-    ? normalizeInspectorEvent(
-        serverEvent.value as unknown as ServerEvent<Inspector>
-      )
-    : null
-);
+const event = computed(() => (serverEvent.value
+  ? normalizeInspectorEvent(
+    serverEvent.value as unknown as ServerEvent<Inspector>,
+  )
+  : null));
 
 const getEvent = async () => {
   isLoading.value = true;
 
   await useFetch(events.getUrl(eventId), {
-    headers: { "X-Auth-Token": $authToken.token || "" },
+    headers: { 'X-Auth-Token': $authToken.token || '' },
     onResponse({ response: { _data } }) {
       serverEvent.value = _data;
       isLoading.value = false;
     },
     onResponseError() {
-      router.push("/404");
+      router.push('/404');
     },
     onRequestError() {
-      router.push("/404");
+      router.push('/404');
     },
   });
 };

pages/inspector/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { PageHeader, PageLayout } from "~/src/widgets/ui";
-import { PAGE_TYPES } from "~/src/shared/constants";
+import { PageHeader, PageLayout } from '~/src/widgets/ui';
+import { PAGE_TYPES } from '~/src/shared/constants';
 </script>
 
 <template>

pages/login.vue

@@ -1,18 +1,18 @@
 <script setup lang="ts">
-import { storeToRefs } from "pinia";
-import { computed } from "vue";
-import { navigateTo, setPageLayout } from "#app"; // eslint-disable-line @conarti/feature-sliced/layers-slices
-import { REST_API_URL } from "~/src/shared/lib/io";
-import { useProfileStore, useSettingsStore } from "~/src/shared/stores";
-import { IconSvg } from "~/src/shared/ui";
+import { storeToRefs } from 'pinia';
+import { computed } from 'vue';
+import { navigateTo, setPageLayout } from '#app'; // eslint-disable-line @conarti/feature-sliced/layers-slices
+import { REST_API_URL } from '~/src/shared/lib/io';
+import { useProfileStore, useSettingsStore } from '~/src/shared/stores';
+import { IconSvg } from '~/src/shared/ui';
 
-setPageLayout("blank");
+setPageLayout('blank');
 
 const store = useProfileStore();
 const { auth } = storeToRefs(useSettingsStore());
 
 if (store.isAuthenticated) {
-  await navigateTo("/");
+  await navigateTo('/');
 }
 
 const loginUrl = computed(() => `${REST_API_URL}/${auth.value.loginUrl}`);