chore: fix eslint issues

azat-io · Oct 15, 2024 · 2285ca6 · 2285ca6
1 parent 441b80c
commit 2285ca6
Show file tree

Hide file tree

Showing 12 changed files with 671 additions and 386 deletions.
diff --git a/package.json b/package.json
@@ -20,9 +20,9 @@
     "release:publish": "clean-publish",
     "release:version": "changelogen --output changelog.md --release --push",
     "test": "pnpm run /^test:/",
-    "test:format": "prettier --check \"**/*.{js,ts,css,json,md,yml}\"",
-    "test:css": "stylelint **/*.css",
-    "test:js": "eslint \"**/*.{js,ts}\"",
+    "test:format": "prettier --check \"**/*.{svelte,js,ts,css,json,md,yml}\"",
+    "test:css": "stylelint **/*.{svelte,css}",
+    "test:js": "eslint \"**/*.{svelte,js,ts}\"",
     "test:spelling": "cspell \"**/*\"",
     "test:svelte": "svelte-check",
     "test:types": "tsc --noEmit --pretty",
@@ -38,20 +38,21 @@
     "@svelte-plugins/tooltips": "^3.0.1",
     "@sveltejs/vite-plugin-svelte": "4.0.0-next.8",
     "@tanstack/svelte-table": "9.0.0-alpha.10",
+    "@tanstack/table-core": "9.0.0-alpha.10",
     "@types/html-minifier-terser": "^7.0.2",
     "@types/node": "^22.7.5",
-    "@typescript-eslint/eslint-plugin": "^8.8.1",
-    "@typescript-eslint/parser": "^8.8.1",
+    "@typescript-eslint/eslint-plugin": "^8.9.0",
+    "@typescript-eslint/parser": "^8.9.0",
     "browserslist": "^4.24.0",
     "changelogen": "^0.5.7",
     "clean-publish": "^5.0.0",
-    "cspell": "^8.14.4",
+    "cspell": "^8.15.2",
     "date-fns": "^4.1.0",
     "eslint": "^9.12.0",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-n": "^17.11.1",
     "eslint-plugin-node-import": "^1.0.4",
-    "eslint-plugin-perfectionist": "^3.8.0",
+    "eslint-plugin-perfectionist": "^3.9.0",
     "eslint-plugin-prefer-arrow": "^1.2.3",
     "eslint-plugin-prefer-let": "^4.0.0",
     "eslint-plugin-promise": "^7.1.0",
@@ -65,7 +66,7 @@
     "prettier": "^3.3.3",
     "prettier-plugin-svelte": "^3.2.7",
     "simple-git-hooks": "^2.11.1",
-    "stylelint": "^16.9.0",
+    "stylelint": "^16.10.0",
     "stylelint-config-recess-order": "^5.1.1",
     "stylelint-gamut": "^1.3.4",
     "stylelint-order": "^6.0.4",
@@ -75,7 +76,7 @@
     "svelte-eslint-parser": "^0.41.1",
     "svelte-preprocess": "^6.0.3",
     "typescript": "^5.6.3",
-    "vite": "^5.4.8",
+    "vite": "^5.4.9",
     "vite-plugin-mock-dev-server": "^1.8.0",
     "vite-plugin-singlefile": "^2.0.2"
   }

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/preview/blocks/footer.svelte b/preview/blocks/footer.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
-  import Container from '~/elements/container.svelte'
   import Typography from '~/elements/typography.svelte'
+  import Container from '~/elements/container.svelte'
 </script>
 
 <footer class="footer">

diff --git a/preview/blocks/header.svelte b/preview/blocks/header.svelte
@@ -5,6 +5,7 @@
   import Logo from '~/elements/logo.svelte'
   import { data } from '~/stores/data'
 
+  // eslint-disable-next-line no-unused-expressions
   $theme
 </script>
 
@@ -28,11 +29,11 @@
         </div>
       </div>
       <div class="links">
-        <button class="button" on:click={toggleTheme}>
-          <Typography size="s" color="brand">Toggle Theme</Typography>
+        <button on:click={toggleTheme} class="button">
+          <Typography color="brand" size="s">Toggle Theme</Typography>
         </button>
         <a href="https://github.com/azat-io/todoctor" target="_blank">
-          <Typography size="s" color="brand">GitHub</Typography>
+          <Typography color="brand" size="s">GitHub</Typography>
         </a>
       </div>
     </div>

diff --git a/preview/blocks/list.svelte b/preview/blocks/list.svelte
@@ -1,13 +1,14 @@
 <script lang="ts">
   import type { ColumnDef } from '@tanstack/svelte-table'
 
-  import TableComment from '~/elements/table-comment.svelte'
   import { renderComponent } from '@tanstack/svelte-table'
-  import Container from '~/elements/container.svelte'
+
+  import TableComment from '~/elements/table-comment.svelte'
   import TableCode from '~/elements/table-code.svelte'
   import TableUser from '~/elements/table-user.svelte'
   import TablePath from '~/elements/table-path.svelte'
   import TableDate from '~/elements/table-date.svelte'
+  import Container from '~/elements/container.svelte'
   import Table from '~/elements/table.svelte'
   import { data } from '~/stores/data'
 
@@ -28,60 +29,60 @@
       ...rest,
     })) ?? []
 
-  $: currentPath = $data.currentPath
+  $: ({ currentPath } = $data)
 
   let columns: ColumnDef<Column>[] = [
     {
-      accessorKey: 'author',
-      header: 'Author',
       cell: props =>
         renderComponent(TableUser, {
           author: props.getValue() as string,
           email: props.row.original.email,
         }),
+      accessorKey: 'author',
+      header: 'Author',
       size: 280,
     },
     {
-      accessorKey: 'path',
-      header: 'Path',
       cell: props =>
         renderComponent(TablePath, {
           value: props.getValue() as string,
           line: props.row.original.line,
-          currentPath: currentPath,
+          currentPath,
         }),
+      accessorKey: 'path',
+      header: 'Path',
       size: 250,
     },
     {
-      accessorKey: 'commit',
-      header: 'Commit',
       cell: props =>
         renderComponent(TableCode, {
           summary: props.row.original.summary,
           value: props.getValue() as string,
         }),
+      accessorKey: 'commit',
+      header: 'Commit',
       size: 80,
     },
     {
-      accessorKey: 'comment',
-      header: 'Comment',
-      size: 380,
       cell: props =>
         renderComponent(TableComment, {
           value: props.getValue() as string,
         }),
+      accessorKey: 'comment',
+      header: 'Comment',
+      size: 380,
     },
     {
-      accessorKey: 'date',
-      header: 'Added',
+      sortingFn: (a, b) =>
+        new Date(a.original.date).getTime() -
+        new Date(b.original.date).getTime(),
       cell: props =>
         renderComponent(TableDate, {
           value: props.getValue() as string,
         }),
+      accessorKey: 'date',
+      header: 'Added',
       size: 130,
-      sortingFn: (a, b) =>
-        new Date(a.original.date).getTime() -
-        new Date(b.original.date).getTime(),
     },
   ]
 </script>

diff --git a/preview/elements/avatar.svelte b/preview/elements/avatar.svelte
@@ -6,12 +6,10 @@
 
   export let data: string = ''
 
-  openPeeps.schema.properties!.face
-
   let transformToCode = (string: string, length: number): number => {
     let hash = 0
 
-    for (let i = 0, len = string.length; i < len; i++) {
+    for (let len = string.length, i = 0; i < len; i++) {
       let chr = string.charCodeAt(i)
       hash = (hash << 5) - hash + chr
       hash |= 0

diff --git a/preview/elements/logo.svelte b/preview/elements/logo.svelte
@@ -10,15 +10,15 @@
   fill="none"
 >
   <path
-    fill="var(--color-content-primary)"
     d="M262.873 507.624c-2.832-7.468-11.803-30.302-14.12-35.967l-2.189-5.365-.129-91.418c-.043-50.302-.172-93.179-.257-95.325-.129-3.519-.301-4.249-1.717-7.167-1.932-3.863-4.807-6.696-8.885-8.627l-2.789-1.331-43.134-.257v-1.417c0-2.875 5.922-14.936 13.219-26.867l3.777-6.223 27.039-.43 2.876-1.459c3.176-1.631 6.523-4.85 8.026-7.725 1.158-2.318 2.146-6.825 2.146-9.958v-2.446l10-3.906a1936.37 1936.37 0 0 1 17.597-6.953c5.15-2.06 8.026-2.961 9.013-2.875l1.373.128-.128 8.799c-.086 4.85.042 10.129.3 11.76.858 5.966 4.378 10.73 9.829 13.434l2.446 1.201 65.238.43 3.862 2.188a426.764 426.764 0 0 0 9.872 5.322c5.622 2.962 12.447 6.739 14.721 8.198.773.472.945.901.859 2.232l-.129 1.631-8.369 4.506c-4.593 2.447-10.859 5.795-13.949 7.383l-5.58 2.875-65.667.429-2.704 1.417c-3.261 1.716-6.008 4.12-7.768 6.91-2.833 4.378-2.618-3.734-2.833 100.646l-.214 94.895-1.331 3.648c-.729 2.017-3.39 8.97-5.837 15.451-2.489 6.481-5.751 15.108-7.21 19.099l-2.704 7.297-1.46.129-1.416.085-1.674-4.377Z"
+    fill="var(--color-content-primary)"
   />
   <path
-    fill="var(--color-content-primary)"
     d="M289.87 432.815c-.129-3.863-.172-7.254-.043-7.468.171-.215 1.373-1.03 2.747-1.803 7.382-4.249 10.343-11.545 7.296-18.112-1.416-3.004-5.365-7.253-7.897-8.498l-1.889-.901v-28.67h1.417c.815 0 3.347 1.073 6.523 2.704 15.194 7.897 23.349 16.352 26.267 27.339.987 3.82.987 12.49-.043 16.31-2.575 9.571-9.657 17.468-19.957 22.232-4.722 2.189-10.215 3.949-12.318 3.949h-1.76l-.343-7.082ZM234.718 385.518c-.601-.086-3.863-.558-7.296-1.031-11.803-1.63-26.224-4.978-36.096-8.369-14.292-4.893-29.142-12.704-41.074-21.588-6.266-4.679-18.112-16.224-22.489-21.932-18.542-24.078-26.181-49.615-23.95-80.045 2.275-31.331 14.936-56.311 38.628-76.054 14.164-11.845 29.7-20.172 55.023-29.485 2.275-.859 9.442-3.176 15.88-5.151 10.988-3.39 18.284-5.279 62.148-16.094 27.897-6.868 40.687-11.503 51.417-18.628 7.812-5.236 14.078-12.66 15.237-18.112.815-3.905-1.417-10.257-5.237-15.15-7.339-9.27-25.751-16.782-43.005-17.554-17.683-.773-36.009 5.408-57.984 19.528-16.395 10.515-28.37 15.966-38.628 17.511-5.279.816-14.206.558-18.112-.472-3.176-.858-7.124-2.832-9.785-4.85-1.846-1.373-2.061-1.716-2.061-3.176 0-1.244.172-1.63.773-1.674.386 0-2.146-.515-5.708-1.073-19.014-3.047-21.589-3.991-26.825-10.172-3.734-4.377-5.58-8.24-5.58-11.674 0-3.777.945-6.566 2.876-8.455.901-.858 3.949-2.747 6.781-4.249 2.833-1.46 6.782-3.605 8.799-4.764 7.682-4.378 21.717-11.073 25.451-12.146 6.481-1.846 8.67-2.06 22.318-2.189 7.254-.086 14.722-.343 16.524-.6 6.481-.86 11.975-2.834 21.203-7.555 22.919-11.717 27.425-13.648 37.812-16.31 5.794-1.458 15.15-3.004 22.146-3.647 8.412-.73 26.009-.3 33.735.901 16.181 2.446 30.816 7.425 42.919 14.55 20.13 11.888 32.319 28.67 36.782 50.688.902 4.463.988 6.094.988 16.738 0 13.177-.387 15.923-3.52 25.28-7.253 21.717-25.709 39.615-56.868 55.237-15.795 7.898-30.087 12.876-54.851 19.057-14.722 3.691-37.083 11.202-53.435 17.983-9.271 3.863-22.104 10.258-26.825 13.348-16.953 11.159-28.284 27.383-32.876 46.997-1.116 4.807-1.202 5.794-1.202 14.163 0 7.726.129 9.657.944 13.434 3.219 14.764 9.443 26.481 19.572 36.954 9.785 10.086 21.76 17.64 39.571 24.936.859.343.902.773 1.159 8.198.172 4.292.301 12.146.301 17.425v9.571l-2.232-.043c-1.245-.043-2.747-.129-3.348-.257ZM190.983 83.493a44.35 44.35 0 0 0 13.906-6.266c4.721-3.262 4.592-3.563-.386-.988-10.301 5.28-16.996 6.996-27.598 7.04-4.849 0-6.437.128-5.493.428 4.678 1.46 13.391 1.374 19.571-.214Zm-.858-28.499c4.678-2.275 7.94-4.592 6.996-4.978-2.275-.859-7.426.171-12.833 2.618-1.889.858-4.464 1.888-5.752 2.274l-2.36.73 1.502.472c2.661.816 3.133.901 6.009.773 2.317-.13 3.562-.472 6.438-1.889Z"
+    fill="var(--color-content-primary)"
   />
   <path
-    fill="var(--color-content-primary)"
     d="M246.607 122.85c-.172-.129-.301-1.416-.301-2.833 0-2.403-.043-2.532-.944-2.317-11.717 2.832-17.597 3.476-29.486 3.176-11.03-.258-14.764-.859-23.434-3.777-9.313-3.176-15.966-7.125-21.202-12.619-4.678-4.935-7.768-10.343-7.768-13.562 0-1.588.085-1.674 1.33-1.674 1.073 0 2.017.644 4.893 3.348 5.88 5.536 13.176 9.27 21.932 11.202 16.395 3.648 33.134.729 55.752-9.614 15.881-7.254 27.641-11.074 39.486-12.747 2.146-.3 7.468-.515 12.018-.515 9.313.042 15.58.944 22.661 3.261l4.163 1.331v1.674c0 1.416-.128 1.63-1.03 1.63-.558 0-2.918.387-5.236.86-11.416 2.317-20.644 6.566-27.34 12.489-2.961 2.575-6.266 7.124-6.867 9.356-.601 2.189-.901 2.361-6.953 4.035-23.09 6.481-30.773 8.24-31.674 7.296Z"
+    fill="var(--color-content-primary)"
   />
 </svg>
diff --git a/preview/elements/table-code.svelte b/preview/elements/table-code.svelte
@@ -5,7 +5,7 @@
   export let summary = ''
 </script>
 
-<Tooltip content={summary} theme="custom-tooltip">
+<Tooltip theme="custom-tooltip" content={summary}>
   <code class="code">
     {value}
   </code>

diff --git a/preview/elements/table-date.svelte b/preview/elements/table-date.svelte
@@ -14,7 +14,7 @@
   <Typography size="s">
     {`${relativeValue} ago`}
   </Typography>
-  <Typography size="xs" color="secondary">
+  <Typography color="secondary" size="xs">
     {formattedValue}
   </Typography>
 </div>

diff --git a/preview/elements/table-path.svelte b/preview/elements/table-path.svelte
@@ -4,8 +4,6 @@
   export let value = ''
   export let currentPath = ''
   export let line = 0
-
-  console.log('currentPath', currentPath)
 </script>
 
 <a href={`${currentPath}/${value}`}>

diff --git a/preview/elements/table.svelte b/preview/elements/table.svelte
@@ -1,18 +1,16 @@
-<script lang="ts" generics="T extends Object">
+<script generics="T extends Object" lang="ts">
+  /* global T */
+
   import type {
     TableOptions,
     SortingState,
     OnChangeFn,
     ColumnDef,
   } from '@tanstack/svelte-table'
 
+  import { getSortedRowModel, getCoreRowModel } from '@tanstack/table-core'
+  import { createTable, FlexRender } from '@tanstack/svelte-table'
   import { writable } from 'svelte/store'
-  import {
-    getSortedRowModel,
-    getCoreRowModel,
-    createTable,
-    FlexRender,
-  } from '@tanstack/svelte-table'
 
   export let data: T[] = []
   export let columns: ColumnDef<T>[] = []
@@ -35,26 +33,26 @@
   }
 
   let options = writable<TableOptions<T>>({
-    data,
-    columns,
+    getSortedRowModel: getSortedRowModel(),
+    getCoreRowModel: getCoreRowModel(),
     state: {
       sorting,
     },
     onSortingChange: setSorting,
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
     debugTable: true,
+    columns,
+    data,
   })
 
   $: options.set({
-    data,
-    columns,
+    getSortedRowModel: getSortedRowModel(),
+    getCoreRowModel: getCoreRowModel(),
     state: {
       sorting,
     },
     onSortingChange: setSorting,
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
+    columns,
+    data,
   })
 
   $: table = createTable($options)
@@ -65,20 +63,20 @@
     <thead>
       {#each table.getHeaderGroups() as headerGroup}
         <tr class="tr">
-          <th class="th" style="inline-size: 40px">#</th>
+          <th style="inline-size: 40px" class="th">#</th>
           {#each headerGroup.headers as header}
             <th
-              class="th"
               style={header.getSize()
                 ? `inline-size: ${header.getSize()}px`
                 : ''}
+              class="th"
             >
               {#if !header.isPlaceholder}
                 <button
-                  class="button"
+                  on:click={header.column.getToggleSortingHandler()}
                   class:cursor-pointer={header.column.getCanSort()}
                   class:select-none={header.column.getCanSort()}
-                  on:click={header.column.getToggleSortingHandler()}
+                  class="button"
                 >
                   <FlexRender
                     content={header.column.columnDef.header}
@@ -99,7 +97,7 @@
     <tbody>
       {#each table.getRowModel().rows as row, index}
         <tr class="tr">
-          <td class="td td-index" style="inline-size: 40px">{index + 1}</td>
+          <td style="inline-size: 40px" class="td td-index">{index + 1}</td>
           {#each row.getVisibleCells() as cell}
             <td style={`inline-size: ${cell.column.getSize()}px`} class="td">
               <FlexRender

diff --git a/preview/elements/typography.svelte b/preview/elements/typography.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
   export let color: 'secondary' | 'primary' | 'inherit' | 'brand' = 'inherit'
   export let size: '2xl' | '2xs' | 'xl' | 'xs' | 'l' | 'm' | 's' = 'm'
-  export let mbs: '2xs' | 'xs' | 'xl' | 's' | 'm' | 'l' | null = null
-  export let mbe: '2xs' | 'xs' | 'xl' | 's' | 'm' | 'l' | null = null
-  export let align: 'left' | 'center' | 'right' = 'left'
+  export let mbs: '2xs' | 'xs' | 'xl' | null | 's' | 'm' | 'l' = null
+  export let mbe: '2xs' | 'xs' | 'xl' | null | 's' | 'm' | 'l' = null
+  export let align: 'center' | 'right' | 'left' = 'left'
   export let noWrap: boolean = false
   export let bold: boolean = false
   export let tag = 'p'