Merge pull request #61 from penguinsufcg/fix/user-close-table

Fix problem when user close the bill

src/components/Session/SessionProvider.tsx

@@ -26,7 +26,7 @@ function SessionProvider({ children }: SessionContextProps): JSX.Element {
     setSessionId(undefined)
     setSession(null)
     setSessionRef(null)
-    
+
     router.push('/logout')
   }
 
@@ -106,7 +106,7 @@ function SessionProvider({ children }: SessionContextProps): JSX.Element {
   }, [session])
 
   useEffect(() => {
-    if(session?.status === 'FINISHED') {
+    if (session?.status === 'FINISHED') {
       closeSession()
     }
   }, [session])
@@ -116,6 +116,7 @@ function SessionProvider({ children }: SessionContextProps): JSX.Element {
       session,
       sessionRef,
       isLogged: sessionId && sessionId !== 'undefined' ? true : false,
+      underPayment: session?.status == 'PAYMENT',
       isLoading,
       createNewSession,
       joinSession,

src/components/client/Navbar/index.tsx

@@ -1,14 +1,16 @@
+import useSession from "@/hooks/useSession"
 import { Flex } from "@chakra-ui/react"
 import React from "react"
 import { BiHome, BiCartAlt, BiReceipt } from "react-icons/bi"
 import NavbarOption from "./components/NavbarOption"
 
 const Navbar = () => {
+  const { underPayment } = useSession()
   return (
     <Flex justifyContent="space-around">
       <NavbarOption isSelected icon={<BiHome size={24} />} href="/" />
       <NavbarOption icon={<BiCartAlt size={24} />} href="/cart" />
-      <NavbarOption icon={<BiReceipt size={24} />} href="/receipt" />
+      <NavbarOption icon={<BiReceipt size={24} />} href={underPayment ? "/bill" : "/receipt"} />
     </Flex>
   )
 }

src/hooks/useSession.ts

@@ -5,7 +5,8 @@ type SessionContextProps = {
   session?: EntityWithID<Session> | null
   sessionRef?: Reference<Session> | null
   isLogged: boolean
-  createNewSession?: (params: {table: string, client: string }) => Promise<string>
+  underPayment: boolean
+  createNewSession?: (params: { table: string, client: string }) => Promise<string>
   joinSession?: (params: { sessionId: string }) => void
 }
 
@@ -14,16 +15,17 @@ export const SessionContext: Context<SessionContextProps> =
     session: null,
     sessionRef: null,
     isLogged: false,
+    underPayment: false,
     isLoading: false,
   })
 
-const useSession = (): SessionContextProps =>  {
+const useSession = (): SessionContextProps => {
   const context = useContext<SessionContextProps>(SessionContext)
 
   if (!context) {
     throw new Error('Do not use Session outside of context')
   }
-  
+
   return context
 }
 

src/pages/bill/index.tsx

@@ -5,12 +5,12 @@ import useSessionReceipt from '@/hooks/useSessionReceipt'
 import { useToast } from '@chakra-ui/react'
 import { Container } from '@chakra-ui/layout'
 import { updateTableStatus } from '@/api/tables'
+import { updateSessionStatus } from '@/api/session'
 import Layout from '@/components/client/Layout'
 import BillDetails from '@/components/BillDetails'
 
 const BillPage = () => {
-  const [ disableButton, setDisableButton ] = useState(false)
-  const { session, sessionRef } = useSession()
+  const { session, sessionRef, underPayment } = useSession()
   const { items: receiptItems, total: billTotal } = useSessionReceipt({
     sessionRef,
   })
@@ -26,15 +26,15 @@ const BillPage = () => {
       newStatus: 'PAYMENT',
     })
 
+    await updateSessionStatus(session.id, 'PAYMENT')
+
     toast({
       title: 'Pagamento solicitado!',
       description: 'Aguarde pelo garçom :)',
       status: 'success',
       duration: 5000,
       isClosable: true,
     })
-
-    setDisableButton(true)
   }
 
   return (
@@ -45,11 +45,11 @@ const BillPage = () => {
         buttonProps: {
           children: 'Solicitar pagamento',
           onClick: handleClick,
-          disabled: disableButton 
+          disabled: underPayment
         },
       }}>
       <Container px={10}>
-        <BillDetails items={receiptItems}/>
+        <BillDetails items={receiptItems} />
       </Container>
     </Layout>
   )

src/pages/dish-details/[dishId].tsx

@@ -16,7 +16,7 @@ const DishPage = () => {
     dishId,
   ])
   const { addItem } = useMinicart()
-  const { isLogged } = useSession()
+  const { isLogged, underPayment } = useSession()
 
   const toast = useToast()
 
@@ -59,7 +59,7 @@ const DishPage = () => {
         <ChevronLeftIcon />
       </Button>
       {dishData && <DishDetails dish={dishData} />}
-      {isLogged && <AddDishForm onSubmit={handleSubmit} />}
+      {isLogged && !underPayment && <AddDishForm onSubmit={handleSubmit} />}
     </Flex>
   )
 }