ok

package.json

@@ -2,7 +2,7 @@
   "name": "groovebrew-mockup",
   "version": "0.1.0",
   "private": true,
-  "homepage": "https://kedaimaster.com",
+  "homepage": "https://test.kedaimaster.com",
   "dependencies": {
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",

src/App.css

@@ -30,7 +30,7 @@ body {
   width: 100%;
   background-image: url(https://i.ibb.co.com/F4FMw1jz/testuseonly.png);
   z-index: 1000;
-  filter: opacity(0.05);
+  filter: opacity(0.04);
   pointer-events: none;
 }
 

src/components/Header.js

@@ -66,19 +66,19 @@ const gg = keyframes`
     height: 60px;
   }
   100% {
-    top: 34px;
+    top: 45px;
-    right: 30px;
+    right: 51px;
-    width: 200px; /* Adjust this value based on the length of the text */
+    width: 200px;
-    height: 60px;
+    height: 40px;
   }
 `;
 
 const ss = keyframes`
   0% {
-    top: 34px;
+    top: 45px;
-    right: 30px;
+    right: 51px;
-    width: 200px; /* Adjust this value based on the length of the text */
+    width: 200px;
-    height: 60px;
+    height: 40px;
   }
   100% {
     top: 20px;
@@ -112,19 +112,19 @@ const g = keyframes`
     height: 60px;
   }
   100% {
-    top: 10px;
+    top: 28px;
-    right: 220px;
+    right: 247px;
-    width: 60px;
+    width: 40px;
-    height: 60px;
+    height: 40px;
   }
 `;
 
 const s = keyframes`
   0% {
-    top: 10px;
+    top: 28px;
-    right: 220px;
+    right: 247px;
-    width: 60px;
+    width: 40px;
-    height: 60px;
+    height: 40px;
   }
   100% {
     top: 0px;
@@ -143,9 +143,8 @@ const grow = keyframes`
   }
   100% {
     width: 300px;
-    height: auto;
+    border-top-left-radius: 15px;
-    border-top-left-radius: 20px;
+    border-bottom-left-radius: 15px;
-    border-bottom-left-radius: 20px;
   }
 `;
 
@@ -176,6 +175,8 @@ const Rectangle = styled.div`
   padding: 10px;
   box-sizing: border-box;
   overflow-x: hidden;
+  font-size: 14px;
+  color: #393939;
 `;
 
 const ChildContainer = styled.div`
@@ -194,11 +195,7 @@ const ChildWrapper = styled.div`
 `;
 const Child = styled.div`
     width: 100%;
-  height: 40px;
+    height: 36px;
-  margin: 5px;
-  border-top-left-radius: 5px;
-  border-bottom-left-radius: 5px;
-  padding-left: 5px;
     font-family: "Plus Jakarta Sans", sans-serif;
     font-weight: 500;
     font-style: normal;
@@ -206,14 +203,13 @@ const Child = styled.div`
   ${(props) =>
     props.hasChildren
       ? `
-        border: 1px solid #ababab;
+        margin-top: 14px;
+        border-top: 0.5px solid #a5a5a5;
         height: auto;
-        padding-bottom: 10px;
       `
       : `
         display: flex;
         align-items: center;
-        background-color: rgb(223 223 223);
       `}
 `;
 
@@ -335,7 +331,7 @@ const Header = ({
               )}
               {user.username !== undefined && (
                 <Child onClick={() => setModal("edit_account")}>
-                  Ubah profil
+                  Kelola akun
                 </Child>
               )}
               {user.roleId == 0 && (
@@ -348,7 +344,9 @@ const Header = ({
                 user.roleId === 1 && (
                   <>
                     <Child hasChildren>
+                      <Child>
                       {shopName}
+                      </Child>
                       <Child>
                         Mode pengembangan &nbsp;
                         <Switch
@@ -363,7 +361,19 @@ const Header = ({
                       </Child>
 
                       <Child hasChildren>
-                        Kasir
+                        <Child>Konfigurasi</Child>
+                        <Child onClick={() => setModal("welcome_config")}>
+                          Desain kafe
+                        </Child>
+                        <Child onClick={() => setModal("edit_tables")}>
+                          Identifikasi kedai
+                        </Child>
+                        <Child onClick={() => setModal("payment_option")}>
+                          Metode pembayaran
+                        </Child>
+                      </Child>
+                      <Child hasChildren>
+                        <Child>Kasir</Child>
                         <Child onClick={() => setModal("create_clerk")}>
                           + Tambah
                         </Child>
@@ -383,18 +393,6 @@ const Header = ({
                             </Child>
                           ))}
                       </Child>
-                      <Child hasChildren>
-                        Konfigurasi
-                        <Child onClick={() => setModal("welcome_config")}>
-                          Desain kafe
-                        </Child>
-                        <Child onClick={() => setModal("edit_tables")}>
-                          Identifikasi kedai
-                        </Child>
-                        <Child onClick={() => setModal("payment_option")}>
-                          Metode pembayaran
-                        </Child>
-                      </Child>
                     </Child>
                   </>
                 )}
@@ -402,7 +400,7 @@ const Header = ({
                 user.cafeId == shopId &&
                 user.roleId === 2 && (
                   <Child hasChildren>
-                    {shopName}
+                    <Child>{shopName}</Child>
 
                     <Child>
                       Mode edit&nbsp;
@@ -445,7 +443,7 @@ const Header = ({
                   </Child>
                 )}
               {user.username !== undefined && (
-                <Child onClick={isLogout}>Logout</Child>
+                <Child hasChildren ><Child onClick={isLogout}>Logout</Child></Child>
               )}
             </ChildContainer>
           </Rectangle>

src/components/MusicPlayer.js

@@ -108,7 +108,7 @@ export function MusicPlayer({ socket, shopId, user, shopOwnerId, isSpotifyNeedLo
           //   setSubtitleColor("white");
           //   setSubtitleBG("black");
           // }
-          const proxiedUrl = `https://api.kedaimaster.com/image?url=${encodeURIComponent(modifyUrl(imageUrl))}`;  // Use your proxy to fetch the image
+          const proxiedUrl = `https://test.api.kedaimaster.com/image?url=${encodeURIComponent(modifyUrl(imageUrl))}`;  // Use your proxy to fetch the image
 
           setBackgroundImage(proxiedUrl);
         } catch (error) {

src/config.js

@@ -1,5 +1,5 @@
 // src/config.js
 
-const API_BASE_URL = 'https://api.kedaimaster.com';
+const API_BASE_URL = 'https://test.api.kedaimaster.com';
 
 export default API_BASE_URL;

src/pages/CafePage.js

@@ -244,6 +244,7 @@ function CafePage({
                   queue={queue}
                   setModal={setModal}
                 />
+                <div></div>
                 <ItemTypeLister
                   user={user}
                   shopOwnerId={shopOwnerId}

src/pages/CreateCoupon.js

@@ -46,7 +46,7 @@ const CreateCouponPage = () => {
       let encodedCouponCode = encodeURIComponent(encryptedCouponCode);
       
       // Construct the URL with the encoded coupon code as a query parameter
-      const urlWithCoupon = `https://coupon.kedaimaster.com/coupon?c=${encodedCouponCode}`;
+      const urlWithCoupon = `https://test.coupon.kedaimaster.com/coupon?c=${encodedCouponCode}`;
   
       // Optionally, set the URL to use with the coupon
       setCouponUrl(urlWithCoupon);