diff --git a/package.json b/package.json index 8a9ada5..22c9164 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "scripts": { "dev": "vite dev --host 0.0.0.0", "build": "vite build && tsc --noEmit", - "start": "vite start --host 0.0.0.0" + "start": "node .output/server/index.mjs" }, "dependencies": { "@hello-pangea/dnd": "^18.0.1", diff --git a/src/app/routes/api/events.$.ts b/src/app/routes/api/events.$.ts index 8f2034f..64aee1d 100644 --- a/src/app/routes/api/events.$.ts +++ b/src/app/routes/api/events.$.ts @@ -35,7 +35,6 @@ export const Route = createFileRoute("/api/events/$")({ controller.enqueue(new TextEncoder().encode(pingMessage)); } catch (e) { clearInterval(pingInterval); - controller.close(); } }, 30000); diff --git a/src/components/sheet/drawer.tsx b/src/components/sheet/drawer.tsx index 86b08f8..fef6043 100644 --- a/src/components/sheet/drawer.tsx +++ b/src/components/sheet/drawer.tsx @@ -62,6 +62,22 @@ const Drawer: React.FC = ({ useEffect(() => { if (!opened || !contentRef.current) return; + const updateDrawerHeight = () => { + if (contentRef.current) { + const drawerContent = contentRef.current; + const visualViewport = window.visualViewport; + + if (visualViewport) { + const availableHeight = visualViewport.height; + const maxDrawerHeight = Math.min(availableHeight * 0.75, window.innerHeight * 0.75); + + drawerContent.style.maxHeight = `${maxDrawerHeight}px`; + } else { + drawerContent.style.maxHeight = '75vh'; + } + } + }; + const resizeObserver = new ResizeObserver(() => { if (contentRef.current) { const drawerContent = contentRef.current.closest('[data-vaul-drawer-wrapper]'); @@ -72,15 +88,24 @@ const Drawer: React.FC = ({ } }); + updateDrawerHeight(); + + if (window.visualViewport) { + window.visualViewport.addEventListener('resize', updateDrawerHeight); + } + resizeObserver.observe(contentRef.current); return () => { resizeObserver.disconnect(); + if (window.visualViewport) { + window.visualViewport.removeEventListener('resize', updateDrawerHeight); + } }; }, [opened, children]); return ( - + diff --git a/src/components/sheet/sheet.tsx b/src/components/sheet/sheet.tsx index fbf7eba..9d2e178 100644 --- a/src/components/sheet/sheet.tsx +++ b/src/components/sheet/sheet.tsx @@ -23,14 +23,14 @@ const Sheet: React.FC = ({ title, children, opened, onChange }) => { onChange={onChange} onClose={handleClose} > - {children} - + ); }; diff --git a/src/components/sheet/styles.module.css b/src/components/sheet/styles.module.css index f5f82d7..a60924d 100644 --- a/src/components/sheet/styles.module.css +++ b/src/components/sheet/styles.module.css @@ -13,11 +13,10 @@ margin-top: 24px; height: auto !important; min-height: fit-content; - max-height: 100dvh; position: fixed; bottom: 0; left: 0; right: 0; outline: none; - transition: height 0.2s ease-out; + transition: height 0.2s ease-out, max-height 0.2s ease-out; } diff --git a/src/features/admin/components/admin-page.tsx b/src/features/admin/components/admin-page.tsx index bb5eb67..c4f4b82 100644 --- a/src/features/admin/components/admin-page.tsx +++ b/src/features/admin/components/admin-page.tsx @@ -9,7 +9,7 @@ import ListButton from "@/components/list-button"; const AdminPage = () => { return ( - + { const { data: tournaments } = useTournaments(); return ( - + {tournaments.map((t) => ( ))} diff --git a/src/features/core/components/layout.tsx b/src/features/core/components/layout.tsx index 10e474e..f0a457a 100644 --- a/src/features/core/components/layout.tsx +++ b/src/features/core/components/layout.tsx @@ -31,11 +31,7 @@ const Layout: React.FC = ({ children }) => { pos='relative' h='100dvh' mah='100dvh' - style={{ - top: 0, - minHeight: '100dvh', - maxHeight: '100dvh' - }} + // style={{ top: viewport.top }} //, transition: 'top 0.1s ease-in-out' }} >
{ ))} - return + return {players?.map((player) => ( { if (loading) return ( - + {Array.from({ length: 10 }).map((_, i) => ( { ); return ( - + {teams?.map((team) => (
{ return ( <> - + + {Array.from({ length: 5 }).map((_, i) => ( + {tournaments.map((tournament) => ( <> { const [selectedTeam, setSelectedTeam] = useState(null); const { data: teamData } = useServerQuery({ - ...teamQueries.details(selectedTeamId!), + ...teamQueries.details(selectedTeamId || ''), options: { enabled: !!selectedTeamId } }); diff --git a/src/features/tournaments/components/upcoming-tournament/update-team.tsx b/src/features/tournaments/components/upcoming-tournament/update-team.tsx index e34e1fc..48689b6 100644 --- a/src/features/tournaments/components/upcoming-tournament/update-team.tsx +++ b/src/features/tournaments/components/upcoming-tournament/update-team.tsx @@ -18,7 +18,6 @@ interface UpdateTeamProps { const UpdateTeam = ({ tournamentId, teamId }: UpdateTeamProps) => { const { open, isOpen, toggle } = useSheet(); - const { data: team } = useTeam(teamId); const initialValues = useMemo(() => { diff --git a/src/hooks/use-server-events.ts b/src/hooks/use-server-events.ts index 968a3af..7197385 100644 --- a/src/hooks/use-server-events.ts +++ b/src/hooks/use-server-events.ts @@ -112,5 +112,5 @@ export function useServerEvents() { eventSource.close(); } }; - }, [user?.id, queryClient]); + }, [user?.id]); } \ No newline at end of file