feat: upgrade to React 19, Next.js 15, React Compiler, HeroUI and Tailwind 4 (#8748)

Co-authored-by: Alan Buscaglia <alanbuscaglia@MacBook-Pro.local>
Co-authored-by: alejandrobailo <alejandrobailo94@gmail.com>
Co-authored-by: César Arroba <cesar@prowler.com>
Co-authored-by: Alejandro Bailo <59607668+alejandrobailo@users.noreply.github.com>
This commit is contained in:
Alan Buscaglia
2025-09-30 09:59:51 +02:00
committed by GitHub
parent 2a4b62527a
commit 4d5676f00e
261 changed files with 6339 additions and 6126 deletions

View File

@@ -1,8 +1,10 @@
"use client";
import { Button } from "@heroui/button";
import { Checkbox } from "@heroui/checkbox";
import { Divider } from "@heroui/divider";
import { zodResolver } from "@hookform/resolvers/zod";
import { Icon } from "@iconify/react";
import { Button, Checkbox, Divider } from "@nextui-org/react";
import { useRouter, useSearchParams } from "next/navigation";
import { useEffect } from "react";
import { useForm } from "react-hook-form";
@@ -190,9 +192,9 @@ export const AuthForm = ({
{/* Auth Form */}
<div className="relative flex w-full items-center justify-center lg:w-full">
{/* Background Pattern */}
<div className="absolute h-full w-full bg-[radial-gradient(#6af400_1px,transparent_1px)] [background-size:16px_16px] [mask-image:radial-gradient(ellipse_50%_50%_at_50%_50%,#000_10%,transparent_80%)]"></div>
<div className="absolute h-full w-full bg-[radial-gradient(#6af400_1px,transparent_1px)] mask-[radial-gradient(ellipse_50%_50%_at_50%_50%,#000_10%,transparent_80%)] bg-size-[16px_16px]"></div>
<div className="relative z-10 flex w-full max-w-sm flex-col gap-4 rounded-large border-1 border-divider bg-white/90 px-8 py-10 shadow-small dark:bg-background/85 md:max-w-md">
<div className="rounded-large border-divider shadow-small dark:bg-background/85 relative z-10 flex w-full max-w-sm flex-col gap-4 border bg-white/90 px-8 py-10 md:max-w-md">
{/* Prowler Logo */}
<div className="absolute -top-[100px] left-1/2 z-10 flex h-fit w-fit -translate-x-1/2">
<ProwlerExtended width={300} />
@@ -350,7 +352,7 @@ export const AuthForm = ({
<>
<div className="flex items-center gap-4 py-2">
<Divider className="flex-1" />
<p className="shrink-0 text-tiny text-default-500">OR</p>
<p className="text-tiny text-default-500 shrink-0">OR</p>
<Divider className="flex-1" />
</div>
<div className="flex flex-col gap-2">
@@ -387,7 +389,7 @@ export const AuthForm = ({
<>
<div className="flex items-center gap-4 py-2">
<Divider className="flex-1" />
<p className="shrink-0 text-tiny text-default-500">OR</p>
<p className="text-tiny text-default-500 shrink-0">OR</p>
<Divider className="flex-1" />
</div>
<div className="flex flex-col gap-2">
@@ -401,14 +403,14 @@ export const AuthForm = ({
</>
)}
{type === "sign-in" ? (
<p className="text-center text-small">
<p className="text-small text-center">
Need to create an account?&nbsp;
<CustomLink size="base" href="/sign-up" target="_self">
Sign up
</CustomLink>
</p>
) : (
<p className="text-center text-small">
<p className="text-small text-center">
Already have an account?&nbsp;
<CustomLink size="base" href="/sign-in" target="_self">
Log in

View File

@@ -69,25 +69,28 @@ export const PasswordRequirementsMessage = ({
{allRequirementsMet ? (
<div className="flex items-center gap-2">
<CheckCircle
className="h-4 w-4 flex-shrink-0 text-system-success"
className="text-system-success h-4 w-4 shrink-0"
aria-hidden="true"
/>
<p className="text-xs font-medium leading-tight text-system-success">
<p className="text-system-success text-xs leading-tight font-medium">
Password meets all requirements
</p>
</div>
) : (
<div className="space-y-1">
<div className="flex flex-col gap-1">
<div className="flex items-center gap-2">
<AlertCircle
className="h-4 w-4 flex-shrink-0 text-red-600"
className="h-4 w-4 shrink-0 text-red-600"
aria-hidden="true"
/>
<p className="text-xs font-medium leading-tight text-red-700">
<p className="text-xs leading-tight font-medium text-red-700">
Password must include:
</p>
</div>
<ul className="ml-6 space-y-0.5" aria-label="Password requirements">
<ul
className="ml-6 flex flex-col gap-0.5"
aria-label="Password requirements"
>
{results.map((req) => (
<li
key={req.key}
@@ -95,7 +98,7 @@ export const PasswordRequirementsMessage = ({
>
<div className="flex items-center gap-2">
<div
className={`h-2 w-2 flex-shrink-0 rounded-full ${
className={`h-2 w-2 shrink-0 rounded-full ${
req.isMet ? "bg-system-success" : "bg-red-400"
}`}
aria-hidden="true"

View File

@@ -1,5 +1,6 @@
import { Button } from "@heroui/button";
import { Tooltip } from "@heroui/tooltip";
import { Icon } from "@iconify/react";
import { Button, Tooltip } from "@nextui-org/react";
import { CustomLink } from "@/components/ui/custom/custom-link";
@@ -24,7 +25,7 @@ export const SocialButtons = ({
</CustomLink>
</div>
}
placement="right-start"
placement="top"
shadow="sm"
isDisabled={isGoogleOAuthEnabled}
className="w-96"
@@ -51,7 +52,7 @@ export const SocialButtons = ({
</CustomLink>
</div>
}
placement="right-start"
placement="top"
shadow="sm"
isDisabled={isGithubOAuthEnabled}
className="w-96"