diff --git a/public/images/icons/back-arrow.svg b/public/images/icons/back-arrow.svg new file mode 100644 index 0000000..63e382c --- /dev/null +++ b/public/images/icons/back-arrow.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/images/icons/discount-badge.svg b/public/images/icons/discount-badge.svg new file mode 100644 index 0000000..dd2f752 --- /dev/null +++ b/public/images/icons/discount-badge.svg @@ -0,0 +1,12 @@ + + + + + diff --git a/src/app/(auth)/(login)/change-passowrd/page.tsx b/src/app/(auth)/(login)/change-passowrd/page.tsx index 3659ddf..23d2e0b 100644 --- a/src/app/(auth)/(login)/change-passowrd/page.tsx +++ b/src/app/(auth)/(login)/change-passowrd/page.tsx @@ -100,7 +100,7 @@ function ChangePassword() { return ( -
+

{isEmailReset diff --git a/src/app/(auth)/(login)/forget-password-otp/page.tsx b/src/app/(auth)/(login)/forget-password-otp/page.tsx index 1d03e76..d9dfb56 100644 --- a/src/app/(auth)/(login)/forget-password-otp/page.tsx +++ b/src/app/(auth)/(login)/forget-password-otp/page.tsx @@ -74,7 +74,7 @@ function ForgetPasswordOtp() { return ( -

+
-
+

{t("auth.forgetPasswordDesc")} diff --git a/src/app/(auth)/(login)/login-2fa/page.tsx b/src/app/(auth)/(login)/login-2fa/page.tsx index da138e5..80a01cc 100644 --- a/src/app/(auth)/(login)/login-2fa/page.tsx +++ b/src/app/(auth)/(login)/login-2fa/page.tsx @@ -58,7 +58,7 @@ export default function LoginTwoFactorPage() { return ( -

+

{t("auth.twoFactorHint")} diff --git a/src/app/(auth)/(login)/login-with-username/page.tsx b/src/app/(auth)/(login)/login-with-username/page.tsx index ef0a26b..1bfe64e 100644 --- a/src/app/(auth)/(login)/login-with-username/page.tsx +++ b/src/app/(auth)/(login)/login-with-username/page.tsx @@ -95,7 +95,7 @@ function LoginWithUsername() { return ( -

+
-
+
- + {/* */} {t("auth.loginWithUsername")} diff --git a/src/app/(auth)/(login)/verify-otp/page.tsx b/src/app/(auth)/(login)/verify-otp/page.tsx index 2cb8bc8..d22dfc3 100644 --- a/src/app/(auth)/(login)/verify-otp/page.tsx +++ b/src/app/(auth)/(login)/verify-otp/page.tsx @@ -79,7 +79,7 @@ function VerifyOtp() { return ( -
+
-
+
-
+
- + {/* */} {t("auth.haveAccount")}{" "} diff --git a/src/app/(auth)/verify/location/page.tsx b/src/app/(auth)/verify/location/page.tsx index 0c2f79a..7f4d900 100644 --- a/src/app/(auth)/verify/location/page.tsx +++ b/src/app/(auth)/verify/location/page.tsx @@ -1,261 +1,198 @@ -/* eslint-disable @typescript-eslint/no-explicit-any */ -"use client"; - -import AuthPageLayout, { - AuthFormFooter, - AuthPageContent, -} from "@/components/auth/AuthPageLayout"; -import React, { useEffect, useMemo, useState } from "react"; -import useAxios from "@/hooks/useAxios"; -import { useFormik } from "formik"; -import * as yup from "yup"; -import { useRouter } from "next/navigation"; -import AuthNextButton from "@/components/auth/AuthNextButton"; -import toast from "react-hot-toast"; -import AuthUserDetails from "@/components/auth/AuthUserDetails"; -import SelectBox from "@/components/elements/SelectBox"; -import { ICity, IProvince } from "@/types/types"; -import Map, { GeolocateControl, Marker } from "react-map-gl"; -import "mapbox-gl/dist/mapbox-gl.css"; -import Image from "next/image"; -import { useTranslation } from "react-i18next"; -import LocalePageShell from "@/components/i18n/LocalePageShell"; - -function LocationPage() { - const { t } = useTranslation("common"); - const router = useRouter(); - const { request, loading } = useAxios(); - - const [isCheckedOne, setIsCheckedOne] = useState(false); - const [allStates, setAllStates] = useState(null); - const [cities, setCities] = useState(null); - const [selectedLocation, setSelectedLocation] = useState<{ - lat: number; - lng: number; - } | null>(null); - - const schema = useMemo( - () => - yup.object().shape({ - markerCoordinate: yup.mixed().required(t("auth.locationRequired")), - address: yup.string().required(t("auth.addressRequired")), - cityId: yup.string().required(t("auth.cityRequired")), - stateId: yup.string().required(t("auth.provinceRequired")), - }), - [t] - ); - - const fetchStates = async () => { - try { - const response = await request<{ provinces: IProvince[] }>( - "GET", - "/provinces" - ); - setAllStates(response?.provinces || null); - } catch (err) { - console.log(err); - } - }; - - const fetchCities = async (provinceId: string) => { - try { - const response = await request<{ cities: ICity[] }>( - "GET", - `/cities/${provinceId}` - ); - setCities(response?.cities || []); - } catch (err) { - console.log(err); - } - }; - - useEffect(() => { - fetchStates(); - }, []); - - const toggleCheckBox = () => { - setIsCheckedOne(!isCheckedOne); - }; - - const mobile = - typeof window !== "undefined" ? localStorage.getItem("mobile") : null; - - const formik = useFormik({ - initialValues: { - markerCoordinate: [], - address: "", - cityId: "", - stateId: "", - }, - validationSchema: schema, - onSubmit: async (values, { setSubmitting }) => { - try { - await request("POST", "/verify/address", { - mobile: mobile, - address: values.address, - province_id: values.stateId, - city_id: values.cityId, - lat: values.markerCoordinate[1], - lng: values.markerCoordinate[0], - show_location: isCheckedOne, - }); - router.push("/verify/national-cart"); - } catch (err: any) { - toast.error(err?.response?.data?.message || t("auth.unknownError")); - } finally { - setSubmitting(false); - } - }, - }); - - const handleProvinceChange = (e: React.ChangeEvent) => { - const selectedProvinceId = e.target.value; - formik.setFieldValue("stateId", selectedProvinceId); - fetchCities(selectedProvinceId); - }; - - const handleMapClick = (event: any) => { - const { lngLat } = event; - setSelectedLocation({ - lat: lngLat.lat, - lng: lngLat.lng, - }); - formik.setFieldValue("markerCoordinate", [lngLat.lng, lngLat.lat]); - }; - - return ( - - -
- - {t("auth.locationTitle")} -
- -
- - - {t("auth.locationActivityHint")} - - -
- - - {allStates?.map((item: IProvince) => ( - - ))} - - {formik.touched.stateId && formik.errors.stateId && ( - - {formik.errors.stateId} - - )} - - formik.setFieldValue("cityId", e.target.value)} - > - - {cities?.map((city: ICity) => ( - - ))} - - {formik.touched.cityId && formik.errors.cityId && ( - - {formik.errors.cityId} - - )} - -