Autofix (#594)

Signed-off-by: Giovanni Ravalico <[email protected]>
suddenlyGiovanni · Mar 7, 2024 · 945acfb · 945acfb
1 parent 4e2dae1
commit 945acfb
Show file tree

Hide file tree

Showing 23 changed files with 95 additions and 73 deletions.
diff --git a/apps/web/app/root.tsx b/apps/web/app/root.tsx
@@ -2,7 +2,7 @@ import type { LinksFunction, LoaderFunctionArgs, MetaFunction } from '@remix-run
 import { Links, Meta, Scripts, ScrollRestoration, useLoaderData } from '@remix-run/react'
 import { Layout, cn } from '@suddenly-giovanni/ui'
 import type { ReactElement, ReactNode } from 'react'
-import { PreventFlashOnWrongTheme, ThemeProvider, useTheme } from 'remix-themes'
+import { PreventFlashOnWrongTheme, ThemeProvider, useTheme, type Theme } from 'remix-themes'
 import faviconAssertUrl from './assets/suddenly_giovanni-icon-white.svg'
 import { Footer } from './footer.tsx'
 import { Header } from './header.tsx'
@@ -11,7 +11,9 @@ import { themeSessionResolver } from './sessions.server'
 
 import './styles/tailwind.css'
 
-export async function loader({ request }: LoaderFunctionArgs) {
+export async function loader({ request }: LoaderFunctionArgs): Promise<{
+	theme: null | Theme
+}> {
 	const { getTheme } = await themeSessionResolver(request)
 	return { theme: getTheme() }
 }
@@ -68,7 +70,7 @@ function Document({ children }: { children: ReactNode }): ReactElement {
 	)
 }
 
-function App(): JSX.Element {
+function App(): ReactElement {
 	return (
 		<Document>
 			<Header />

diff --git a/apps/web/app/routes/_index.tsx b/apps/web/app/routes/_index.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react/no-unescaped-entities -- TODO: need to validate the rule  */
 import type { MetaFunction } from '@remix-run/node'
 import { Link as RLink } from '@remix-run/react'
 import { T, cn } from '@suddenly-giovanni/ui'

diff --git a/apps/web/app/routes/motivations/route.tsx b/apps/web/app/routes/motivations/route.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react/no-unescaped-entities -- Reason: storybook story */
 import type { MetaFunction } from '@remix-run/node'
 import { Link } from '@remix-run/react'
 import type { ReactElement } from 'react'

diff --git a/apps/web/app/routes/resume/interface.ts b/apps/web/app/routes/resume/interface.ts
@@ -56,7 +56,7 @@ export interface Award {
 
 export interface Basics {
 	/**
-	 * e.g. [email protected]
+	 * e.g. `[email protected]`
 	 */
 	email?: string
 	/**

diff --git a/apps/web/app/routes/resume/mapper.ts b/apps/web/app/routes/resume/mapper.ts
@@ -1,3 +1,7 @@
+/*
+	eslint-disable @typescript-eslint/no-explicit-any -- Reason: this is a WIP module.
+		need to fix it
+	*/
 import type * as R from './interface.ts'
 
 type GatsbyTypes = any

diff --git a/apps/web/env.d.ts b/apps/web/env.d.ts
@@ -4,10 +4,8 @@
 import type { ReactElement } from 'react'
 
 declare module '*.mdx' {
-	// biome-ignore lint/suspicious/noExplicitAny: this is a configuration file
-	let MDXComponent: (props: any) => ReactElement
-	// biome-ignore lint/suspicious/noExplicitAny: this is a configuration file
-	export const frontmatter: any
+	let MDXComponent: (props: unknown) => ReactElement
+	export const frontmatter: unknown
 	// biome-ignore lint/correctness/noUndeclaredVariables: this is a configuration file
 	export default MDXComponent
 }
diff --git a/packages/ui/src/components/accordion/accordion.stories.tsx b/packages/ui/src/components/accordion/accordion.stories.tsx
@@ -1,3 +1,9 @@
+/*
+	eslint-disable jsx-a11y/anchor-is-valid,
+		react/no-array-index-key,
+		react/no-unescaped-entities -- Reason: This rule is disabled because...
+*/
+
 import type { Meta } from '@storybook/react'
 import { type ReactElement, useEffect, useRef, useState } from 'react'
 import { cn } from '../../lib/utils'
@@ -89,7 +95,7 @@ const contentAttrClass = cn('block', styles)
 
 export function _Accordion(): ReactElement {
 	return (
-		<Accordion className="w-full" collapsible={true} type="single">
+		<Accordion className="w-full" collapsible type="single">
 			<AccordionItem value="item-1">
 				<AccordionTrigger>Is it accessible?</AccordionTrigger>
 				<AccordionContent>Yes. It adheres to the WAI-ARIA design pattern.</AccordionContent>
@@ -134,7 +140,7 @@ export function SingleUncontrolled(): ReactElement {
 					porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 				</AccordionContent>
 			</AccordionItem>
-			<AccordionItem className={itemClass} disabled={true} value="three">
+			<AccordionItem className={itemClass} disabled value="three">
 				<AccordionHeader className={headerClass}>
 					<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 				</AccordionHeader>
@@ -150,14 +156,15 @@ export function SingleUncontrolled(): ReactElement {
 				<AccordionContent className={contentClass}>
 					Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 					dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-					<button>Cool</button>
+					<button type="button">Cool</button>
 				</AccordionContent>
 			</AccordionItem>
 		</Accordion>
 	)
 }
 
 export function SingleControlled(): ReactElement {
+	// eslint-disable-next-line @typescript-eslint/ban-types -- Reason: I need a sum type and the ability to use a string as a value.
 	const [valueOne, setValueOne] = useState<('one' | 'two' | 'three' | 'four') | (string & {})>(
 		'one',
 	)
@@ -183,7 +190,7 @@ export function SingleControlled(): ReactElement {
 					porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 				</AccordionContent>
 			</AccordionItem>
-			<AccordionItem className={itemClass} disabled={true} value="three">
+			<AccordionItem className={itemClass} disabled value="three">
 				<AccordionHeader className={headerClass}>
 					<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 				</AccordionHeader>
@@ -199,7 +206,7 @@ export function SingleControlled(): ReactElement {
 				<AccordionContent className={contentClass}>
 					Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 					dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-					<button>Cool</button>
+					<button type="button">Cool</button>
 				</AccordionContent>
 			</AccordionItem>
 		</Accordion>
@@ -208,7 +215,7 @@ export function SingleControlled(): ReactElement {
 
 export function SingleCollapsible(): ReactElement {
 	return (
-		<Accordion className={rootClass} collapsible={true} defaultValue="one" type="single">
+		<Accordion className={rootClass} collapsible defaultValue="one" type="single">
 			<AccordionItem className={itemClass} value="one">
 				<AccordionHeader className={headerClass}>
 					<AccordionTrigger className={triggerClass}>One</AccordionTrigger>
@@ -228,7 +235,7 @@ export function SingleCollapsible(): ReactElement {
 					porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 				</AccordionContent>
 			</AccordionItem>
-			<AccordionItem className={itemClass} disabled={true} value="three">
+			<AccordionItem className={itemClass} disabled value="three">
 				<AccordionHeader className={headerClass}>
 					<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 				</AccordionHeader>
@@ -244,7 +251,7 @@ export function SingleCollapsible(): ReactElement {
 				<AccordionContent className={contentClass}>
 					Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 					dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-					<button>Cool</button>
+					<button type="button">Cool</button>
 				</AccordionContent>
 			</AccordionItem>
 		</Accordion>
@@ -273,7 +280,7 @@ export function MultipleUncontrolled(): ReactElement {
 					porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 				</AccordionContent>
 			</AccordionItem>
-			<AccordionItem className={itemClass} disabled={true} value="three">
+			<AccordionItem className={itemClass} disabled value="three">
 				<AccordionHeader className={headerClass}>
 					<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 				</AccordionHeader>
@@ -289,13 +296,16 @@ export function MultipleUncontrolled(): ReactElement {
 				<AccordionContent className={contentClass}>
 					Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 					dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-					<button>Cool</button>
+					<button type="button">Cool</button>
 				</AccordionContent>
 			</AccordionItem>
 		</Accordion>
 	)
 }
 export function MultipleControlled(): ReactElement {
+	/*
+	 eslint-disable-next-line @typescript-eslint/ban-types -- Reason: I need a sum type and the ability to use a string as a value.
+	*/
 	const [value, setValue] = useState<(('one' | 'two' | 'three' | 'four') | (string & {}))[]>([
 		'one',
 		'two',
@@ -322,7 +332,7 @@ export function MultipleControlled(): ReactElement {
 					porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 				</AccordionContent>
 			</AccordionItem>
-			<AccordionItem className={itemClass} disabled={true} value="three">
+			<AccordionItem className={itemClass} disabled value="three">
 				<AccordionHeader className={headerClass}>
 					<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 				</AccordionHeader>
@@ -338,7 +348,7 @@ export function MultipleControlled(): ReactElement {
 				<AccordionContent className={contentClass}>
 					Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 					dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-					<button>Cool</button>
+					<button type="button">Cool</button>
 				</AccordionContent>
 			</AccordionItem>
 		</Accordion>
@@ -390,7 +400,7 @@ export function Animated(): ReactElement {
 							<AccordionTrigger className={triggerClass}>{value}</AccordionTrigger>
 						</AccordionHeader>
 						<AccordionContent className={animatedContentClass}>
-							{[...Array(count)].map((_, index) => (
+							{[...new Array<unknown>(count)].map((_, index) => (
 								<div key={index} style={{ padding: 10 }}>
 									Per erat orci nostra luctus sociosqu mus risus penatibus, duis elit vulputate
 									viverra integer ullamcorper congue curabitur sociis, nisi malesuada scelerisque
@@ -410,7 +420,7 @@ export function Animated(): ReactElement {
 							<AccordionTrigger className={triggerClass}>{value}</AccordionTrigger>
 						</AccordionHeader>
 						<AccordionContent className={animatedContentClass}>
-							{[...Array(count)].map((_, index) => (
+							{[...new Array<unknown>(count)].map((_, index) => (
 								<div key={index} style={{ padding: 10 }}>
 									Per erat orci nostra luctus sociosqu mus risus penatibus, duis elit vulputate
 									viverra integer ullamcorper congue curabitur sociis, nisi malesuada scelerisque
@@ -451,6 +461,7 @@ export function Animated2D(): ReactElement {
 }
 
 export function AnimatedControlled(): ReactElement {
+	// eslint-disable-next-line @typescript-eslint/ban-types -- Reason: I need a sum type and the ability to use a string as a value.
 	const [value, setValue] = useState<(('one' | 'two' | 'three' | 'four') | (string & {}))[]>([
 		'one',
 		'two',
@@ -494,7 +505,7 @@ export function AnimatedControlled(): ReactElement {
 				<AccordionContent className={animatedContentClass}>
 					Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 					dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-					<button>Cool</button>
+					<button type="button">Cool</button>
 				</AccordionContent>
 			</AccordionItem>
 		</Accordion>
@@ -530,7 +541,7 @@ export function OutsideViewport(): ReactElement {
 						porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 					</AccordionContent>
 				</AccordionItem>
-				<AccordionItem className={itemClass} disabled={true} value="three">
+				<AccordionItem className={itemClass} disabled value="three">
 					<AccordionHeader className={headerClass}>
 						<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 					</AccordionHeader>
@@ -546,7 +557,8 @@ export function OutsideViewport(): ReactElement {
 					<AccordionContent className={contentClass}>
 						Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 						dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-						<button>Cool</button>
+						{}
+						<button type="button">Cool</button>
 					</AccordionContent>
 				</AccordionItem>
 			</Accordion>
@@ -579,7 +591,7 @@ export function Horizontal(): ReactElement {
 						porta nascetur ac dictum, leo tellus dis integer platea ultrices mi.
 					</AccordionContent>
 				</AccordionItem>
-				<AccordionItem className={itemClass} disabled={true} value="three">
+				<AccordionItem className={itemClass} disabled value="three">
 					<AccordionHeader className={headerClass}>
 						<AccordionTrigger className={triggerClass}>Three (disabled)</AccordionTrigger>
 					</AccordionHeader>
@@ -595,15 +607,15 @@ export function Horizontal(): ReactElement {
 					<AccordionContent className={contentClass}>
 						Odio placerat <a href="#">quisque</a> sapien sagittis non sociis ligula penatibus
 						dignissim vitae, enim vulputate nullam semper potenti etiam volutpat libero.
-						<button>Cool</button>
+						<button type="button">Cool</button>
 					</AccordionContent>
 				</AccordionItem>
 			</Accordion>
 		</>
 	)
 }
 
-export function Chromatic() {
+export function Chromatic(): ReactElement {
 	const items = ['One', 'Two', 'Three', 'Four']
 	return (
 		<>
@@ -706,7 +718,7 @@ export function Chromatic() {
 			</Accordion>
 
 			<h1>Disabled (whole)</h1>
-			<Accordion className={rootClass} disabled={true} type="single">
+			<Accordion className={rootClass} disabled type="single">
 				{items.map(item => (
 					<AccordionItem className={itemClass} key={item} value={item}>
 						<AccordionHeader className={headerClass}>
@@ -761,7 +773,7 @@ export function Chromatic() {
 						<AccordionHeader className={headerClass}>
 							<AccordionTrigger className={triggerClass}>{item}</AccordionTrigger>
 						</AccordionHeader>
-						<AccordionContent className={contentClass} forceMount={true}>
+						<AccordionContent className={contentClass} forceMount>
 							{item}: Per erat orci nostra luctus sociosqu mus risus penatibus, duis elit vulputate
 							viverra integer ullamcorper congue curabitur sociis, nisi malesuada scelerisque quam
 							suscipit habitant sed.
@@ -772,7 +784,7 @@ export function Chromatic() {
 
 			<h1>State attributes</h1>
 			<h2>Accordion disabled</h2>
-			<Accordion className={rootAttrClass} defaultValue="Two" disabled={true} type="single">
+			<Accordion className={rootAttrClass} defaultValue="Two" disabled type="single">
 				{items.map(item => (
 					<AccordionItem className={itemAttrClass} key={item} value={item}>
 						<AccordionHeader className={headerAttrClass}>
@@ -809,7 +821,7 @@ export function Chromatic() {
 			</Accordion>
 
 			<h2>Accordion disabled with item override</h2>
-			<Accordion className={rootAttrClass} defaultValue="Two" disabled={true} type="single">
+			<Accordion className={rootAttrClass} defaultValue="Two" disabled type="single">
 				{items.map(item => (
 					<AccordionItem
 						className={itemAttrClass}

diff --git a/packages/ui/src/components/button/button.stories.tsx b/packages/ui/src/components/button/button.stories.tsx
@@ -1,7 +1,7 @@
 import { ChevronRightIcon, EnvelopeOpenIcon, ReloadIcon } from '@radix-ui/react-icons'
 import type { Meta, StoryObj } from '@storybook/react'
 import { Button } from '../../ui/button.tsx'
-import { T } from '../typography/typography.tsx'
+import { T } from '~/components'
 
 const meta = {
 	component: Button,
@@ -65,7 +65,7 @@ export const WithIcon: Story = {
 
 export const Loading: Story = {
 	render: args => (
-		<Button {...args} disabled={true}>
+		<Button {...args} disabled>
 			<ReloadIcon className="mr-2 h-4 w-4 animate-spin" />
 			Please wait
 		</Button>
@@ -74,7 +74,7 @@ export const Loading: Story = {
 
 export const AsChild: Story = {
 	render: args => (
-		<Button {...args} asChild={true}>
+		<Button {...args} asChild>
 			<T.a>Login</T.a>
 		</Button>
 	),