Merge pull request #805 from ibi-group/set-viewed-stop-from-endpoint

Set viewed stop from endpoint
opentripplanner · Jan 15, 2025 · 123ffa3 · 123ffa3
2 parents 779128e + 3bc4a90
commit 123ffa3
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 1 deletion.
diff --git a/packages/endpoints-overlay/i18n/en-US.yml b/packages/endpoints-overlay/i18n/en-US.yml
@@ -7,3 +7,4 @@ otpUi:
     saveAsHome: Save as home
     saveAsWork: Save as work
     swapLocation: Change to {locationType} location
+    viewNearby: View nearby
diff --git a/packages/endpoints-overlay/i18n/fr.yml b/packages/endpoints-overlay/i18n/fr.yml
@@ -11,3 +11,4 @@ otpUi:
     swapLocation: >-
       En faire {locationType, select, from {le point de départ} to {la
       destination} other {{locationType}}}
+    viewNearby: À proximité
diff --git a/packages/endpoints-overlay/src/EndpointsOverlay.story.tsx b/packages/endpoints-overlay/src/EndpointsOverlay.story.tsx
@@ -14,6 +14,7 @@ const clearLocation = action("clearLocation");
 const forgetPlace = action("forgetPlace");
 const rememberPlace = action("rememberPlace");
 const setLocation = action("setLocation");
+const setViewNearby = action("setViewNearby");
 const unnamedFromLocation = {
   lat: 45.522497,
   lon: -122.676029,
@@ -57,6 +58,7 @@ export const EndpointsOverlayWithUserSettings: ComponentStory<typeof EndpointsOv
     locations={locations}
     rememberPlace={rememberPlace}
     setLocation={setLocation}
+    setViewNearby={setViewNearby}
     showUserSettings
     toLocation={toLocation}
   />
@@ -91,6 +93,7 @@ export const EndpointsOverlayWithUnnamedPlace: ComponentStory<typeof EndpointsOv
   <EndpointsOverlay
     fromLocation={unnamedFromLocation}
     setLocation={setLocation}
+    setViewNearby={setViewNearby}
     showUserSettings
     toLocation={unnamedToLocation}
   />

diff --git a/packages/endpoints-overlay/src/endpoint.tsx b/packages/endpoints-overlay/src/endpoint.tsx
@@ -1,5 +1,6 @@
 import { Briefcase } from "@styled-icons/fa-solid/Briefcase";
 import { Popup } from "@opentripplanner/base-map";
+import { Search } from "@styled-icons/fa-solid/Search";
 import {
   ClearLocationArg,
   Location,
@@ -30,6 +31,7 @@ interface Props {
   MapMarkerIcon: ComponentType<UserLocationAndType>;
   rememberPlace: (arg: UserLocationAndType) => void;
   setLocation: (arg: MapLocationActionArg) => void;
+  setViewNearby?: (arg: Location) => void;
   showUserSettings: boolean;
   type: string;
 }
@@ -60,6 +62,8 @@ function UserLocationInnerIcon({ type }: IconProps) {
       return <Sync size={12} />;
     case "times":
       return <Times size={12} />;
+    case "nearby":
+      return <Search size={12} />;
     default:
       return null;
   }
@@ -150,7 +154,14 @@ const Endpoint = (props: Props): JSX.Element => {
   };
 
   const [showPopup, setShowPopup] = useState(false);
-  const { location, locations, MapMarkerIcon, showUserSettings, type } = props;
+  const {
+    location,
+    locations,
+    MapMarkerIcon,
+    setViewNearby,
+    showUserSettings,
+    type
+  } = props;
   if (!(location && location.lat && location.lon)) return null;
   const match = locations.find(l => coreUtils.map.matchLatLon(l, location));
   const isWork = match && match.type === "work";
@@ -273,6 +284,18 @@ const Endpoint = (props: Props): JSX.Element => {
                 />
               </S.Button>
             </div>
+            <div>
+              <S.Button onClick={() => setViewNearby(location)}>
+                <UserLocationIcon type="nearby" />
+                <FormattedMessage
+                  defaultMessage={
+                    defaultMessages["otpUi.EndpointsOverlay.viewStop"]
+                  }
+                  description="Button text to view the coordinates in the nearby view"
+                  id="otpUi.EndpointsOverlay.viewNearby"
+                />
+              </S.Button>
+            </div>
           </FocusTrapWrapper>
         </Popup>
       )}

diff --git a/packages/endpoints-overlay/src/index.tsx b/packages/endpoints-overlay/src/index.tsx
@@ -64,6 +64,10 @@ interface Props {
    * { location: {...location}, reverseGeocode: true, type: "from/to" }
    */
   setLocation?: (arg: MapLocationActionArg) => void;
+  /**
+   * Opens the nearby view from the location coordinates
+   */
+  setViewNearby?: (arg: Location) => void;
   /**
    * Whether or not to show the user settings popup when an endpoint is clicked.
    */
@@ -121,6 +125,7 @@ const EndpointsOverlay = ({
   MapMarkerIcon = DefaultMapMarkerIcon,
   rememberPlace = noop,
   setLocation = noop,
+  setViewNearby = noop,
   showUserSettings,
   toLocation
 }: Props): ReactElement => (
@@ -133,6 +138,7 @@ const EndpointsOverlay = ({
       MapMarkerIcon={MapMarkerIcon}
       rememberPlace={rememberPlace}
       setLocation={setLocation}
+      setViewNearby={setViewNearby}
       showUserSettings={showUserSettings}
       type="from"
     />
@@ -161,6 +167,7 @@ const EndpointsOverlay = ({
       rememberPlace={rememberPlace}
       setLocation={setLocation}
       showUserSettings={showUserSettings}
+      setViewNearby={setViewNearby}
       type="to"
     />
   </div>