(andri) set true checklist ubah ke akun bisnis

2 files changed, 93 insertions, 45 deletions

diff --git a/src/lib/pengajuan-tempo/component/FinishTempo.jsx b/src/lib/pengajuan-tempo/component/FinishTempo.jsx
index 84c80e60..9d912b1a 100644
--- a/src/lib/pengajuan-tempo/component/FinishTempo.jsx
+++ b/src/lib/pengajuan-tempo/component/FinishTempo.jsx
@@ -8,6 +8,7 @@ import useAuth from '@/core/hooks/useAuth';
 import axios from 'axios';
 import { toast } from 'react-hot-toast';
 import { ChevronRightIcon, ChevronLeftIcon } from '@heroicons/react/24/outline';
+import { useRouter } from 'next/router';
 
 const FinishTempo = ({ query }) => {
   const [data, setData] = useState();
@@ -15,6 +16,8 @@ const FinishTempo = ({ query }) => {
   const { isDesktop, isMobile } = useDevice();
   const auth = useAuth();
   const so_order = query?.order_id?.replaceAll('-', '/');
+  const router = useRouter();
+
   useEffect(() => {
     const fetchData = async () => {
       const fetchedData = await odooApi(
@@ -26,6 +29,14 @@ const FinishTempo = ({ query }) => {
     fetchData();
   }, [query]);
 
+  // Handler khusus untuk tombol Ubah Akun
+  const handleSwitchAccountClick = () => {
+    // Set flag di localStorage
+    localStorage.setItem('autoCheckProfile', 'true');
+    // Navigate tanpa query param ke halaman profile
+    router.push('/my/profile');
+  };
+
   return (
     <div className='container flex flex-col items-center gap-4'>
       <div
@@ -94,27 +105,36 @@ const FinishTempo = ({ query }) => {
         {query?.status == 'approve' &&
           'Proses pengajuan tempo anda sudah berhasil terdaftar di indoteknik.com. Nikmati pembelian anda di website indoteknik dengan menggunakan pembayaran tempo'}
       </div>
-      <Link
-        href={
-          query?.status === 'switch-account'
-            ? '/my/profile'
-            : query?.status === 'approve'
-            ? '/my/tempo/'
-            : '/'
-        }
-        className='btn-solid-red rounded-md text-base flex flex-row items-center justify-center'
-      >
-        {query?.status === 'switch-account'
-          ? 'Ubah Akun'
-          : query?.status === 'approve'
-          ? 'Lihat Detail Tempo'
-          : 'Kembali Ke Beranda'}
-        <ChevronRightIcon className='w-5' />
-      </Link>
+
+      {/* Tombol dengan behavior berbeda jika status switch-account */}
+      {query?.status === 'switch-account' ? (
+        <button
+          onClick={handleSwitchAccountClick}
+          className='btn-solid-red rounded-md text-base flex flex-row items-center justify-center'
+        >
+          Ubah Akun
+          <ChevronRightIcon className='w-5' />
+        </button>
+      ) : (
+        <Link
+          href={
+            query?.status === 'approve'
+              ? '/my/tempo/'
+              : '/'
+          }
+          className='btn-solid-red rounded-md text-base flex flex-row items-center justify-center'
+        >
+          {query?.status === 'approve'
+            ? 'Lihat Detail Tempo'
+            : 'Kembali Ke Beranda'}
+          <ChevronRightIcon className='w-5' />
+        </Link>
+      )}
+
       {/* Video panduan khusus tampil saat status switch-account */}
       {query?.status === 'switch-account' && (
-        <div className="mt-6 w-full max-w-3xl mx-auto px-4 text-center text-gray-700 mb-6 md:mb-20">
-          <div className="mb-3 font-medium">
+        <div className="w-full max-w-3xl mx-auto px-4 text-center text-gray-700 mb-6 md:mb-20">
+          <div className="mb-3 font-medium opacity-75">
             <p>Agar tidak bingung saat mengubah akun,</p>
             <p>Yuk pelajari dulu langkah-langkah pengajuan tempo lewat video berikut</p>
           </div>
diff --git a/src/pages/my/profile.jsx b/src/pages/my/profile.jsx
index 859b6960..663ff97a 100644
--- a/src/pages/my/profile.jsx
+++ b/src/pages/my/profile.jsx
@@ -14,19 +14,26 @@ import { Checkbox } from '@chakra-ui/react';
 import { useState, useEffect } from 'react';
 import switchAccountProgresApi from '@/lib/auth/api/switchAccountProgresApi.js';
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
+import { useRouter } from 'next/router';
+
 export default function Profile() {
   const auth = useAuth();
   const [isChecked, setIsChecked] = useState(false);
   const [ubahAkun, setUbahAkun] = useState(false);
   const [isAprove, setIsAprove] = useState();
   const [changeConfirmation, setChangeConfirmation] = useState(false);
-  const handleChange = async () => {
+  const router = useRouter();
+
+  // Handle checkbox toggle
+  const handleChange = () => {
     if (isChecked) {
-      setIsChecked(!isChecked);
+      setIsChecked(false);
     } else {
       setChangeConfirmation(true);
     }
   };
+
+  // Load status dan cek localStorage "autoCheckProfile"
   useEffect(() => {
     const loadPromo = async () => {
       const progresSwitchAccount = await switchAccountProgresApi();
@@ -36,7 +43,28 @@ export default function Profile() {
       }
     };
     loadPromo();
-  }, []);
+
+    if (typeof window !== 'undefined') {
+      const autoCheck = localStorage.getItem('autoCheckProfile');
+      if (autoCheck === 'true') {
+        setIsChecked(true);
+        localStorage.removeItem('autoCheckProfile');
+
+        // Hapus query param supaya URL bersih
+        if (router.query.autoCheck) {
+          const cleanQuery = { ...router.query };
+          delete cleanQuery.autoCheck;
+          router.replace(
+            { pathname: router.pathname, query: cleanQuery },
+            undefined,
+            { shallow: true }
+          );
+        }
+      }
+    }
+  }, [router]);
+
+  // Confirm checkbox change from popup
   const handleConfirmSubmit = () => {
     setChangeConfirmation(false);
     setIsChecked(true);
@@ -46,22 +74,22 @@ export default function Profile() {
       <BottomPopup
         active={changeConfirmation}
         close={() => setChangeConfirmation(false)} // Menutup popup
-        title='Ubah type akun'
+        title="Ubah type akun"
       >
-        <div className='leading-7 text-gray_r-12/80'>
+        <div className="leading-7 text-gray_r-12/80">
           Anda akan mengubah type akun anda?
         </div>
-        <div className='flex mt-6 gap-x-4 md:justify-end'>
+        <div className="flex mt-6 gap-x-4 md:justify-end">
           <button
-            className='btn-solid-red flex-1 md:flex-none'
-            type='button'
+            className="btn-solid-red flex-1 md:flex-none"
+            type="button"
             onClick={handleConfirmSubmit}
           >
             Yakin
           </button>
           <button
-            className='btn-light flex-1 md:flex-none'
-            type='button'
+            className="btn-light flex-1 md:flex-none"
+            type="button"
             onClick={() => setChangeConfirmation(false)}
           >
             Batal
@@ -70,23 +98,23 @@ export default function Profile() {
       </BottomPopup>
       <IsAuth>
         <MobileView>
-          <AppLayout title='Akun Saya'>
+          <AppLayout title="Akun Saya">
             {auth?.company ||
               (!ubahAkun && (
-                <div className='text-sm p-4 flex items-center'>
+                <div className="text-sm p-4 flex items-center">
                   <Checkbox
-                    borderColor='gray.600'
-                    colorScheme='red'
-                    size='lg'
+                    borderColor="gray.600"
+                    colorScheme="red"
+                    size="lg"
                     isChecked={isChecked}
                     onChange={handleChange}
                   />
-                  <p className='ml-2'>Ubah ke akun bisnis</p>
+                  <p className="ml-2">Ubah ke akun bisnis</p>
                 </div>
               ))}
             {isChecked && (
               <div>
-                <SwitchAccount company_type='nonpkp' />
+                <SwitchAccount company_type="nonpkp" />
                 <Divider />
               </div>
             )}
@@ -104,27 +132,27 @@ export default function Profile() {
 
         <DesktopView>
           <BasicLayout>
-            <div className='container mx-auto flex py-10'>
-              <div className='w-3/12 pr-4'>
+            <div className="container mx-auto flex py-10">
+              <div className="w-3/12 pr-4">
                 <Menu />
               </div>
-              <div className='w-9/12 bg-white border border-gray_r-6 rounded'>
+              <div className="w-9/12 bg-white border border-gray_r-6 rounded">
                 {auth?.company ||
                   (!ubahAkun && (
-                    <div className='text-sm p-4 flex items-center'>
+                    <div className="text-sm p-4 flex items-center">
                       <Checkbox
-                        borderColor='gray.600'
-                        colorScheme='red'
-                        size='lg'
+                        borderColor="gray.600"
+                        colorScheme="red"
+                        size="lg"
                         isChecked={isChecked}
                         onChange={handleChange}
                       />
-                      <p className='ml-2'>Ubah ke akun bisnis</p>
+                      <p className="ml-2">Ubah ke akun bisnis</p>
                     </div>
                   ))}
                 {isChecked && (
                   <div>
-                    <SwitchAccount company_type='nonpkp' />
+                    <SwitchAccount company_type="nonpkp" />
                     <Divider />
                   </div>
                 )}