Merge pull request onwidget#429 from ShoGinn/eslint_corrections

Eslint corrections

eslint.config.js

@@ -54,6 +54,6 @@ export default [
     },
   },
   {
-    ignores: ['dist', 'node_modules', '.github', 'types.generated.d.ts'],
+    ignores: ['dist', 'node_modules', '.github', 'types.generated.d.ts', '.astro'],
   },
 ];

src/components/blog/RelatedPosts.astro

@@ -1,10 +1,10 @@
 ---
-import { APP_BLOG } from "astrowind:config";
+import { APP_BLOG } from 'astrowind:config';
 
-import { fetchPosts, getRelatedPosts } from "~/utils/blog";
-import BlogHighlightedPosts from "../widgets/BlogHighlightedPosts.astro";
-import type { Post } from "~/types";
-import { getBlogPermalink } from "~/utils/permalinks";
+import { getRelatedPosts } from '~/utils/blog';
+import BlogHighlightedPosts from '../widgets/BlogHighlightedPosts.astro';
+import type { Post } from '~/types';
+import { getBlogPermalink } from '~/utils/permalinks';
 
 export interface Props {
   post: Post;
@@ -18,7 +18,7 @@ const relatedPosts = post.tags ? await getRelatedPosts(post, 4) : [];
 {
   APP_BLOG.isRelatedPostsEnabled ? (
     <BlogHighlightedPosts
-      classes={{ container: "pt-0 lg:pt-0 md:pt-0" }}
+      classes={{ container: 'pt-0 lg:pt-0 md:pt-0' }}
       title="Related Posts"
       linkText="View All Posts"
       linkUrl={getBlogPermalink()}

src/components/blog/SinglePost.astro

@@ -16,7 +16,6 @@ export interface Props {
 }
 
 const { post, url } = Astro.props;
-const { Content } = post;
 ---
 
 <section class="py-8 sm:py-16 lg:py-20 mx-auto">

src/components/widgets/Content.astro

@@ -82,7 +82,7 @@ const {
                   widths={[400, 768]}
                   sizes="(max-width: 768px) 100vw, 432px"
                   layout="responsive"
-                  {...(image as any)}
+                  {...image}
                 />
               )}
             </div>

src/components/widgets/Features.astro

@@ -1,13 +1,13 @@
 ---
-import WidgetWrapper from "~/components/ui/WidgetWrapper.astro";
-import ItemGrid from "~/components/ui/ItemGrid.astro";
-import Headline from "~/components/ui/Headline.astro";
-import type { Features as Props } from "~/types";
+import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
+import ItemGrid from '~/components/ui/ItemGrid.astro';
+import Headline from '~/components/ui/Headline.astro';
+import type { Features as Props } from '~/types';
 
 const {
-  title = await Astro.slots.render("title"),
-  subtitle = await Astro.slots.render("subtitle"),
-  tagline = await Astro.slots.render("tagline"),
+  title = await Astro.slots.render('title'),
+  subtitle = await Astro.slots.render('subtitle'),
+  tagline = await Astro.slots.render('tagline'),
   items = [],
   columns = 2,
 
@@ -16,31 +16,21 @@ const {
   id,
   isDark = false,
   classes = {},
-  bg = await Astro.slots.render("bg"),
+  bg = await Astro.slots.render('bg'),
 } = Astro.props;
 ---
 
-<WidgetWrapper
-  id={id}
-  isDark={isDark}
-  containerClass={`max-w-5xl ${classes?.container ?? ""}`}
-  bg={bg}
->
-  <Headline
-    title={title}
-    subtitle={subtitle}
-    tagline={tagline}
-    classes={classes?.headline as Record<string, string>}
-  />
+<WidgetWrapper id={id} isDark={isDark} containerClass={`max-w-5xl ${classes?.container ?? ''}`} bg={bg}>
+  <Headline title={title} subtitle={subtitle} tagline={tagline} classes={classes?.headline as Record<string, string>} />
   <ItemGrid
     items={items}
     columns={columns}
     defaultIcon={defaultIcon}
     classes={{
-      container: "",
-      title: "md:text-[1.3rem]",
-      icon: "text-white bg-primary rounded-full w-10 h-10 p-2 md:w-12 md:h-12 md:p-3 mr-4 rtl:ml-4 rtl:mr-0",
-      ...((classes?.items as {}) ?? {}),
+      container: '',
+      title: 'md:text-[1.3rem]',
+      icon: 'text-white bg-primary rounded-full w-10 h-10 p-2 md:w-12 md:h-12 md:p-3 mr-4 rtl:ml-4 rtl:mr-0',
+      ...((classes?.items as Record<string, never>) ?? {}),
     }}
   />
 </WidgetWrapper>

src/components/widgets/Features2.astro

@@ -1,48 +1,38 @@
 ---
-import WidgetWrapper from "~/components/ui/WidgetWrapper.astro";
-import Headline from "~/components/ui/Headline.astro";
-import ItemGrid2 from "~/components/ui/ItemGrid2.astro";
-import type { Features as Props } from "~/types";
+import WidgetWrapper from '~/components/ui/WidgetWrapper.astro';
+import Headline from '~/components/ui/Headline.astro';
+import ItemGrid2 from '~/components/ui/ItemGrid2.astro';
+import type { Features as Props } from '~/types';
 
 const {
-  title = await Astro.slots.render("title"),
-  subtitle = await Astro.slots.render("subtitle"),
-  tagline = await Astro.slots.render("tagline"),
+  title = await Astro.slots.render('title'),
+  subtitle = await Astro.slots.render('subtitle'),
+  tagline = await Astro.slots.render('tagline'),
   items = [],
   columns = 3,
   defaultIcon,
 
   id,
   isDark = false,
   classes = {},
-  bg = await Astro.slots.render("bg"),
+  bg = await Astro.slots.render('bg'),
 } = Astro.props;
 ---
 
-<WidgetWrapper
-  id={id}
-  isDark={isDark}
-  containerClass={`max-w-7xl mx-auto ${classes?.container ?? ''}`}
-  bg={bg}
->
-  <Headline
-    title={title}
-    subtitle={subtitle}
-    tagline={tagline}
-    classes={classes?.headline as Record<string, string>}
-  />
+<WidgetWrapper id={id} isDark={isDark} containerClass={`max-w-7xl mx-auto ${classes?.container ?? ''}`} bg={bg}>
+  <Headline title={title} subtitle={subtitle} tagline={tagline} classes={classes?.headline as Record<string, string>} />
   <ItemGrid2
     items={items}
     columns={columns}
     defaultIcon={defaultIcon}
     classes={{
-      container: "gap-4 md:gap-6",
+      container: 'gap-4 md:gap-6',
       panel:
-            'rounded-lg shadow-[0_4px_30px_rgba(0,0,0,0.1)] dark:shadow-[0_4px_30px_rgba(0,0,0,0.1)] backdrop-blur border border-[#ffffff29] bg-white dark:bg-slate-900 p-6',
+        'rounded-lg shadow-[0_4px_30px_rgba(0,0,0,0.1)] dark:shadow-[0_4px_30px_rgba(0,0,0,0.1)] backdrop-blur border border-[#ffffff29] bg-white dark:bg-slate-900 p-6',
       // panel:
       //   "text-center bg-page items-center md:text-left rtl:md:text-right md:items-start p-6 p-6 rounded-md shadow-xl dark:shadow-none dark:border dark:border-slate-800",
-      icon: "w-12 h-12 mb-6 text-primary",
-      ...((classes?.items as {}) ?? {}),
+      icon: 'w-12 h-12 mb-6 text-primary',
+      ...((classes?.items as Record<string, never>) ?? {}),
     }}
   />
 </WidgetWrapper>

src/components/widgets/Features3.astro

@@ -46,7 +46,7 @@ const {
               height={320}
               widths={[400, 768]}
               layout="fullWidth"
-              {...(image as any)}
+              {...image}
             />
           )}
         </div>
@@ -64,7 +64,7 @@ const {
       title: 'text-lg font-semibold',
       description: 'mt-0.5',
       icon: 'flex-shrink-0 mt-1 text-primary w-6 h-6',
-      ...((classes?.items as {}) ?? {}),
+      ...((classes?.items as object) ?? {}),
     }}
   />
 </WidgetWrapper>

src/components/widgets/Hero.astro

@@ -10,7 +10,7 @@ export interface Props {
   tagline?: string;
   content?: string;
   actions?: string | CallToAction[];
-  image?: string | any; // TODO: find HTMLElementProps
+  image?: string | unknown; // TODO: find HTMLElementProps
 }
 
 const {

src/components/widgets/Hero2.astro

@@ -9,7 +9,7 @@ export interface Props {
   tagline?: string;
   content?: string;
   actions?: string | CallToAction[];
-  image?: string | any; // TODO: find HTMLElementProps
+  image?: string | unknown; // TODO: find HTMLElementProps
 }
 
 const {

src/components/widgets/Steps.astro

@@ -21,37 +21,37 @@ const {
 ---
 
 <WidgetWrapper id={id} isDark={isDark} containerClass={`max-w-5xl ${classes?.container ?? ''}`} bg={bg}>
-  <div class:list={['flex flex-col gap-8 md:gap-12', { 'md:flex-row-reverse': isReversed }, { 'md:flex-row': image}]}>
-    <div class:list={["md:py-4 md:self-center", { 'md:basis-1/2': image }, { "w-full": !image}]}>
+  <div class:list={['flex flex-col gap-8 md:gap-12', { 'md:flex-row-reverse': isReversed }, { 'md:flex-row': image }]}>
+    <div class:list={['md:py-4 md:self-center', { 'md:basis-1/2': image }, { 'w-full': !image }]}>
       <Headline
         title={title}
         subtitle={subtitle}
         tagline={tagline}
         classes={{
           container: 'text-left rtl:text-right',
           title: 'text-3xl lg:text-4xl',
-          ...((classes?.headline as {}) ?? {}),
+          ...((classes?.headline as object) ?? {}),
         }}
       />
-      <Timeline items={items} classes={classes?.items as {}} />
+      <Timeline items={items} classes={classes?.items as Record<string, never>} />
     </div>
     {
       image && (
         <div class="relative md:basis-1/2">
-          {(typeof image === 'string' ? (
-          <Fragment set:html={image} />
+          {typeof image === 'string' ? (
+            <Fragment set:html={image} />
           ) : (
-          <Image
-            class="inset-0 object-cover object-top w-full rounded-md shadow-lg md:absolute md:h-full bg-gray-400 dark:bg-slate-700"
-            widths={[400, 768]}
-            sizes="(max-width: 768px) 100vw, 432px"
-            width={432}
-            height={768}
-            layout="cover"
-            src={image?.src}
-            alt={image?.alt || ''}
-          />
-          ))}
+            <Image
+              class="inset-0 object-cover object-top w-full rounded-md shadow-lg md:absolute md:h-full bg-gray-400 dark:bg-slate-700"
+              widths={[400, 768]}
+              sizes="(max-width: 768px) 100vw, 432px"
+              width={432}
+              height={768}
+              layout="cover"
+              src={image?.src}
+              alt={image?.alt || ''}
+            />
+          )}
         </div>
       )
     }

src/components/widgets/Testimonials.astro

@@ -5,7 +5,6 @@ import Button from '~/components/ui/Button.astro';
 import Image from '~/components/common/Image.astro';
 import type { Testimonials as Props } from '~/types';
 
-
 const {
   title = '',
   subtitle = '',
@@ -50,7 +49,7 @@ const {
                         height={40}
                         widths={[400, 768]}
                         layout="fixed"
-                        {...(image as any)}
+                        {...image}
                       />
                     )}
                   </div>

src/utils/blog.ts

@@ -1,7 +1,7 @@
 import type { PaginateFunction } from 'astro';
 import { getCollection } from 'astro:content';
 import type { CollectionEntry } from 'astro:content';
-import type { Post, Taxonomy } from '~/types';
+import type { Post } from '~/types';
 import { APP_BLOG } from 'astrowind:config';
 import { cleanSlug, trimSlash, BLOG_BASE, POST_PERMALINK_PATTERN, CATEGORY_BASE, TAG_BASE } from './permalinks';
 
@@ -243,7 +243,7 @@ export const getStaticPathsBlogTag = async ({ paginate }: { paginate: PaginateFu
 /** */
 export async function getRelatedPosts(originalPost: Post, maxResults: number = 4): Promise<Post[]> {
   const allPosts = await fetchPosts();
-  const originalTagsSet = new Set(originalPost.tags ? originalPost.tags.map(tag => tag.slug) : []);
+  const originalTagsSet = new Set(originalPost.tags ? originalPost.tags.map((tag) => tag.slug) : []);
 
   const postsWithScores = allPosts.reduce((acc: { post: Post; score: number }[], iteratedPost: Post) => {
     if (iteratedPost.slug === originalPost.slug) return acc;
@@ -254,7 +254,7 @@ export async function getRelatedPosts(originalPost: Post, maxResults: number = 4
     }
 
     if (iteratedPost.tags) {
-      iteratedPost.tags.forEach(tag => {
+      iteratedPost.tags.forEach((tag) => {
         if (originalTagsSet.has(tag.slug)) {
           score += 1;
         }

src/utils/images-optimization.ts

@@ -210,7 +210,7 @@ const getBreakpoints = ({
 };
 
 /* ** */
-export const astroAsseetsOptimizer: ImagesOptimizer = async (image, breakpoints, width, height) => {
+export const astroAsseetsOptimizer: ImagesOptimizer = async (image, breakpoints, _width, _height) => {
   if (!image) {
     return [];
   }

src/utils/permalinks.ts

@@ -109,7 +109,7 @@ export const applyGetPermalinks = (menu: object = {}) => {
     return menu.map((item) => applyGetPermalinks(item));
   } else if (typeof menu === 'object' && menu !== null) {
     const obj = {};
-    for (let key in menu) {
+    for (const key in menu) {
       if (key === 'href') {
         if (typeof menu[key] === 'string') {
           obj[key] = getPermalink(menu[key]);