diff --git a/apps/expo/src/app/events/_layout.tsx b/apps/expo/src/app/events/_layout.tsx deleted file mode 100644 index 0a402b28..00000000 --- a/apps/expo/src/app/events/_layout.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import { Stack } from "expo-router" -import { EventsProvider } from "./eventsContext" - -export default function EventsLayout() { - return ( - - - - - - - ) -} diff --git a/apps/expo/src/app/events/event/[id].tsx b/apps/expo/src/app/events/event/[title].tsx similarity index 71% rename from apps/expo/src/app/events/event/[id].tsx rename to apps/expo/src/app/events/event/[title].tsx index bb3be47a..2529e97f 100644 --- a/apps/expo/src/app/events/event/[id].tsx +++ b/apps/expo/src/app/events/event/[title].tsx @@ -1,5 +1,5 @@ -import React, { useContext } from "react"; -import { Stack, useGlobalSearchParams } from "expo-router"; +import React from "react"; +import { Redirect, Stack, useGlobalSearchParams } from "expo-router"; import { CalendarClock, ChevronDown, @@ -22,21 +22,32 @@ import { import type { Event } from "@zotmeal/db"; -import { useMenuStore } from "~/utils"; - -import { useEvents } from "../eventsContext"; +import useZotmealStore from "~/utils/useZotmealStore"; export default function Event() { - const { id } = useGlobalSearchParams(); - const { selectedRestaurant } = useMenuStore(); - const { events } = useEvents() - const eventData = events[Number(id)]! + const { title } = useGlobalSearchParams(); + + if (!title || typeof title !== "string") + throw new Error("title is not a string"); + + const { selectedRestaurant, anteateryEvents, brandywineEvents } = + useZotmealStore(); + + const events = + selectedRestaurant === "anteatery" ? anteateryEvents : brandywineEvents; + + const event = events.find((event) => event.title === title); + + // TODO: Log error if event is not found + if (!event) return ; return ( <> -

{eventData.title}

+

{event.title}

@@ -81,13 +92,13 @@ export default function Event() { - {format(eventData.start.toString(), "LLL do p")} -{" "} - {format(eventData.end.toString(), "LLL do p")} + {format(event.start.toString(), "LLL do p")} -{" "} + {format(event.end.toString(), "LLL do p")} - {eventData.shortDescription} + {event.shortDescription} @@ -115,7 +126,7 @@ export default function Event() { borderTopLeftRadius={0} borderTopRightRadius={0} > - {eventData.longDescription} + {event.longDescription} diff --git a/apps/expo/src/app/events/eventsContext.tsx b/apps/expo/src/app/events/eventsContext.tsx deleted file mode 100644 index 877a71db..00000000 --- a/apps/expo/src/app/events/eventsContext.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import React, { createContext, useState, useContext, ReactNode } from 'react'; -import type { Event } from "@zotmeal/db" - -interface EventsContextProps { - events: Event[]; - setEvents: React.Dispatch>; -} - -const EventsContext = createContext({events: [], setEvents: () => {}}); - -export function EventsProvider(props: { children: ReactNode }) { - const [events, setEvents] = useState([]); - - return ( - - {props.children} - - ); -}; - -export function useEvents() { - const context = useContext(EventsContext); - return context; - }; \ No newline at end of file diff --git a/apps/expo/src/app/events/index.tsx b/apps/expo/src/app/events/index.tsx index 5780ad63..7acd3c6b 100644 --- a/apps/expo/src/app/events/index.tsx +++ b/apps/expo/src/app/events/index.tsx @@ -1,18 +1,17 @@ -import { useEffect} from "react"; +import { useEffect } from "react"; import { Link } from "expo-router"; import { format } from "date-fns"; -import { H3, Image, ScrollView, Text, YStack } from "tamagui"; +import { H3, Image, Tabs, Text, YStack } from "tamagui"; import type { Event } from "@zotmeal/db"; -import { useEvents } from "./eventsContext"; +import { getRestaurantNameById } from "@zotmeal/utils"; import { RestaurantTabs } from "~/components"; - import { api } from "~/utils/api"; - +import useZotmealStore from "~/utils/useZotmealStore"; // Create a context for events, default value is a test event -const testData: Event = { +const _testData = { start: new Date("2022-01-01 12:00:00"), end: new Date(), title: "Test Event", @@ -25,17 +24,76 @@ const testData: Event = { restaurantId: "3314", } satisfies Event; +const EventCard = ({ event }: Readonly<{ event: Event }>) => ( + + + + + +

{event.title}

+ + {format(event.start.toString(), "LLL do p")} -{" "} + {format(event.end.toString(), "LLL do p")} + + + +); + // Events Component export default function Events() { - const { events, setEvents } = useEvents(); + const { + anteateryEvents, + brandywineEvents, + setAnteateryEvents, + setBrandywineEvents, + } = useZotmealStore(); const eventsQuery = api.event.get.useQuery({}); useEffect(() => { - if (eventsQuery?.data) { - setEvents(eventsQuery.data); - } - }, [eventsQuery?.data]); + if (!eventsQuery?.data) return; + + const anteateryEvents = eventsQuery.data.filter( + (event: Event) => event.restaurantId === "3056", + ); + const brandywineEvents = eventsQuery.data.filter( + (event: Event) => event.restaurantId === "3314", + ); + + setAnteateryEvents(anteateryEvents); + setBrandywineEvents(brandywineEvents); + }, [eventsQuery.data, setAnteateryEvents, setBrandywineEvents]); if (eventsQuery?.isLoading) { return Loading...; @@ -44,61 +102,25 @@ export default function Events() { if (eventsQuery?.isError) { return Error: {eventsQuery.error.message}; } + + if (!anteateryEvents || !brandywineEvents) { + return No events found; + } + return ( - - {events.map((event: Event, index: number) => ( - - - - - -

{event.title}

- - {format(event.start.toString(), "LLL do p")} -{" "} - {format(event.end.toString(), "LLL do p")} - - - - ))} - + {[brandywineEvents, anteateryEvents].map((events, index) => ( + + + {events.map((event, index) => ( + + ))} + + + ))} ); } diff --git a/apps/expo/src/app/home/index.tsx b/apps/expo/src/app/home/index.tsx index 57cc7d68..857cd0fa 100644 --- a/apps/expo/src/app/home/index.tsx +++ b/apps/expo/src/app/home/index.tsx @@ -15,15 +15,15 @@ import { import { RestaurantTabs } from "~/components"; import { CategoryCard } from "~/components/menu/category-card"; -import { useMenuStore } from "~/utils"; import { api } from "~/utils/api"; +import useZotmealStore from "~/utils/useZotmealStore"; import { EventToast } from "./_components/event-toast"; import { PeriodPicker } from "./_components/period-picker"; import { StationTabs } from "./_components/station-tabs"; export function Home() { const { anteateryMenu, brandywineMenu, setAnteateryMenu, setBrandywineMenu } = - useMenuStore(); + useZotmealStore(); const toast = useToastController(); @@ -41,22 +41,22 @@ export function Home() { // TODO: how should we handle fetching when restaurant is closed? const [anteateryQuery, brandywineQuery] = api.useQueries((t) => restaurantNames.map((restaurantName) => - t.menu.get({ - date: date.toLocaleDateString("en-US"), - period: periodName, - restaurant: restaurantName, - }), + t.menu.get( + { + date: date.toLocaleDateString("en-US"), + period: periodName, + restaurant: restaurantName, + }, + { + refetchOnWindowFocus: false, + }, + ), ), ); useEffect(() => { - if (anteateryQuery?.data) { - setAnteateryMenu(anteateryQuery.data); - } - - if (brandywineQuery?.data) { - setBrandywineMenu(brandywineQuery.data); - } + if (anteateryQuery?.data) setAnteateryMenu(anteateryQuery.data); + if (brandywineQuery?.data) setBrandywineMenu(brandywineQuery.data); if ( anteateryQuery && @@ -81,14 +81,12 @@ export function Home() { toast, ]); - if (!anteateryQuery || !brandywineQuery) { - return Fetching menus; - } + if (!anteateryQuery || !brandywineQuery) + throw new Error("Unreachable: anteateryQuery and brandywineQuery are null"); // TODO: maybe loading spinner instead - if (anteateryQuery.isLoading || brandywineQuery.isLoading) { + if (anteateryQuery.isLoading || brandywineQuery.isLoading) return Loading...; - } if (anteateryQuery.isError || brandywineQuery.isError) { console.error(anteateryQuery.error, brandywineQuery.error); @@ -100,6 +98,8 @@ export function Home() { ); } + if (!anteateryMenu || !brandywineMenu) return Menus not found; + return ( diff --git a/apps/expo/src/app/home/item/RateItem.tsx b/apps/expo/src/app/home/item/RateItem.tsx index 701753bb..9a395b6a 100644 --- a/apps/expo/src/app/home/item/RateItem.tsx +++ b/apps/expo/src/app/home/item/RateItem.tsx @@ -10,7 +10,7 @@ export default function RateItem({ const [rating, setRating] = useState(5); return ( - +