diff --git a/apps/nextjs/src/app/[locale]/manage/users/[userId]/general/_components/_change-home-board.tsx b/apps/nextjs/src/app/[locale]/manage/users/[userId]/general/_components/_change-home-board.tsx new file mode 100644 index 000000000..bdad9cfea --- /dev/null +++ b/apps/nextjs/src/app/[locale]/manage/users/[userId]/general/_components/_change-home-board.tsx @@ -0,0 +1,85 @@ +"use client"; + +import { Button, Group, Stack } from "@mantine/core"; +import type { z } from "zod/v4"; + +import type { RouterOutputs } from "@homarr/api"; +import { clientApi } from "@homarr/api/client"; +import { revalidatePathActionAsync } from "@homarr/common/client"; +import { useZodForm } from "@homarr/form"; +import { showErrorNotification, showSuccessNotification } from "@homarr/notifications"; +import { useI18n } from "@homarr/translation/client"; +import { userChangeHomeBoardsSchema } from "@homarr/validation/user"; + +import type { Board } from "~/app/[locale]/boards/_types"; +import { BoardSelect } from "~/components/board/board-select"; + +interface ChangeHomeBoardFormProps { + user: RouterOutputs["user"]["getById"]; + boardsData: Pick[]; +} + +export const ChangeHomeBoardForm = ({ user, boardsData }: ChangeHomeBoardFormProps) => { + const t = useI18n(); + const { mutate, isPending } = clientApi.user.changeHomeBoards.useMutation({ + async onSettled() { + await revalidatePathActionAsync(`/manage/users/${user.id}`); + }, + onSuccess(_, variables) { + form.setInitialValues({ + homeBoardId: variables.homeBoardId, + mobileHomeBoardId: variables.mobileHomeBoardId, + }); + showSuccessNotification({ + message: t("user.action.changeHomeBoard.notification.success.message"), + }); + }, + onError() { + showErrorNotification({ + message: t("user.action.changeHomeBoard.notification.error.message"), + }); + }, + }); + const form = useZodForm(userChangeHomeBoardsSchema, { + initialValues: { + homeBoardId: user.homeBoardId, + mobileHomeBoardId: user.mobileHomeBoardId, + }, + }); + + const handleSubmit = (values: FormType) => { + mutate({ + userId: user.id, + ...values, + }); + }; + + return ( +
+ + + + + + + + +
+ ); +}; + +type FormType = z.infer; diff --git a/apps/nextjs/src/app/[locale]/manage/users/[userId]/general/_components/_change-search-preferences.tsx b/apps/nextjs/src/app/[locale]/manage/users/[userId]/general/_components/_change-search-preferences.tsx new file mode 100644 index 000000000..afae60dc1 --- /dev/null +++ b/apps/nextjs/src/app/[locale]/manage/users/[userId]/general/_components/_change-search-preferences.tsx @@ -0,0 +1,84 @@ +"use client"; + +import { Button, Group, Select, Stack, Switch } from "@mantine/core"; +import type { z } from "zod/v4"; + +import type { RouterOutputs } from "@homarr/api"; +import { clientApi } from "@homarr/api/client"; +import { revalidatePathActionAsync } from "@homarr/common/client"; +import { useZodForm } from "@homarr/form"; +import { showErrorNotification, showSuccessNotification } from "@homarr/notifications"; +import { useI18n } from "@homarr/translation/client"; +import { userChangeSearchPreferencesSchema } from "@homarr/validation/user"; + +interface ChangeSearchPreferencesFormProps { + user: RouterOutputs["user"]["getById"]; + searchEnginesData: { value: string; label: string }[]; +} + +export const ChangeSearchPreferencesForm = ({ user, searchEnginesData }: ChangeSearchPreferencesFormProps) => { + const t = useI18n(); + const { mutate, isPending } = clientApi.user.changeSearchPreferences.useMutation({ + async onSettled() { + await revalidatePathActionAsync(`/manage/users/${user.id}`); + }, + onSuccess(_, variables) { + form.setInitialValues({ + defaultSearchEngineId: variables.defaultSearchEngineId, + openInNewTab: variables.openInNewTab, + ddgBangsEnabled: variables.ddgBangsEnabled, + }); + showSuccessNotification({ + message: t("user.action.changeSearchPreferences.notification.success.message"), + }); + }, + onError() { + showErrorNotification({ + message: t("user.action.changeSearchPreferences.notification.error.message"), + }); + }, + }); + const form = useZodForm(userChangeSearchPreferencesSchema, { + initialValues: { + defaultSearchEngineId: user.defaultSearchEngineId, + openInNewTab: user.openSearchInNewTab, + ddgBangsEnabled: user.ddgBangs, + }, + }); + + const handleSubmit = (values: FormType) => { + mutate({ + userId: user.id, + ...values, + }); + }; + + return ( +
+ +