From cb5b73ddbd04520be1bc58a5ee1a081f782c7dd6 Mon Sep 17 00:00:00 2001 From: Thomas Camlong Date: Tue, 19 May 2026 14:58:51 +0200 Subject: [PATCH] chore: migrate to mantine v9 Followed the migration guide --- .../[locale]/_client-providers/mantine.tsx | 1 + .../app/[locale]/auth/login/_login-form.tsx | 2 +- .../app/[locale]/boards/(content)/_theme.tsx | 1 + .../boards/[name]/settings/_appereance.tsx | 2 +- apps/nextjs/src/app/[locale]/layout.tsx | 2 +- .../secrets/integration-secret-card.tsx | 2 +- .../new/_integration-new-form.tsx | 2 +- .../board/sections/category-section.tsx | 2 +- packages/form/package.json | 1 - packages/form/src/index.ts | 5 ++-- .../forms-collection/src/new-app/_form.tsx | 2 +- packages/ui/src/theme.ts | 1 + packages/widgets/package.json | 2 +- packages/widgets/src/downloads/component.tsx | 2 +- packages/widgets/src/firewall/component.tsx | 4 ++-- .../src/media-requests/stats/component.tsx | 2 +- .../widgets/src/modals/widget-edit-modal.tsx | 5 ++-- pnpm-lock.yaml | 24 +++---------------- pnpm-workspace.yaml | 1 - 19 files changed, 23 insertions(+), 40 deletions(-) diff --git a/apps/nextjs/src/app/[locale]/_client-providers/mantine.tsx b/apps/nextjs/src/app/[locale]/_client-providers/mantine.tsx index d81b828f3..dc240d764 100644 --- a/apps/nextjs/src/app/[locale]/_client-providers/mantine.tsx +++ b/apps/nextjs/src/app/[locale]/_client-providers/mantine.tsx @@ -23,6 +23,7 @@ export const CustomMantineProvider = ({ theme={createTheme({ primaryColor: "red", autoContrast: true, + defaultRadius: "sm", })} > {children} diff --git a/apps/nextjs/src/app/[locale]/auth/login/_login-form.tsx b/apps/nextjs/src/app/[locale]/auth/login/_login-form.tsx index 71d249cf5..10a2f7c58 100644 --- a/apps/nextjs/src/app/[locale]/auth/login/_login-form.tsx +++ b/apps/nextjs/src/app/[locale]/auth/login/_login-form.tsx @@ -198,7 +198,7 @@ const PasswordForgottenCollapse = ({ username }: PasswordForgottenCollapseProps) {tForgotPassword("label")} - + {tForgotPassword("description")} diff --git a/apps/nextjs/src/app/[locale]/boards/(content)/_theme.tsx b/apps/nextjs/src/app/[locale]/boards/(content)/_theme.tsx index 27f3e9152..8fa031ad0 100644 --- a/apps/nextjs/src/app/[locale]/boards/(content)/_theme.tsx +++ b/apps/nextjs/src/app/[locale]/boards/(content)/_theme.tsx @@ -24,6 +24,7 @@ export const BoardMantineProvider = ({ }, primaryColor: "primaryColor", autoContrast: true, + defaultRadius: "sm", fontSizes: { "2xl": rem(24), "3xl": rem(28), diff --git a/apps/nextjs/src/app/[locale]/boards/[name]/settings/_appereance.tsx b/apps/nextjs/src/app/[locale]/boards/[name]/settings/_appereance.tsx index 95b3602e6..4af4af15f 100644 --- a/apps/nextjs/src/app/[locale]/boards/[name]/settings/_appereance.tsx +++ b/apps/nextjs/src/app/[locale]/boards/[name]/settings/_appereance.tsx @@ -83,7 +83,7 @@ export const ColorSettingsContent = ({ board }: Props) => { {showPreview ? t("common.preview.hide") : t("common.preview.show")} - + diff --git a/apps/nextjs/src/app/[locale]/layout.tsx b/apps/nextjs/src/app/[locale]/layout.tsx index 5449e1252..9342e0d30 100644 --- a/apps/nextjs/src/app/[locale]/layout.tsx +++ b/apps/nextjs/src/app/[locale]/layout.tsx @@ -142,7 +142,7 @@ export default async function Layout(props: { - + {props.children} diff --git a/apps/nextjs/src/app/[locale]/manage/integrations/_components/secrets/integration-secret-card.tsx b/apps/nextjs/src/app/[locale]/manage/integrations/_components/secrets/integration-secret-card.tsx index 06c4baff3..cc6a0a752 100644 --- a/apps/nextjs/src/app/[locale]/manage/integrations/_components/secrets/integration-secret-card.tsx +++ b/apps/nextjs/src/app/[locale]/manage/integrations/_components/secrets/integration-secret-card.tsx @@ -79,7 +79,7 @@ export const SecretCard = ({ secret, children, onCancel }: SecretCardProps) => { - {children} + {children} ); diff --git a/apps/nextjs/src/app/[locale]/manage/integrations/new/_integration-new-form.tsx b/apps/nextjs/src/app/[locale]/manage/integrations/new/_integration-new-form.tsx index 016b9336c..b7fbf3291 100644 --- a/apps/nextjs/src/app/[locale]/manage/integrations/new/_integration-new-form.tsx +++ b/apps/nextjs/src/app/[locale]/manage/integrations/new/_integration-new-form.tsx @@ -226,7 +226,7 @@ const AppForm = ({ form, canCreateApps }: { form: UseFormReturnType; c description={t("integration.field.createApp.description")} /> - +
{canCreateApps && ( diff --git a/apps/nextjs/src/components/board/sections/category-section.tsx b/apps/nextjs/src/components/board/sections/category-section.tsx index df204998b..81f49fa3e 100644 --- a/apps/nextjs/src/components/board/sections/category-section.tsx +++ b/apps/nextjs/src/components/board/sections/category-section.tsx @@ -44,7 +44,7 @@ export const BoardCategorySection = ({ section }: Props) => { - + diff --git a/packages/form/package.json b/packages/form/package.json index fcb7754ea..8fc2d7dac 100644 --- a/packages/form/package.json +++ b/packages/form/package.json @@ -27,7 +27,6 @@ "@homarr/translation": "workspace:^0.1.0", "@homarr/validation": "workspace:^0.1.0", "@mantine/form": "catalog:", - "mantine-form-zod-resolver": "catalog:", "zod": "catalog:" }, "devDependencies": { diff --git a/packages/form/src/index.ts b/packages/form/src/index.ts index f1d34f193..af8e4198e 100644 --- a/packages/form/src/index.ts +++ b/packages/form/src/index.ts @@ -1,5 +1,4 @@ -import { useForm } from "@mantine/form"; -import { zod4Resolver } from "mantine-form-zod-resolver"; +import { schemaResolver, useForm } from "@mantine/form"; import type { ZodDiscriminatedUnion, ZodIntersection, ZodObject, ZodPipe } from "zod/v4"; import { z } from "zod/v4"; @@ -34,6 +33,6 @@ export const useZodForm = < ...options, validateInputOnBlur: true, validateInputOnChange: true, - validate: zod4Resolver(schema), + validate: schemaResolver(schema, { sync: true }), }); }; diff --git a/packages/forms-collection/src/new-app/_form.tsx b/packages/forms-collection/src/new-app/_form.tsx index 82f5a7caa..05c7e3f6f 100644 --- a/packages/forms-collection/src/new-app/_form.tsx +++ b/packages/forms-collection/src/new-app/_form.tsx @@ -114,7 +114,7 @@ export const AppForm = ({ mt="md" /> - + diff --git a/packages/ui/src/theme.ts b/packages/ui/src/theme.ts index e1e928d57..7439ae440 100644 --- a/packages/ui/src/theme.ts +++ b/packages/ui/src/theme.ts @@ -9,4 +9,5 @@ export const theme = createTheme({ secondaryColor, }, primaryColor: "primaryColor", + defaultRadius: "sm", }); diff --git a/packages/widgets/package.json b/packages/widgets/package.json index 4ee4834f8..b4ce610a6 100644 --- a/packages/widgets/package.json +++ b/packages/widgets/package.json @@ -50,6 +50,7 @@ "@homarr/validation": "workspace:^0.1.0", "@mantine/charts": "catalog:", "@mantine/core": "catalog:", + "@mantine/form": "catalog:", "@mantine/hooks": "catalog:", "@tabler/icons-react": "catalog:", "@tiptap/extension-color": "catalog:", @@ -70,7 +71,6 @@ "@tiptap/starter-kit": "catalog:", "clsx": "catalog:", "dayjs": "catalog:", - "mantine-form-zod-resolver": "catalog:", "mantine-react-table": "catalog:", "next": "catalog:", "react": "catalog:", diff --git a/packages/widgets/src/downloads/component.tsx b/packages/widgets/src/downloads/component.tsx index 9af29da6d..8e27d702f 100644 --- a/packages/widgets/src/downloads/component.tsx +++ b/packages/widgets/src/downloads/component.tsx @@ -805,7 +805,7 @@ const ClientsControl = ({ clients, filters, setFilters, availableStatuses }: Cli setFilters({ ...filters, statuses: statuses as typeof filters.statuses })} + onChange={(statuses) => setFilters({ ...filters, statuses: statuses })} > {availableStatuses.map((status) => ( diff --git a/packages/widgets/src/firewall/component.tsx b/packages/widgets/src/firewall/component.tsx index 111ab85fa..cf5ac2b0e 100644 --- a/packages/widgets/src/firewall/component.tsx +++ b/packages/widgets/src/firewall/component.tsx @@ -153,7 +153,7 @@ export default function FirewallWidget({ integrationIds, width, itemId }: Widget style={{ justifyContent: "flex-start" }} > - + {formatBitsPerSec(transmit, 2)} @@ -164,7 +164,7 @@ export default function FirewallWidget({ integrationIds, width, itemId }: Widget style={{ justifyContent: "flex-start" }} > - + {formatBitsPerSec(receive, 2)} diff --git a/packages/widgets/src/media-requests/stats/component.tsx b/packages/widgets/src/media-requests/stats/component.tsx index ea6ca302d..e3696ef47 100644 --- a/packages/widgets/src/media-requests/stats/component.tsx +++ b/packages/widgets/src/media-requests/stats/component.tsx @@ -103,7 +103,7 @@ export default function MediaServerWidget({ {t("titles.stats.main")} - + {data.map((stat) => ( >(({ actions, i const form = useForm({ mode: "controlled", initialValues: innerProps.value, - validate: zod4Resolver( + validate: schemaResolver( z.object({ options: z.object( objectEntries(options).reduce( @@ -70,6 +70,7 @@ export const WidgetEditModal = createModal>(({ actions, i borderColor: z.string(), }), }), + { sync: true }, ), validateInputOnBlur: true, validateInputOnChange: true, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 80cfe4037..de088b38a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -417,9 +417,6 @@ catalogs: lodash.clonedeep: specifier: ^4.5.0 version: 4.5.0 - mantine-form-zod-resolver: - specifier: ^1.3.0 - version: 1.3.0 mantine-react-table: specifier: 2.0.0-beta.9 version: 2.0.0-beta.9 @@ -1796,9 +1793,6 @@ importers: '@mantine/form': specifier: 'catalog:' version: 9.2.1(react@19.2.6) - mantine-form-zod-resolver: - specifier: 'catalog:' - version: 1.3.0(@mantine/form@9.2.1(react@19.2.6))(zod@4.4.3) zod: specifier: 'catalog:' version: 4.4.3 @@ -2757,6 +2751,9 @@ importers: '@mantine/core': specifier: 'catalog:' version: 9.2.1(@mantine/hooks@9.2.1(react@19.2.6))(@types/react@19.2.14)(react-dom@19.2.6(react@19.2.6))(react@19.2.6) + '@mantine/form': + specifier: 'catalog:' + version: 9.2.1(react@19.2.6) '@mantine/hooks': specifier: 'catalog:' version: 9.2.1(react@19.2.6) @@ -2817,9 +2814,6 @@ importers: dayjs: specifier: 'catalog:' version: 1.11.20 - mantine-form-zod-resolver: - specifier: 'catalog:' - version: 1.3.0(@mantine/form@9.2.1(react@19.2.6))(zod@4.4.3) mantine-react-table: specifier: 'catalog:' version: 2.0.0-beta.9(@mantine/core@9.2.1(@mantine/hooks@9.2.1(react@19.2.6))(@types/react@19.2.14)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/dates@9.2.1(@mantine/core@9.2.1(@mantine/hooks@9.2.1(react@19.2.6))(@types/react@19.2.14)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.2.1(react@19.2.6))(dayjs@1.11.20)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.2.1(react@19.2.6))(@tabler/icons-react@3.44.0(react@19.2.6))(clsx@2.1.1)(dayjs@1.11.20)(react-dom@19.2.6(react@19.2.6))(react@19.2.6) @@ -8149,13 +8143,6 @@ packages: resolution: {integrity: sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==} engines: {node: '>=10'} - mantine-form-zod-resolver@1.3.0: - resolution: {integrity: sha512-XlXXkJCYuUuOllW0zedYW+m/lbdFQ/bso1Vz+pJOYkxgjhoGvzN2EXWCS2+0iTOT9Q7WnOwWvHmvpTJN3PxSXw==} - engines: {node: '>=16.6.0'} - peerDependencies: - '@mantine/form': '>=7.0.0' - zod: '>=3.25.0' - mantine-react-table@2.0.0-beta.9: resolution: {integrity: sha512-ZdfcwebWaPERoDvAuk43VYcBCzamohARVclnbuepT0PHZ0wRcDPMBR+zgaocL+pFy8EXUGwvWTOKNh25ITpjNQ==} engines: {node: '>=16'} @@ -16214,11 +16201,6 @@ snapshots: dependencies: semver: 7.7.4 - mantine-form-zod-resolver@1.3.0(@mantine/form@9.2.1(react@19.2.6))(zod@4.4.3): - dependencies: - '@mantine/form': 9.2.1(react@19.2.6) - zod: 4.4.3 - mantine-react-table@2.0.0-beta.9(@mantine/core@9.2.1(@mantine/hooks@9.2.1(react@19.2.6))(@types/react@19.2.14)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/dates@9.2.1(@mantine/core@9.2.1(@mantine/hooks@9.2.1(react@19.2.6))(@types/react@19.2.14)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.2.1(react@19.2.6))(dayjs@1.11.20)(react-dom@19.2.6(react@19.2.6))(react@19.2.6))(@mantine/hooks@9.2.1(react@19.2.6))(@tabler/icons-react@3.44.0(react@19.2.6))(clsx@2.1.1)(dayjs@1.11.20)(react-dom@19.2.6(react@19.2.6))(react@19.2.6): dependencies: '@mantine/core': 9.2.1(@mantine/hooks@9.2.1(react@19.2.6))(@types/react@19.2.14)(react-dom@19.2.6(react@19.2.6))(react@19.2.6) diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index fa6afe4b6..615ee2570 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -140,7 +140,6 @@ catalog: json5: ^2.2.3 ldapts: 8.1.7 lodash.clonedeep: ^4.5.0 - mantine-form-zod-resolver: ^1.3.0 mantine-react-table: 2.0.0-beta.9 maria2: ^0.4.1 mysql2: 3.22.3