Update UI text and area search logic

Replaced logo and updated branding in Header. Improved area search by using 'searchArea' instead of 'coverageArea' in HomeSearch and Header. Enhanced ProductInfoModal with more detailed delivery and data reset time messages. Updated i18n files with new translations and added 'register' key. Changed 'Buy Now' button to use translation. Added optional 'searchArea' field to Area type.

EsimLao/esim-vite/src/components/Header.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from "react";
 import { useNavigate, useLocation, Link } from "react-router-dom";
-import logo from "../assets/img/getgo.svg";
+// import logo from "../assets/img/getgo.svg";
 import { useAppDispatch, useAppSelector } from "../hooks/useRedux";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import {
@@ -24,6 +24,7 @@ import {
 import { Faq } from "../services/content/types";
 import { DataCacheKey, staleTime } from "../global/constants";
 import { contentApi } from "../apis/contentApi";
+import logo from "../assets/img/logo-skysim.png";
 
 const Header: React.FC = () => {
   const navigate = useNavigate();
@@ -193,7 +194,7 @@ const Header: React.FC = () => {
       setAreasList(areas);
     } else {
       const filtered = areas.filter((area: Area) =>
-        area.coverageArea.toLowerCase().includes(query.toLowerCase()),
+        area.searchArea?.toLowerCase().includes(query.toLowerCase()),
       );
       setAreasList(filtered);
     }
@@ -769,7 +770,7 @@ const Header: React.FC = () => {
               onClick={() => setIsMenuOpen(false)}
               className="flex items-center space-x-1"
             >
-              <svg
+              {/* <svg
                 className="w-7 h-7 text-[#EE0434]"
                 viewBox="0 0 24 24"
                 fill="currentColor"
@@ -779,7 +780,8 @@ const Header: React.FC = () => {
               <span className="text-xl font-black tracking-tighter">
                 <span className="text-[#EE0434]">Get</span>
                 <span className="text-[#333]">Go</span>
-              </span>
+              </span> */}
+              <img src={logo} alt="Sky Sim Hub Logo" className="h-12" />
             </Link>
             <button
               onClick={() => setIsMenuOpen(false)}

EsimLao/esim-vite/src/components/ProductInfoModal.tsx

@@ -101,11 +101,12 @@ const ProductInfoModal: React.FC<ProductInfoModalProps> = ({
     {
       label: t("deliveryMethod"),
       value:
-        packageInfo?.deliveryMethod === 0
-          ? t(
-              "youWillReceiveAnEmailImmediatelyAfterPaymentWithEsimWaitForShippingAndReceiveYourPhysicalSim"
-            )
-          : t("physicalSimWillBeShippedToYourAddressWithin3-5BusinessDays"),
+        "Bạn sẽ nhận được email chứa eSIM trong vòng 5 phút sau khi thanh toán thành công. ",
+      // packageInfo?.deliveryMethod === 0
+      //   ? t(
+      //       "youWillReceiveAnEmailImmediatelyAfterPaymentWithEsimWaitForShippingAndReceiveYourPhysicalSim",
+      //     )
+      //   : t("physicalSimWillBeShippedToYourAddressWithin3-5BusinessDays")
       icon: (
         <svg
           className="w-5 h-5 color-EE0434"
@@ -205,9 +206,28 @@ const ProductInfoModal: React.FC<ProductInfoModalProps> = ({
     {
       label: t("dataResetTime"),
       value:
+        //         0: Một ngày được tính đến 23:59 Giờ địa phương
+        // 1:Gói được tính theo   giờ Trung Quốc (UTC+8), nhưng sẽ reset vào 0:00 theo giờ quốc tế UTC+0.
+        // 2: Gói được tính theo ngày (0h–24h) của múi giờ quốc gia nơi gói cước được kích hoạt.
+        // 3: Một ngày được tính đến 23:59 giờ Bắc Kinh (GMT+8).
+        // 4: Thời gian tính theo múi giờ UTC+0, reset lúc 0:00.
+        // 5: Một ngày được tính đến 23:59 giờ Bắc Kinh (GMT+8)
+        // 6: Thời gian tính theo ngày (0h–24h) của múi giờ quốc gia nơi kích hoạt gói.
         packageInfo?.dataResetTime === 0
-          ? t("timeResetInfo")
-          : t("timeResetInfo"),
+          ? "Một ngày được tính đến 23:59 Giờ địa phương."
+          : packageInfo?.dataResetTime === 1
+            ? "Gói được tính theo   giờ Trung Quốc (UTC+8), nhưng sẽ reset vào 0:00 theo giờ quốc tế UTC+0."
+            : packageInfo?.dataResetTime === 2
+              ? "Gói được tính theo ngày (0h–24h) của múi giờ quốc gia nơi gói cước được kích hoạt."
+              : packageInfo?.dataResetTime === 3
+                ? "Một ngày được tính đến 23:59 giờ Bắc Kinh (GMT+8)."
+                : packageInfo?.dataResetTime === 4
+                  ? "Thời gian tính theo múi giờ UTC+0, reset lúc 0:00."
+                  : packageInfo?.dataResetTime === 5
+                    ? "Một ngày được tính đến 23:59 giờ Bắc Kinh (GMT+8)."
+                    : packageInfo?.dataResetTime === 6
+                      ? "Thời gian tính theo ngày (0h–24h) của múi giờ quốc gia nơi kích hoạt gói."
+                      : "",
       icon: (
         <svg
           className="w-5 h-5 color-EE0434"

EsimLao/esim-vite/src/i18n/locales/en.json

@@ -225,5 +225,6 @@
   "highSpeed": "High Speed",
   "selectADataPackageForYourDestination": "Select a data package for your destination.",
   "checkIfYourPhoneSupportsESIMTechnology": "Check if your phone supports eSIM technology.",
-  "scanTheQRCodeAndConnectToHighSpeedData": "Scan the QR code and connect to high-speed data."
-}
+  "scanTheQRCodeAndConnectToHighSpeedData": "Scan the QR code and connect to high-speed data.",
+  "register": "Register"
+}

EsimLao/esim-vite/src/i18n/locales/vi.json

@@ -150,7 +150,7 @@
   "required": "Bắt buộc",
   "notRequired": "Không bắt buộc",
   "packageStartTime": "Thời gian bắt đầu gói",
-  "usageTimeCalculatedFromSignal": "Thời gian sử dụng được tính từ khi có tín hiệu",
+  "usageTimeCalculatedFromSignal": "Kích hoạt tự động, hạ cánh là dùng (Plug and Play)",
   "usageTimeCalculatedFromPurchase": "Thời gian sử dụng được tính từ lúc mua hàng",
   "coverageArea": "Khu vực phủ sóng",
   "deliveryMethod": "Phương thức giao hàng",
@@ -225,5 +225,6 @@
   "highSpeed": "Tốc độ cao",
   "selectADataPackageForYourDestination": "Chọn gói dữ liệu phù hợp với điểm đến của bạn.",
   "checkIfYourPhoneSupportsESIMTechnology": "Kiểm tra xem điện thoại của bạn có hỗ trợ công nghệ eSIM không.",
-  "scanTheQRCodeAndConnectToHighSpeedData": "Quét mã QR và kết nối với dữ liệu tốc độ cao."
-}
+  "scanTheQRCodeAndConnectToHighSpeedData": "Quét mã QR và kết nối với dữ liệu tốc độ cao.",
+  "register": "Đăng ký"
+}

EsimLao/esim-vite/src/pages/home/components/HomeSearch.tsx

@@ -83,7 +83,7 @@ const HomeSearch = () => {
       const timer = setTimeout(() => {
         // logic sau khi user ngừng gõ
         const filtered = areas.filter((area: Area) =>
-          area.coverageArea.toLowerCase().includes(query.toLowerCase())
+          area.searchArea?.toLowerCase().includes(query.toLowerCase()),
         );
         setAreasList(filtered);
       }, 500);
@@ -181,7 +181,7 @@ const HomeSearch = () => {
                       <div className="text-center py-8 text-slate-400 font-medium">
                         {t("noCountryMatchesFound").replace(
                           "{searchQuery}",
-                          searchQuery
+                          searchQuery,
                         )}
                       </div>
                     )}

EsimLao/esim-vite/src/pages/product-detail/ProductDetailView.tsx

@@ -533,7 +533,7 @@ const ProductDetailView: React.FC = () => {
           onClick={handleBuyNow}
           className="flex-1 bg-[#EE0434] text-white py-3.5 rounded-2xl font-black text-lg shadow-lg shadow-red-200"
         >
-          Buy Now
+          {t("buyNow")}
         </button>
       </div>
     </div>

EsimLao/esim-vite/src/services/product/type.ts

@@ -13,6 +13,7 @@ export interface Area {
   promotionPercent: number;
   curency: string;
   coverageArea: string;
+  searchArea?: string;
 }
 
 export interface Package {