refactor(SavedTripScreen): Add readonly prop

opentripplanner · Nov 20, 2024 · ccd4d57 · ccd4d57
1 parent 10b13aa
commit ccd4d57
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 4 deletions.
diff --git a/lib/components/user/mobility-profile/trip-companions-pane.tsx b/lib/components/user/mobility-profile/trip-companions-pane.tsx
@@ -6,7 +6,10 @@ import { MonitoredTrip } from '../types'
 
 import CompanionSelector, { Option } from './companion-selector'
 
-type Props = WrappedComponentProps & FormikProps<MonitoredTrip>
+type Props = WrappedComponentProps &
+  FormikProps<MonitoredTrip> & {
+    isReadOnly: boolean
+  }
 
 function optionValue(option: Option) {
   if (!option) return null
@@ -17,6 +20,7 @@ function optionValue(option: Option) {
  * Pane for showing/setting trip companions and observers.
  */
 const TripCompanions = ({
+  isReadOnly,
   setFieldValue,
   values: trip
 }: Props): JSX.Element => {
@@ -36,26 +40,29 @@ const TripCompanions = ({
 
   const { companion, observers, primary } = trip
 
-  const didIPlanThisTrip = !primary
+  const iAmThePrimaryTraveler = !primary
 
   return (
     <div>
       <p>
         Primary traveler:{' '}
-        <strong>{didIPlanThisTrip ? 'Myself' : primary.email}</strong>
+        <strong>{iAmThePrimaryTraveler ? 'Myself' : primary.email}</strong>
       </p>
       <p>
+        {/* TODO: a11y label */}
         Companion on this trip:
         <CompanionSelector
-          disabled={!didIPlanThisTrip}
+          disabled={isReadOnly || !iAmThePrimaryTraveler}
           excludedUsers={observers}
           onChange={handleCompanionChange}
           selectedCompanions={companion}
         />
       </p>
       <p>
+        {/* TODO: a11y label */}
         Observers:
         <CompanionSelector
+          disabled={isReadOnly}
           excludedUsers={[companion]}
           multi
           onChange={handleObserversChange}

diff --git a/lib/components/user/monitored-trip/saved-trip-editor.tsx b/lib/components/user/monitored-trip/saved-trip-editor.tsx
@@ -15,6 +15,7 @@ import TripNotFound from './trip-not-found'
 interface Props {
   hasMobilityProfile: boolean
   isCreating: boolean
+  isReadOnly: boolean
   onCancel: () => void
   panes: Record<string, ComponentType>
   values: MonitoredTrip

diff --git a/lib/components/user/monitored-trip/saved-trip-screen.js b/lib/components/user/monitored-trip/saved-trip-screen.js
@@ -256,6 +256,7 @@ class SavedTripScreen extends Component {
                   {...props}
                   hasMobilityProfile={Boolean(loggedInUser.mobilityProfile)}
                   isCreating={isCreating}
+                  isReadOnly={monitoredTrip.userId !== loggedInUser.id}
                   notificationChannel={loggedInUser.notificationChannel}
                   onCancel={
                     isCreating ? this._goToTripPlanner : this._goToSavedTrips