feat: fix lucide-react renders

feat: fix mobile designs feat: remove conflicting react-hook-form feat: change update-account-form path
2025-07-18 17:19:12 +03:00
parent 8c090f9d68
commit eec8a12db2
22 changed files with 198 additions and 156 deletions
--- a/app/(public)/company-offer/page.tsx
+++ b/app/(public)/company-offer/page.tsx
@@ -10,7 +10,7 @@ import CompanyOfferForm from './_components/company-offer-form';
 function CompanyOffer() {
  return (
    <div className="border-border flex max-w-5xl flex-row overflow-hidden rounded-3xl border">
-      <div className="flex w-1/2 flex-col px-12 py-14 text-center">
+      <div className="flex flex-col px-12 py-14 text-center md:w-1/2">
        <MedReportLogo />
        <h1 className="pt-8">
          <Trans i18nKey={'account:requestCompanyAccount:title'} />
@@ -20,7 +20,7 @@ function CompanyOffer() {
        </p>
        <CompanyOfferForm />
      </div>
-      <div className="w-1/2 min-w-[460px] bg-[url(/assets/med-report-logo-big.png)] bg-cover bg-center bg-no-repeat"></div>
+      <div className="hidden w-1/2 min-w-[460px] bg-[url(/assets/med-report-logo-big.png)] bg-cover bg-center bg-no-repeat md:block"></div>
    </div>
  );
 }
--- a/packages/features/auth/src/components/update-account-form.tsx
+++ b/packages/features/auth/src/components/update-account-form.tsx
@@ -21,8 +21,8 @@ import {
 import { Input } from '@kit/ui/input';
 import { Trans } from '@kit/ui/trans';

-import { UpdateAccountSchema } from '../schemas/update-account.schema';
-import { onUpdateAccount } from '../server/actions/update-account-actions';
+import { UpdateAccountSchema } from '../_lib/schemas/update-account.schema';
+import { onUpdateAccount } from '../_lib/server/update-account';

 export function UpdateAccountForm({ user }: { user: User }) {
  const form = useForm({
--- a/app/auth/update-account/_lib/schemas/update-account.schema.ts
+++ b/app/auth/update-account/_lib/schemas/update-account.schema.ts
--- a/packages/features/auth/src/server/actions/update-account-actions.ts
+++ b/packages/features/auth/src/server/actions/update-account-actions.ts
@@ -2,13 +2,13 @@

 import { redirect } from 'next/navigation';

+import { createAuthApi } from '@kit/auth/api';
 import { enhanceAction } from '@kit/next/actions';
 import { getSupabaseServerClient } from '@kit/supabase/server-client';

 import pathsConfig from '~/config/paths.config';

-import { UpdateAccountSchema } from '../../schemas/update-account.schema';
-import { createAuthApi } from '../api';
+import { UpdateAccountSchema } from '../schemas/update-account.schema';

 export interface AccountSubmitData {
  firstName: string;
--- a/app/auth/update-account/page.tsx
+++ b/app/auth/update-account/page.tsx
@@ -4,13 +4,14 @@ import { BackButton } from '@/components/back-button';
 import { MedReportLogo } from '@/components/med-report-logo';
 import pathsConfig from '@/config/paths.config';
 import { signOutAction } from '@/lib/actions/sign-out';
-import { UpdateAccountForm } from '@/packages/features/auth/src/components/update-account-form';
 import { getSupabaseServerClient } from '@/packages/supabase/src/clients/server-client';

 import { Trans } from '@kit/ui/trans';

 import { withI18n } from '~/lib/i18n/with-i18n';

+import { UpdateAccountForm } from './_components/update-account-form';
+
 async function UpdateAccount() {
  const client = getSupabaseServerClient();

@@ -24,7 +25,7 @@ async function UpdateAccount() {

  return (
    <div className="border-border flex max-w-5xl flex-row overflow-hidden rounded-3xl border">
-      <div className="relative flex w-1/2 min-w-md flex-col px-12 pt-7 pb-22 text-center">
+      <div className="relative flex min-w-md flex-col px-12 pt-7 pb-22 text-center md:w-1/2">
        <BackButton onBack={signOutAction} />
        <MedReportLogo />
        <h1 className="pt-8">
@@ -35,7 +36,7 @@ async function UpdateAccount() {
        </p>
        <UpdateAccountForm user={user} />
      </div>
-      <div className="w-1/2 min-w-[460px] bg-[url(/assets/med-report-logo-big.png)] bg-cover bg-center bg-no-repeat"></div>
+      <div className="hidden w-1/2 min-w-[460px] bg-[url(/assets/med-report-logo-big.png)] bg-cover bg-center bg-no-repeat md:block"></div>
    </div>
  );
 }
--- a/app/home/(user)/(dashboard)/analysis-results/_components/analysis-level-bar.tsx
+++ b/app/home/(user)/(dashboard)/analysis-results/_components/analysis-level-bar.tsx
@@ -50,7 +50,7 @@ const AnalysisLevelBar = ({
  level: AnalysisResultLevel;
 }) => {
  return (
-    <div className="flex h-3 w-full max-w-[360px] gap-1">
+    <div className="mt-4 flex h-3 w-full max-w-[360px] gap-1 sm:mt-0">
      {normLowerIncluded && (
        <>
          <Level
--- a/app/home/(user)/(dashboard)/analysis-results/_components/analysis.tsx
+++ b/app/home/(user)/(dashboard)/analysis-results/_components/analysis.tsx
@@ -1,7 +1,11 @@
-import React from 'react';
+'use client';
+
+import React, { useState } from 'react';

 import { Info } from 'lucide-react';

+import { cn } from '@kit/ui/utils';
+
 import AnalysisLevelBar, { AnalysisResultLevel } from './analysis-level-bar';

 export enum AnalysisStatus {
@@ -33,6 +37,7 @@ const Analysis = ({
    normUpper: number;
  };
 }) => {
+  const [showTooltip, setShowTooltip] = useState(false);
  const isUnderNorm = value < normLower;
  const getAnalysisResultLevel = () => {
    if (isUnderNorm) {
@@ -54,12 +59,21 @@ const Analysis = ({
  };

  return (
-    <div className="border-border flex items-center justify-between rounded-lg border px-5 py-3">
+    <div className="border-border grid grid-cols-2 items-center justify-between rounded-lg border px-5 py-3 sm:flex">
      <div className="flex items-center gap-2 font-semibold">
        {name}
-        <div className="group/tooltip relative">
+        <div
+          className="group/tooltip relative"
+          onClick={() => setShowTooltip(!showTooltip)}
+          onMouseLeave={() => setShowTooltip(false)}
+        >
          <Info className="hover" />{' '}
-          <div className="absolute bottom-full left-1/2 z-10 mb-2 hidden -translate-x-1/2 rounded bg-gray-800 px-2 py-1 text-sm whitespace-nowrap text-white group-hover/tooltip:block">
+          <div
+            className={cn(
+              'absolute bottom-full left-1/2 z-10 mb-2 hidden -translate-x-1/2 rounded border bg-white p-4 text-sm whitespace-nowrap group-hover/tooltip:block',
+              { block: showTooltip },
+            )}
+          >
            This text changes when you hover the box above.
          </div>
        </div>
@@ -68,7 +82,7 @@ const Analysis = ({
        <div className="font-semibold">{value}</div>
        <div className="text-muted-foreground text-sm">{unit}</div>
      </div>
-      <div className="text-muted-foreground text-center text-sm">
+      <div className="text-muted-foreground mt-4 flex gap-2 text-center text-sm sm:mt-0 sm:block sm:gap-0">
        {normLower} - {normUpper}
        <div>Normaalne vahemik</div>
      </div>
--- a/app/home/(user)/_components/dashboard.tsx
+++ b/app/home/(user)/_components/dashboard.tsx
@@ -1,6 +1,7 @@
 'use client';

 import Link from 'next/link';
+
 import { InfoTooltip } from '@/components/ui/info-tooltip';
 import { BlendingModeIcon, RulerHorizontalIcon } from '@radix-ui/react-icons';
 import {
@@ -130,7 +131,7 @@ const dummyRecommendations = [
 export default function Dashboard() {
  return (
    <>
-      <div className="grid auto-rows-fr grid-cols-5 gap-3">
+      <div className="grid auto-rows-fr grid-cols-2 gap-3 sm:grid-cols-4 lg:grid-cols-5">
        {dummyCards.map(
          ({
            title,
@@ -190,7 +191,7 @@ export default function Dashboard() {
            ) => {
              return (
                <div className="flex justify-between" key={index}>
-                  <div className="flex flex-row items-center gap-4">
+                  <div className="mr-4 flex flex-row items-center gap-4">
                    <div
                      className={cn(
                        'flex size-8 items-center-safe justify-center-safe rounded-full text-white',
--- a/app/select-package/page.tsx
+++ b/app/select-package/page.tsx
@@ -1,14 +1,14 @@
 import Link from 'next/link';

+import SelectAnalysisPackages from '@/components/select-analysis-packages';
 import { CaretRightIcon } from '@radix-ui/react-icons';
 import { Scale } from 'lucide-react';
-import { Trans } from '@kit/ui/trans';

 import { Button } from '@kit/ui/button';
+import { Trans } from '@kit/ui/trans';

 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
 import { withI18n } from '~/lib/i18n/with-i18n';
-import SelectAnalysisPackages from '@/components/select-analysis-packages';

 import { MedReportLogo } from '../../components/med-report-logo';
 import pathsConfig from '../../config/paths.config';
@@ -40,12 +40,14 @@ async function SelectPackagePage() {
        />
      </div>
      <SelectAnalysisPackages />
-      <Link href={pathsConfig.app.home}>
-        <Button variant="secondary" className="align-center">
-          <Trans i18nKey={'marketing:notInterestedInAudit'} />{' '}
-          <CaretRightIcon className="size-4" />
-        </Button>
-      </Link>
+      <div className="flex justify-center">
+        <Link href={pathsConfig.app.home}>
+          <Button variant="secondary" className="align-center">
+            <Trans i18nKey="marketing:notInterestedInAudit" />{' '}
+            <CaretRightIcon className="size-4" />
+          </Button>
+        </Link>
+      </div>
    </div>
  );
 }
--- a/components/package-header.tsx
+++ b/components/package-header.tsx
@@ -17,8 +17,8 @@ export const PackageHeader = ({
 }) => {
  return (
    <div className="space-y-1 text-center">
-      <p className="font-medium">{title}</p>
-      <h2>
+      <p className="text-sm sm:text-lg sm:font-medium">{title}</p>
+      <h2 className="text-xl sm:text-4xl">
        {formatCurrency({
          currencyCode: 'eur',
          locale: language,
--- a/components/select-analysis-packages.tsx
+++ b/components/select-analysis-packages.tsx
@@ -1,6 +1,7 @@
 'use client';

 import Image from 'next/image';
+
 import { useTranslation } from 'react-i18next';

 import { Button } from '@kit/ui/button';
@@ -57,50 +58,52 @@ export default function SelectAnalysisPackages() {
  } = useTranslation();

  return (
-    <div className="grid grid-cols-3 gap-6">
-      {analysisPackages.length > 0 ? analysisPackages.map(
-        (
-          { titleKey, price, nrOfAnalyses, tagColor, descriptionKey },
-          index,
-        ) => {
-          return (
-            <Card key={index}>
-              <CardHeader className="relative">
-                <ButtonTooltip
-                  content="Content pending"
-                  className="absolute top-5 right-5 z-10"
-                />
-                <Image
-                  src="/assets/card-image.png"
-                  alt="background"
-                  width={326}
-                  height={195}
-                  className="max-h-48 w-full opacity-10"
-                />
-              </CardHeader>
-              <CardContent className="space-y-1 text-center">
-                <PackageHeader
-                  title={t(titleKey)}
-                  tagColor={tagColor}
-                  analysesNr={t('product:nrOfAnalyses', { nr: nrOfAnalyses })}
-                  language={language}
-                  price={price}
-                />
-                <CardDescription>
-                  <Trans i18nKey={descriptionKey} />
-                </CardDescription>
-              </CardContent>
-              <CardFooter>
-                <Button className="w-full">
-                  <Trans i18nKey='order-analysis-package:selectThisPackage' />
-                </Button>
-              </CardFooter>
-            </Card>
-          );
-        },
+    <div className="mb-6 grid grid-cols-2 gap-6 sm:grid-cols-3">
+      {analysisPackages.length > 0 ? (
+        analysisPackages.map(
+          (
+            { titleKey, price, nrOfAnalyses, tagColor, descriptionKey },
+            index,
+          ) => {
+            return (
+              <Card key={index}>
+                <CardHeader className="relative">
+                  <ButtonTooltip
+                    content="Content pending"
+                    className="absolute top-5 right-5 z-10"
+                  />
+                  <Image
+                    src="/assets/card-image.png"
+                    alt="background"
+                    width={326}
+                    height={195}
+                    className="max-h-48 w-full opacity-10"
+                  />
+                </CardHeader>
+                <CardContent className="space-y-1 text-center">
+                  <PackageHeader
+                    title={t(titleKey)}
+                    tagColor={tagColor}
+                    analysesNr={t('product:nrOfAnalyses', { nr: nrOfAnalyses })}
+                    language={language}
+                    price={price}
+                  />
+                  <CardDescription>
+                    <Trans i18nKey={descriptionKey} />
+                  </CardDescription>
+                </CardContent>
+                <CardFooter>
+                  <Button className="w-full text-[10px] sm:text-sm">
+                    <Trans i18nKey="order-analysis-package:selectThisPackage" />
+                  </Button>
+                </CardFooter>
+              </Card>
+            );
+          },
+        )
      ) : (
        <h4>
-          <Trans i18nKey='order-analysis-package:noPackagesAvailable' />
+          <Trans i18nKey="order-analysis-package:noPackagesAvailable" />
        </h4>
      )}
    </div>
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -1,4 +1,7 @@
 import withBundleAnalyzer from '@next/bundle-analyzer';
+import transpileModules from 'next-transpile-modules';
+
+const withTM = transpileModules(['lucide-react']);

 const IS_PRODUCTION = process.env.NODE_ENV === 'production';
 const SUPABASE_URL = process.env.NEXT_PUBLIC_SUPABASE_URL;
@@ -24,7 +27,7 @@ const INTERNAL_PACKAGES = [
 ];

 /** @type {import('next').NextConfig} */
-const config = {
+const config = withTM({
  reactStrictMode: true,
  /** Enables hot reloading for local packages without a build step */
  transpilePackages: INTERNAL_PACKAGES,
@@ -67,7 +70,7 @@ const config = {
  /** We already do linting and typechecking as separate tasks in CI */
  eslint: { ignoreDuringBuilds: true },
  typescript: { ignoreBuildErrors: true },
-};
+});

 export default withBundleAnalyzer({
  enabled: process.env.ANALYZE === 'true',
--- a/package.json
+++ b/package.json
@@ -99,9 +99,9 @@
    "babel-plugin-react-compiler": "19.1.0-rc.2",
    "cssnano": "^7.0.7",
    "dotenv": "^16.5.0",
+    "next-transpile-modules": "^10.0.1",
    "pino-pretty": "^13.0.0",
    "prettier": "^3.5.3",
-    "react-hook-form": "^7.57.0",
    "supabase": "^2.30.4",
    "tailwindcss": "4.1.7",
    "tailwindcss-animate": "^1.0.7",
--- a/packages/billing/gateway/package.json
+++ b/packages/billing/gateway/package.json
@@ -31,8 +31,7 @@
    "date-fns": "^4.1.0",
    "lucide-react": "^0.510.0",
    "next": "15.3.2",
-    "react": "19.1.0",
-    "react-hook-form": "^7.56.3"
+    "react": "19.1.0"
  },
  "typesVersions": {
    "*": {
--- a/packages/features/accounts/package.json
+++ b/packages/features/accounts/package.json
@@ -44,7 +44,6 @@
    "next-themes": "0.4.6",
    "react": "19.1.0",
    "react-dom": "19.1.0",
-    "react-hook-form": "^7.56.3",
    "sonner": "^2.0.3"
  },
  "prettier": "@kit/prettier-config",
--- a/packages/features/admin/package.json
+++ b/packages/features/admin/package.json
@@ -27,8 +27,7 @@
    "lucide-react": "^0.510.0",
    "next": "15.3.2",
    "react": "19.1.0",
-    "react-dom": "19.1.0",
-    "react-hook-form": "^7.56.3"
+    "react-dom": "19.1.0"
  },
  "exports": {
    ".": "./src/index.ts",
--- a/packages/features/auth/package.json
+++ b/packages/features/auth/package.json
@@ -17,7 +17,8 @@
    "./captcha/client": "./src/captcha/client/index.ts",
    "./captcha/server": "./src/captcha/server/index.ts",
    "./resend-email-link": "./src/components/resend-auth-link-form.tsx",
-    "./lib/utils/*": "./src/lib/utils/*.ts"
+    "./lib/utils/*": "./src/lib/utils/*.ts",
+    "./api": "./src/server/api.ts"
  },
  "devDependencies": {
    "@hookform/resolvers": "^5.0.1",
@@ -34,7 +35,6 @@
    "@types/react": "19.1.4",
    "lucide-react": "^0.510.0",
    "next": "15.3.2",
-    "react-hook-form": "^7.56.3",
    "sonner": "^2.0.3"
  },
  "prettier": "@kit/prettier-config",
--- a/packages/features/notifications/src/components/success-notification.tsx
+++ b/packages/features/notifications/src/components/success-notification.tsx
@@ -38,7 +38,9 @@ export const SuccessNotification = ({
          width={326}
          height={195}
        />
-        <h1 className="pb-2">{title || <Trans i18nKey={titleKey} />}</h1>
+        <h1 className="pb-2 text-center">
+          {title || <Trans i18nKey={titleKey} />}
+        </h1>
        <p className="text-muted-foreground text-sm">
          <Trans i18nKey={descriptionKey} />
        </p>
--- a/packages/features/team-accounts/package.json
+++ b/packages/features/team-accounts/package.json
@@ -44,7 +44,6 @@
    "next": "15.3.2",
    "react": "19.1.0",
    "react-dom": "19.1.0",
-    "react-hook-form": "^7.56.3",
    "sonner": "^2.0.3"
  },
  "prettier": "@kit/prettier-config",
--- a/packages/otp/package.json
+++ b/packages/otp/package.json
@@ -29,8 +29,7 @@
    "@types/react": "19.1.4",
    "@types/react-dom": "19.1.5",
    "react": "19.1.0",
-    "react-dom": "19.1.0",
-    "react-hook-form": "^7.56.3"
+    "react-dom": "19.1.0"
  },
  "typesVersions": {
    "*": {
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -54,7 +54,6 @@
    "next-themes": "0.4.6",
    "prettier": "^3.5.3",
    "react-day-picker": "^8.10.1",
-    "react-hook-form": "^7.56.3",
    "sonner": "^2.0.3",
    "tailwindcss": "4.1.7",
    "tailwindcss-animate": "^1.0.7",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -82,10 +82,10 @@ importers:
        version: 2.8.6(react@19.1.0)
      '@medusajs/js-sdk':
        specifier: latest
-        version: 2.8.6(awilix@8.0.1)
+        version: 2.8.7(awilix@8.0.1)
      '@medusajs/ui':
        specifier: latest
-        version: 4.0.16(@types/react-dom@19.1.5(@types/react@19.1.4))(@types/react@19.1.4)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(typescript@5.8.3)
+        version: 4.0.17(@types/react-dom@19.1.5(@types/react@19.1.4))(@types/react@19.1.4)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(typescript@5.8.3)
      '@nosecone/next':
        specifier: 1.0.0-beta.7
        version: 1.0.0-beta.7(next@15.3.2(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0))
@@ -173,10 +173,10 @@ importers:
        version: link:tooling/typescript
      '@medusajs/types':
        specifier: latest
-        version: 2.8.6(awilix@8.0.1)
+        version: 2.8.7(awilix@8.0.1)
      '@medusajs/ui-preset':
        specifier: latest
-        version: 2.8.6(tailwindcss@4.1.7)
+        version: 2.8.7(tailwindcss@4.1.7)
      '@next/bundle-analyzer':
        specifier: 15.3.2
        version: 15.3.2
@@ -204,6 +204,9 @@ importers:
      dotenv:
        specifier: ^16.5.0
        version: 16.5.0
+      next-transpile-modules:
+        specifier: ^10.0.1
+        version: 10.0.1
      pino-pretty:
        specifier: ^13.0.0
        version: 13.0.0
@@ -263,7 +266,7 @@ importers:
    devDependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@kit/billing':
        specifier: workspace:*
        version: link:../core
@@ -309,9 +312,6 @@ importers:
      react:
        specifier: 19.1.0
        version: 19.1.0
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)

  packages/billing/lemon-squeezy:
    dependencies:
@@ -559,7 +559,7 @@ importers:
    devDependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@kit/billing-gateway':
        specifier: workspace:*
        version: link:../../billing/gateway
@@ -626,9 +626,6 @@ importers:
      react-dom:
        specifier: 19.1.0
        version: 19.1.0(react@19.1.0)
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)
      sonner:
        specifier: ^2.0.3
        version: 2.0.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
@@ -637,7 +634,7 @@ importers:
    devDependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@kit/eslint-config':
        specifier: workspace:*
        version: link:../../../tooling/eslint
@@ -689,15 +686,12 @@ importers:
      react-dom:
        specifier: 19.1.0
        version: 19.1.0(react@19.1.0)
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)

  packages/features/auth:
    devDependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@kit/eslint-config':
        specifier: workspace:*
        version: link:../../../tooling/eslint
@@ -737,9 +731,6 @@ importers:
      next:
        specifier: 15.3.2
        version: 15.3.2(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)
      sonner:
        specifier: ^2.0.3
        version: 2.0.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
@@ -751,10 +742,10 @@ importers:
        version: 2.2.4(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)
      '@medusajs/js-sdk':
        specifier: latest
-        version: 2.8.6(awilix@8.0.1)
+        version: 2.8.7(awilix@8.0.1)
      '@medusajs/ui':
        specifier: latest
-        version: 4.0.16(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)(typescript@5.8.3)
+        version: 4.0.17(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)(typescript@5.8.3)
      '@radix-ui/react-accordion':
        specifier: ^1.2.1
        version: 1.2.10(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)
@@ -800,10 +791,10 @@ importers:
        version: 7.27.4
      '@medusajs/types':
        specifier: latest
-        version: 2.8.6(awilix@8.0.1)
+        version: 2.8.7(awilix@8.0.1)
      '@medusajs/ui-preset':
        specifier: latest
-        version: 2.8.6(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3)))
+        version: 2.8.7(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3)))
      '@types/lodash':
        specifier: ^4.14.195
        version: 4.17.17
@@ -894,7 +885,7 @@ importers:
    devDependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@kit/accounts':
        specifier: workspace:*
        version: link:../accounts
@@ -967,9 +958,6 @@ importers:
      react-dom:
        specifier: 19.1.0
        version: 19.1.0(react@19.1.0)
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)
      sonner:
        specifier: ^2.0.3
        version: 2.0.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
@@ -1173,7 +1161,7 @@ importers:
    dependencies:
      '@sentry/nextjs':
        specifier: ^9.19.0
-        version: 9.27.0(@opentelemetry/context-async-hooks@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/core@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.57.2(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.30.1(@opentelemetry/api@1.9.0))(next@15.3.2(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(react@19.1.0)(webpack@5.99.9)
+        version: 9.27.0(@opentelemetry/context-async-hooks@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/core@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.57.2(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.30.1(@opentelemetry/api@1.9.0))(next@15.3.2(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(react@19.1.0)(webpack@5.99.9)
      import-in-the-middle:
        specifier: 1.13.2
        version: 1.13.2
@@ -1228,7 +1216,7 @@ importers:
    devDependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@kit/email-templates':
        specifier: workspace:*
        version: link:../email-templates
@@ -1274,9 +1262,6 @@ importers:
      react-dom:
        specifier: 19.1.0
        version: 19.1.0(react@19.1.0)
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)

  packages/shared:
    dependencies:
@@ -1336,7 +1321,7 @@ importers:
    dependencies:
      '@hookform/resolvers':
        specifier: ^5.0.1
-        version: 5.0.1(react-hook-form@7.57.0(react@19.1.0))
+        version: 5.0.1(react-hook-form@7.58.0(react@19.1.0))
      '@radix-ui/react-accordion':
        specifier: 1.2.10
        version: 1.2.10(@types/react-dom@19.1.5(@types/react@19.1.4))(@types/react@19.1.4)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
@@ -1464,9 +1449,6 @@ importers:
      react-day-picker:
        specifier: ^8.10.1
        version: 8.10.1(date-fns@4.1.0)(react@19.1.0)
-      react-hook-form:
-        specifier: ^7.56.3
-        version: 7.57.0(react@19.1.0)
      sonner:
        specifier: ^2.0.3
        version: 2.0.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
@@ -2131,12 +2113,17 @@ packages:
    peerDependencies:
      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc

-  '@medusajs/js-sdk@2.8.6':
-    resolution: {integrity: sha512-nrecLAeo+uHfL8u7WhUleysSRPjcgPLSgWbiRIq1oFeJU91M8xVlvNZgz+MSgwiDWCJsMYBr/8bgEu7+PxSy0w==}
+  '@medusajs/icons@2.8.7':
+    resolution: {integrity: sha512-zGkAokqWBNJ1PcTktCPSMT5spIIjv8Pba88BXvfcbblG5cUbMSvvJ2v/BRODMFejQ9NqlboIeP0fo/9RzLpPHg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+
+  '@medusajs/js-sdk@2.8.7':
+    resolution: {integrity: sha512-ZGYMQOM7GHuKtxOvJ+wgKyC/fzLlyMu5nij4hIWIf2osZy7d6dpvEglcV6w9B0UgSEADJh1SZ7a22HOJdjjJ9A==}
    engines: {node: '>=20'}

-  '@medusajs/types@2.8.6':
-    resolution: {integrity: sha512-SAkRVASQL+Rd+snaq2kEXJCfJBUjB6U4PBKvS+yHWdTVnvGUxkD725I4W+hWORjCK85po0lNdhv5Hx5YVe2BoQ==}
+  '@medusajs/types@2.8.7':
+    resolution: {integrity: sha512-8m/H9KkDUQz4YD+XkD/C63RfE/2elcdWf5G/KOK2QViTK0Jsd/Iw8Yy+T60pm0Lq/QQ925AfGH/Ji8UYNXjT8g==}
    engines: {node: '>=20'}
    peerDependencies:
      awilix: ^8.0.1
@@ -2148,13 +2135,13 @@ packages:
      vite:
        optional: true

-  '@medusajs/ui-preset@2.8.6':
-    resolution: {integrity: sha512-t5LKe7rOZeP8D87d1nzc3wjDSzVypMzasM3CbUlQVZ78xgfnewjqkbVlFacSQy4X36sIKHV4eHW8/E6cxdGbng==}
+  '@medusajs/ui-preset@2.8.7':
+    resolution: {integrity: sha512-ro8BrYlqHh7iZvYKrxmJtLweJYYet+wYQQv0R3pyfxkkP0aQ09KDPo8yTwls11iuMC4cQHljekdaOyXtSR6ZiQ==}
    peerDependencies:
      tailwindcss: '>=3.0.0'

-  '@medusajs/ui@4.0.16':
-    resolution: {integrity: sha512-eAziJhmVM4mQPbAE1qXFKF3oTk+j32XFjXU8LEjuw5TN8gXuWHEu+5/aNxycV8N01ooO41Bms5rcGzPuj8kcGw==}
+  '@medusajs/ui@4.0.17':
+    resolution: {integrity: sha512-N5KtZXvns13jDiCE3ZgZLINQnlECYLf4Q4GFdbRhCjAFKFBRGyyeNKX+Zo2wBUZA2Oi4kockdxFfsZfBHh/ZhA==}
    peerDependencies:
      react: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
      react-dom: ^18.0.0 || ^19.0.0 || ^19.0.0-rc
@@ -7657,6 +7644,9 @@ packages:
      react: ^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc
      react-dom: ^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc

+  next-transpile-modules@10.0.1:
+    resolution: {integrity: sha512-4VX/LCMofxIYAVV58UmD+kr8jQflpLWvas/BQ4Co0qWLWzVh06FoZkECkrX5eEZT6oJFqie6+kfbTA3EZCVtdQ==}
+
  next@15.3.2:
    resolution: {integrity: sha512-CA3BatMyHkxZ48sgOCLdVHjFU36N7TF1HhqAHLFOkV6buwZnvMI84Cug8xD56B9mCuKrqXnLn94417GrZ/jjCQ==}
    engines: {node: ^18.18.0 || ^19.8.0 || >= 20.0.0}
@@ -8354,12 +8344,6 @@ packages:
    peerDependencies:
      react: '>=16.13.1'

-  react-hook-form@7.57.0:
-    resolution: {integrity: sha512-RbEks3+cbvTP84l/VXGUZ+JMrKOS8ykQCRYdm5aYsxnDquL0vspsyNhGRO7pcH6hsZqWlPOjLye7rJqdtdAmlg==}
-    engines: {node: '>=18.0.0'}
-    peerDependencies:
-      react: ^16.8.0 || ^17 || ^18 || ^19
-
  react-hook-form@7.58.0:
    resolution: {integrity: sha512-zGijmEed35oNfOfy7ub99jfjkiLhHwA3dl5AgyKdWC6QQzhnc7tkWewSa+T+A2EpLrc6wo5DUoZctS9kufWJjA==}
    engines: {node: '>=18.0.0'}
@@ -9795,10 +9779,10 @@ snapshots:
      react-dom: 19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106)
      use-sync-external-store: 1.5.0(react@19.0.0-rc-66855b96-20241106)

-  '@hookform/resolvers@5.0.1(react-hook-form@7.57.0(react@19.1.0))':
+  '@hookform/resolvers@5.0.1(react-hook-form@7.58.0(react@19.1.0))':
    dependencies:
      '@standard-schema/utils': 0.3.0
-      react-hook-form: 7.57.0(react@19.1.0)
+      react-hook-form: 7.58.0(react@19.1.0)

  '@hookform/resolvers@5.1.1(react-hook-form@7.58.0(react@19.1.0))':
    dependencies:
@@ -10192,17 +10176,21 @@ snapshots:
      react: 19.1.0
      react-dom: 19.1.0(react@19.1.0)

-  '@medusajs/icons@2.8.6(react@19.0.0-rc-66855b96-20241106)':
-    dependencies:
-      react: 19.0.0-rc-66855b96-20241106
-
  '@medusajs/icons@2.8.6(react@19.1.0)':
    dependencies:
      react: 19.1.0

-  '@medusajs/js-sdk@2.8.6(awilix@8.0.1)':
+  '@medusajs/icons@2.8.7(react@19.0.0-rc-66855b96-20241106)':
    dependencies:
-      '@medusajs/types': 2.8.6(awilix@8.0.1)
+      react: 19.0.0-rc-66855b96-20241106
+
+  '@medusajs/icons@2.8.7(react@19.1.0)':
+    dependencies:
+      react: 19.1.0
+
+  '@medusajs/js-sdk@2.8.7(awilix@8.0.1)':
+    dependencies:
+      '@medusajs/types': 2.8.7(awilix@8.0.1)
      fetch-event-stream: 0.1.5
      qs: 6.14.0
    transitivePeerDependencies:
@@ -10210,26 +10198,26 @@ snapshots:
      - ioredis
      - vite

-  '@medusajs/types@2.8.6(awilix@8.0.1)':
+  '@medusajs/types@2.8.7(awilix@8.0.1)':
    dependencies:
      awilix: 8.0.1
      bignumber.js: 9.3.0

-  '@medusajs/ui-preset@2.8.6(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3)))':
+  '@medusajs/ui-preset@2.8.7(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3)))':
    dependencies:
      '@tailwindcss/forms': 0.5.10(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3)))
      tailwindcss: 3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3))
      tailwindcss-animate: 1.0.7(tailwindcss@3.4.17(ts-node@10.9.2(@types/node@17.0.21)(typescript@5.8.3)))

-  '@medusajs/ui-preset@2.8.6(tailwindcss@4.1.7)':
+  '@medusajs/ui-preset@2.8.7(tailwindcss@4.1.7)':
    dependencies:
      '@tailwindcss/forms': 0.5.10(tailwindcss@4.1.7)
      tailwindcss: 4.1.7
      tailwindcss-animate: 1.0.7(tailwindcss@4.1.7)

-  '@medusajs/ui@4.0.16(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)(typescript@5.8.3)':
+  '@medusajs/ui@4.0.17(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)(typescript@5.8.3)':
    dependencies:
-      '@medusajs/icons': 2.8.6(react@19.0.0-rc-66855b96-20241106)
+      '@medusajs/icons': 2.8.7(react@19.0.0-rc-66855b96-20241106)
      '@tanstack/react-table': 8.20.5(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106)
      clsx: 1.2.1
      copy-to-clipboard: 3.3.3
@@ -10249,9 +10237,9 @@ snapshots:
      - '@types/react-dom'
      - typescript

-  '@medusajs/ui@4.0.16(@types/react-dom@19.1.5(@types/react@19.1.4))(@types/react@19.1.4)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(typescript@5.8.3)':
+  '@medusajs/ui@4.0.17(@types/react-dom@19.1.5(@types/react@19.1.4))(@types/react@19.1.4)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)(typescript@5.8.3)':
    dependencies:
-      '@medusajs/icons': 2.8.6(react@19.1.0)
+      '@medusajs/icons': 2.8.7(react@19.1.0)
      '@tanstack/react-table': 8.20.5(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
      clsx: 1.2.1
      copy-to-clipboard: 3.3.3
@@ -15707,7 +15695,7 @@ snapshots:

  '@sentry/core@9.27.0': {}

-  '@sentry/nextjs@9.27.0(@opentelemetry/context-async-hooks@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/core@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.57.2(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.30.1(@opentelemetry/api@1.9.0))(next@15.3.2(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(react@19.1.0)(webpack@5.99.9)':
+  '@sentry/nextjs@9.27.0(@opentelemetry/context-async-hooks@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/core@1.30.1(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.57.2(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.30.1(@opentelemetry/api@1.9.0))(next@15.3.2(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0))(react@19.1.0)(webpack@5.99.9)':
    dependencies:
      '@opentelemetry/api': 1.9.0
      '@opentelemetry/semantic-conventions': 1.34.0
@@ -15720,7 +15708,7 @@ snapshots:
      '@sentry/vercel-edge': 9.27.0
      '@sentry/webpack-plugin': 3.5.0(webpack@5.99.9)
      chalk: 3.0.0
-      next: 15.3.2(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
+      next: 15.3.2(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
      resolve: 1.22.8
      rollup: 4.35.0
      stacktrace-parser: 0.1.11
@@ -19017,6 +19005,10 @@ snapshots:
      react: 19.1.0
      react-dom: 19.1.0(react@19.1.0)

+  next-transpile-modules@10.0.1:
+    dependencies:
+      enhanced-resolve: 5.18.1
+
  next@15.3.2(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.0.0-rc-66855b96-20241106(react@19.0.0-rc-66855b96-20241106))(react@19.0.0-rc-66855b96-20241106):
    dependencies:
      '@next/env': 15.3.2
@@ -19044,6 +19036,33 @@ snapshots:
      - '@babel/core'
      - babel-plugin-macros

+  next@15.3.2(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
+    dependencies:
+      '@next/env': 15.3.2
+      '@swc/counter': 0.1.3
+      '@swc/helpers': 0.5.15
+      busboy: 1.6.0
+      caniuse-lite: 1.0.30001723
+      postcss: 8.4.31
+      react: 19.1.0
+      react-dom: 19.1.0(react@19.1.0)
+      styled-jsx: 5.1.6(@babel/core@7.27.4)(react@19.1.0)
+    optionalDependencies:
+      '@next/swc-darwin-arm64': 15.3.2
+      '@next/swc-darwin-x64': 15.3.2
+      '@next/swc-linux-arm64-gnu': 15.3.2
+      '@next/swc-linux-arm64-musl': 15.3.2
+      '@next/swc-linux-x64-gnu': 15.3.2
+      '@next/swc-linux-x64-musl': 15.3.2
+      '@next/swc-win32-arm64-msvc': 15.3.2
+      '@next/swc-win32-x64-msvc': 15.3.2
+      '@opentelemetry/api': 1.9.0
+      babel-plugin-react-compiler: 19.1.0-rc.2
+      sharp: 0.34.2
+    transitivePeerDependencies:
+      - '@babel/core'
+      - babel-plugin-macros
+
  next@15.3.2(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
    dependencies:
      '@next/env': 15.3.2
@@ -19906,10 +19925,6 @@ snapshots:
      '@babel/runtime': 7.27.6
      react: 19.1.0

-  react-hook-form@7.57.0(react@19.1.0):
-    dependencies:
-      react: 19.1.0
-
  react-hook-form@7.58.0(react@19.1.0):
    dependencies:
      react: 19.1.0
@@ -20524,6 +20539,13 @@ snapshots:
    optionalDependencies:
      '@babel/core': 7.27.4

+  styled-jsx@5.1.6(@babel/core@7.27.4)(react@19.1.0):
+    dependencies:
+      client-only: 0.0.1
+      react: 19.1.0
+    optionalDependencies:
+      '@babel/core': 7.27.4
+
  styled-jsx@5.1.6(react@19.1.0):
    dependencies:
      client-only: 0.0.1