fix lint issues

AlidotSal · AlidotSal · commit 84d5720f4eb9 · 2024-10-25T21:28:45.000+03:30
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/pages/404.tsx b/src/pages/404.tsx
@@ -1,4 +1,4 @@
-import { Component } from 'solid-js';
+import type { Component } from 'solid-js';
 import { Title } from '@solidjs/meta';
 import { Icon } from 'solid-heroicons';
 import { emojiSad } from 'solid-heroicons/outline';
diff --git a/src/pages/Blog.data.ts b/src/pages/Blog.data.ts
@@ -1,6 +1,6 @@
-import { RouteLoadFunc } from '@solidjs/router';
+import type { RouteLoadFunc } from '@solidjs/router';
 import type { Component } from 'solid-js';
-import { SpotifyProps, TweetProps, TwitchProps, YouTubeProps } from 'solid-social';
+import type { SpotifyProps, TweetProps, TwitchProps, YouTubeProps } from 'solid-social';
 
 export type MDXComponent = Component<{
   components: {
diff --git a/src/pages/Blog.tsx b/src/pages/Blog.tsx
@@ -1,4 +1,4 @@
-import { Component, For } from 'solid-js';
+import { type Component, For } from 'solid-js';
 import Footer from '../components/Footer';
 import { A } from '@solidjs/router';
 import { Title } from '@solidjs/meta';
@@ -26,7 +26,7 @@ const Blog: Component<{ data: BlogData }> = (props) => {
                   href={`/blog/${id}`}
                   class="block px-3 lg:px-0 text-md mx-auto mb-10 pb-10 text-center"
                 >
-                  <img class="lg:w-4/6 mx-auto rounded-md mb-10 shadow-md" src={article.img} />
+                  <img alt="article poster" class="lg:w-4/6 mx-auto rounded-md mb-10 shadow-md" src={article.img} />
                   <h1 class="text-xl lg:text-2xl mb-3 font-semibold text-solid-medium dark:text-solid-darkdefault">
                     {article.title}
                   </h1>
diff --git a/src/pages/BlogArticle.data.ts b/src/pages/BlogArticle.data.ts
@@ -1,6 +1,6 @@
 import { createResource } from 'solid-js';
-import { RouteLoadFunc } from '@solidjs/router';
-import { BlogInfo, list, MDXComponent } from './Blog.data';
+import type { RouteLoadFunc } from '@solidjs/router';
+import { type BlogInfo, list, type MDXComponent } from './Blog.data';
 
 export interface BlogArticleData {
   loading: boolean;
diff --git a/src/pages/BlogArticle.tsx b/src/pages/BlogArticle.tsx
@@ -1,4 +1,4 @@
-import { Component, Show, createMemo } from 'solid-js';
+import { type Component, Show, createMemo } from 'solid-js';
 import { A } from '@solidjs/router';
 import { useRouteReadyState } from '../utils/routeReadyState';
 import Footer from '../components/Footer';
@@ -12,7 +12,7 @@ export const BlogArticle: Component<{ data: BlogArticleData }> = (props) => {
   const ctx = useAppState();
 
   useRouteReadyState();
-  const chevron = createMemo(() => (ctx.dir == 'rtl' ? 'chevron-right' : 'chevron-left'));
+  const chevron = createMemo(() => (ctx.dir === 'rtl' ? 'chevron-right' : 'chevron-left'));
 
   return (
     <div class="flex flex-col">
@@ -26,13 +26,13 @@ export const BlogArticle: Component<{ data: BlogArticleData }> = (props) => {
             >
               <div class="container lg:px-10">
                 <div class="text-center space-y-5">
-                  <img class="rounded-md mb-10 shadow-md" src={data.details.img} />
+                  <img alt="poster" class="rounded-md mb-10 shadow-md" src={data.details.img} />
                   <h1 class="text-4xl font-semibold mt-10 text-solid-medium dark:text-solid-darkdefault">
                     {data.details.title}
                   </h1>
                   <div class="text-md">
                     Posted by{' '}
-                    <a target="_blank" rel="noopener" href={data.details.author_url}>
+                    <a target="_blank" rel="noreferrer noopener" href={data.details.author_url}>
                       {data.details.author}
                     </a>{' '}
                     on {new Date(data.details.date).toDateString()}
diff --git a/src/pages/Contributors.tsx b/src/pages/Contributors.tsx
@@ -1,7 +1,7 @@
-import { Component, For, Show } from 'solid-js';
+import { type Component, For, Show } from 'solid-js';
 import { Title } from '@solidjs/meta';
 import github from '../assets/github.svg';
-import { ContributorsDataProps } from './Contributors.data';
+import type { ContributorsDataProps } from './Contributors.data';
 import Footer from '../components/Footer';
 import { useRouteReadyState } from '../utils/routeReadyState';
 import { useAppState } from '../AppContext';
@@ -31,7 +31,7 @@ const CoreMember: Component<CoreMemberProps> = (props) => {
         <hr class="self-stretch" />
         <small>{props.role}</small>
         <p class="block">{props.bio}</p>
-        <a target="_blank" rel="noopener" href={`https://github.com/${props.github}`}>
+        <a target="_blank" rel="noreferrer noopener" href={`https://github.com/${props.github}`}>
           <span class="sr-only">GitHub URL of {props.github}</span>
           <img class="w-7" alt={`GitHub URL of ${props.github}`} src={github} />
         </a>
@@ -100,7 +100,7 @@ const Contributors: Component<{ data: ContributorsDataProps }> = (props) => {
               <h2 class="text-2xl mb-5 font-semibold text-solid-default dark:text-solid-darkdefault">
                 {t('contributors.contributors')}
               </h2>
-              <a target="_blank" href="https://github.com/solidjs/solid/graphs/contributors">
+              <a target="_blank" href="https://github.com/solidjs/solid/graphs/contributors" rel="noreferrer">
                 <img src="https://camo.githubusercontent.com/c2d6e18c0cf67d82e51738442d4082326b7cf63a1552e9d27f773eafe0d3d3be/68747470733a2f2f6f70656e636f6c6c6563746976652e636f6d2f736f6c69642f636f6e7472696275746f72732e7376673f77696474683d38393026627574746f6e3d66616c7365" />
               </a>
             </div>
@@ -130,7 +130,7 @@ const Contributors: Component<{ data: ContributorsDataProps }> = (props) => {
                 <a
                   target="_blank"
                   class="text-solid-default dark:text-solid-darkdefault "
-                  href="https://opencollective.com/solid"
+                  href="https://opencollective.com/solid" rel="noreferrer"
                 >
                   Contribute today &raquo;
                 </a>
diff --git a/src/pages/Docs.data.ts b/src/pages/Docs.data.ts
@@ -1,6 +1,6 @@
-import { useLocation, RouteLoadFunc } from '@solidjs/router';
+import { useLocation, type RouteLoadFunc } from '@solidjs/router';
 import { createResource } from 'solid-js';
-import { DocFile, getApi } from '@solid.js/docs';
+import { type DocFile, getApi } from '@solid.js/docs';
 import { useAppState } from '../AppContext';
 
 export interface DocData {
diff --git a/src/pages/Docs.tsx b/src/pages/Docs.tsx
@@ -62,7 +62,7 @@ const Sidebar: Component<{
                       `#${slug(secondLevel.value)}` === props.hash,
                     'hover:text-gray-400 dark:hover:text-gray-400':
                       `#${slug(secondLevel.value)}` !== props.hash,
-                    'pb-2': index() == firstLevel.children!.length - 1,
+                    'pb-2': index() === firstLevel.children!.length - 1,
                   }}
                   href={`#${slug(secondLevel.value)}`}
                 >
@@ -108,7 +108,7 @@ const Content: Component<{
           <a
             class="underline"
             target="_blank"
-            href="https://github.com/solidjs/solid-docs/blob/main/README.md#support"
+            href="https://github.com/solidjs/solid-docs/blob/main/README.md#support" rel="noreferrer"
           >
             helping with on-going translation efforts
           </a>
@@ -154,7 +154,7 @@ const Docs: Component<{ hash?: string; data: DocData }> = (props) => {
     if (!data.loading) {
       if (globalThis.location.hash !== '') {
         const anchor = document.getElementById(globalThis.location.hash.replace('#', ''));
-        anchor && anchor.scrollIntoView(true);
+        anchor?.scrollIntoView(true);
       }
     }
   });
diff --git a/src/pages/Examples.tsx b/src/pages/Examples.tsx
@@ -1,7 +1,7 @@
 import Repl from 'solid-repl/dist/repl';
 import { A, useParams } from '@solidjs/router';
-import { For, Component, createSignal, createEffect, batch, ErrorBoundary, Show } from 'solid-js';
-import { ExamplesDataRoute } from './Examples.data';
+import { For, type Component, createSignal, createEffect, batch, ErrorBoundary, Show } from 'solid-js';
+import type { ExamplesDataRoute } from './Examples.data';
 
 import { compiler, formatter, linter } from '../components/setupRepl';
 import { useRouteReadyState } from '../utils/routeReadyState';
diff --git a/src/pages/Guide.data.ts b/src/pages/Guide.data.ts
@@ -1,7 +1,7 @@
-import { useLocation, RouteLoadFunc } from '@solidjs/router';
+import { useLocation, type RouteLoadFunc } from '@solidjs/router';
 import { createResource } from 'solid-js';
 import { getDoc } from '@solid.js/docs';
-import { DocData } from './Docs.data';
+import type { DocData } from './Docs.data';
 import { useAppState } from '../AppContext';
 
 export const GuideData: RouteLoadFunc<DocData> = (props) => {
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
@@ -1,5 +1,5 @@
 import {
-  Component,
+  type Component,
   createSignal,
   lazy,
   onMount,
@@ -22,7 +22,7 @@ import productive from '../assets/icons/productive.svg';
 import { shoppingCart } from 'solid-heroicons/outline';
 import { Icon } from 'solid-heroicons';
 import Footer from '../components/Footer';
-import Benchmarks, { GraphData } from '../components/Benchmarks';
+import Benchmarks, { type GraphData } from '../components/Benchmarks';
 import { useRouteReadyState } from '../utils/routeReadyState';
 import { useAppState } from '../AppContext';
 
@@ -57,7 +57,7 @@ const Home: Component<{ data: { benchmarks: GraphData[] } }> = (props) => {
   useRouteReadyState();
 
   const chevron = createMemo(() => {
-    const direction = ctx.dir == 'rtl' ? 'chevron-left' : 'chevron-right';
+    const direction = ctx.dir === 'rtl' ? 'chevron-left' : 'chevron-right';
     return `chevron ${direction}`;
   });
 
@@ -109,7 +109,7 @@ const Home: Component<{ data: { benchmarks: GraphData[] } }> = (props) => {
                     {fact.link ? (
                       <a
                         target="_blank"
-                        rel="noopener"
+                        rel="noreferrer noopener"
                         href={fact.link}
                         class="flex p-3 justify-center border-b-2 border-gray-100 dark:border-solid-darkLighterBg md:border-none md:px-5 md:py-5 w-full"
                       >
diff --git a/src/pages/Media.tsx b/src/pages/Media.tsx
@@ -1,4 +1,4 @@
-import { Component, For } from 'solid-js';
+import { type Component, For } from 'solid-js';
 import downloadArrow from '../assets/download-arrow.svg';
 import Footer from '../components/Footer';
 import { useRouteReadyState } from '../utils/routeReadyState';
diff --git a/src/pages/Packages.tsx b/src/pages/Packages.tsx
@@ -1,10 +1,10 @@
-import { Component, For, Show, createSignal, createMemo, onMount, JSX } from 'solid-js';
+import { type Component, For, Show, createSignal, createMemo, onMount, type JSX } from 'solid-js';
 import { useNavigate, useSearchParams } from '@solidjs/router';
-import { PackagesDataProps } from './Packages.data';
+import type { PackagesDataProps } from './Packages.data';
 import Fuse from 'fuse.js';
 import { debounce } from '@solid-primitives/scheduled';
 import { makeIntersectionObserver } from '@solid-primitives/intersection-observer';
-import { Resource, ResourceCategory, ResourceType, ResourceTypeIcons } from './Resources/Ecosystem';
+import { type Resource, ResourceCategory, type ResourceType, ResourceTypeIcons } from './Resources/Ecosystem';
 import { parseKeyword } from '../utils/parseKeyword';
 import { rememberSearch } from '../utils/rememberSearch';
 import SideContent from '../components/layout/SideContent';
@@ -83,7 +83,7 @@ const ResourceLink: Component<Resource> = (props) => {
     <a
       target="_blank"
       href={props.link}
-      rel="nofollow"
+      rel="noreferrer nofollow"
       class="border border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 rounded px-3.5 py-3 min-h-[144px] flex flex-col"
     >
       <div class="flex items-center">
@@ -104,7 +104,7 @@ const ResourceLink: Component<Resource> = (props) => {
         <div>
           <Show when={props.author && props.author_url}>
             <a
-              rel="noopener"
+              rel="noreferrer noopener"
               href={props.author_url}
               target="_blank"
               class="text-xs text-gray-500 dark:text-gray-300 inline hover:text-solid-medium"
@@ -162,8 +162,8 @@ const Packages: Component<{ data: PackagesDataProps }> = (props) => {
 
   // Produces a base set of filtered results
   const resources = createMemo<Resource[]>(() => {
-    let filteredData = [];
-    if (keyword() == '') {
+    const filteredData = [];
+    if (keyword() === '') {
       for (const item of data.list) {
         if (officialCheck() && !item.official) continue;
         if (maintainedCheck() && item.maintained === false) continue;
@@ -176,7 +176,7 @@ const Packages: Component<{ data: PackagesDataProps }> = (props) => {
 
     const search = fs.search(keyword()).map((result) => result.item);
 
-    let result = [];
+    const result = [];
 
     for (const item of search) {
       if (officialCheck() && !item.official) continue;
diff --git a/src/pages/Resources.tsx b/src/pages/Resources.tsx
@@ -6,16 +6,16 @@ import Fuse from 'fuse.js';
 import Dismiss from 'solid-dismiss';
 import { Icon } from 'solid-heroicons';
 import { chevronLeft, chevronRight, filter, shieldCheck } from 'solid-heroicons/outline';
-import { Component, For, Show, createMemo, createSignal } from 'solid-js';
+import { type Component, For, Show, createMemo, createSignal } from 'solid-js';
 import { createStore } from 'solid-js/store';
 import { Title } from '@solidjs/meta';
 import { useAppState } from '../AppContext';
 import Footer from '../components/Footer';
 import { parseKeyword } from '../utils/parseKeyword';
 import { rememberSearch } from '../utils/rememberSearch';
 import { useRouteReadyState } from '../utils/routeReadyState';
-import { ResourcesDataProps } from './Resources.data';
-import { PackageType, Resource, ResourceType, ResourceTypeIcons } from './Resources/Ecosystem';
+import type { ResourcesDataProps } from './Resources.data';
+import { type PackageType, type Resource, ResourceType, ResourceTypeIcons } from './Resources/Ecosystem';
 
 const AResource: Component<Resource> = (props) => {
   const { t } = useAppState();
@@ -31,7 +31,7 @@ const AResource: Component<Resource> = (props) => {
         class="relative grid grid-cols-10 md:grid-cols-12 grid-flow-col gap-2 text-solid"
         target="_blank"
         href={props.link}
-        rel="nofollow"
+        rel="noreferrer nofollow"
       >
         <div class="col-span-2 md:col-span-3 lg:col-span-1 flex items-center justify-center">
           <figure class="flex justify-center content-center w-11 h-11 md:w-14 md:h-14 p-1.5 border-4 border-solid-medium dark:border-solid-darkdefault rounded-full text-white flex-shrink-0">
@@ -44,7 +44,7 @@ const AResource: Component<Resource> = (props) => {
         <div class="col-start-3 col-end-[-1] md:col-span-7 lg:col-span-10 items-center">
           <div dir="ltr">
             <div class="text-lg">{props.title}</div>
-            <Show when={props.description != ''}>
+            <Show when={props.description !== ''}>
               <div class="text-xs mt-2 text-black dark:text-white mb-3 block">
                 {props.description}
               </div>
@@ -58,7 +58,7 @@ const AResource: Component<Resource> = (props) => {
           <Show when={props.author && props.author_url}>
             <div class="rtl:text-right">
               <a
-                rel="noopener"
+                rel="noreferrer noopener"
                 href={props.author_url}
                 target="_blank"
                 class="text-xs text-gray-500 dark:text-gray-300 inline hover:text-solid-medium"
@@ -103,7 +103,7 @@ const Resources: Component<{ data: ResourcesDataProps }> = (props) => {
   const debouncedKeyword = debounce((str: string) => setKeyword(str), 250);
   rememberSearch(keyword);
   const resources = createMemo(() => {
-    if (keyword() == '') {
+    if (keyword() === '') {
       return data.list;
     }
     return fs.search(keyword()).map((result) => result.item);
@@ -170,7 +170,7 @@ const Resources: Component<{ data: ResourcesDataProps }> = (props) => {
           <div
             class="text-xs bg-gray-100 dark:bg-solid-darkLighterBg p-4 rounded"
             innerHTML={t('resources.cta')}
-          ></div>
+          />
           <div class="hidden md:block">
             <input
               class="my-5 rounded border-solid w-full border-gray-400 border bg-transparent p-3 placeholder-opacity-50 placeholder-gray-500 dark:placeholder-white"
@@ -193,11 +193,10 @@ const Resources: Component<{ data: ResourcesDataProps }> = (props) => {
                       const pos = arr.indexOf(type);
                       if (pos === -1) {
                         return [...arr, type];
-                      } else {
-                        const newArray = arr.slice();
-                        newArray.splice(pos, 1);
-                        return newArray;
                       }
+                      const newArray = arr.slice();
+                      newArray.splice(pos, 1);
+                      return newArray;
                     });
                   }}
                   classList={{
@@ -235,8 +234,8 @@ const Resources: Component<{ data: ResourcesDataProps }> = (props) => {
             classList={{
               'shadow-md': stickyBarActive(),
             }}
-          ></div>
-          <div class="absolute w-full h-full top-0 left-0 bg-white dark:bg-neutral-600 z-negative"></div>
+          />
+          <div class="absolute w-full h-full top-0 left-0 bg-white dark:bg-neutral-600 z-negative" />
           <div class="h-[45px] px-5 flex justify-between gap-1">
             <div use:intersectionObserver class="absolute top-[-62px] h-0" />
             <input
@@ -288,11 +287,10 @@ const Resources: Component<{ data: ResourcesDataProps }> = (props) => {
                       const pos = arr.indexOf(type);
                       if (pos === -1) {
                         return [...arr, type];
-                      } else {
-                        const newArray = arr.slice();
-                        newArray.splice(pos, 1);
-                        return newArray;
                       }
+                      const newArray = arr.slice();
+                      newArray.splice(pos, 1);
+                      return newArray;
                     });
                   }}
                   classList={{
diff --git a/src/pages/Store.data.ts b/src/pages/Store.data.ts
@@ -1,5 +1,5 @@
 import { createEffect, on } from 'solid-js';
-import { RouteLoadFunc } from '@solidjs/router';
+import type { RouteLoadFunc } from '@solidjs/router';
 import { createCookieStorage } from '@solid-primitives/storage';
 import { createCollection, createCart } from '../utils/shopify';
 
@@ -12,14 +12,14 @@ export const StoreData: RouteLoadFunc = () => {
   const [collection] = createCollection(() => 'gid://shopify/Collection/285612933298', settings);
   const [cookie, setCookie] = createCookieStorage();
   const id: string | null =
-    !cookie.cartId || cookie.cartId == '' ? null : (cookie.cartId as string);
+    !cookie.cartId || cookie.cartId === '' ? null : (cookie.cartId as string);
   const commerce = createCart(id, settings);
   createEffect(
     on(
       () => [commerce.loading(), commerce.cart.id, commerce.cart.id],
       () => {
-        if (commerce.loading() == true) return;
-        if (commerce.cart.id != cookie.cartId) {
+        if (commerce.loading() === true) return;
+        if (commerce.cart.id !== cookie.cartId) {
           setCookie('cartId', commerce.cart.id);
         }
       },
diff --git a/src/pages/Store.tsx b/src/pages/Store.tsx
diff --git a/src/pages/Tutorial.data.ts b/src/pages/Tutorial.data.ts
diff --git a/src/pages/Tutorial.tsx b/src/pages/Tutorial.tsx

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { Component } from 'solid-js';`
	`1`	`+import type { Component } from 'solid-js';`
`2`	`2`	`import { Title } from '@solidjs/meta';`
`3`	`3`	`import { Icon } from 'solid-heroicons';`
`4`	`4`	`import { emojiSad } from 'solid-heroicons/outline';`