import { useContext } from 'react' import Head from 'next/head' import dynamic from 'next/dynamic' import styles from 'styles/Map.module.css' import { supabase } from 'lib/Store' import SignIn from 'components/SignIn' import UserContext from 'lib/UserContext' const MapInput = dynamic( () => import('components/MapInput'), { ssr: false } ) function randomPosition() { var array = [ { lat: 1.3489728457596013, lng: 103.77043978311998 }, { lat: 1.37462, lng: 103.77694 }, { lat: 1.41006, lng: 103.77144 }, { lat: 1.34313, lng: 103.84191 }, { lat: 1.35454, lng: 103.69746 } ]; return array[Math.floor(Math.random() * array.length)]; } export default function Page() { const { user, signOut } = useContext(UserContext) const center = randomPosition() const zoomLevel = 14 return (
Driver View

Driver View

Get started by drag-drop the marker around to simulate location update

{!user && } {user && (
{ user.role === "DRIVER" ? :

Sorry, You need to sign in as driver

}
Signed in as {user.username} [{user.role}]
)}
) }