Skip to content

Commit

Permalink
Merge pull request #1126 from hackclub/malted/fixstasrntoirsntoeisr
Browse files Browse the repository at this point in the history
Yeah
  • Loading branch information
malted authored Jan 22, 2025
2 parents 7b811c7 + 53a2aeb commit 9bf50be
Show file tree
Hide file tree
Showing 3 changed files with 117 additions and 99 deletions.
2 changes: 1 addition & 1 deletion src/app/harbor/shipyard/edit-ship-form.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import React, { useState } from 'react'
import Modal from '../../../components/ui/modal'
import { EditableShipFields } from '../../utils/server/data'

const editMessages = [
export const editMessages = [
'Orpheus hopes you know that she put a lot of effort into recording your changes~',
'Heidi scribbles down your changes hastily...',
"Orpheus put your Ship changes in the logbook. They're going nowhere, rest assured.",
Expand Down
79 changes: 42 additions & 37 deletions src/app/harbor/tavern/map.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ export default function Map({ tavernEvents, tavernPeople, selectedTavern }) {
className="h-96 rounded-lg"
center={[0, 0]}
zoom={2}
scrollWheelZoom={false}
scrollWheelZoom={true}
>
<TileLayer
attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
Expand Down Expand Up @@ -61,10 +61,10 @@ export default function Map({ tavernEvents, tavernPeople, selectedTavern }) {
/>
<p>Mystic Tavern without organizer</p>
</div>
<div className="flex flex-row justify-start items-center gap-2">
{/* <div className="flex flex-row justify-start items-center gap-2">
<div className="h-7 w-7 rounded-full border-2 border-white bg-[#cfdfff]"></div>
<p>Someone unable to organize or attend</p>
</div>
</div> */}
<div className="flex flex-row justify-start items-center gap-2">
<div className="h-7 w-7 rounded-full border-2 border-white bg-[#ffd66e]"></div>
<p>Someone able to organize</p>
Expand All @@ -73,10 +73,10 @@ export default function Map({ tavernEvents, tavernPeople, selectedTavern }) {
<div className="h-7 w-7 rounded-full border-2 border-white bg-[#f82b60]"></div>
<p>Someone able to attend</p>
</div>
<div className="flex flex-row justify-start items-center gap-2">
{/* <div className="flex flex-row justify-start items-center gap-2">
<div className="h-7 w-7 rounded-full border-2 border-white bg-[#666666]"></div>
<p>Someone who has not responded</p>
</div>
</div> */}
</Card>
</div>
)
Expand Down Expand Up @@ -116,43 +116,48 @@ function TavernMarkers(props: MapProps) {

console.log(props)

const peopleMarkers = props.people.map((t) => {
let iconClass = `rounded-full border-2 border-white w-full h-full `
const peopleMarkers = props.people
.map((t) => {
let iconClass = `rounded-full border-2 border-white w-full h-full `

switch (t.status) {
case 'none': {
iconClass += 'bg-[#cfdfff]'
break
}
case 'organizer': {
iconClass += 'bg-[#ffd66e]'
break
}
case 'participant': {
iconClass += 'bg-[#f82b60]'
break
}
default: {
iconClass += 'bg-[#666666]'
break
switch (t.status) {
case 'none': {
// iconClass += 'bg-[#cfdfff]'
// break
return null
}
case 'organizer': {
iconClass += 'bg-[#ffd66e]'
break
}
case 'participant': {
iconClass += 'bg-[#f82b60]'
break
}
default: {
// iconClass += 'bg-[#666666]'
// break
return null
}
}
}

const icon = new DivIcon({
className: iconClass,
iconSize: [25, 25],
const icon = new DivIcon({
className: iconClass,
iconSize: [25, 25],
})

return (
<Marker
key={t.coordinates}
position={
t.coordinates.split(', ').map((c) => Number(c)) as LatLngExpression
}
icon={icon}
/>
)
})
.filter((e) => e !== null)

return (
<Marker
key={t.coordinates}
position={
t.coordinates.split(', ').map((c) => Number(c)) as LatLngExpression
}
icon={icon}
/>
)
})
const eventMarkers = props.events
.map((e) => {
if (!e.geocode) {
Expand Down
135 changes: 74 additions & 61 deletions src/app/harbor/tavern/tavern.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ import {
} from './tavern-utils'
import Modal from '@/components/ui/modal'
import { Button } from '@/components/ui/button'
import { useToast } from '@/hooks/use-toast'
import { editMessages } from '../shipyard/edit-ship-form'

const Map = dynamic(() => import('./map'), {
ssr: false,
Expand All @@ -41,6 +43,15 @@ const RsvpStatusSwitcher = ({ tavernEvents, onTavernSelect }) => {
const [attendeeNoOrganizerModal, setAttendeeNoOrganizerModal] =
useState(false)

const { toast } = useToast()
useEffect(() => {
toast({
title: 'Saved',
description:
editMessages[Math.floor(Math.random() * editMessages.length)],
})
}, [rsvpStatus, whichTavern, shirtSize])

useEffect(() => {
// set rsvp status
getTavernRsvpStatus().then((status) => setRsvpStatus(status))
Expand Down Expand Up @@ -99,71 +110,73 @@ const RsvpStatusSwitcher = ({ tavernEvents, onTavernSelect }) => {
<br />
Please consider volunteering to organize this tavern, me hearty!
</Modal>
<div className="text-center mb-6 mt-12" id="region-select">
<label>Will you join?</label>
<select
onChange={onOptionChangeHandler}
value={rsvpStatus}
className="ml-2 text-gray-600 rounded-sm"
>
<option disabled>Select</option>
<option value="none">Nope, can't do either</option>
<option value="organizer">I can organize a tavern near me</option>
<option value="participant">I want to attend a tavern near me</option>
</select>
<div
className="text-center mb-6 mt-12 flex flex-col gap-2"
id="region-select"
>
<label>
Will you join?
<select
onChange={onOptionChangeHandler}
value={rsvpStatus}
className="ml-2 text-gray-600 rounded-sm"
>
<option disabled>Select</option>
<option value="none">Nope, can't do either</option>
<option value="organizer">I can organize a tavern near me</option>
<option value="participant">
I want to attend a tavern near me
</option>
</select>
</label>

{tavernEvents &&
(rsvpStatus === 'participant' || rsvpStatus === 'organizer') ? (
<div>
<label>Which tavern will you attend?</label>
<select
onChange={onTavernChangeHandler}
value={whichTavern}
className="ml-2 text-gray-600 rounded-sm"
>
<option value="">Select</option>
{Object.keys(eventsByCountry)
.sort()
.map((country) => (
<optgroup key={country} label={country}>
{eventsByCountry[country].map((te) => (
<option key={te.id} value={te.id}>
{te.locality}
{te.organizers.length === 0
? ' (no organizers yet!)'
: ''}
</option>
))}
</optgroup>
))}
{/* {tavernEvents.map((te, idx) => {
console.log(te)
return (
<option key={idx} value={te.id}>
{te.locality}
{te.organizers.length === 0 ? ' (no organizers yet!)' : ''}
</option>
)
})} */}
</select>
<>
<label>
Which tavern will you attend?
<select
onChange={onTavernChangeHandler}
value={whichTavern}
className="ml-2 text-gray-600 rounded-sm"
>
<option value="">Select</option>
{Object.keys(eventsByCountry)
.sort()
.map((country) => (
<optgroup key={country} label={country}>
{eventsByCountry[country].map((te) => (
<option key={te.id} value={te.id}>
{te.locality}
{te.organizers.length === 0
? ' (no organizers yet!)'
: ''}
</option>
))}
</optgroup>
))}
</select>
</label>

<label>What is your shirt size?</label>
<select
onChange={async (e) => {
setShirtSize(e.target.value)
await submitShirtSize(e.target.value)
}}
value={shirtSize}
className="ml-2 text-gray-600 rounded-sm"
>
<option disabled>Select</option>
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="XL">XL</option>
<option value="XXL">XXL</option>
</select>
</div>
<label>
What is your shirt size?
<select
onChange={async (e) => {
setShirtSize(e.target.value)
await submitShirtSize(e.target.value)
}}
value={shirtSize}
className="ml-2 text-gray-600 rounded-sm"
>
<option disabled>Select</option>
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="XL">XL</option>
<option value="XXL">XXL</option>
</select>
</label>
</>
) : null}
</div>
</>
Expand Down

0 comments on commit 9bf50be

Please sign in to comment.