4 files changed, 40 insertions, 6 deletions
diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
index 1276d6e0..1d65c7a3 100644
--- a/src/core/components/elements/Popup/BottomPopup.jsx
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -35,7 +35,7 @@ const BottomPopup = ({ children, active = false, title, close }) => {
                 animate={{ bottom: 0 }}
                 exit={{ bottom: '-100%' }}
                 transition={transition}
-                className='fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white'
+                className='fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white max-h-[80vh] overflow-auto'
               >
                 <div className='flex justify-between py-4'>
                   <div className='font-semibold text-h-sm'>{title}</div>
@@ -53,7 +53,7 @@ const BottomPopup = ({ children, active = false, title, close }) => {
                 animate={{ bottom: '50%', opacity: 1 }}
                 exit={{ bottom: '45%', opacity: 0 }}
                 transition={transition}
-                className='fixed left-1/2 -translate-x-1/2 translate-y-1/2 md:w-1/4 lg:w-1/3 border border-gray_r-6 rounded-xl z-[60] p-4 pt-0 bg-white'
+                className='fixed left-1/2 -translate-x-1/2 translate-y-1/2 md:w-1/4 lg:w-1/3 border border-gray_r-6 rounded-xl z-[60] p-4 pt-0 bg-white max-h-[80vh] overflow-auto'
               >
                 <div className='flex justify-between py-4'>
                   <div className='font-semibold text-h-sm'>{title}</div>
diff --git a/src/lib/auth/components/RegisterDesktop.jsx b/src/lib/auth/components/RegisterDesktop.jsx
index 71cc29d8..5f0caf73 100644
--- a/src/lib/auth/components/RegisterDesktop.jsx
+++ b/src/lib/auth/components/RegisterDesktop.jsx
@@ -3,6 +3,7 @@ import useRegister from '../hooks/useRegister'
 import Link from '@/core/components/elements/Link/Link'
 import Alert from '@/core/components/elements/Alert/Alert'
 import PageContent from '@/lib/content/components/PageContent'
+import BottomPopup from '@/core/components/elements/Popup/BottomPopup'
 
 const RegisterDesktop = () => {
   const {
@@ -14,7 +15,9 @@ const RegisterDesktop = () => {
     companyNameRef,
     fullnameRef,
     emailRef,
-    passwordRef
+    passwordRef,
+    tnd,
+    setTnd
   } = useRegister()
 
   return (
@@ -86,6 +89,10 @@ const RegisterDesktop = () => {
                   placeholder='••••••••••••'
                 />
               </div>
+              <div class="flex items-center mt-4 ">
+                <input type="checkbox" id='sdk' className='form-input flex items-start w-fit mr-2' required />
+                <label onClick={() => setTnd(true)}  className='inline cursor-pointer text-red_r-10'>Syarat dan Ketentuan</label>
+              </div>
               <button
                 type='submit'
                 className='btn-yellow w-full mt-2'
@@ -95,6 +102,10 @@ const RegisterDesktop = () => {
               </button>
             </form>
 
+            <div>
+              <BottomPopup active={tnd} close={() => setTnd(false)}><PageContent path='/register#tnd'></PageContent></BottomPopup>
+            </div>
+
             <div className='text-gray_r-11 mt-10'>
               Sudah punya akun Indoteknik?{' '}
               <Link href='/login' className='inline'>
diff --git a/src/lib/auth/components/RegisterMobile.jsx b/src/lib/auth/components/RegisterMobile.jsx
index 007b127c..11935439 100644
--- a/src/lib/auth/components/RegisterMobile.jsx
+++ b/src/lib/auth/components/RegisterMobile.jsx
@@ -4,6 +4,8 @@ import Image from 'next/image'
 import Link from '@/core/components/elements/Link/Link'
 import useRegister from '../hooks/useRegister'
 import MobileView from '@/core/components/views/MobileView'
+import BottomPopup from '@/core/components/elements/Popup/BottomPopup'
+import PageContent from '@/lib/content/components/PageContent'
 
 const RegisterMobile = () => {
   const {
@@ -15,7 +17,9 @@ const RegisterMobile = () => {
     companyNameRef,
     fullnameRef,
     emailRef,
-    passwordRef
+    passwordRef,
+    tnd,
+    setTnd
   } = useRegister()
 
   return (
@@ -89,12 +93,28 @@ const RegisterMobile = () => {
               placeholder='••••••••••••'
             />
           </div>
-
+          <div class='flex items-center mt-4 '>
+            <input
+              type='checkbox'
+              id='sdk'
+              className='form-input flex items-start w-fit mr-2'
+              required
+            />
+            <label onClick={() => setTnd(true)} className='inline cursor-pointer text-red_r-10'>
+              Syarat dan Ketentuan
+            </label>
+          </div>
           <button type='submit' className='btn-yellow w-full mt-2' disabled={!isValid || isLoading}>
             {!isLoading ? 'Daftar' : 'Loading...'}
           </button>
         </form>
 
+        <div>
+          <BottomPopup active={tnd} close={() => setTnd(false)}>
+            <PageContent path='/register#tnd'></PageContent>
+          </BottomPopup>
+        </div>
+        
         <div className='text-gray_r-11 mt-4'>
           Sudah punya akun Indoteknik?{' '}
           <Link href='/login' className='inline'>
diff --git a/src/lib/auth/hooks/useRegister.js b/src/lib/auth/hooks/useRegister.js
index 7642a666..2375cf19 100644
--- a/src/lib/auth/hooks/useRegister.js
+++ b/src/lib/auth/hooks/useRegister.js
@@ -6,6 +6,7 @@ const useRegister = () => {
   const [isLoading, setIsLoading] = useState(false)
   const [alert, setAlert] = useState(null)
   const [isValid, setIsValid] = useState(false)
+  const [tnd, setTnd] = useState(false)
 
   const fullnameRef = useRef(null)
   const emailRef = useRef(null)
@@ -73,7 +74,9 @@ const useRegister = () => {
     companyNameRef,
     fullnameRef,
     emailRef,
-    passwordRef
+    passwordRef,
+    tnd,
+    setTnd
   }
 }