\n {children}\n

\n );\n}\n\nfunction MobileNav() {\n const location = useLocation();\n\n return (\n

\n \n \n

\n {location.pathname === \"/\" ? : }\n Home\n

\n \n \n

\n \n Rides\n

\n \n \n

\n \n Account\n

\n \n \n \n \n

\n {location.pathname === \"/\" ? : }\n Home\n

\n \n \n

\n {location.pathname === \"/rides\" ? : }\n Rides\n

\n \n \n

\n {location.pathname === \"/account\" ? : }\n Account\n

\n \n \n

\n );\n}\n\nfunction DesktopNav() {\n const navigate = useNavigate();\n const location = useLocation();\n return (\n \n );\n}\n\nfunction UnauthenticatedApp() {\n return (\n

\n \n

\n \n \n } />\n \n \n

\n \n

\n );\n}\n\nfunction Modal({ isOpen, onClose, children }) {\n if (!isOpen) return null;\n\n return (\n

\n {children}\n

\n );\n}\n\nfunction AuthenticatedApp() {\n const db = init({ appId: INSTANTDB_APP_ID });\n const [modalOpen, setModalOpen] = useState(false);\n const [textInput, setTextInput] = useState(\"\");\n const [numberInput, setNumberInput] = useState(\"\");\n\n // Reducer for managing additional profile fields\n const initialProfileState = {\n phone: \"\",\n address: \"\",\n };\n\n const profileReducer = (state, action) => {\n switch (action.type) {\n case \"UPDATE_PHONE\":\n return { ...state, phone: action.payload };\n case \"UPDATE_ADDRESS\":\n return { ...state, address: action.payload };\n case \"RESET\":\n return initialProfileState;\n default:\n return state;\n }\n };\n\n const [profileState, dispatchProfile] = useReducer(profileReducer, initialProfileState);\n\n const { getToken, signOut } = useAuth();\n\n const signInToInstantWithClerkToken = async () => {\n const idToken = await getToken();\n\n if (!idToken) {\n return;\n }\n\n db.auth.signInWithIdToken({\n clientName: \"notUber\",\n idToken: idToken,\n });\n };\n\n useEffect(() => {\n signInToInstantWithClerkToken();\n }, []);\n\n const { isLoading, user, error } = db.useAuth();\n\n const query = {\n users: {\n $: {\n where: {\n email: !isLoading && user && user.email,\n },\n },\n receivers: {},\n },\n };\n\n const { queryIsLoading, queryError, data } = db.useQuery(query);\n const { user: clerkUser } = useUser();\n\n // Render profile field\n const renderField = (\n label: string,\n value: string,\n onChange: (e: React.ChangeEvent) => void,\n placeholder?: string,\n type: \"text\" | \"phone\" = \"text\",\n ) => {\n const handlePhoneChange = (e: React.ChangeEvent) => {\n // Only allow + at the start and digits after\n const input = e.target.value;\n if (type === \"phone\") {\n // Ensure starts with +, then only digits\n const sanitizedInput = input.startsWith(\"+\")\n ? input.replace(/[^\\d+]/g, \"\").replace(/(?<=^.{1})\\+/g, \"\")\n : \"+\" + input.replace(/\\D/g, \"\");\n onChange({ ...e, target: { ...e.target, value: sanitizedInput } });\n } else {\n onChange(e);\n }\n };\n\n return (\n

\n {label}\n \n

\n );\n };\n\n useEffect(() => {\n if (!queryIsLoading && data && data.users && data.users.length == 0) {\n setModalOpen(true);\n }\n else {\n setModalOpen(false);\n }\n }, [data]);\n\n const handleSaveProfile = async () => {\n await db.transact(\n tx.users[id()].update({\n firstName: clerkUser.firstName,\n lastName: clerkUser.lastName,\n email: clerkUser?.emailAddresses[0].emailAddress,\n ...profileState,\n }).link({ $users: user.id }),\n );\n\n setModalOpen(false);\n };\n\n // Determine if save button should be disabled\n const isSaveDisabled = !profileState.phone || !profileState.address;\n\n return (\n

\n \n

\n \n \n } />\n } />\n } />\n } />\n } />\n \n \n

\n \n\n setModalOpen(false)}>\n

\n Welcome to Not Uber!\n

\n {`We're so glad to have you here, ${clerkUser?.firstName}! Please complete your user profile.`}\n

\n First Name\n \n

\n Last Name\n \n

\n\n

\n Email\n \n

\n\n {renderField(\n \"Phone Number\",\n profileState.phone,\n (e) =>\n dispatchProfile({\n type: \"UPDATE_PHONE\",\n payload: e.target.value,\n }),\n \"Enter your full phone number (country code)\",\n \"phone\",\n )}\n\n {renderField(\n \"Address\",\n profileState.address,\n (e) =>\n dispatchProfile({\n type: \"UPDATE_ADDRESS\",\n payload: e.target.value,\n }),\n \"Enter your full address\",\n )}\n\n \n Save Profile\n \n

\n \n

\n );\n}\n\nfunction App() {\n return (\n \n \n \n \n \n \n \n \n \n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request: Request): Promise {\n console.log(\"Server function called\");\n\n return new Response(\n `\n \n \n \n \n \n Not Uber\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}","deleted","label","children",[],[96],{"_102":172,"_95":173,"_156":174,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":175,"_99":32,"_162":176,"_164":177,"_166":22,"_167":-5,"_168":178,"_98":179},"5cfd632e-040a-11f0-9c63-569c3dd06744","notUberAccount","a887b473-e688-492b-bf64-9a9ed8faf9c9",["D",1742310300442],"script","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useAuth } from \"https://esm.sh/@clerk/clerk-react?bundle-deps&deps=react@18.2.0\";\nimport { init } from \"https://esm.sh/@instantdb/react?bundle-deps&deps=react@18.2.0\";\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { INSTANTDB_APP_ID } from \"https://esm.town/v/vawogbemi/notUberConsts\";\n\nexport function Account() {\n const db = init({ appId: INSTANTDB_APP_ID });\n\n const { signOut } = useAuth();\n\n const { isLoading: userIsLoading, user } = db.useAuth();\n\n const query = {\n users: {\n $: {\n where: {\n email: !userIsLoading && user?.email,\n },\n },\n },\n };\n\n const { isLoading, error, data } = db.useQuery(query);\n\n const renderField = (label: string, value: string) => (\n

{label}

{value || \"—\"}

\n );\n\n if (isLoading || userIsLoading) {\n return (\n

\n );\n }\n\n if (error) {\n return (\n

Error loading account information

\n );\n }\n\n const userData = data?.users[0];\n\n return (\n

Your Account

\n {\n db.auth.signOut().then(() => {\n signOut();\n });\n }}\n className=\"bg-red-500 hover:bg-red-600 text-white font-bold py-2 px-4 rounded-full transition duration-300 ease-in-out transform hover:scale-105 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-opacity-50\"\n >\n Sign out\n \n

\n {renderField(\"First Name\", userData?.firstName)}\n {renderField(\"Last Name\", userData?.lastName)}\n {renderField(\"Email\", userData?.email)}\n {renderField(\"Phone\", userData?.phone)}\n {renderField(\"Address\", userData?.address)}\n

\n );\n}",[],[173],{"_102":181,"_95":182,"_156":183,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":184,"_99":32,"_162":176,"_164":185,"_166":22,"_167":-5,"_168":186,"_98":187},"5cfd67c0-040a-11f0-9c63-569c3dd06744","notUberConsts","e8162375-4db6-411c-8822-05888010a24e",["D",1742310300442],"export const INSTANTDB_APP_ID = \"b63bc79a-c9f3-486f-b067-7afc402b3efc\";\nexport const CLERK_PUBLISHABLE_KEY = \"pk_test_cGVyZmVjdC1zYWlsZmlzaC02NS5jbGVyay5hY2NvdW50cy5kZXYk\";\n// GO TO https://www.val.town/v/vawogbemi/notUberMapComponent to change the google maps api key -- for some reason importing it doesn't work.",[],[182],{"_102":189,"_95":190,"_156":191,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":192,"_99":32,"_162":176,"_164":193,"_166":22,"_167":-5,"_168":194,"_98":195},"5cfd693c-040a-11f0-9c63-569c3dd06744","notUberHome","93bd70ed-824f-478b-9501-df6ac6c4095b",["D",1742310300442],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { SignedIn, SignedOut, SignInButton } from \"https://esm.sh/@clerk/clerk-react?bundle-deps&deps=react@18.2.0\";\nimport { IconCircleFilled, IconSquareFilled } from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { AutocompleteInput, MapComponent } from \"https://esm.town/v/vawogbemi/notUberMapComponent\";\n\nconst LocationSelector = ({ title }) => {\n const [pickupLocation, setPickupLocation] = useState(\"Pianos, New York\");\n const [dropoffLocation, setDropoffLocation] = useState(\"\");\n\n const swapLocations = () => {\n setPickupLocation(dropoffLocation);\n setDropoffLocation(pickupLocation);\n };\n\n const handleLocationChange = (setter) => (newLocation) => {\n if (newLocation === (setter === setPickupLocation ? dropoffLocation : pickupLocation) && newLocation !== \"\") {\n swapLocations();\n } else {\n setter(newLocation);\n }\n };\n\n const handleSeePrices = () => {\n const redirectUrl = `/new?pickup=${encodeURIComponent(pickupLocation)}&dropoff=${\n encodeURIComponent(dropoffLocation)\n }`;\n window.location.href = redirectUrl;\n };\n\n const isPriceButtonDisabled = !pickupLocation || !dropoffLocation;\n\n const scrollToTop = () => {\n window.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n };\n\n useEffect(() => {\n scrollToTop();\n }, [pickupLocation, dropoffLocation]);\n\n return (\n

\n {title &&

{title}

}\n

\n \n

\n \n \n \n See Prices\n \n \n \n \n \n See Prices\n \n \n

\n \n

\n );\n};\n\nexport function Home() {\n return (\n

\n \n

\n );\n}",[],[190],{"_102":197,"_95":198,"_156":199,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":200,"_99":32,"_162":176,"_164":201,"_166":22,"_167":-5,"_168":202,"_98":203},"5cfd6d7e-040a-11f0-9c63-569c3dd06744","notUberNew","7611def5-7502-4c94-8f64-6d58a8cd3fba",["D",1742310300442],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { id, init, tx } from \"https://esm.sh/@instantdb/react?bundle-deps&deps=react@18.2.0\";\nimport {\n IconCar,\n IconCarFilled,\n IconCircleCheck,\n IconCircleFilled,\n IconSquareFilled,\n} from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport React, { useEffect, useMemo, useState } from \"https://esm.sh/react@18.2.0\";\nimport { INSTANTDB_APP_ID } from \"https://esm.town/v/vawogbemi/notUberConsts\";\nimport { AutocompleteInput, MapComponent } from \"https://esm.town/v/vawogbemi/notUberMapComponent\";\n\nconst SelectionItem = ({ title, icon: Icon, description, isSelected, onClick, cost }) => (\n \n

\n \n

{title}

\n \n ${cost.toFixed(2)}\n \n

\n {`2 mins away • ${new Date(Date.now()).toLocaleTimeString()}`}\n

{description}

\n \n);\n\nconst calculateCost = () => {\n // Base cost for the ride\n return 20;\n};\n\nconst Toast = ({ isVisible, onClose }) => {\n useEffect(() => {\n if (isVisible) {\n const timer = setTimeout(() => {\n onClose();\n }, 3000);\n\n return () => clearTimeout(timer);\n }\n }, [isVisible, onClose]);\n\n if (!isVisible) return null;\n\n return (\n

\n \n Success!\n

\n );\n};\n\nconst DropOffSelector = ({ title }) => {\n const urlParams = new URLSearchParams(window.location.search);\n const [pickupLocation, setPickupLocation] = useState(urlParams.get(\"pickup\") || \"\");\n const [dropoffLocation, setDropoffLocation] = useState(urlParams.get(\"dropoff\") || \"\");\n const [selectedOption, setSelectedOption] = useState(\"notUberX\");\n const [showToast, setShowToast] = useState(false);\n\n const db = init({ appId: INSTANTDB_APP_ID });\n const { isLoading, user, error: authError } = db.useAuth();\n const query = {\n users: {\n $: {\n where: {\n email: !isLoading && user?.email,\n },\n },\n },\n };\n\n const { queryIsLoading, queryError, data } = db.useQuery(query);\n\n const cost = useMemo(() => calculateCost(), []);\n\n useEffect(() => {\n const isMobile = window.matchMedia(\"(max-width: 768px)\").matches;\n if (isMobile) {\n window.scrollTo(0, document.body.scrollHeight);\n }\n }, []);\n\n const swapLocations = () => {\n setPickupLocation(dropoffLocation);\n setDropoffLocation(pickupLocation);\n };\n\n const handleLocationChange = (setter) => (newLocation) => {\n if (newLocation === (setter === setPickupLocation ? dropoffLocation : pickupLocation) && newLocation !== \"\") {\n swapLocations();\n } else {\n setter(newLocation);\n }\n };\n\n const handleProductSelection = async () => {\n await db.transact(\n tx.rides[id()].update({\n pickupLocation: pickupLocation,\n dropoffLocation: dropoffLocation,\n selectedOption: selectedOption,\n cost: `$${cost}`,\n createdAt: Date.now(),\n }).link({ users: data.users[0].id }),\n );\n setShowToast(true);\n setTimeout(() => {\n setShowToast(false);\n window.location.href = \"/rides\";\n }, 3000);\n };\n\n const isFormValid = pickupLocation && dropoffLocation;\n\n return (\n

\n {title &&

{title}

}\n

\n \n

Select Ride Option

\n setSelectedOption(\"notUberX\")}\n cost={cost}\n />\n setSelectedOption(\"notUberXL\")}\n cost={cost + 5}\n />\n

\n \n {selectedOption} - ${(selectedOption === \"notUberX\" ? cost : cost + 5).toFixed(2)}\n \n

\n \n

\n setShowToast(false)}\n />\n

\n );\n};\n\nexport function New() {\n return (\n

\n \n

\n );\n}\n\nconst css = `\n@keyframes toastIn {\n from {\n transform: scale(0);\n opacity: 0;\n }\n to {\n transform: scale(1);\n opacity: 1;\n }\n}\n\n@keyframes toastOut {\n from {\n transform: scale(1);\n opacity: 1;\n }\n to {\n transform: scale(0);\n opacity: 0;\n }\n}\n\n.animate-toast {\n animation: toastIn 0.5s ease-out forwards, toastOut 0.5s ease-in forwards 2.5s;\n}\n`;\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n Get a ride\n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}",[],[198],{"_102":205,"_95":206,"_156":207,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":208,"_99":32,"_162":176,"_164":209,"_166":22,"_167":-5,"_168":210,"_98":211},"5cfd93da-040a-11f0-9c63-569c3dd06744","notUberRide","303d15ef-f19e-4993-bf53-cd5f525984a6",["D",1742310300442],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { init } from \"https://esm.sh/@instantdb/react?bundle-deps&deps=react@18.2.0\";\nimport { IconLoader2 } from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { INSTANTDB_APP_ID } from \"https://esm.town/v/vawogbemi/notUberConsts\";\nimport { MapComponent } from \"https://esm.town/v/vawogbemi/notUberMapComponent\";\n\nconst Tracking = () => {\n const db = init({ appId: INSTANTDB_APP_ID });\n\n db.useAuth();\n\n const query = {\n rides: {\n $: {\n where: {\n \"id\": window.location.pathname.split(\"/\")[2],\n },\n },\n $users: {},\n },\n };\n\n const { queryIsLoading, queryError, data } = db.useQuery(query);\n\n if (queryIsLoading) {\n return (\n

\n \n

\n );\n }\n\n if (queryError) {\n console.error(\"Query error:\", queryError);\n return (\n

Error loading data: {queryError.message}

\n );\n }\n\n if (!data || !data.rides || data.rides.length === 0) {\n console.error(\"No data or empty rides:\", data);\n return (\n

No data available for this ride.

\n );\n }\n\n const ride = data.rides[0];\n\n return (\n

\n {ride.dropoffLocation || \"Unknown Location\"}\n

\n {`${new Date(ride.createdAt).toDateString()} • \n ${new Date(ride.createdAt).toLocaleTimeString()}`}\n

{`Cost: ${ride.cost}`}

{`${ride.selectedOption}`}

\n \n

\n );\n};\n\nexport function Ride() {\n return (\n

\n \n

\n );\n}",[],[206],{"_102":213,"_95":214,"_156":215,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":216,"_99":32,"_162":176,"_164":217,"_166":22,"_167":-5,"_168":218,"_98":219},"5cfd9704-040a-11f0-9c63-569c3dd06744","notUberRides","4b4c783c-e57f-4545-8bfe-1393bf9362d7",["D",1742310300442],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { init } from \"https://esm.sh/@instantdb/react?bundle-deps&deps=react@18.2.0\";\nimport { IconCar, IconCarFilled } from \"https://esm.sh/@tabler/icons-react?deps=react@18.2.0\";\nimport { useNavigate } from \"https://esm.sh/react-router-dom?deps=react@18.2.0\";\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { INSTANTDB_APP_ID } from \"https://esm.town/v/vawogbemi/notUberConsts\";\n\nexport function Rides() {\n const db = init({ appId: INSTANTDB_APP_ID });\n\n const { isLoading, user, error } = db.useAuth();\n\n const query = {\n rides: {\n $: {\n where: {\n \"users.email\": !isLoading && user && user.email,\n },\n },\n users: {},\n },\n };\n\n const { queryIsLoading, queryError, data } = db.useQuery(query);\n\n const navigate = useNavigate();\n\n const renderRides = (rides) => {\n return (\n

\n {rides.map((ride) => (\n \n

\n {ride.selectedOption == \"notUberX\"\n ? \n : }\n

{ride.selectedOption}

{ride.dropoffLocation}

\n {`${new Date(ride.createdAt).toDateString()} • \n ${new Date(ride.createdAt).toLocaleTimeString()}`}\n

{ride.cost}

\n {ride.description}\n

\n \n ))}\n

\n );\n };\n\n const renderSection = (title, rides) => {\n return (\n

{title}

\n {rides.length > 0\n ? renderRides(rides)\n :

No rides in this category.

}\n

\n );\n };\n\n if (isLoading || queryIsLoading) {\n return

;\n }\n\n if (error || queryError) {\n return

Error: {error?.message || queryError?.message}

;\n }\n\n const allRides = data && data.rides ? Object.values(data.rides) : [];\n\n return (\n

Your Rides

\n {renderSection(\"All Rides\", allRides)}\n

\n );\n}",[],[214],"files",[154,171,180,188,196,204,212],"counts",{"_224":32,"_225":137,"_226":32,"_227":228},"pulls","branches","forks","envVars",{"_229":32,"_230":32},"count","emptyCount","contents",[233,236,239,242,245,248,251],{"_102":155,"_95":96,"_156":114,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":234,"_99":32,"_162":163,"_164":165,"_166":22,"_167":-5,"_98":235},["D",1742310300442],[96],{"_102":172,"_95":173,"_156":174,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":237,"_99":32,"_162":176,"_164":177,"_166":22,"_167":-5,"_98":238},["D",1742310300442],[173],{"_102":181,"_95":182,"_156":183,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":240,"_99":32,"_162":176,"_164":185,"_166":22,"_167":-5,"_98":241},["D",1742310300442],[182],{"_102":189,"_95":190,"_156":191,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":243,"_99":32,"_162":176,"_164":193,"_166":22,"_167":-5,"_98":244},["D",1742310300442],[190],{"_102":197,"_95":198,"_156":199,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":246,"_99":32,"_162":176,"_164":201,"_166":22,"_167":-5,"_98":247},["D",1742310300442],[198],{"_102":205,"_95":206,"_156":207,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":249,"_99":32,"_162":176,"_164":209,"_166":22,"_167":-5,"_98":250},["D",1742310300442],[206],{"_102":213,"_95":214,"_156":215,"_157":-5,"_158":138,"_159":137,"_160":116,"_104":252,"_99":32,"_162":176,"_164":217,"_166":22,"_167":-5,"_98":253},["D",1742310300442],[214],"file","upstreamProject",{"_102":146,"_95":96,"_110":-5,"_111":257,"_108":109,"_23":258},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/e7100663-7cdd-485d-4379-417fd4e85100/square512",{"_93":259,"_130":260},"vawogbemi","https://images.clerk.dev/oauth_github/img_2TXrDk0iTsMgo2T7z93Wn4eqcgK.jpeg","upstreamBranch",{"_102":141,"_104":263,"_264":265,"_95":43,"_139":146,"_99":143,"_140":-5,"_142":-5,"_266":267,"_106":-5,"_151":22,"_108":109,"_150":259,"_16":148,"_149":96},["D",1738727371488],"updatedAt",["D",1738728484238],"lockfileKey","1764589856857-esm.town_v_vawogbemi_notUber@29-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.compare.$branch",{"_93":94,"_95":96,"_97":43,"_100":274,"_279":32,"_280":32,"_281":282,"_288":22,"_289":278,"_290":291,"_294":-5},{"_102":103,"_95":96,"_104":275,"_106":-5,"_107":22,"_108":109,"_110":-5,"_111":-5,"_14":112,"_113":114,"_115":116,"_117":-5,"_118":32,"_16":119,"_120":121,"_122":121,"_123":124,"_125":124,"_126":124,"_127":121,"_128":121,"_23":276,"_132":277,"_135":278,"_151":22},["D",1742310300442],{"_93":94,"_130":131},{"_93":94,"_134":131,"_14":112},{"_99":137,"_95":43,"_102":138,"_139":103,"_140":141,"_142":143,"_144":109,"_145":146,"_147":148,"_149":96,"_150":94},"ahead","behind","diff",{"_283":284,"_166":285,"_286":287},"added",[],[],"modified",[],"hasChanges","sourceBranch","targetBranch",{"_102":141,"_104":292,"_264":293,"_95":43,"_139":146,"_99":143,"_140":-5,"_142":-5,"_266":267,"_106":-5,"_151":22,"_108":109,"_150":259,"_16":148,"_149":96},["D",1738727371488],["D",1738728484238],"pull","actionData","errors"]

cameron

notUber

Mergecameron/mainintovawogbemi/main