DONE: queue management for customer side to get queue number, add logo to teller display, advertisement module

fe/web/teller-app/src/pages/StationIntroPage/StationIntroPage.jsx

@@ -5,6 +5,7 @@ import 'bootstrap/dist/css/bootstrap.min.css';
 import { SERVER_URL } from '../../constants.js';
 import { useNavigate } from 'react-router-dom';
 import { UserContext } from '../../context/UserContext.jsx';
+import { saveActiveStation } from '../../utils/activeStation.js';
 
 const StationIntroPage = () => {
     const navigate = useNavigate();
@@ -77,15 +78,26 @@ const StationIntroPage = () => {
 
     function handleStationSelect(station) {
         setSelectedStation(station);
-        navigate(`/teller-queue/${station.id}`);
+        saveActiveStation({
+            stationId: station.id,
+            stationName: station.name,
+            branchId: selectedBranch?.id,
+            branchName: selectedBranch?.name,
+        });
+        navigate(`/teller-queue/${station.id}`, {
+            state: {
+                station,
+                branch: selectedBranch,
+            },
+        });
     }
 
     return (
         <div className="text-center mt-5">
             <div className="border p-3" style={{ maxWidth: '500px', margin: '0 auto' }}>
-                <h1 className="mb-2">Select Branch and Station</h1>
+                <h1 className="mb-2">Pilih Cawangan dan Kaunter</h1>
                 {tenantCode ? (
-                    <p className="text-muted mb-4">Tenant: {tenantCode}</p>
+                    <p className="text-muted mb-4">Syarikat: {tenantCode}</p>
                 ) : null}
 
                 {error ? <p className="text-danger">{error}</p> : null}
@@ -98,10 +110,10 @@ const StationIntroPage = () => {
                         disabled={loadingBranches || branches.length === 0}
                     >
                         {loadingBranches
-                            ? 'Loading branches…'
+                            ? 'Loading cawangan…'
                             : selectedBranch
-                              ? selectedBranch.name
-                              : 'Select Branch'}
+                                ? selectedBranch.name
+                                : 'Pilih Cawangan'}
                     </Dropdown.Toggle>
                     <Dropdown.Menu style={{ width: '100%' }}>
                         {branches.map((branch) => (
@@ -125,10 +137,10 @@ const StationIntroPage = () => {
                                 disabled={loadingStations || stations.length === 0}
                             >
                                 {loadingStations
-                                    ? 'Loading stations…'
+                                    ? 'Loading kaunter…'
                                     : selectedStation
-                                      ? selectedStation.name
-                                      : 'Select Station'}
+                                        ? selectedStation.name
+                                        : 'Pilih Kaunter'}
                             </Dropdown.Toggle>
                             <Dropdown.Menu style={{ width: '100%' }}>
                                 {stations.map((station) => (