Merge branch 'main' into deploy

davwheat · Sep 22, 2024 · 2b5521f · 2b5521f
2 parents 70c267b + e045707
commit 2b5521f
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 10 deletions.
diff --git a/src/components/ImportStateFromRtt.tsx b/src/components/ImportStateFromRtt.tsx
@@ -292,8 +292,8 @@ export default function ImportStateFromRtt({ importStateFromRttService, disabled
                     }
 
                     return (
-                      <ul>
-                        {locations.map((location, i) => {
+                      <ul css={{ margin: 0 }}>
+                        {locations.map((location, i, arr) => {
                           console.log(location)
 
                           let schedArr: Dayjs | null = null
@@ -324,30 +324,70 @@ export default function ImportStateFromRtt({ importStateFromRttService, disabled
                             console.warn(e)
                           }
 
+                          const isSetDownOnly = schedDep === null && i !== arr.length - 1
+                          const isPickUpOnly = schedArr === null && i !== 0
+
                           return (
                             <li
                               key={location.randomId}
                               css={{
+                                '--track-color': 'var(--primary-blue)',
+                                '--track-gap': '24px',
+                                '--track-line-weight': '6px',
+                                '--circle-radius': 'calc(var(--track-line-weight) * 1.75)',
+
+                                '& label::before, & label::after': {
+                                  pointerEvents: 'none',
+                                },
+
                                 '& label::before': {
                                   content: '""',
-                                  width: 8,
-                                  background: 'var(--primary-blue)',
+                                  width: 'var(--track-line-weight)',
+                                  background: 'var(--track-color)',
                                   position: 'absolute',
-                                  left: -24,
+                                  left: 'calc(-1 * var(--track-gap))',
                                   top: 'calc(-1 * var(--item-spacing))',
                                   bottom: 'calc(-1 * var(--item-spacing))',
                                 },
 
                                 '&:first-of-type label::before': {
-                                  top: '50%',
+                                  top: 'calc(50% - var(--circle-radius))',
+                                },
+
+                                '&:last-of-type label::before': {
+                                  bottom: 'calc(50% - var(--circle-radius))',
+                                },
+
+                                '& label::after': {
+                                  content: '""',
+                                  height: 'var(--track-line-weight)',
+                                  width: 'calc(var(--track-gap) / 2)',
+                                  background: 'var(--track-color)',
+                                  position: 'absolute',
+                                  left: 'calc(-1 * var(--track-gap) + var(--track-line-weight))',
+                                  top: 'calc(50% - var(--track-line-weight) / 2)',
+                                },
+
+                                '&:first-of-type label::after, &:last-of-type label::after': {
+                                  left: 'calc(-1 * var(--track-gap) - var(--circle-radius) + var(--track-line-weight) / 2)',
+                                  height: 'calc(var(--circle-radius) * 2)',
+                                  width: 'calc(var(--circle-radius) * 2)',
+                                  borderRadius: '50%',
+                                },
+
+                                '&:first-of-type label::after': {
+                                  top: 'calc(50% - var(--circle-radius))',
+                                },
+                                '&:last-of-type label::after': {
+                                  top: 'calc(50% - var(--circle-radius))',
                                 },
                               }}
                             >
                               <label
                                 htmlFor={`originLocation-${i}`}
                                 css={{
                                   '--item-spacing': '8px',
-                                  marginLeft: 24,
+                                  marginLeft: 'var(--track-gap)',
                                   display: 'grid',
                                   gridTemplateAreas: `
                                     "radio arr location"
@@ -418,7 +458,10 @@ export default function ImportStateFromRtt({ importStateFromRttService, disabled
                                 <div css={{ gridArea: 'detail', color: '#888', fontWeight: 'normal', fontSize: '0.8em' }}>
                                   {[
                                     location.rttPlatform && `Platform ${location.rttPlatform}`,
-                                    location.depLateness && `Departed ${latenessString(location.depLateness)}`,
+                                    !isSetDownOnly && location.depLateness && `Departed ${latenessString(location.depLateness)}`,
+                                    isPickUpOnly && location.arrLateness && `Arrived ${latenessString(location.arrLateness)}`,
+                                    isSetDownOnly && 'Set down only',
+                                    isPickUpOnly && 'Pick up only',
                                   ]
                                     .filter(Boolean)
                                     .join(' • ')}

diff --git a/src/data/RttUtils.ts b/src/data/RttUtils.ts
@@ -23,12 +23,14 @@ export class RttUtils {
 
     return this.getEligibleLocationsInternal(rttService)
       .slice(fromLocationIndex + 1)
-      .filter(l => {
-        if (!l.isPublicCall || l.displayAs === 'CANCELLED_CALL') return false
+      .filter((l, i, arr) => {
+        if (!l.isPublicCall || l.displayAs === 'CANCELLED_CALL' || l.displayAs === 'DESTINATION' || l.displayAs === 'TERMINATES') return false
         if (!l.crs) {
           console.warn(`Location ${l.tiploc} has no CRS code`)
           return false
         }
+        // Ignore destination in calling points
+        if (i === arr.length - 1 && l.destination.some(d => d.tiploc === l.tiploc)) return false
         return true
       })
       .map(l => ({