From 96d21a3a15c0c648bc8bfa40101c34aaed8b801c Mon Sep 17 00:00:00 2001
From: haphut <haphut@mistmap.com>
Date: Thu, 28 May 2020 17:19:43 +0300
Subject: [PATCH 1/3] Add new properties into Overpass Tags interface

---
 src/overpass.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/overpass.ts b/src/overpass.ts
index 2ae6e440..4a3192d8 100644
--- a/src/overpass.ts
+++ b/src/overpass.ts
@@ -32,6 +32,8 @@ export interface Tags {
   operator?: string;
   ref?: string;
   "addr:unit"?: string;
+  "addr:housenumber"?: string;
+  "addr:street"?: string;
 }
 
 const buildEntranceQuery = (lat: number, lon: number): string => `

From d879a7faaf7a260dd26af6631a49c611369b3725 Mon Sep 17 00:00:00 2001
From: Tuukka Hastrup <tuukka@sproutverse.com>
Date: Thu, 28 May 2020 18:40:40 +0300
Subject: [PATCH 2/3] Show a popup also for entrances

---
 src/App.tsx | 158 ++++++++++++++++++++++++++++++----------------------
 1 file changed, 92 insertions(+), 66 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 8787eacd..12e173b5 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -44,7 +44,7 @@ interface State {
   route: FeatureCollection;
   isGeolocating: boolean;
   geolocationPosition: LatLng | null;
-  popupCoordinates: LatLng | null;
+  popupCoordinates: ElementWithCoordinates | null;
   snackbar?: ReactText;
 }
 
@@ -379,21 +379,33 @@ const App: React.FC = () => {
     setState(
       (prevState): State => {
         if (feature?.properties.entrance) {
+          const element = {
+            id: feature.properties["@id"],
+            type: feature.properties["@type"],
+            lat: feature.geometry.coordinates[1],
+            lon: feature.geometry.coordinates[0],
+            tags: feature.properties,
+          };
           // If an entrance was clicked, set it as the destination
           return {
             ...prevState,
-            destination: {
-              id: feature.properties["@id"],
-              type: feature.properties["@type"],
-              lat: feature.geometry.coordinates[1],
-              lon: feature.geometry.coordinates[0],
-            },
+            destination: element,
+            popupCoordinates: element,
+          };
+        }
+        // As a fallback, toggle popup.
+        if (prevState.popupCoordinates) {
+          return {
+            ...prevState,
+            popupCoordinates: null,
           };
         }
-        // As a fallback, open a popup.
         return {
           ...prevState,
-          popupCoordinates: [event.lngLat.lat, event.lngLat.lng],
+          popupCoordinates: latLngToDestination([
+            event.lngLat.lat,
+            event.lngLat.lng,
+          ]),
         };
       }
     );
@@ -638,74 +650,88 @@ const App: React.FC = () => {
             />
           </Marker>
         )}
-        {state.popupCoordinates != null && (
-          <Popup
-            latitude={state.popupCoordinates[0]}
-            longitude={state.popupCoordinates[1]}
-            closeButton={false}
-            closeOnClick
-            onClose={(): void =>
-              setState(
-                (prevState): State => ({ ...prevState, popupCoordinates: null })
-              )
-            }
-          >
-            <button
-              data-testid="origin-button"
-              type="button"
-              aria-label="Set origin"
-              onClick={(): void =>
-                setState(
-                  (prevState): State => {
-                    // Check this to appease the compiler.
-                    if (prevState.popupCoordinates != null) {
+        <Popup
+          open={state.popupCoordinates != null}
+          latitude={state.popupCoordinates?.lat || null}
+          longitude={state.popupCoordinates?.lon || null}
+          closeButton={false}
+          closeOnClick={false}
+        >
+          {state.popupCoordinates && (
+            <>
+              <div>
+                <p>
+                  {state.popupCoordinates.tags?.["addr:street"]}{" "}
+                  {state.popupCoordinates.tags?.["addr:housenumber"]}{" "}
+                  {state.popupCoordinates.tags?.["ref"] ||
+                    state.popupCoordinates.tags?.["addr:unit"]}
+                </p>
+                <p>
+                  {state.popupCoordinates.tags &&
+                    JSON.stringify(
+                      Object.entries(state.popupCoordinates.tags).filter(
+                        ([k]) => !k.startsWith("@")
+                      )
+                    )}
+                </p>
+              </div>
+              <button
+                data-testid="origin-button"
+                type="button"
+                aria-label="Set origin"
+                onClick={(): void =>
+                  setState(
+                    (prevState): State => {
+                      // Check this to appease the compiler.
+                      if (prevState.popupCoordinates != null) {
+                        return {
+                          ...prevState,
+                          origin: destinationToLatLng(
+                            prevState.popupCoordinates
+                          ),
+                          isOriginExplicit: true,
+                          popupCoordinates: null,
+                        };
+                      }
                       return {
                         ...prevState,
-                        origin: prevState.popupCoordinates,
                         isOriginExplicit: true,
                         popupCoordinates: null,
                       };
                     }
-                    return {
-                      ...prevState,
-                      isOriginExplicit: true,
-                      popupCoordinates: null,
-                    };
-                  }
-                )
-              }
-            >
-              Origin
-            </button>
-            <button
-              data-testid="destination-button"
-              type="button"
-              aria-label="Set destination"
-              onClick={(): void =>
-                setState(
-                  (prevState): State => {
-                    // Check this to appease the compiler.
-                    if (prevState.popupCoordinates != null) {
+                  )
+                }
+              >
+                Origin
+              </button>
+              <button
+                data-testid="destination-button"
+                type="button"
+                aria-label="Set destination"
+                onClick={(): void =>
+                  setState(
+                    (prevState): State => {
+                      // Check this to appease the compiler.
+                      if (prevState.popupCoordinates != null) {
+                        return {
+                          ...prevState,
+                          destination: prevState.popupCoordinates,
+                          popupCoordinates: null,
+                        };
+                      }
                       return {
                         ...prevState,
-                        destination: latLngToDestination(
-                          prevState.popupCoordinates
-                        ),
                         popupCoordinates: null,
                       };
                     }
-                    return {
-                      ...prevState,
-                      popupCoordinates: null,
-                    };
-                  }
-                )
-              }
-            >
-              Destination
-            </button>
-          </Popup>
-        )}
+                  )
+                }
+              >
+                Destination
+              </button>
+            </>
+          )}
+        </Popup>
       </MapGL>
     </div>
   );

From db55db99ea170d904262a7f3aa7d7b0a3a4dbc40 Mon Sep 17 00:00:00 2001
From: Tuukka Hastrup <tuukka@sproutverse.com>
Date: Thu, 28 May 2020 19:01:42 +0300
Subject: [PATCH 3/3] Hide (redundant) action buttons on the entrance popup

---
 src/App.tsx | 36 +++++++++++++++++++-----------------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 12e173b5..e1fff88c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -657,24 +657,26 @@ const App: React.FC = () => {
           closeButton={false}
           closeOnClick={false}
         >
-          {state.popupCoordinates && (
+          {state.popupCoordinates && state.popupCoordinates.tags && (
+            <div>
+              <p>
+                {state.popupCoordinates.tags?.["addr:street"]}{" "}
+                {state.popupCoordinates.tags?.["addr:housenumber"]}{" "}
+                {state.popupCoordinates.tags?.["ref"] ||
+                  state.popupCoordinates.tags?.["addr:unit"]}
+              </p>
+              <p>
+                {state.popupCoordinates.tags &&
+                  JSON.stringify(
+                    Object.entries(state.popupCoordinates.tags).filter(
+                      ([k]) => !k.startsWith("@")
+                    )
+                  )}
+              </p>
+            </div>
+          )}
+          {state.popupCoordinates && !state.popupCoordinates.tags && (
             <>
-              <div>
-                <p>
-                  {state.popupCoordinates.tags?.["addr:street"]}{" "}
-                  {state.popupCoordinates.tags?.["addr:housenumber"]}{" "}
-                  {state.popupCoordinates.tags?.["ref"] ||
-                    state.popupCoordinates.tags?.["addr:unit"]}
-                </p>
-                <p>
-                  {state.popupCoordinates.tags &&
-                    JSON.stringify(
-                      Object.entries(state.popupCoordinates.tags).filter(
-                        ([k]) => !k.startsWith("@")
-                      )
-                    )}
-                </p>
-              </div>
               <button
                 data-testid="origin-button"
                 type="button"