From 4c8d08def514cb441007c0bd2bc78e105e6d0153 Mon Sep 17 00:00:00 2001 From: trisusilo48 Date: Wed, 4 Dec 2024 11:50:21 +0700 Subject: cr popup information method --- src-migrate/modules/popup-information/index.tsx | 61 +++++++++++++++++++------ 1 file changed, 47 insertions(+), 14 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/popup-information/index.tsx b/src-migrate/modules/popup-information/index.tsx index 0d36f8e9..20afa902 100644 --- a/src-migrate/modules/popup-information/index.tsx +++ b/src-migrate/modules/popup-information/index.tsx @@ -1,33 +1,66 @@ import { useRouter } from 'next/router'; import { useEffect, useState } from 'react'; -import { Modal } from "~/components/ui/modal"; +import Image from 'next/image'; +import Link from 'next/link'; +import { Modal } from '~/components/ui/modal'; import { getAuth } from '~/libs/auth'; -import PageContent from '../page-content'; -const PagePopupInformation = () => { +const PagePopupInformation = ({data} : {data: any[]}) => { const router = useRouter(); const isHomePage = router.pathname === '/'; const auth = getAuth(); const [active, setActive] = useState(false); + // const [data, setData] = useState(null); useEffect(() => { - if (isHomePage && !auth) setActive(true); + // const getData = async () => { + // const res = await fetch(`/api/hero-banner?type=popup-banner`); + // const { data } = await res.json(); + // if (data) { + // setData(data); + // } + // }; + + if (isHomePage && !auth) { + setActive(true); + // getData(); + } }, [isHomePage, auth]); return (
- setActive(false)} - mode='desktop' - > -
setActive(false)}> - -
-
+ {data && ( + setActive(false)} + mode='desktop' + > +
setActive(false)} + > + + {data[0]?.name} + +
+
+ )}
); }; +export async function getServerSideProps() { + const res = await fetch(`/api/hero-banner?type=popup-banner`); + const { data } = await res.json(); + return { props: { data } }; +} + export default PagePopupInformation; -- cgit v1.2.3 From 23d6791006c3179bb3cbccef13f6d6a2a4f39c93 Mon Sep 17 00:00:00 2001 From: trisusilo48 Date: Wed, 4 Dec 2024 12:05:23 +0700 Subject: update get popup information --- src-migrate/modules/popup-information/index.tsx | 27 ++++++++++--------------- 1 file changed, 11 insertions(+), 16 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/popup-information/index.tsx b/src-migrate/modules/popup-information/index.tsx index 20afa902..5acdb068 100644 --- a/src-migrate/modules/popup-information/index.tsx +++ b/src-migrate/modules/popup-information/index.tsx @@ -6,25 +6,25 @@ import Link from 'next/link'; import { Modal } from '~/components/ui/modal'; import { getAuth } from '~/libs/auth'; -const PagePopupInformation = ({data} : {data: any[]}) => { +const PagePopupInformation = () => { const router = useRouter(); const isHomePage = router.pathname === '/'; const auth = getAuth(); const [active, setActive] = useState(false); - // const [data, setData] = useState(null); + const [data, setData] = useState(null); useEffect(() => { - // const getData = async () => { - // const res = await fetch(`/api/hero-banner?type=popup-banner`); - // const { data } = await res.json(); - // if (data) { - // setData(data); - // } - // }; + const getData = async () => { + const res = await fetch(`/api/hero-banner?type=popup-banner`); + const { data } = await res.json(); + if (data) { + setData(data); + } + }; if (isHomePage && !auth) { setActive(true); - // getData(); + getData(); } }, [isHomePage, auth]); return ( @@ -46,6 +46,7 @@ const PagePopupInformation = ({data} : {data: any[]}) => { alt={data[0]?.name} width={1152} height={768} + loading='eager' sizes='(max-width: 768px) 100vw, 50vw' priority={true} /> @@ -56,11 +57,5 @@ const PagePopupInformation = ({data} : {data: any[]}) => { ); }; -export async function getServerSideProps() { - const res = await fetch(`/api/hero-banner?type=popup-banner`); - const { data } = await res.json(); - return { props: { data } }; -} - export default PagePopupInformation; -- cgit v1.2.3 From 0ef6dd27b4c516c6948e8107c9e2477fca9f069f Mon Sep 17 00:00:00 2001 From: trisusilo48 Date: Fri, 6 Dec 2024 11:02:51 +0700 Subject: update performance --- src-migrate/modules/popup-information/index.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/popup-information/index.tsx b/src-migrate/modules/popup-information/index.tsx index 5acdb068..d50711cc 100644 --- a/src-migrate/modules/popup-information/index.tsx +++ b/src-migrate/modules/popup-information/index.tsx @@ -5,6 +5,7 @@ import Image from 'next/image'; import Link from 'next/link'; import { Modal } from '~/components/ui/modal'; import { getAuth } from '~/libs/auth'; +import dynamic from 'next/dynamic'; const PagePopupInformation = () => { const router = useRouter(); @@ -12,6 +13,8 @@ const PagePopupInformation = () => { const auth = getAuth(); const [active, setActive] = useState(false); const [data, setData] = useState(null); + const [loading, setLoading] = useState(true); + useEffect(() => { const getData = async () => { @@ -20,6 +23,7 @@ const PagePopupInformation = () => { if (data) { setData(data); } + setLoading(false); }; if (isHomePage && !auth) { @@ -29,7 +33,7 @@ const PagePopupInformation = () => { }, [isHomePage, auth]); return (
- {data && ( + {data && !loading && ( Date: Mon, 9 Dec 2024 15:48:36 +0700 Subject: add dynamic to call component --- .../modules/register/components/FormBisnis.tsx | 7 --- .../register/components/RegistrasiBisnis.tsx | 19 +------- src-migrate/modules/register/index.tsx | 54 +++++++++++----------- 3 files changed, 30 insertions(+), 50 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index e4cf3442..12397956 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -1,9 +1,5 @@ import { ChangeEvent, useEffect, useMemo, useRef, useState } from 'react'; -import { useMutation } from 'react-query'; import { useRegisterStore } from '../stores/useRegisterStore'; -import { RegisterProps } from '~/types/auth'; -import { registerUser } from '~/services/auth'; -import { useRouter } from 'next/router'; import { Button, Checkbox, @@ -11,12 +7,10 @@ import { color, useToast, } from '@chakra-ui/react'; -import Link from 'next/link'; import getFileBase64 from '@/core/utils/getFileBase64'; import { Controller, useForm } from 'react-hook-form'; import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'; import odooApi from '~/libs/odooApi'; -import { toast } from 'react-hot-toast'; import { EyeIcon } from '@heroicons/react/24/outline'; import BottomPopup from '@/core/components/elements/Popup/BottomPopup'; import Image from 'next/image'; @@ -60,7 +54,6 @@ const form: React.FC = ({ const [industries, setIndustries] = useState([]); const [companyTypes, setCompanyTypes] = useState([]); - const router = useRouter(); const toast = useToast(); const emailRef = useRef(null); diff --git a/src-migrate/modules/register/components/RegistrasiBisnis.tsx b/src-migrate/modules/register/components/RegistrasiBisnis.tsx index ce4d3972..40caed65 100644 --- a/src-migrate/modules/register/components/RegistrasiBisnis.tsx +++ b/src-migrate/modules/register/components/RegistrasiBisnis.tsx @@ -1,19 +1,10 @@ -import { ChangeEvent, useEffect, useMemo, useState } from 'react'; +import { useEffect, useMemo, useState } from 'react'; import FormBisnis from './FormBisnis'; import Form from './Form'; -import TermCondition from './TermCondition'; -import FormCaptcha from './FormCaptcha'; import { Radio, RadioGroup, Stack, Divider, Button } from '@chakra-ui/react'; import React from 'react'; import { ChevronDownIcon, ChevronRightIcon } from '@heroicons/react/24/outline'; import { useRegisterStore } from '../stores/useRegisterStore'; -import { useMutation } from 'react-query'; -import { RegisterProps } from '~/types/auth'; -import { registerUser } from '~/services/auth'; -import router from 'next/router'; -import { useRouter } from 'next/router'; -import { UseToastOptions, useToast } from '@chakra-ui/react'; -import Link from 'next/link'; interface FormProps { chekValid: boolean; buttonSubmitClick: boolean; @@ -28,13 +19,7 @@ const RegistrasiBisnis: React.FC = ({ const [isBisnisClicked, setisBisnisClicked] = useState(true); const [selectedValue, setSelectedValue] = useState('PKP'); const [selectedValueBisnis, setSelectedValueBisnis] = useState('false'); - const { form, isCheckedTNC, isValidCaptcha, errors, validate, updateForm } = - useRegisterStore(); - const isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors]); - const toast = useToast(); - const mutation = useMutation({ - mutationFn: (data: RegisterProps) => registerUser(data), - }); + const { validate, updateForm } = useRegisterStore(); useEffect(() => { if (selectedValue === 'PKP') { diff --git a/src-migrate/modules/register/index.tsx b/src-migrate/modules/register/index.tsx index da41fd8b..0308e397 100644 --- a/src-migrate/modules/register/index.tsx +++ b/src-migrate/modules/register/index.tsx @@ -1,20 +1,24 @@ -import PageContent from '~/modules/page-content'; -import RegistrasiIndividu from './components/RegistrasiIndividu'; -import RegistrasiBisnis from './components/RegistrasiBisnis'; +import dynamic from 'next/dynamic'; import Link from 'next/link'; import Image from 'next/image'; -import IndoteknikLogo from '~/images/logo.png'; -import AccountActivation from '../account-activation'; import { useMemo, useState } from 'react'; -import { useRegisterStore } from './stores/useRegisterStore'; -import FormCaptcha from './components/FormCaptcha'; -import TermCondition from './components/TermCondition'; +import { useRouter } from 'next/router'; import { Button } from '@chakra-ui/react'; -import { useMutation } from 'react-query'; import { UseToastOptions, useToast } from '@chakra-ui/react'; -import { RegisterProps } from '~/types/auth'; +import { useMutation } from 'react-query'; +import { useRegisterStore } from './stores/useRegisterStore'; import { registerUser } from '~/services/auth'; -import { useRouter } from 'next/router'; +import IndoteknikLogo from '~/images/logo.png'; +import { RegisterProps } from '~/types/auth'; + +const PageContent = dynamic(() => import('~/modules/page-content')); +const RegistrasiIndividu = dynamic( + () => import('./components/RegistrasiIndividu') +); +const RegistrasiBisnis = dynamic(() => import('./components/RegistrasiBisnis')); +const FormCaptcha = dynamic(() => import('./components/FormCaptcha')); +const TermCondition = dynamic(() => import('./components/TermCondition')); +const AccountActivation = dynamic(() => import('../account-activation')); const LOGO_WIDTH = 150; const LOGO_HEIGHT = LOGO_WIDTH / 3; @@ -47,6 +51,7 @@ const Register = () => { setIsIndividuClicked(false); setIsBisnisClicked(true); }; + const handleSubmit = async () => { if (!isFormValid) { setNotValid(true); @@ -98,10 +103,11 @@ const Register = () => { break; } }; + return (
-
+
{
{

Individu

{
{isIndividuClicked && ( -
- -
+ )} {isBisnisClicked && ( -
- -
+ )}
-- cgit v1.2.3