adapt to new quasar/vite

headwaymaps · Dec 12, 2024 · 91d2d9c · 91d2d9c
1 parent 37f32d8
commit 91d2d9c
Show file tree

Hide file tree

Showing 11 changed files with 63 additions and 65 deletions.
diff --git a/services/frontend/www-app/quasar.config.js → services/frontend/www-app/quasar.config.ts b/services/frontend/www-app/quasar.config.js → services/frontend/www-app/quasar.config.ts
@@ -8,11 +8,11 @@
 // Configuration for your app
 // https://v2.quasar.dev/quasar-cli-vite/quasar-config-js
 
-const { configure } = require('quasar/wrappers');
+import { defineConfig } from '#q-app/wrappers';
 
 const HEADWAY_HOST = 'https://maps.earth';
 
-module.exports = configure(function (/* ctx */) {
+export default defineConfig((/* ctx */) => {
   return {
     eslint: {
       // fix: true,
@@ -55,6 +55,12 @@ module.exports = configure(function (/* ctx */) {
         node: 'node16',
       },
 
+      typescript: {
+        strict: true,
+        vueShim: true,
+        // extendsTsConfig (tsConfig) {}
+      },
+
       vueRouterMode: 'history', // available values: 'hash', 'history'
       // Dev: Use this where we don't have mod_rewrite, otherwise refreshing page with path 404's
       // vueRouterMode: 'hash',
@@ -77,22 +83,20 @@ module.exports = configure(function (/* ctx */) {
       // extendViteConf (viteConf) {},
       // viteVuePluginOptions: {},
 
-      chainWebpack: (chain) => {
-        chain.module
-          .rule('i18n-resource')
-          .test(/\.(json5?|ya?ml)$/)
-          .include.add(path.resolve(__dirname, './src/i18n'))
-          .end()
-          .type('javascript/auto')
-          .use('i18n-resource')
-          .loader('@intlify/vue-i18n-loader');
-        chain.module
-          .rule('i18n')
-          .resourceQuery(/blockType=i18n/)
-          .type('javascript/auto')
-          .use('i18n')
-          .loader('@intlify/vue-i18n-loader');
-      },
+      vitePlugins: [
+        [
+          'vite-plugin-checker',
+          {
+            vueTsc: true,
+            eslint: {
+              lintCommand:
+                'eslint -c ./eslint.config.js "./src*/**/*.{ts,js,mjs,cjs,vue}"',
+              useFlatConfig: true,
+            },
+          },
+          { server: false },
+        ],
+      ],
     },
 
     // Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#devServer

diff --git a/services/frontend/www-app/src/layouts/MainLayout.vue b/services/frontend/www-app/src/layouts/MainLayout.vue
@@ -56,6 +56,7 @@ body.mobile {
 
 .top-card {
   border-bottom: solid #ccc 1px;
+  padding: 16px;
   @media screen and (max-width: 799px) {
     order: 1;
 
@@ -69,7 +70,6 @@ body.mobile {
     order: 1;
     width: var(--left-panel-width);
   }
-  padding: 16px;
 }
 
 .bottom-card {

diff --git a/services/frontend/www-app/src/models/OpeningHours.test.ts b/services/frontend/www-app/src/models/OpeningHours.test.ts
@@ -39,7 +39,7 @@ test('weeklyRanges', () => {
 
   for (const dayInterval of ranges) {
     expect(dayInterval.intervals.length).toBe(1);
-    const interval = dayInterval.intervals[0];
+    const interval = dayInterval.intervals[0]!;
     switch (dayInterval.day) {
       case 'Sun':
       case 'Mon':

diff --git a/services/frontend/www-app/src/models/Place.ts b/services/frontend/www-app/src/models/Place.ts
@@ -6,19 +6,17 @@ import OSMID from './OSMID';
 /// PlaceId can be either a LngLat or a gid (but not both).
 type GID = string;
 export class PlaceId {
-  public readonly location?: LngLat;
-  public readonly gid?: GID;
+  public readonly location?: LngLat | undefined;
+  public readonly gid?: GID | undefined;
 
   constructor(location?: LngLat, gid?: GID) {
-    if (location && gid) {
-      throw new Error('PlaceId cannot have both location and gid');
-    }
-    if (!location && !gid) {
+    if (location) {
+      this.location = location;
+    } else if (gid) {
+      this.gid = gid;
+    } else {
       throw new Error('PlaceId requires either location or gid');
     }
-
-    this.location = location;
-    this.gid = gid;
   }
 
   static location(location: LngLat): PlaceId {
@@ -49,7 +47,11 @@ export class PlaceId {
   public static deserialize(serialized: string): PlaceId {
     if (/([0-9.-]+,[0-9.-]+)/.test(serialized)) {
       const lngLat = serialized.split(',');
-      const location = new LngLat(parseFloat(lngLat[0]), parseFloat(lngLat[1]));
+      console.assert!(lngLat.length == 2, 'unexpected length', lngLat);
+      const location = new LngLat(
+        parseFloat(lngLat[0]!),
+        parseFloat(lngLat[1]!),
+      );
       return PlaceId.location(location);
     } else {
       return PlaceId.gid(serialized);
@@ -156,13 +158,13 @@ type PlaceProperties = {
 export default class Place {
   id: PlaceId;
   point: LngLat;
-  bbox?: LngLatBounds;
-  countryCode?: string;
-  public address?: string | null;
-  name?: string;
-  public phone?: string;
-  public website?: string;
-  public openingHours?: string;
+  bbox?: LngLatBounds | undefined;
+  countryCode?: string | undefined;
+  public address?: string | null | undefined;
+  name?: string | undefined;
+  public phone?: string | undefined;
+  public website?: string | undefined;
+  public openingHours?: string | undefined;
 
   constructor(
     id: PlaceId,
@@ -192,7 +194,7 @@ export default class Place {
     const [lng, lat] = geometry.coordinates;
     console.assert(lng, 'missing lng');
     console.assert(lat, 'missing lat');
-    const location = new LngLat(lng, lat);
+    const location = new LngLat(lng!, lat!);
 
     let bbox;
     if (feature.bbox?.length == 4) {

diff --git a/services/frontend/www-app/src/models/Route.ts b/services/frontend/www-app/src/models/Route.ts
@@ -31,7 +31,8 @@ export default class Route {
     mode: TravelMode,
     distanceUnits: DistanceUnits,
   ): Route {
-    const viaRoads = substantialRoadNames(route.legs[0].maneuvers, 3);
+    console.assert(route.legs.length > 0, 'missing legs');
+    const viaRoads = substantialRoadNames(route.legs[0]!.maneuvers, 3);
     return new Route({
       mode,
       valhallaRoute: route,
@@ -55,7 +56,8 @@ function substantialRoadNames(
     cumulativeRoadLength += length;
     if (maneuver.street_names) {
       const name = maneuver.street_names[0];
-      roadLengths.push({ name, length });
+      console.assert(name, 'missing street name');
+      roadLengths.push({ name: name!, length });
     }
   }
   roadLengths.sort((a, b) => b.length - a.length).slice(0, limit);
@@ -67,7 +69,8 @@ function substantialRoadNames(
   );
 
   if (substantialRoads.length == 0) {
-    substantialRoads = [roadLengths[0]];
+    console.assert(roadLengths.length > 0);
+    substantialRoads = [roadLengths[0]!];
   }
 
   return substantialRoads.map((r) => r.name);

diff --git a/services/frontend/www-app/src/models/Trip.ts b/services/frontend/www-app/src/models/Trip.ts
@@ -88,8 +88,8 @@ export class TripLeg {
   }
 
   get start(): LngLat {
-    const lngLat = this.geometry.coordinates[0];
-    return new LngLat(lngLat[0], lngLat[1]);
+    const lngLat = this.geometry.coordinates[0]!;
+    return new LngLat(lngLat[0]!, lngLat[1]!);
   }
 
   get mode(): TravelMode {

diff --git a/services/frontend/www-app/src/router/routes.ts b/services/frontend/www-app/src/router/routes.ts
@@ -72,17 +72,6 @@ const routes: RouteRecordRaw[] = [
       },
     ],
   },
-  // DEPRECATED ROUTE: will remove eventually
-  {
-    path: '/multimodal/:to/:from',
-    redirect: (route) => {
-      return {
-        path: `/directions/transit/${encodeURIComponent(
-          route.params.to.toString(),
-        )}/${encodeURIComponent(route.params.from.toString())}`,
-      };
-    },
-  },
 
   // Always leave this as last one,
   // but you can also remove it

diff --git a/services/frontend/www-app/src/ui/LocationControl.ts b/services/frontend/www-app/src/ui/LocationControl.ts
@@ -24,9 +24,9 @@ export default class LocationControl extends Evented implements IControl {
   currentRotation = 0;
   compassMarker: Marker;
 
-  mostRecentPosition?: LngLat;
+  mostRecentPosition?: LngLat | undefined;
   mostRecentCompassHeading?: number;
-  map?: Map;
+  map?: Map | undefined;
 
   constructor(options: GeolocateControlOptions) {
     super();

diff --git a/services/frontend/www-app/src/ui/ScaleControl.ts b/services/frontend/www-app/src/ui/ScaleControl.ts
@@ -16,7 +16,7 @@ const defaultOptions: ScaleOptions = {
 };
 
 export default class ScaleControl implements IControl {
-  _map?: Map;
+  _map?: Map | undefined;
   containerEl: HTMLElement;
   rulerEl: HTMLElement;
   textEl: HTMLElement;
@@ -119,7 +119,7 @@ export default class ScaleControl implements IControl {
     // When I try to measure somewhat acurately, I pan the area I want to measure
     // near to the ruler. So, I think the most reasonable thing is to make sure
     // that the ruler is to scale with the land directly beneath it.
-    const rulerBounds = this.rulerEl.getClientRects()[0];
+    const rulerBounds = this.rulerEl.getClientRects()[0]!;
     const y = rulerBounds.y;
     const left = map.unproject([0, y]);
     const right = map.unproject([maxWidth, y]);

diff --git a/services/frontend/www-app/src/utils/decodePolyline.test.ts b/services/frontend/www-app/src/utils/decodePolyline.test.ts
@@ -8,11 +8,11 @@ test('decode', () => {
   const result = decodePolyline(input, 6);
 
   expect(result.length).toBe(350);
-  const firstCoord = result[0];
-  expect(firstCoord[0]).toBeCloseTo(-122.339216);
-  expect(firstCoord[1]).toBeCloseTo(47.575836);
+  const firstCoord = result[0]!;
+  expect(firstCoord[0]!).toBeCloseTo(-122.339216);
+  expect(firstCoord[1]!).toBeCloseTo(47.575836);
 
-  const lastCoord = result[349];
-  expect(lastCoord[0]).toBeCloseTo(-122.347199);
-  expect(lastCoord[1]).toBeCloseTo(47.651048);
+  const lastCoord = result[349]!;
+  expect(lastCoord[0]!).toBeCloseTo(-122.347199);
+  expect(lastCoord[1]!).toBeCloseTo(47.651048);
 });
diff --git a/services/frontend/www-app/tsconfig.json b/services/frontend/www-app/tsconfig.json
@@ -1,5 +1,5 @@
 {
-  "extends": "@quasar/app-vite/tsconfig-preset",
+  "extends": "./.quasar/tsconfig.json",
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {