From 8b82f4744e4a302c240f12a278eaf72007da07c0 Mon Sep 17 00:00:00 2001 From: Rafi Arrafif Date: Tue, 7 Oct 2025 21:46:50 +0700 Subject: [PATCH] :lipstick: (ui) add toast to display an error --- bun.lock | 16 +++++++-- features/auth/models/submitRegisterForm.ts | 2 +- .../auth/ui/components/ProvisionInput.tsx | 35 ++++++++++++++----- package.json | 4 ++- 4 files changed, 43 insertions(+), 14 deletions(-) diff --git a/bun.lock b/bun.lock index f5ae551..6a1e71f 100644 --- a/bun.lock +++ b/bun.lock @@ -5,6 +5,7 @@ "name": "frontend", "dependencies": { "@heroui/react": "^2.8.2", + "@hookform/resolvers": "^5.2.2", "@iconify/react": "^6.0.0", "@sentry/nextjs": "10", "@tailwindcss/postcss": "^4.1.11", @@ -12,6 +13,7 @@ "cz-emoji": "^1.3.2-canary.2", "framer-motion": "^12.23.3", "ky": "^1.8.2", + "nanoid": "^5.1.6", "next": "15.3.5", "next-themes": "^0.4.6", "nextjs-toploader": "^3.8.16", @@ -19,7 +21,7 @@ "react-dom": "^19.0.0", "react-hook-form": "^7.64.0", "tailwindcss": "^4.1.11", - "zod": "^4.0.5", + "zod": "^4.1.12", }, "devDependencies": { "@eslint/eslintrc": "^3", @@ -275,6 +277,8 @@ "@heroui/user": ["@heroui/user@2.2.20", "", { "dependencies": { "@heroui/avatar": "2.2.20", "@heroui/react-utils": "2.1.12", "@heroui/shared-utils": "2.1.10", "@react-aria/focus": "3.21.0" }, "peerDependencies": { "@heroui/system": ">=2.4.18", "@heroui/theme": ">=2.4.17", "react": ">=18 || >=19.0.0-rc.0", "react-dom": ">=18 || >=19.0.0-rc.0" } }, "sha512-KnqFtiZR18nlpSEJzA6/aGhNMnuWjQx6L7JbF8kAA2CdhHEBABRIsqKN1qBRon7awMilzBOvlHe6yuk1sEqJHg=="], + "@hookform/resolvers": ["@hookform/resolvers@5.2.2", "", { "dependencies": { "@standard-schema/utils": "^0.3.0" }, "peerDependencies": { "react-hook-form": "^7.55.0" } }, "sha512-A/IxlMLShx3KjV/HeTcTfaMxdwy690+L/ZADoeaTltLx+CVuzkeVIPuybK3jrRfw7YZnmdKsVVHAlEPIAEUNlA=="], + "@humanfs/core": ["@humanfs/core@0.19.1", "", {}, "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA=="], "@humanfs/node": ["@humanfs/node@0.16.6", "", { "dependencies": { "@humanfs/core": "^0.19.1", "@humanwhocodes/retry": "^0.3.0" } }, "sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw=="], @@ -715,6 +719,8 @@ "@sentry/webpack-plugin": ["@sentry/webpack-plugin@4.3.0", "", { "dependencies": { "@sentry/bundler-plugin-core": "4.3.0", "unplugin": "1.0.1", "uuid": "^9.0.0" }, "peerDependencies": { "webpack": ">=4.40.0" } }, "sha512-K4nU1SheK/tvyakBws2zfd+MN6hzmpW+wPTbSbDWn1+WL9+g9hsPh8hjFFiVe47AhhUoUZ3YgiH2HyeHXjHflA=="], + "@standard-schema/utils": ["@standard-schema/utils@0.3.0", "", {}, "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g=="], + "@swc/counter": ["@swc/counter@0.1.3", "", {}, "sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ=="], "@swc/helpers": ["@swc/helpers@0.5.15", "", { "dependencies": { "tslib": "^2.8.0" } }, "sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g=="], @@ -1483,7 +1489,7 @@ "mute-stream": ["mute-stream@0.0.8", "", {}, "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA=="], - "nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="], + "nanoid": ["nanoid@5.1.6", "", { "bin": { "nanoid": "bin/nanoid.js" } }, "sha512-c7+7RQ+dMB5dPwwCp4ee1/iV/q2P6aK1mTZcfr1BTuVlyW9hJYiMPybJCcnBlQtuSmTIWNeazm/zqNoZSSElBg=="], "napi-postinstall": ["napi-postinstall@0.3.0", "", { "bin": { "napi-postinstall": "lib/cli.js" } }, "sha512-M7NqKyhODKV1gRLdkwE7pDsZP2/SC2a2vHkOYh9MCpKMbWVfyVfUw5MaH83Fv6XMjxr5jryUp3IDDL9rlxsTeA=="], @@ -1859,7 +1865,7 @@ "yocto-queue": ["yocto-queue@0.1.0", "", {}, "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="], - "zod": ["zod@4.0.5", "", {}, "sha512-/5UuuRPStvHXu7RS+gmvRf4NXrNxpSllGwDnCBcJZtQsKrviYXm54yDGV2KYNLT5kq0lHGcl7lqWJLgSaG+tgA=="], + "zod": ["zod@4.1.12", "", {}, "sha512-JInaHOamG8pt5+Ey8kGmdcAcg3OL9reK8ltczgHTAwNhMys/6ThXHityHxVV2p3fkw/c+MAvBHFVYHFZDmjMCQ=="], "@babel/core/json5": ["json5@2.2.3", "", { "bin": { "json5": "lib/cli.js" } }, "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg=="], @@ -1975,6 +1981,8 @@ "path-scurry/lru-cache": ["lru-cache@10.4.3", "", {}, "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ=="], + "postcss/nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="], + "read-pkg/type-fest": ["type-fest@0.6.0", "", {}, "sha512-q+MB8nYR1KDLrgr4G5yemftpMC7/QLqVndBmEEdqzmNj5dcFOO4Oo8qlwZE3ULT3+Zim1F8Kq4cBnikNhlCMlg=="], "read-pkg-up/find-up": ["find-up@4.1.0", "", { "dependencies": { "locate-path": "^5.0.0", "path-exists": "^4.0.0" } }, "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw=="], @@ -2075,6 +2083,8 @@ "inquirer-maxlength-input-prompt/inquirer/strip-ansi": ["strip-ansi@4.0.0", "", { "dependencies": { "ansi-regex": "^3.0.0" } }, "sha512-4XaJ2zQdCzROZDivEVIDPkcQn8LMFSa8kj8Gxb/Lnwzv9A8VctNZ+lfivC/sV3ivW8ElJTERXZoPBRrZKkNKow=="], + "next/postcss/nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="], + "read-pkg-up/find-up/locate-path": ["locate-path@5.0.0", "", { "dependencies": { "p-locate": "^4.1.0" } }, "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g=="], "schema-utils/ajv/json-schema-traverse": ["json-schema-traverse@1.0.0", "", {}, "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="], diff --git a/features/auth/models/submitRegisterForm.ts b/features/auth/models/submitRegisterForm.ts index cf2b2a5..f6dddee 100644 --- a/features/auth/models/submitRegisterForm.ts +++ b/features/auth/models/submitRegisterForm.ts @@ -2,7 +2,7 @@ import { apiErrorHandler } from "@/shared/lib/ky/errorHandler"; import { RegisterInputs } from "../ui/components/ProvisionInput"; -import { ServerRequestCallback } from "@/shared/types/serverRequestCallback"; +import { ServerRequestCallback } from "@/shared/types/ServerRequestCallback"; export const submitRegisterForm = async ( data: RegisterInputs diff --git a/features/auth/ui/components/ProvisionInput.tsx b/features/auth/ui/components/ProvisionInput.tsx index 4751a09..91d1618 100644 --- a/features/auth/ui/components/ProvisionInput.tsx +++ b/features/auth/ui/components/ProvisionInput.tsx @@ -23,15 +23,32 @@ const ProvisionInput = ({ fullname }: Props) => { const [submitStatus, setSubmitStatus] = useState(false); const onSubmit: SubmitHandler = async (data) => { setSubmitStatus(true); - console.log("Mensubmit"); - const returnData = await submitRegisterForm(data); - console.log(returnData); - addToast({ - color: "danger", - title: "😬 Oops, something went wrong!", - description: returnData.text.message, - }); - setSubmitStatus(false); + + try { + const returnData = await submitRegisterForm(data); + if (!returnData.success) { + setSubmitStatus(false); + addToast({ + color: "danger", + title: "😬 Oops, something went wrong!", + description: returnData.text.message, + }); + } else { + setSubmitStatus(false); + addToast({ + color: "success", + title: "OKKE!", + description: returnData.text.message, + }); + } + } catch (error) { + setSubmitStatus(false); + addToast({ + color: "danger", + title: "😬 Oops, something went wrong!", + description: "Internal server error", + }); + } }; return ( diff --git a/package.json b/package.json index 4e58914..a1c5ce9 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ }, "dependencies": { "@heroui/react": "^2.8.2", + "@hookform/resolvers": "^5.2.2", "@iconify/react": "^6.0.0", "@sentry/nextjs": "10", "@tailwindcss/postcss": "^4.1.11", @@ -21,6 +22,7 @@ "cz-emoji": "^1.3.2-canary.2", "framer-motion": "^12.23.3", "ky": "^1.8.2", + "nanoid": "^5.1.6", "next": "15.3.5", "next-themes": "^0.4.6", "nextjs-toploader": "^3.8.16", @@ -28,7 +30,7 @@ "react-dom": "^19.0.0", "react-hook-form": "^7.64.0", "tailwindcss": "^4.1.11", - "zod": "^4.0.5" + "zod": "^4.1.12" }, "devDependencies": { "@eslint/eslintrc": "^3",