rushilwiz/wheelshare-frontend
1
0
Fork 0
mirror of https://github.com/myfatemi04/wheelshare-frontend.git synced 2025-04-21 11:20:17 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

add confirmed button

Browse Source
This commit is contained in:
Michael Fatemi 2021-06-08 12:09:30 -04:00
parent 11272ce41a
commit a7b70a31e7
2 changed files with 36 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/NewUI/Event.tsx
View File

@ -21,6 +21,7 @@ export default function Event({
const [needRideBack, setNeedRideBack] = useState(false); const [needRideBack, setNeedRideBack] = useState(false);
const [rideTherePickupPlaceID, setRideTherePickupPlaceID] = useState(''); const [rideTherePickupPlaceID, setRideTherePickupPlaceID] = useState('');
const [rideBackDropoffPlaceID, setRideBackDropoffPlaceID] = useState(''); const [rideBackDropoffPlaceID, setRideBackDropoffPlaceID] = useState('');
const [confirmed, setConfirmed] = useState(false);
useEffect(() => { useEffect(() => {
console.log({ rideTherePickupPlaceID, rideBackDropoffPlaceID }); console.log({ rideTherePickupPlaceID, rideBackDropoffPlaceID });
@ -131,9 +132,10 @@ export default function Event({
</span> </span>
<UIPlacesAutocomplete <UIPlacesAutocomplete
placeholder="Pickup location" placeholder="Pickup location"
onSelected={(address, placeID) => onSelected={(address, placeID) => {
setRideTherePickupPlaceID(placeID) setRideTherePickupPlaceID(placeID);
} setConfirmed(false);
}}
/> />
<UITimeInput /> <UITimeInput />
</> </>
@ -152,13 +154,35 @@ export default function Event({
</span> </span>
<UIPlacesAutocomplete <UIPlacesAutocomplete
placeholder="Dropoff location" placeholder="Dropoff location"
onSelected={(address, placeID) => onSelected={(address, placeID) => {
setRideBackDropoffPlaceID(placeID) setRideBackDropoffPlaceID(placeID);
} setConfirmed(false);
}}
/> />
<UITimeInput /> <UITimeInput />
</> </>
)} )}
{(needRideThere || needRideBack) &&
(rideTherePickupPlaceID || rideBackDropoffPlaceID) && (
<div
style={{
backgroundColor: confirmed ? green : lightgrey,
color: confirmed ? 'white' : 'black',
padding: '1rem',
borderRadius: '0.5em',
textTransform: 'uppercase',
fontWeight: 500,
marginTop: '0.5em',
cursor: 'pointer',
userSelect: 'none',
}}
onClick={() => {
setConfirmed((confirmed) => !confirmed);
}}
>
{confirmed ? 'Confirmed' : 'Confirm'}
</div>
)}
</div> </div>
); );
} }

7
src/components/NewUI/UIPlacesAutocomplete.tsx
View File

@ -50,7 +50,12 @@ export default function UIPlacesAutocomplete({
const suggestionsRef = useRef<readonly Suggestion[]>([]); const suggestionsRef = useRef<readonly Suggestion[]>([]);
return ( return (
<PlacesAutocomplete <PlacesAutocomplete
onChange={setLocation} onChange={(location) => {
setLocation(location);
if (onSelected) {
onSelected(null!, null!);
}
}}
onSelect={(address, placeID) => { onSelect={(address, placeID) => {
setLocation(address); setLocation(address);
if (onSelected) { if (onSelected) {