Dev

be/database/15042025_create_counters_table.sql

@@ -12,5 +12,4 @@ CREATE TABLE counters (
     open_account_receipt_id UUID,
     FOREIGN KEY (regular_receipt_id) REFERENCES regular_receipt(regular_receipt_id) ON DELETE SET NULL ,
     FOREIGN KEY (priority_receipt_id) REFERENCES priority_receipt(priority_receipt_id) ON DELETE SET NULL,
-    FOREIGN KEY (open_account_receipt_id) REFERENCES open_account_receipt(open_account_receipt_id) ON DELETE SET NULL,
-);
+    FOREIGN KEY (open_account_receipt_id) REFERENCES open_account_receipt(open_account_receipt_id) ON DELETE SET NULL);

be/database/connection.ts

@@ -5,8 +5,9 @@ const pool = new Pool({
   user: "postgres",
   host: "localhost",
   database: "smart_queue",
-  //password: "rhenz",  
-  password: "ymmahs13",
+  //password: "rhenz", 
+  //password: "ymmahs13"
+  password: "password",
   port: 5432,
 });
 

fe/App.tsx

@@ -104,3 +104,4 @@ const App = () => {
 };
 
 export default App;
+``

fe/constant/constant.ts

@@ -1,3 +1,3 @@
-const WS_URL = "ws://192.168.0.41:5000"
+const WS_URL = "ws://192.168.8.108:5000"
 
 export default WS_URL; 

fe/screens/ConfirmationScreen.tsx

@@ -0,0 +1,12 @@
+import { View, Text } from 'react-native'
+import React from 'react'
+
+const ConfirmationScreen = () => {
+  return (
+    <View>
+      <Text>ConfirmationScreen</Text>
+    </View>
+  )
+}
+
+export default ConfirmationScreen

fe/screens/ReceiptScreen.tsx

@@ -5,6 +5,7 @@ import { format } from "date-fns";
 import { Dimensions } from "react-native";
 import HomeBackground from "../assets/backgrounds/home-background.svg";
 
+
 let globalQueueCounter = 0;
 const { width } = Dimensions.get("window");
 
@@ -118,30 +119,30 @@ const ReceiptScreen: React.FC<ReceiptScreenProps> = ({ route, navigation }) => {
     : "None selected";
 
   return (
-    <SafeAreaView style={{ flex: 1, backgroundColor: '#BC1823' }}>
-      <HomeBackground 
+    <SafeAreaView style={{ flex: 1, backgroundColor: '#FFFFFF' }}>
+      <HomeBackground
         style={{
           position: 'absolute',
           width: '100%',
           height: '100%'
         }}
       />
-      
+
       <View style={{ flex: 1, alignItems: 'center', width: '100%' }}>
         <View style={{ marginTop: 60, marginBottom: 40 }}>
-          <Text style={{ 
-            color: 'white', 
-            fontWeight: 'bold', 
-            fontSize: 24, 
+          <Text style={{
+            color: 'white',
+            fontWeight: 'bold',
+            fontSize: 24,
             textAlign: 'center',
             opacity: isPrinting ? 1 : 0.7,
           }}>
             {isPrinting ? 'Printing your queue receipt...' : 'Receipt Printed'}
           </Text>
           {!isPrinting && (
-            <Text style={{ 
+            <Text style={{
               color: 'white',
-              fontSize: 16, 
+              fontSize: 16,
               textAlign: 'center',
               marginTop: 8,
             }}>
@@ -150,15 +151,15 @@ const ReceiptScreen: React.FC<ReceiptScreenProps> = ({ route, navigation }) => {
           )}
         </View>
 
-        <View style={{ 
-          width: 320, 
-          height: 64, 
-          backgroundColor: '#4B5563', 
-          borderTopLeftRadius: 8, 
-          borderTopRightRadius: 8, 
-          position: 'relative', 
-          shadowColor: '#000', 
-          shadowOpacity: 0.2, 
+        <View style={{
+          width: 320,
+          height: 64,
+          backgroundColor: '#4B5563',
+          borderTopLeftRadius: 8,
+          borderTopRightRadius: 8,
+          position: 'relative',
+          shadowColor: '#000',
+          shadowOpacity: 0.2,
           shadowRadius: 4,
           shadowOffset: { width: 0, height: 2 },
           elevation: 5
@@ -167,38 +168,38 @@ const ReceiptScreen: React.FC<ReceiptScreenProps> = ({ route, navigation }) => {
             <View style={{ width: 8, height: 8, borderRadius: 4, backgroundColor: '#6B7280', marginRight: 8 }} />
             <View style={{ width: 8, height: 8, borderRadius: 4, backgroundColor: '#6B7280' }} />
           </View>
-          
-          <Animated.View 
-            style={{ 
-              width: 10, 
-              height: 10, 
-              borderRadius: 5, 
-              backgroundColor: '#10B981', 
-              position: 'absolute', 
-              top: 16, 
+
+          <Animated.View
+            style={{
+              width: 10,
+              height: 10,
+              borderRadius: 5,
+              backgroundColor: '#10B981',
+              position: 'absolute',
+              top: 16,
               right: 20,
-              opacity: printerLightOpacity 
+              opacity: printerLightOpacity
             }}
           />
-          
-          <Animated.View style={{ 
-            width: printerSlotWidth, 
-            height: 4, 
-            backgroundColor: '#1F2937', 
-            position: 'absolute', 
-            bottom: 4, 
-            alignSelf: 'center' 
+
+          <Animated.View style={{
+            width: printerSlotWidth,
+            height: 4,
+            backgroundColor: '#1F2937',
+            position: 'absolute',
+            bottom: 4,
+            alignSelf: 'center'
           }} />
         </View>
 
         <View style={{ width: 320, height: 450, overflow: 'hidden' }}>
-          <AnimatedView 
+          <AnimatedView
             style={{
-              width: '100%', 
-              backgroundColor: 'white', 
-              borderBottomLeftRadius: 8, 
-              borderBottomRightRadius: 8, 
-              padding: 20, 
+              width: '100%',
+              backgroundColor: 'white',
+              borderBottomLeftRadius: 8,
+              borderBottomRightRadius: 8,
+              padding: 20,
               shadowColor: '#000',
               shadowOffset: { width: 0, height: 2 },
               shadowOpacity: 0.25,
@@ -245,14 +246,14 @@ const ReceiptScreen: React.FC<ReceiptScreenProps> = ({ route, navigation }) => {
         </View>
 
         <View style={{ position: 'absolute', bottom: 0, width: '100%', height: 192 }}>
-          <View style={{ 
-            width: '100%', 
-            height: 192, 
-            opacity: 0.2, 
-            backgroundColor: 'white', 
+          <View style={{
+            width: '100%',
+            height: 192,
+            opacity: 0.2,
+            backgroundColor: 'white',
             borderTopLeftRadius: 100,
             borderTopRightRadius: 100,
-            transform: [{ scaleX: 1.5 }, { translateY: 96 }] 
+            transform: [{ scaleX: 1.5 }, { translateY: 96 }]
           }} />
         </View>
       </View>

fe/screens/TellerScreen.tsx

@@ -20,8 +20,9 @@ import WS_URL from "../constant/constant";
 type TellerScreenRouteProp = RouteProp<RootStackParamLists, "TellerScreen">;
 type TellerScreenNavigationProp = NativeStackNavigationProp<
   RootStackParamLists,
-  "TellerScreen"
->;
+  "TellerScreen">
+;
+
 
 interface TellerScreenProps {
   route: TellerScreenRouteProp;
@@ -319,4 +320,4 @@ const TellerScreen: React.FC<TellerScreenProps> = ({ route, navigation }) => {
   );
 };
 
-export default TellerScreen;
+export default TellerScreen;

fe/screens/TransactionScreen.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { View, Text, Dimensions, TouchableOpacity, Modal } from 'react-native';
-import { receiptProps } from '../types/receiptProps';
+import { receiptProps } from '../types/ReceiptProps';
 import { format } from 'date-fns';
 // Assets (Icons and Backgrounds)
 import Back from "../assets/icons/back.svg";

fe/screens/WelcomeScreen.tsx

@@ -1,3 +1,4 @@
+
 import React from "react";
 import { View, Text, Dimensions, TouchableOpacity } from "react-native";
 import Logo from "../assets/icons/logo.svg";

fe/websocket/useWebSocket.ts

@@ -44,6 +44,7 @@ const useWebSocket = (url: string) => {
 
 
 
+
   // FUNCTIONS
   const fetchCounterStatus = () => {
     if (ws.current?.readyState == WebSocket.OPEN) {