Display only unique destinations

resources/components/picker/stop.html

@@ -3,10 +3,10 @@
         <slot name="primary-action" />
         <div class="overflow-hidden align-self-center">
             <stop :stop="stop" class="my-1"/>
-            <div class="stop__destinations" v-if="stop.destinations && stop.destinations.length > 0">
+            <div class="stop__destinations" v-if="destinations && destinations.length > 0">
                 <fa :icon="['far', 'chevron-right']" />
                 <ul class="ml-1">
-                    <li class="stop__destination" v-for="destination in stop.destinations" :key="destination.id">{{ destination.name }}</li>
+                    <li class="stop__destination" v-for="destination in destinations" :key="destination.id">{{ destination.name }}</li>
                 </ul>
             </div>
         </div>

resources/ts/components/picker.ts

@@ -2,7 +2,7 @@ import Component from "vue-class-component";
 import Vue from "vue";
 import { Stop, StopGroup, StopGroups } from "../model";
 import { Prop, Watch } from "vue-property-decorator";
-import { ensureArray, FetchingState, filter, map, time } from "../utils";
+import { FetchingState, filter, map, unique } from "../utils";
 import { debounce } from "../decorators";
 import urls from '../urls';
 
@@ -18,6 +18,10 @@ export class PickerStopComponent extends Vue {
     get showMap() {
         return this.inMap || this.map;
     }
+
+    get destinations() {
+        return unique(this.stop.destinations, stop => stop.name);
+    }
 }
 
 @Component({
@@ -38,7 +42,7 @@ export class FinderComponent extends Vue {
     get filtered(): StopGroups {
         const groups = map(
             this.found,
-            (group: StopGroup, name: string) =>
+            (group: StopGroup) =>
                 group.filter(stop => !this.blacklist.some(blacklisted => blacklisted.id === stop.id))
         ) as StopGroups;
 

resources/ts/utils.ts

@@ -75,3 +75,23 @@ export function time<T>(action: () => T, name?: string) {
 
     return result;
 }
+
+export const identity = a => a;
+
+export function unique<T, U>(array: T[], criterion: (item: T) => U = identity) {
+    const result: T[] = [];
+    const known = new Set<U>();
+
+    const entries = array.map(item => [ criterion(item), item ]) as [ U, T ][];
+
+    for (const [ key, item ] of entries) {
+        if (known.has(key)) {
+            continue;
+        }
+
+        known.add(key);
+        result.push(item);
+    }
+
+    return result;
+}