Add next lint

.eslintrc.json

@@ -8,7 +8,8 @@
     "plugin:react/recommended",
     "prettier",
     "eslint:recommended",
-    "plugin:@typescript-eslint/recommended"
+    "plugin:@typescript-eslint/recommended",
+    "next/core-web-vitals"
   ],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {

src/components/changePassword/index.tsx

@@ -1,4 +1,5 @@
 import { useState } from "react";
+import Image from "next/image";
 import { Button } from "../button";
 import { Alert, SuccessAlert } from "../alert";
 import { PasswordInput } from "../password";
@@ -13,7 +14,7 @@ export default function ChangePassword({
   return (
     <main className="flex min-h-full flex-1 flex-col justify-center px-6 py-12 lg:px-8">
       <figure className="sm:mx-auto sm:w-full sm:max-w-sm">
-        <img
+        <Image
           className="mx-auto my-8 h-28 w-auto"
           src="/lightLogo.svg"
           alt="OFMI"

src/components/forgotPassword/index.tsx

@@ -1,4 +1,5 @@
 import { useState } from "react";
+import Image from "next/image";
 import { Button } from "../button";
 import { SuccessAlert } from "../alert";
 
@@ -8,7 +9,7 @@ export default function ForgotPassword(): JSX.Element {
   return (
     <main className="flex min-h-full flex-1 flex-col justify-center px-6 py-12 lg:px-8">
       <figure className="sm:mx-auto sm:w-full sm:max-w-sm">
-        <img
+        <Image
           className="mx-auto my-8 h-28 w-auto"
           src="/lightLogo.svg"
           alt="OFMI"

src/components/login/index.tsx

@@ -4,6 +4,7 @@ import { useRouter } from "next/router";
 import { Alert, SuccessAlert } from "../alert";
 import { Button } from "../button";
 import { PasswordInput } from "../password";
+import Image from "next/image";
 import Link from "next/link";
 import { resendEmailVerification } from "./client";
 
@@ -93,7 +94,7 @@ export default function Login({
   return (
     <div className="flex min-h-full flex-1 flex-col justify-center px-6 py-12 lg:px-8">
       <div className="sm:mx-auto sm:w-full sm:max-w-sm">
-        <img
+        <Image
           className="mx-auto my-8 h-28 w-auto"
           src="/lightLogo.svg"
           alt="OFMI"
@@ -139,12 +140,12 @@ export default function Login({
                 Contraseña
               </label>
               <div className="text-right">
-                <a
+                <Link
                   href="/forgotPassword"
                   className="font-medium text-blue-500 hover:text-blue-700"
                 >
                   ¿Olvidaste tu contraseña?
-                </a>
+                </Link>
               </div>
             </div>
             <div className="mt-2">
@@ -168,12 +169,12 @@ export default function Login({
           <div>
             <p className="font-light text-gray-700">
               ¿Aun no tienes una cuenta?{" "}
-              <a
+              <Link
                 href="/signup"
                 className="font-semibold text-blue-500 hover:text-blue-700 hover:underline"
               >
                 Crea una cuenta
-              </a>
+              </Link>
             </p>
           </div>
         </form>

src/components/navbar/Unauthenticated.tsx

@@ -1,18 +1,19 @@
 import { Button } from "../button";
+import Link from "next/link";
 
 export const Unauthenticated = (): JSX.Element => {
   return (
     <div className="space-x-2">
-      <a href="/login">
+      <Link href="/login">
         <Button buttonSize="sm" buttonType="primary">
           Inicia sesión
         </Button>
-      </a>
-      <a href="/signup">
+      </Link>
+      <Link href="/signup">
         <Button buttonType="secondary" buttonSize="sm">
           Crea tu cuenta
         </Button>
-      </a>
+      </Link>
     </div>
   );
 };

src/components/navbar/index.tsx

@@ -1,5 +1,6 @@
 import { Disclosure } from "@headlessui/react";
 import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
+import Image from "next/image";
 import { ProfileDropdown } from "./Profile";
 import { Unauthenticated } from "./Unauthenticated";
 import { classNames } from "./styles";
@@ -42,7 +43,7 @@ export const Navbar = (): JSX.Element => {
               <div className="flex flex-1 items-center justify-center sm:items-stretch sm:justify-start">
                 <div className="flex flex-shrink-0 items-center">
                   <a key="index-icon" href="/">
-                    <img className="h-9" src="/lightLogo.svg" alt="Inicio" />
+                    <Image className="h-9" src="/lightLogo.svg" alt="Inicio" />
                   </a>
                 </div>
                 <div className="hidden sm:ml-6 sm:block">

src/components/signup/index.tsx

@@ -1,4 +1,6 @@
 import { useState } from "react";
+import Image from "next/image";
+import Link from "next/link";
 import { sendSignUp } from "./client";
 import { Alert, SuccessAlert } from "../alert";
 import { Button } from "../button";
@@ -57,7 +59,7 @@ export default function SignUp(): JSX.Element {
     <>
       <div className="flex min-h-full flex-1 flex-col justify-center px-6 py-12 lg:px-8">
         <div className="sm:mx-auto sm:w-full sm:max-w-sm">
-          <img
+          <Image
             className="mx-auto my-8 h-28 w-auto"
             src="/lightLogo.svg"
             alt="OFMI"
@@ -142,12 +144,12 @@ export default function SignUp(): JSX.Element {
             <div className="text-sm">
               <p className="font-light text-gray-700">
                 ¿Ya tienes una cuenta?{" "}
-                <a
+                <Link
                   href="/login"
                   className="font-medium text-blue-500 hover:text-blue-700 hover:underline"
                 >
                   Inicia sesión
-                </a>
+                </Link>
               </p>
             </div>
           </form>

vitest.config.mts

@@ -3,7 +3,6 @@ import react from "@vitejs/plugin-react";
 import { resolve } from "path";
 
 export default defineConfig({
-  // @ts-expect-error https://www.npmjs.com/package/@vitejs/plugin-react
   plugins: [react()],
   resolve: {
     alias: [{ find: "@", replacement: resolve(__dirname, "./src") }],