Merge branch 'main' into origin/m-progress-component

.eslintrc.js

@@ -0,0 +1,30 @@
+module.exports = {
+  'env': {
+    'es2021': true
+  },
+  'extends': [
+    'eslint:recommended',
+    'plugin:svelte/recommended',
+    'plugin:prettier/recommended'
+  ],
+  'parser': '@typescript-eslint/parser',
+  'parserOptions': {
+    'project': './tsconfig.json',
+    'extraFileExtensions': ['.svelte']
+  },
+  'overrides': [
+    {
+      'files': ['*.svelte'],
+      'parser': 'svelte-eslint-parser',
+      'parserOptions': {
+        'parser': '@typescript-eslint/parser'
+      }
+    }
+  ],
+  'rules': {
+    'no-undef': 'off',
+    "svelte/valid-compile": [
+      "warn",
+    ],
+  },
+}

.github/workflows/lint.yml

@@ -0,0 +1,19 @@
+name: Lint Code
+
+on:
+  push:
+  pull_request:
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: npm
+      - run: npm install
+      - run: npm run lint

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "plugins": [
+    "prettier-plugin-svelte"
+  ]
+}

app/App.svelte

@@ -5,6 +5,7 @@
 
   import { tabIndex } from "~/stores";
 </script>
+
 <rootLayout backgroundColor="black">
   <tabView androidTabsPosition="bottom" bind:selectedIndex={$tabIndex}>
     <tabViewItem title="Planung">

app/api/index.ts

@@ -1 +1 @@
-export * from './routes';
+export * from "./routes";

app/api/routes.ts

@@ -1,4 +1,4 @@
-import { Http } from '@nativescript/core';
+import { Http } from "@nativescript/core";
 
 type GetRouteOptions = {
   origin: string;
@@ -33,8 +33,8 @@ type TimeAndPlace = {
 };
 
 type RouteApiGetParams = {
-  origin: LatLng,
-  destination: LatLng,
+  origin: LatLng;
+  destination: LatLng;
   arrivalTime?: Date;
   departureTime?: Date;
   lang?: string;
@@ -47,7 +47,27 @@ type RouteApiGetParams = {
 };
 
 // @see https://developer.here.com/documentation/intermodal-routing/dev_guide/concepts/modes.html
-export type HereApiTransportMode = 'highSpeedTrain' | 'intercityTrain' | 'interRegionalTrain' | 'regionalTrain' | 'cityTrain' | 'bus' | 'ferry' | 'subway' | 'lightRail' | 'privateBus' | 'inclined' | 'aerial' | 'busRapid' | 'monorail' | 'flight' | 'walk' | 'car' | 'bicycle' | 'pedestrian' | string;
+export type HereApiTransportMode =
+  | "highSpeedTrain"
+  | "intercityTrain"
+  | "interRegionalTrain"
+  | "regionalTrain"
+  | "cityTrain"
+  | "bus"
+  | "ferry"
+  | "subway"
+  | "lightRail"
+  | "privateBus"
+  | "inclined"
+  | "aerial"
+  | "busRapid"
+  | "monorail"
+  | "flight"
+  | "walk"
+  | "car"
+  | "bicycle"
+  | "pedestrian"
+  | string;
 
 export type HereApiRoute = {
   id: string;
@@ -59,7 +79,7 @@ export type HereApiRoute = {
     summary?: {
       duration: number;
       length: number;
-    }
+    };
     actions?: Array<{
       action: string;
       duration: number;
@@ -85,11 +105,11 @@ export type HereApiRoute = {
       textColor?: string;
       headsign?: string;
       shortName?: string;
-    },
+    };
     intermediateStops?: Array<{
       departure: TimeAndPlace;
       duration?: number;
-    }>,
+    }>;
     agency?: {
       id: string;
       name: string;
@@ -101,7 +121,7 @@ export type HereApiRoute = {
     name: string;
     website: string;
   };
-}
+};
 
 export type RouteApiGetResponse = {
   routes: Array<HereApiRoute>;
@@ -111,10 +131,8 @@ export type RouteApiGetResponse = {
   }>;
 };
 
-
 export const routeApi = {
   get: async (params: RouteApiGetParams) => {
-
     const routeOptions: GetRouteOptions = {
       ...params,
       origin: `${params.origin.lat},${params.origin.lng}`,
@@ -123,32 +141,33 @@ export const routeApi = {
       departureTime: params.departureTime?.toISOString() ?? undefined,
     };
 
-    Object.keys(routeOptions).forEach(key => {
+    Object.keys(routeOptions).forEach((key) => {
       if (routeOptions[key as keyof typeof routeOptions] === undefined) {
         delete routeOptions[key as keyof typeof routeOptions];
       }
     });
 
     const response = await Http.request({
-      url: process.env.BACKEND_SERVICE_ROUTE_URL ?? '',
-      method: 'POST',
+      url: process.env.BACKEND_SERVICE_ROUTE_URL ?? "",
+      method: "POST",
       headers: {
-        'Content-Type': 'application/json',
-        'return': 'actions,intermediate',
-        'lang': 'de-de',
-        ...routeOptions
+        "Content-Type": "application/json",
+        return: "actions,intermediate",
+        lang: "de-de",
+        ...routeOptions,
       },
     });
 
-    console.log('response', response);
+    console.log("response", response);
 
     if (response.statusCode !== 200 || !response.content) {
-      throw new Error(response.content?.toString())
+      throw new Error(response.content?.toString());
     }
 
-    const responseJson = JSON.parse(response.content.toString()) as RouteApiGetResponse;
+    const responseJson = JSON.parse(
+      response.content.toString(),
+    ) as RouteApiGetResponse;
 
     return responseJson.routes;
-  }
-}
-
+  },
+};

app/app.ts

@@ -4,8 +4,8 @@ You can use this file to perform app-level initialization, but the primary
 purpose of the file is to pass control to the app’s first page.
 */
 
-import { svelteNativeNoFrame } from 'svelte-native'
+import { svelteNativeNoFrame } from "svelte-native";
 
-import App from './App.svelte'
+import App from "./App.svelte";
 
-svelteNativeNoFrame(App, {})
+svelteNativeNoFrame(App, {});

app/shared/components/Accordion.svelte

@@ -8,19 +8,24 @@
 </script>
 
 <stackLayout class="wrapper {customClass}">
-  <gridLayout columns="*,auto" rows="auto" on:tap="{toggle}">
+  <gridLayout columns="*,auto" rows="auto" on:tap={toggle}>
     <slot name="header" />
-    <button text={open ? 'expand_less' : 'expand_more'} class="icon fs-m" row={0} col={1} on:tap="{toggle}" />
+    <button
+      text={open ? "expand_less" : "expand_more"}
+      class="icon fs-m"
+      row={0}
+      col={1}
+      on:tap={toggle}
+    />
   </gridLayout>
 
   {#if open}
-  <stackLayout class="content">
-    <slot name="content">
-      <label text="No content" />
-    </slot>
-  </stackLayout>
+    <stackLayout class="content">
+      <slot name="content">
+        <label text="No content" />
+      </slot>
+    </stackLayout>
   {/if}
-
 </stackLayout>
 
 <style>
@@ -31,12 +36,11 @@
   }
 
   .content {
-    margin-top: var(--xs)
+    margin-top: var(--xs);
   }
 
   button {
     padding: var(--s);
     margin: calc(var(--s) * -1);
   }
 </style>
-

app/shared/components/Button.svelte

@@ -16,13 +16,24 @@
   export { cssClass as class };
 </script>
 
-<gridLayout columns="auto,*,auto" rows="auto" class="button {type} {icon ? "icon-" + iconPosition : ""} {text ? '' : 'just-icon'} {cssClass}" on:tap {row} {column} {rowSpan} {columnSpan}>
+<gridLayout
+  columns="auto,*,auto"
+  rows="auto"
+  class="button {type} {icon ? 'icon-' + iconPosition : ''} {text
+    ? ''
+    : 'just-icon'} {cssClass}"
+  on:tap
+  {row}
+  {column}
+  {rowSpan}
+  {columnSpan}
+>
   {#if icon && iconPosition === "pre"}
     <label class="icon" text={icon} verticalAlignment="middle" column={0} />
   {/if}
 
   {#if text}
-    <label class="text" text={text} verticalAlignment="middle" column={1} />
+    <label class="text" {text} verticalAlignment="middle" column={1} />
   {/if}
 
   {#if icon && iconPosition === "post"}

app/shared/components/DepartureDestinationSwitcher.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { sizes} from "~/shared/sizes";
+  import { sizes } from "~/shared/sizes";
   import Input from "./Input.svelte";
   import { createEventDispatcher } from "svelte";
 
@@ -12,14 +12,39 @@
   const dispatch = createEventDispatcher();
 </script>
 
-<gridLayout columns="auto, *, auto" rows="auto, {sizes.s}, auto" row={row} col={col}>
+<gridLayout columns="auto, *, auto" rows="auto, {sizes.s}, auto" {row} {col}>
   <label text="von" row={0} col={0} class="fs-xs m-r-xxs" />
   <label text="nach" row={2} col={0} class="fs-xs m-r-xxs" />
 
-  <Input text={departure} hint="Abfahrt" row={0} col={1} on:tap={() => {dispatch('tapDeparture')}} />
-  <Input text={destination} hint="Ziel" row={2} col={1} on:tap={() => {dispatch('tapDestination')}} />
+  <Input
+    text={departure}
+    hint="Abfahrt"
+    row={0}
+    col={1}
+    on:tap={() => {
+      dispatch("tapDeparture");
+    }}
+  />
+  <Input
+    text={destination}
+    hint="Ziel"
+    row={2}
+    col={1}
+    on:tap={() => {
+      dispatch("tapDestination");
+    }}
+  />
 
-  <button text="swap_vert" class="icon fs-l" row={0} col={2} rowSpan={3} on:tap={() => {dispatch('switchValues')}} />
+  <button
+    text="swap_vert"
+    class="icon fs-l"
+    row={0}
+    col={2}
+    rowSpan={3}
+    on:tap={() => {
+      dispatch("switchValues");
+    }}
+  />
 </gridLayout>
 
 <style>