ok

2025-01-21 07:41:46 +07:00
parent 308eafa6d4
commit e0ef8d5023
7 changed files with 371 additions and 63 deletions
--- a/src/pages/CreateUserWithCoupon.js
+++ b/src/pages/CreateUserWithCoupon.js
@@ -0,0 +1,123 @@
+import React, { useState } from 'react';
+import styles from './Join.module.css'; // Import the module.css file
+import API_BASE_URL from '../config.js';
+
+function getAuthToken() {
+  return localStorage.getItem('auth');
+}
+
+const LinktreePage = ({ setModal }) => {
+  const [isUsingCoupon, setIsUsingCoupon] = useState(false);
+  const [couponCode, setCouponCode] = useState('');
+  const [couponStatus, setCouponStatus] = useState('');
+  const [couponDetails, setCouponDetails] = useState(null);
+  const [username, setUsername] = useState('');
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [retypePassword, setRetypePassword] = useState('');
+
+  const handleCheckCoupon = async (e) => {
+    e.preventDefault();
+    try {
+      const response = await fetch(`${API_BASE_URL}/coupon/check/${couponCode}`, {
+        method: 'GET',
+        headers: {
+          'Content-Type': 'application/json',
+          Authorization: `Bearer ${getAuthToken()}`,
+        },
+      });
+
+      if (response.ok) {
+        const data = await response.json();
+        setCouponStatus('Coupon is valid');
+        setCouponDetails(data.coupon);
+      } else {
+        setCouponStatus('Coupon not found or expired');
+        setCouponDetails(null);
+      }
+    } catch (error) {
+      setCouponStatus('Error checking coupon.');
+      setCouponDetails(null);
+    }
+  };
+
+  const handleCreateUserWithCoupon = async (e) => {
+    e.preventDefault();
+
+    if (password !== retypePassword) {
+      setCouponStatus('Passwords do not match');
+      return;
+    }
+
+    try {
+      const response = await fetch(`${API_BASE_URL}/user/create-with-coupon`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          Authorization: `Bearer ${getAuthToken()}`,
+        },
+        body: JSON.stringify({
+          username,
+          email,
+          password,
+          couponCode,
+        }),
+      });
+
+      if (response.ok) {
+        const data = await response.json();
+        setCouponStatus('User created successfully with coupon');
+        setCouponDetails(null);
+        console.log(data);
+      } else {
+        const errorData = await response.json();
+        setCouponStatus(errorData.message || 'Error creating user');
+      }
+    } catch (error) {
+      setCouponStatus('Error creating user.');
+    }
+  };
+
+  return (
+    <div className={styles.linktreePage}>
+        <div className={styles.dashboardContainer}>
+          <div className={styles.mainHeading}>Gunakan Kupon</div>
+            <form className={styles.linktreeForm} onSubmit={handleCreateUserWithCoupon}>
+              <input
+                type="text"
+                placeholder="Username"
+                value={username}
+                onChange={(e) => setUsername(e.target.value)}
+                className={styles.usernameInput}
+              />
+              <input
+                type="email"
+                placeholder="Email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                className={styles.usernameInput}
+              />
+              <input
+                type="password"
+                placeholder="Password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                className={styles.usernameInput}
+              />
+              <input
+                type="password"
+                placeholder="Re-type Password"
+                value={retypePassword}
+                onChange={(e) => setRetypePassword(e.target.value)}
+                className={styles.usernameInput}
+              />
+              <button type="submit" className={styles.claimButton}>
+                <span>Buat Akun</span>
+              </button>
+            </form>
+        </div>
+    </div>
+  );
+};
+
+export default LinktreePage;