UI

[kevinmichaelchen]

Primary functions

The React UI should have 3 functions:

1. View driver locations on a map.
2. Add new driver locations by clicking on the map.
3. Get a ranked list of drivers that are nearest to a point.

TODOs:

Backend

• ListDrivers rpc to paginate drivers
• Enable CORS (see demo)
• Translation layer for errors (see docs) (see connect-go errors, reflection, health checks #29)
• Health checks (docs | demo) (see connect-go errors, reflection, health checks #29)
• Reflection (docs | demo) (see connect-go errors, reflection, health checks #29)

Frontend

• Render Google Map (docs)
• Clicking on map should add point (see onClick prop)
• Marker tooltip should display lat/lng, as well as other info (see title prop)
• Function to fetch all drivers (docs)
• map.onClick should generate a fake full name + some random digits as the driver's ID
• Hovering should display driver ID (their full name)+ geo point
• Button to ingest/upload all new locations
• Dragging point should update location (tackle in subsequent PR)

[kevinmichaelchen]

According to docs, it should be possible to use fetch from the browser. But I don't think an OPTIONS method is supported according to these lines in connect-go.

http OPTIONS http://localhost:8081/coop.drivers.dispatch.v1beta1.DispatchService/ListDrivers \
  "Access-Control-Request-Method":POST \
  "Access-Control-Request-Headers":"content-type" \
  "Origin":"http://localhost:3000"

returns

HTTP/1.1 405 Method Not Allowed

Fixed in c522cf2 and 17f8d02