From 9361364e785f20522d4502864f3f7a66e777ed0c Mon Sep 17 00:00:00 2001 From: Mahyar Khanbolooki Date: Tue, 29 Jul 2025 23:34:19 +0330 Subject: [PATCH] add: report problem page --- public/assets/images/report-hero.svg | 436 ++++++++++++++++++ src/app/[name]/layout.tsx | 3 + src/app/[name]/report/page.tsx | 75 +++ src/app/globals.css | 17 + src/app/layout.tsx | 2 +- src/components/input/InputField.tsx | 4 +- src/components/menu/SideMenu.tsx | 2 +- .../wrapper/ClientMenuRouteWrapper.tsx.tsx | 2 +- src/locales/fa/parallels.json | 15 + 9 files changed, 551 insertions(+), 5 deletions(-) create mode 100644 public/assets/images/report-hero.svg create mode 100644 src/app/[name]/report/page.tsx create mode 100644 src/locales/fa/parallels.json diff --git a/public/assets/images/report-hero.svg b/public/assets/images/report-hero.svg new file mode 100644 index 0000000..574cfeb --- /dev/null +++ b/public/assets/images/report-hero.svg @@ -0,0 +1,436 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/app/[name]/layout.tsx b/src/app/[name]/layout.tsx index de2fa66..bd8fd24 100644 --- a/src/app/[name]/layout.tsx +++ b/src/app/[name]/layout.tsx @@ -7,14 +7,17 @@ export const metadata = { export default function MenuLayout({ children, + report }: Readonly<{ children: React.ReactNode; + report: React.ReactNode, }>) { return ( {children} + {report} ); diff --git a/src/app/[name]/report/page.tsx b/src/app/[name]/report/page.tsx new file mode 100644 index 0000000..d90c0a1 --- /dev/null +++ b/src/app/[name]/report/page.tsx @@ -0,0 +1,75 @@ +'use client'; + +import Button from '@/components/button/PrimaryButton'; +import InputField from '@/components/input/InputField'; +import { ArrowLeft } from 'iconsax-react'; +import Image from 'next/image' +import { useRouter } from 'next/navigation'; +import React from 'react' +import { useTranslation } from 'react-i18next' + +type Props = object; + +function ReportIndex({ }: Props) { + const router = useRouter(); + + const { t } = useTranslation('parallels', { + keyPrefix: 'Report' + }) + + return ( +
+ { router.back() }} + /> + report hero image +
+

{t('Heading')}

+

{t('Description')}

+
+ +
+ { }} + /> + +
+ + + {t('InputDescription.Label')} + +
+ + + +
+ ) +} + +export default ReportIndex \ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css index 2694207..95b35d5 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -88,6 +88,23 @@ input[type="password"] { background: #555; } +input:-webkit-autofill { + -webkit-box-shadow: 0 0 0px 0px transparent inset !important; + box-shadow: 0 0 0px 0px transparent inset !important; + -webkit-text-fill-color: #000 !important; + background: currentColor !important; + transition: background-color 10000s ease-in-out 0s; +} + +input:autofill { + -webkit-box-shadow: 0 0 0px 0px transparent inset !important; + box-shadow: 0 0 0px 0px transparent inset !important; + -webkit-text-fill-color: #000 !important; + background: currentColor !important; + transition: background-color 10000s ease-in-out 0s; +} + + .box-shadow-normal { box-shadow: 0px 2px 16px 0px #00000014; } diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 5e77bc3..48913fc 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -11,7 +11,7 @@ export const metadata: Metadata = { description: 'Webapp dashboard', } -const i18nNamespaces = ['common', 'menu', 'orders', 'auth', "rating", "chat", "notifications"]; +const i18nNamespaces = ['common', 'menu', 'orders', 'auth', "rating", "chat", "notifications", 'parallels']; export default async function RootLayout({ children, diff --git a/src/components/input/InputField.tsx b/src/components/input/InputField.tsx index fce0d5d..26ea54b 100644 --- a/src/components/input/InputField.tsx +++ b/src/components/input/InputField.tsx @@ -15,7 +15,7 @@ function InputField({ onChange, htmlFor, labelText, children, valid = true, clas return (
@@ -25,7 +25,7 @@ function InputField({ onChange, htmlFor, labelText, children, valid = true, clas onChange={onChange} className={clsx( inputProps['aria-errormessage'] && '!text-red-300', - 'py-2.5 pt-3.5 text-base w-full outline-0 !leading-6' + 'py-2.5 pt-3.5 text-sm2 w-full outline-0 !leading-6' )} name={htmlFor} {...inputProps} /> diff --git a/src/components/menu/SideMenu.tsx b/src/components/menu/SideMenu.tsx index 209e497..5dd7dde 100644 --- a/src/components/menu/SideMenu.tsx +++ b/src/components/menu/SideMenu.tsx @@ -40,7 +40,7 @@ const menuItems: Array> = [ { href: 'transactions', title: 'Transactions', icon: }, { href: '/', title: 'Games', icon: }, { href: '?share', title: 'ShareWithFriends', icon: }, - { href: 'services', title: 'ReportProblem', icon: }, + { href: 'report', title: 'ReportProblem', icon: }, { href: 'invoices', title: 'InstallApp', icon: } ], [], diff --git a/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx b/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx index d7ab840..a977713 100644 --- a/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx +++ b/src/components/wrapper/ClientMenuRouteWrapper.tsx.tsx @@ -66,7 +66,7 @@ function ClientMenuRouteWrapper({ children }: Props) {
{children}
diff --git a/src/locales/fa/parallels.json b/src/locales/fa/parallels.json new file mode 100644 index 0000000..9f3f684 --- /dev/null +++ b/src/locales/fa/parallels.json @@ -0,0 +1,15 @@ +{ + "Report": { + "Heading": "با برنامه به مشکلی برخوردید؟", + "Description": "توضیحات خود را برای بررسی توسط ما ثبت کنید", + "InputTitle": { + "Label": "عنوان گزارش", + "Placeholder": "عنوان گزارش خود را وارد کنید" + }, + "InputDescription": { + "Label": "توضیحات", + "Placeholder": "توضیحات خود را وارد کنید" + }, + "ButtonSubmit": "ثبت" + } +} \ No newline at end of file