diff --git a/package-lock.json b/package-lock.json
index 7cd811e..5036e53 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,6 +15,7 @@
         "@testing-library/react": "^13.4.0",
         "@testing-library/user-event": "^13.5.0",
         "caniuse-lite": "^1.0.30001690",
+        "crypto-js": "^4.2.0",
         "html-to-image": "^1.11.11",
         "html2canvas": "^1.4.1",
         "jsqr": "^1.4.0",
@@ -7194,6 +7195,11 @@
         "node": ">= 8"
       }
     },
+    "node_modules/crypto-js": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.2.0.tgz",
+      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
+    },
     "node_modules/crypto-random-string": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz",
diff --git a/package.json b/package.json
index 5c30e14..5b8a6e9 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
     "caniuse-lite": "^1.0.30001690",
+    "crypto-js": "^4.2.0",
     "html-to-image": "^1.11.11",
     "html2canvas": "^1.4.1",
     "jsqr": "^1.4.0",
diff --git a/src/pages/Join.js b/src/pages/Join.js
index 393b4f0..32bdc30 100644
--- a/src/pages/Join.js
+++ b/src/pages/Join.js
@@ -4,6 +4,8 @@ import styles from './Join.module.css'; // Import the module.css file
 import { checkCoupon, logCouponForUser } from '../helpers/couponHelpers';  // Import the new helper
 import Coupon from '../components/Coupon';
 
+import CryptoJS from 'crypto-js';
+
 import {
   getLocalStorage,
 } from "../helpers/localStorageHelpers";
@@ -20,15 +22,15 @@ const LinktreePage = ({ data, setModal }) => {
   useEffect(() => {
     if (couponCode !== '') return;
     const modal = queryParams.get('modal');
-    const code = queryParams.get('couponCode');
+    const code = queryParams.get('c');
 
     console.log(code)
     if (modal == 'claim-coupon') {
       if (!getLocalStorage('auth')) {
 
         // Preserve the couponCode query param while navigating to the claim-coupon modal
-        const newUrl = `?modal=join${code ? `&couponCode=${code}` : ''}`;
-        window.location.href = newUrl; // This will update the URL and reload the page
+        if(code) setModal('join', {c: code})
+        else setModal('join')
       }
 
       setIsOnlyClaimCoupon(true)
@@ -38,14 +40,21 @@ const LinktreePage = ({ data, setModal }) => {
       if (getLocalStorage('auth')) {
 
         // Preserve the couponCode query param while navigating to the claim-coupon modal
-        const newUrl = `?modal=claim-coupon${code ? `&couponCode=${code}` : ''}`;
-        window.location.href = newUrl; // This will update the URL and reload the page
+        if(code) setModal('claim-coupon', {c: code})
+        else setModal('claim-coupon')
       }
     }
     if (code) {
-      setCouponCode(code);
+      // Your AES-256 key (ensure this is kept secret and secure!)
+      const secretKey = 'xixixi666'; // 32 characters for AES-256
+
+      // Decrypt the couponCode
+      const decryptedBytes = CryptoJS.AES.decrypt(code, secretKey);
+      const decryptedCode = decryptedBytes.toString(CryptoJS.enc.Utf8);
+      console.log(decryptedCode)
+      setCouponCode(decryptedCode);
       setIsUsingCoupon(true);  // Automatically switch to the coupon input state
-      handleCheckCoupon(code); // Automatically check the coupon code
+      handleCheckCoupon(decryptedCode); // Automatically check the coupon code
     }
   }, [queryParams]);
 
@@ -162,8 +171,14 @@ const LinktreePage = ({ data, setModal }) => {
                     style={{ width: '266px' }}
                     onClick={() => {
                       if (!isOnlyClaimCoupon) {
+
+                        const secretKey = 'xixixi666'; // Your AES-256 key (32 characters)
+
+                        // Encrypt couponCode inline
+                        const encryptedCouponCode = CryptoJS.AES.encrypt(couponCode, secretKey).toString();
+
                         // If it's only claiming a coupon, trigger claim logic
-                        setModal('create_user', { codeStatus: 200, couponCode });
+                        setModal('create_user', { codeStatus: 200, c: encryptedCouponCode });
                       } else {
                         // Otherwise, handle the coupon for user creation
                         handleLogCouponForUser();
@@ -180,15 +195,15 @@ const LinktreePage = ({ data, setModal }) => {
           <div className={styles.footer}>
             <div className={styles.footerLinks}>
               {!getLocalStorage('auth') &&
-              <a
-                href="https://linktr.ee/discover/trending"
-                target="_blank"
-                rel="noreferrer"
-                className={styles.footerLink}
-              >
-                Sudah punya akun bisnis?
-              </a>
-}
+                <a
+                  href="https://linktr.ee/discover/trending"
+                  target="_blank"
+                  rel="noreferrer"
+                  className={styles.footerLink}
+                >
+                  Sudah punya akun bisnis?
+                </a>
+              }
               <a
                 href="https://linktr.ee/discover/trending"
                 target="_blank"
diff --git a/src/pages/Reports.js b/src/pages/Reports.js
index eff01fd..003ee35 100644
--- a/src/pages/Reports.js
+++ b/src/pages/Reports.js
@@ -114,7 +114,7 @@ const App = ({ forCafe = true, cafeId = -1,
   const [selectedCafeId, setSelectedCafeId] = useState(cafeId);
   const [analytics, setAnalytics] = useState({});
   const [loading, setLoading] = useState(true);
-  const [filter, setFilter] = useState("yesterday");
+  const [filter, setFilter] = useState("monthly");
   const [circularFilter, setCircularFilter] = useState("item");
   const [graphFilter, setGraphFilter] = useState("income");