feat: data filter chips

.changeset/fair-monkeys-tickle.md

@@ -0,0 +1,9 @@
+---
+"@openstapps/node-builder": patch
+"@openstapps/database": patch
+"@openstapps/node-base": patch
+"@openstapps/backend": patch
+"@openstapps/app": patch
+---
+
+pin alpine version to 3.18 and add healthchecks

.changeset/good-eggs-add.md

@@ -0,0 +1,5 @@
+---
+"@openstapps/prettier-config": patch
+---
+
+Update Prettier to 3.1.1

.changeset/nine-bears-speak.md

@@ -0,0 +1,6 @@
+---
+"@openstapps/backend": minor
+"@openstapps/core": minor
+---
+
+Add the ability to filter by existence of a field

.changeset/old-bottles-hide.md

@@ -0,0 +1,5 @@
+---
+"@openstapps/backend": patch
+---
+
+Backend unit tests break every year

.gitlab-ci.yml

@@ -30,11 +30,13 @@ variables:
     description: Bypass turbo cache
 
 default:
-  image: registry.gitlab.com/openstapps/openstapps/node-builder:node-22
+  image: registry.gitlab.com/openstapps/openstapps/node-builder
   tags:
     - saas-linux-xlarge-amd64
   interruptible: true
   before_script:
+    - corepack enable
+    - corepack prepare pnpm@latest-8 --activate
     - echo TURBO_API=$TURBO_API >> .env.local
     - echo TURBO_TOKEN=$TURBO_TOKEN >> .env.local
     - echo TURBO_TEAM=$TURBO_TEAM >> .env.local
@@ -99,7 +101,7 @@ stop review:
   rules: *deploy-rules
 
 unit:
-  image: registry.gitlab.com/openstapps/openstapps/app-builder:node-22
+  image: registry.gitlab.com/openstapps/openstapps/app-builder
   stage: test
   needs: ['build']
   script:

.syncpackrc.cjs

@@ -2,13 +2,7 @@
 
 /** @type {import('syncpack').RcFile} */
 const config = {
-  semverGroups: [
-    {
-      range: '',
-      dependencies: ['**'],
-      packages: ['**'],
-    }
-  ],
+  semverGroups: [{range: ''}],
   source: ['package.json', '**/package.json'],
   indent: '  ',
   sortFirst: [
@@ -27,7 +21,6 @@ const config = {
     'bin',
     'files',
     'engines',
-    'packageManager',
     'scripts',
     'dependencies',
     'devDependencies',

.tool-versions

@@ -1,3 +1,3 @@
-nodejs 22.2.0
-pnpm 8.15.5
-python 3.11.5
+nodejs 18.19.1
+pnpm 8.15.4
+python 3.11.5

backend/backend/.gitlab-ci.yml

@@ -1,5 +1,5 @@
 integration:
-  image: registry.gitlab.com/openstapps/openstapps/node-builder:node-22
+  image: registry.gitlab.com/openstapps/openstapps/node-builder
   stage: test
   needs: ['build']
   variables:

backend/backend/CHANGELOG.md

@@ -1,20 +1,5 @@
 # @openstapps/backend
 
-## 3.2.0
-
-### Minor Changes
-
-- 912ae422: Add the ability to filter by existence of a field
-
-### Patch Changes
-
-- 689ac68b: pin alpine version to 3.18 and add healthchecks
-- e8d72683: Backend unit tests break every year
-- Updated dependencies [912ae422]
-  - @openstapps/core@4.0.0
-  - @openstapps/core-tools@3.0.0
-  - @openstapps/logger@3.0.0
-
 ## 3.1.2
 
 ### Patch Changes

backend/backend/config/f-u/version-history/2.5.0.de.md

@@ -1,15 +0,0 @@
-# Goethe-Uni App 2.5
-
-Die Goethe-Uni App ist noch besser geworden!
-
-## Komplett neue Kartenansicht
-
-Wir haben die Karte überarbeitet, um eine klarere und schnellere Übersicht zu bieten.
-
-## Deutschlandticket mit an Bord
-
-Wenn du das Upgrade des Semesterticket zum Deutschlandticket gemacht hast und eingeloggt bist, findet es sich jetzt auch in der App.
-
-## Bibliotheksdienste sind wieder voll funktionsfähig
-
-Aufgrund einiger Adhoc-Änderungen im Bibliothekssystem haben wir die App so angepasst, dass sie damit umgehen kann.

backend/backend/config/f-u/version-history/2.5.0.en.md

@@ -1,15 +0,0 @@
-# Goethe-Uni App 2.5
-
-The Goethe-Uni App got even better!
-
-## Completelty new map view
-
-We overhauled the map to offer you a clearer and faster and overview.
-
-## Deutschlandticket included
-
-If you upgraded your Semesterticket to a Deutschlandticket it will now reside in the App if you are logged in.
-
-## Library services are fully functional again
-
-Due to some adhoc changes in the library system we adjusted the app to handle them properly.

backend/backend/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openstapps/backend",
   "description": "A reference implementation for a StApps backend",
-  "version": "3.2.0",
+  "version": "3.1.2",
   "private": true,
   "type": "module",
   "license": "AGPL-3.0-only",

backend/backend/src/storage/database.ts

@@ -13,34 +13,15 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
-import {
-  SCConfigFile,
-  SCPlace,
-  SCPlaceWithoutReferences,
-  SCSearchQuery,
-  SCSearchResponse,
-  SCThingWithCategoriesWithoutReferences,
-  SCThings,
-  SCUuid,
-} from '@openstapps/core';
+import {SCConfigFile, SCSearchQuery, SCSearchResponse, SCThings, SCUuid} from '@openstapps/core';
 import {MailQueue} from '../notification/mail-queue.js';
 import {Bulk} from './bulk-storage.js';
-import {FeatureCollection, Point, Polygon} from 'geojson';
 
 /**
  * Creates an instance of a database
  */
 export type DatabaseConstructor = new (config: SCConfigFile, mailQueue?: MailQueue) => Database;
 
-export type SupplementaryGeoJSON = FeatureCollection<Point | Polygon, SupplementaryGeoJSONThing>;
-export type SupplementaryGeoJSONThing = Pick<
-  Extract<SCThings, SCPlace>,
-  Exclude<
-    keyof SCPlaceWithoutReferences | keyof SCThingWithCategoriesWithoutReferences<never, never>,
-    'geo' | 'origin' | 'translations'
-  >
->;
-
 /**
  * Defines what one database class needs to have defined
  */
@@ -101,9 +82,4 @@ export interface Database {
    * @param params Parameters which form a search query to search the backend data
    */
   search(parameters: SCSearchQuery): Promise<SCSearchResponse>;
-
-  /**
-   * Get geo info for display on a map
-   */
-  geo(): Promise<SupplementaryGeoJSON>;
 }

backend/backend/src/storage/elasticsearch/elasticsearch.ts

@@ -26,7 +26,7 @@ import {Logger} from '@openstapps/logger';
 import moment from 'moment';
 import {MailQueue} from '../../notification/mail-queue.js';
 import {Bulk} from '../bulk-storage.js';
-import {Database, SupplementaryGeoJSON, SupplementaryGeoJSONThing} from '../database.js';
+import {Database} from '../database.js';
 import {parseAggregations} from './aggregations.js';
 import * as Monitoring from './monitoring.js';
 import {buildQuery} from './query/query.js';
@@ -46,7 +46,6 @@ import {
 } from './util/index.js';
 import {noUndefined} from './util/no-undefined.js';
 import {retryCatch, RetryOptions} from './util/retry.js';
-import {Feature, Point, Polygon} from 'geojson';
 
 /**
  * A database interface for elasticsearch
@@ -406,49 +405,4 @@ export class Elasticsearch implements Database {
       },
     };
   }
-
-  async geo(): Promise<SupplementaryGeoJSON> {
-    const searchResponse = await this.client.search<Extract<SCThings, {geo: unknown}>>({
-      body: {
-        query: {
-          exists: {
-            field: 'geo',
-          },
-        },
-      },
-      from: 0,
-      allow_no_indices: true,
-      index: ACTIVE_INDICES_ALIAS,
-      size: 1,
-    });
-
-    return {
-      type: 'FeatureCollection',
-      features: searchResponse.hits.hits
-        .map(thing => {
-          return thing._source?.geo
-            ? ({
-                id: Number(thing._source.identifiers?.['OSM']) || undefined,
-                type: 'Feature',
-                geometry: thing._source.geo.polygon ?? thing._source.geo.point,
-                properties: {
-                  name: thing._source.name,
-                  sameAs: thing._source.sameAs,
-                  image: thing._source.image,
-                  alternateNames: thing._source.alternateNames,
-                  description: thing._source.description,
-                  identifiers: thing._source.identifiers,
-                  categories: thing._source.categories,
-                  categorySpecificValues: thing._source.categorySpecificValues,
-                  openingHours: thing._source.openingHours,
-                  address: thing._source.address,
-                  uid: thing._source.uid,
-                  type: thing._source.type,
-                },
-              } satisfies Feature<Polygon | Point, SupplementaryGeoJSONThing>)
-            : undefined;
-        })
-        .filter(noUndefined),
-    };
-  }
 }

backend/backend/src/storage/elasticsearch/query/filters/geo.ts

@@ -19,29 +19,14 @@ import {QueryDslSpecificQueryContainer} from '../../types/util.js';
  * Converts a geo filter to elasticsearch syntax
  * @param filter A search filter for the retrieval of the data
  */
-export function buildGeoFilter(filter: SCGeoFilter): QueryDslSpecificQueryContainer<'bool'> {
+export function buildGeoFilter(filter: SCGeoFilter): QueryDslSpecificQueryContainer<'geo_shape'> {
   return {
-    bool: {
-      should: [
-        {
-          geo_shape: {
-            ignore_unmapped: true,
-            [`${filter.arguments.field}.polygon`]: {
-              shape: filter.arguments.shape,
-              relation: filter.arguments.spatialRelation,
-            },
-          },
-        } satisfies QueryDslSpecificQueryContainer<'geo_shape'>,
-        {
-          geo_shape: {
-            ignore_unmapped: true,
-            [`${filter.arguments.field}.point`]: {
-              shape: filter.arguments.shape,
-              relation: filter.arguments.spatialRelation,
-            },
-          },
-        } satisfies QueryDslSpecificQueryContainer<'geo_shape'>,
-      ],
+    geo_shape: {
+      ignore_unmapped: true,
+      [`${filter.arguments.field}.polygon`]: {
+        shape: filter.arguments.shape,
+        relation: filter.arguments.spatialRelation,
+      },
     },
   };
 }

backend/backend/test/common.ts

@@ -22,7 +22,7 @@ import http from 'http';
 import {MailQueue} from '../src/notification/mail-queue.js';
 import {Bulk, BulkStorage} from '../src/storage/bulk-storage.js';
 import getPort from 'get-port';
-import {Database, SupplementaryGeoJSON} from '../src/storage/database.js';
+import {Database} from '../src/storage/database.js';
 import {v4} from 'uuid';
 import {backendConfig} from '../src/config.js';
 import {getIndexUID} from '../src/storage/elasticsearch/util/index.js';
@@ -58,6 +58,7 @@ export async function startApp(): Promise<Express> {
  * An elasticsearch mock
  */
 export class ElasticsearchMock implements Database {
+  // @ts-expect-error never read
   private bulk: Bulk | undefined;
 
   private storageMock = new Map<string, SCThings>();
@@ -66,10 +67,6 @@ export class ElasticsearchMock implements Database {
     // Nothing to do here
   }
 
-  geo(): Promise<SupplementaryGeoJSON> {
-    throw new Error('Method not implemented.');
-  }
-
   bulkCreated(bulk: Bulk): Promise<void> {
     this.bulk = bulk;
     return Promise.resolve(undefined);

backend/backend/test/routes/search-route.spec.ts

@@ -44,6 +44,7 @@ describe('Search route', async function () {
   });
 
   it('should reject GET, PUT with a valid search query', async function () {
+    // const expectedParams = JSON.parse(JSON.stringify(defaultParams));
     const {status} = await testApp.get('/search').set('Accept', 'application/json').send({
       query: 'Some search terms',
     });

backend/backend/test/storage/elasticsearch/query.spec.ts

@@ -479,39 +479,18 @@ describe('Query', function () {
     it('should build geo filter for shapes and points', function () {
       const filter = buildFilter(searchFilters.geoPoint);
       const expectedFilter = {
-        bool: {
-          should: [
-            {
-              geo_shape: {
-                'geo.polygon': {
-                  relation: undefined,
-                  shape: {
-                    coordinates: [
-                      [50.123, 8.123],
-                      [50.123, 8.123],
-                    ],
-                    type: 'envelope',
-                  },
-                },
-                'ignore_unmapped': true,
-              },
+        geo_shape: {
+          'geo.polygon': {
+            relation: undefined,
+            shape: {
+              type: 'envelope',
+              coordinates: [
+                [50.123, 8.123],
+                [50.123, 8.123],
+              ],
             },
-            {
-              geo_shape: {
-                'geo.point': {
-                  relation: undefined,
-                  shape: {
-                    coordinates: [
-                      [50.123, 8.123],
-                      [50.123, 8.123],
-                    ],
-                    type: 'envelope',
-                  },
-                },
-                'ignore_unmapped': true,
-              },
-            },
-          ],
+          },
+          'ignore_unmapped': true,
         },
       };
 
@@ -521,39 +500,18 @@ describe('Query', function () {
     it('should build geo filter for shapes only', function () {
       const filter = buildFilter(searchFilters.geoShape);
       const expectedFilter = {
-        bool: {
-          should: [
-            {
-              geo_shape: {
-                'geo.polygon': {
-                  relation: 'contains',
-                  shape: {
-                    coordinates: [
-                      [50.123, 8.123],
-                      [50.123, 8.123],
-                    ],
-                    type: 'envelope',
-                  },
-                },
-                'ignore_unmapped': true,
-              },
+        geo_shape: {
+          'geo.polygon': {
+            relation: 'contains',
+            shape: {
+              type: 'envelope',
+              coordinates: [
+                [50.123, 8.123],
+                [50.123, 8.123],
+              ],
             },
-            {
-              geo_shape: {
-                'geo.point': {
-                  relation: 'contains',
-                  shape: {
-                    coordinates: [
-                      [50.123, 8.123],
-                      [50.123, 8.123],
-                    ],
-                    type: 'envelope',
-                  },
-                },
-                'ignore_unmapped': true,
-              },
-            },
-          ],
+          },
+          'ignore_unmapped': true,
         },
       };
 

backend/database/CHANGELOG.md

@@ -1,11 +1,5 @@
 # @openstapps/database
 
-## 3.2.0
-
-### Patch Changes
-
-- 689ac68b: pin alpine version to 3.18 and add healthchecks
-
 ## 3.0.0
 
 ### Patch Changes

backend/database/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstapps/database",
-  "version": "3.2.0",
+  "version": "3.0.0",
   "private": true,
   "files": [
     "config",

configuration/prettier-config/CHANGELOG.md

@@ -1,11 +1,5 @@
 # @openstapps/prettier-config
 
-## 3.2.0
-
-### Patch Changes
-
-- dbb55850: Update Prettier to 3.1.1
-
 ## 3.0.0
 
 ### Major Changes
@@ -36,7 +30,7 @@
 
   ```js
   #!/usr/bin/env node
-  import "./lib/app.js";
+  import './lib/app.js';
   ```
 
 - 64caebaf: Migrate to ESM
@@ -75,14 +69,11 @@
 - 64caebaf: Migrated changelogs to changeset format
 
   ```js
-  import fs from "fs";
+  import fs from 'fs';
 
-  const path = "packages/logger/CHANGELOG.md";
+  const path = 'packages/logger/CHANGELOG.md';
 
-  fs.writeFileSync(
-    path,
-    fs.readFileSync(path, "utf8").replace(/^#+\s+\[/gm, "## ["),
-  );
+  fs.writeFileSync(path, fs.readFileSync(path, 'utf8').replace(/^#+\s+\[/gm, '## ['));
   ```
 
 - 98546a97: Migrate away from @openstapps/configuration
@@ -124,7 +115,7 @@
 
   ```js
   #!/usr/bin/env node
-  import "./lib/app.js";
+  import './lib/app.js';
   ```
 
 - 64caebaf: Migrate to ESM
@@ -163,14 +154,11 @@
 - 64caebaf: Migrated changelogs to changeset format
 
   ```js
-  import fs from "fs";
+  import fs from 'fs';
 
-  const path = "packages/logger/CHANGELOG.md";
+  const path = 'packages/logger/CHANGELOG.md';
 
-  fs.writeFileSync(
-    path,
-    fs.readFileSync(path, "utf8").replace(/^#+\s+\[/gm, "## ["),
-  );
+  fs.writeFileSync(path, fs.readFileSync(path, 'utf8').replace(/^#+\s+\[/gm, '## ['));
   ```
 
 - 98546a97: Migrate away from @openstapps/configuration

configuration/prettier-config/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openstapps/prettier-config",
   "description": "StApps Prettier Config",
-  "version": "3.2.0",
+  "version": "3.0.0",
   "type": "module",
   "license": "GPL-3.0-only",
   "repository": "git@gitlab.com:openstapps/prettier-config.git",

configuration/tsconfig/tsconfig.json

@@ -19,21 +19,15 @@
     "allowSyntheticDefaultImports": true,
     "noImplicitAny": true,
     "noImplicitReturns": true,
-    "noUnusedLocals": false,
-    "noUnusedParameters": false,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
     "outDir": "../../../lib/",
-    "lib": [
-      "ES2022",
-      "DOM"
-    ],
+    "lib": ["ES2022", "DOM"],
     "strict": true,
     "target": "ES2022"
   },
   "ts-node": {
     "transpileOnly": true
   },
-  "exclude": [
-    "../../../app.js",
-    "../../../lib/"
-  ]
+  "exclude": ["../../../app.js", "../../../lib/"]
 }

coverage.mjs

@@ -9,7 +9,7 @@ const args = files.map(it => `${it.split('/', 2)[1]}='${it}'`);
 
 console.log(
   'Collecting coverage...',
-  await promisify(exec)(`merge-cobertura -o ./coverage.xml ${args.join(' ')}`),
+  await promisify(exec)(`cobertura-merge -o ./coverage.xml ${args.join(' ')}`),
 );
 
 const reportFiles = await glob('./*/*/coverage/report-junit.xml');

examples/minimal-connector/CHANGELOG.md

@@ -1,14 +1,5 @@
 # @openstapps/minimal-connector
 
-## 3.2.0
-
-### Patch Changes
-
-- Updated dependencies [912ae422]
-  - @openstapps/core@4.0.0
-  - @openstapps/api@4.0.0
-  - @openstapps/logger@3.0.0
-
 ## 3.1.1
 
 ### Patch Changes

examples/minimal-connector/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openstapps/minimal-connector",
   "description": "This is a minimal connector which serves as an example",
-  "version": "3.2.0",
+  "version": "3.1.1",
   "private": true,
   "type": "module",
   "license": "GPL-3.0-only",

examples/minimal-plugin/CHANGELOG.md

@@ -1,16 +1,5 @@
 # @openstapps/minimal-plugin
 
-## 3.2.0
-
-### Patch Changes
-
-- Updated dependencies [912ae422]
-  - @openstapps/core@4.0.0
-  - @openstapps/api@4.0.0
-  - @openstapps/api-plugin@4.0.0
-  - @openstapps/core-tools@3.0.0
-  - @openstapps/logger@3.0.0
-
 ## 3.1.1
 
 ### Patch Changes

examples/minimal-plugin/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openstapps/minimal-plugin",
   "description": "Minimal Plugin",
-  "version": "3.2.0",
+  "version": "3.1.1",
   "private": true,
   "type": "module",
   "license": "GPL-3.0-only",

flake.lock

@@ -5,11 +5,11 @@
         "systems": "systems"
       },
       "locked": {
-        "lastModified": 1710146030,
-        "narHash": "sha256-SZ5L6eA7HJ/nmkzGG7/ISclqe6oZdOZTNoesiInkXPQ=",
+        "lastModified": 1701680307,
+        "narHash": "sha256-kAuep2h5ajznlPMD9rnQyffWG8EM/C73lejGofXvdM8=",
         "owner": "numtide",
         "repo": "flake-utils",
-        "rev": "b1d9ab70662946ef0850d488da1c9019f3a9752a",
+        "rev": "4022d587cbbfd70fe950c1e2083a02621806a725",
         "type": "github"
       },
       "original": {
@@ -20,11 +20,11 @@
     },
     "nixpkgs": {
       "locked": {
-        "lastModified": 1717112898,
-        "narHash": "sha256-7R2ZvOnvd9h8fDd65p0JnB7wXfUvreox3xFdYWd1BnY=",
+        "lastModified": 1701626906,
+        "narHash": "sha256-ugr1QyzzwNk505ICE4VMQzonHQ9QS5W33xF2FXzFQ00=",
         "owner": "NixOS",
         "repo": "nixpkgs",
-        "rev": "6132b0f6e344ce2fe34fc051b72fb46e34f668e0",
+        "rev": "0c6d8c783336a59f4c59d4a6daed6ab269c4b361",
         "type": "github"
       },
       "original": {

flake.nix

@@ -4,86 +4,72 @@
     nixpkgs.url = "github:NixOS/nixpkgs/nixpkgs-unstable";
     flake-utils.url = "github:numtide/flake-utils";
   };
-  outputs =
-    {
-      self,
-      nixpkgs,
-      flake-utils,
-    }:
-    let
-      aapt2buildToolsVersion = "34.0.0";
-    in
-    flake-utils.lib.eachDefaultSystem (
-      system:
-      let
-        pkgs = import nixpkgs {
-          inherit system;
-          overlays = [
-            (final: prev: {
-              fontMin = prev.python311.withPackages (
-                ps:
-                with ps;
-                [
-                  brotli
-                  fonttools
-                ]
-                ++ (with fonttools.optional-dependencies; [ woff ])
-              );
-              android = prev.androidenv.composeAndroidPackages {
-                buildToolsVersions = prev.lib.lists.unique [
-                  "34.0.0"
-                  aapt2buildToolsVersion
-                ];
-                platformVersions = [ "34" ];
+  outputs = {
+    self,
+    nixpkgs,
+    flake-utils,
+  }: let
+    aapt2buildToolsVersion = "33.0.2";
+  in
+    flake-utils.lib.eachDefaultSystem (system: let
+      pkgs = import nixpkgs {
+        inherit system;
+        overlays = [
+          (final: prev: rec {
+            fontMin = prev.python311.withPackages (ps: with ps; [brotli fonttools] ++ (with fonttools.optional-dependencies; [woff]));
+            android = prev.androidenv.composeAndroidPackages {
+              buildToolsVersions = ["30.0.3" aapt2buildToolsVersion];
+              platformVersions = ["33"];
+            };
+            cypress = prev.cypress.overrideAttrs (cyPrev: rec {
+              version = "13.2.0";
+              src = prev.fetchzip {
+                url = "https://cdn.cypress.io/desktop/${version}/linux-x64/cypress.zip";
+                hash = "sha256-9o0nprGcJhudS1LNm+T7Vf0Dwd1RBauYKI+w1FBQ3ZM=";
               };
-              cypress = prev.cypress.overrideAttrs (cyPrev: rec {
-                version = "13.10.0";
-                src = prev.fetchzip {
-                  url = "https://cdn.cypress.io/desktop/${version}/linux-x64/cypress.zip";
-                  hash = "sha256-wKNXo2lWndsQaouOiul0rsOWah+RRQ6fljzdeC8/KW4=";
-                };
-              });
-              nodejs = prev.nodejs_22;
-            })
-          ];
-          config = {
-            allowUnfree = true;
-            android_sdk.accept_license = true;
-          };
+            });
+          })
+        ];
+        config = {
+          allowUnfree = true;
+          android_sdk.accept_license = true;
         };
-        androidFhs = pkgs.buildFHSUserEnv {
-          name = "android-env";
-          runScript = "bash";
-          profile = ''
-            export ALLOW_NINJA_ENV=true
-            export USE_CCACHE=1
-            export LD_LIBRARY_PATH=/usr/lib:/usr/lib32
-          '';
-        };
-      in
-      {
-        devShell = pkgs.mkShell rec {
-          nativeBuildInputs = [ androidFhs ];
-          buildInputs = with pkgs; [
-            nodejs
-            nodePackages.pnpm
-            # tools
-            curl
-            jq
-            fontMin
-            cypress
-            # android
-            jdk17
-            android.androidsdk
-          ];
-          ANDROID_JAVA_HOME = "${pkgs.jdk.home}";
-          ANDROID_SDK_ROOT = "${pkgs.android.androidsdk}/libexec/android-sdk";
-          GRADLE_OPTS = "-Dorg.gradle.project.android.aapt2FromMavenOverride=${ANDROID_SDK_ROOT}/build-tools/${aapt2buildToolsVersion}/aapt2";
-          CYPRESS_INSTALL_BINARY = "0";
-          CYPRESS_RUN_BINARY = "${pkgs.cypress}/bin/Cypress";
-          # https://github.com/nodejs/node/issues/48444#issuecomment-1591882694
-          UV_USE_IO_URING = "0";
-        };
-      }
-    );
+      };
+      androidFhs = pkgs.buildFHSUserEnv {
+        name = "android-env";
+        targetPkgs = pkgs: with pkgs; [];
+        runScript = "bash";
+        profile = ''
+          export ALLOW_NINJA_ENV=true
+          export USE_CCACHE=1
+          export LD_LIBRARY_PATH=/usr/lib:/usr/lib32
+        '';
+      };
+    in {
+      devShell = pkgs.mkShell rec {
+        nativeBuildInputs = [androidFhs];
+        buildInputs = with pkgs; [
+          nodejs-18_x
+          nodePackages.pnpm
+          # tools
+          curl
+          jq
+          fontMin
+          # browsers
+          firefox
+          google-chrome
+          epiphany # Safari-ish browser
+          cypress
+          # android
+          jdk17
+          android.androidsdk
+          musl
+        ];
+        ANDROID_JAVA_HOME = "${pkgs.jdk.home}";
+        ANDROID_SDK_ROOT = "${pkgs.android.androidsdk}/libexec/android-sdk";
+        GRADLE_OPTS = "-Dorg.gradle.project.android.aapt2FromMavenOverride=${ANDROID_SDK_ROOT}/build-tools/${aapt2buildToolsVersion}/aapt2";
+        CYPRESS_INSTALL_BINARY = "0";
+        CYPRESS_RUN_BINARY = "${pkgs.cypress}/bin/Cypress";
+      };
+    });
 }

frontend/app/.gitlab-ci.yml

@@ -1,5 +1,5 @@
 e2e:
-  image: registry.gitlab.com/openstapps/openstapps/app-cypress:node-22
+  image: registry.gitlab.com/openstapps/openstapps/app-cypress:node-18
   stage: test
   script:
     - pnpm --filter=@openstapps/app install

frontend/app/CHANGELOG.md

@@ -1,15 +1,5 @@
 # @openstapps/app
 
-## 3.2.0
-
-### Patch Changes
-
-- 689ac68b: pin alpine version to 3.18 and add healthchecks
-- Updated dependencies [912ae422]
-  - @openstapps/core@4.0.0
-  - @openstapps/api@4.0.0
-  - @openstapps/collection-utils@3.0.0
-
 ## 3.1.2
 
 ### Patch Changes

frontend/app/ICONS.md

@@ -50,11 +50,11 @@ the config file.
 Icon font minification is done automatically, but requires you to
 follow a few simple rules:
 
-1. Use the type-safe proxy for referencing icon names in
+1. Use the tagged template literal for referencing icon names in
    TypeScript files and code
 
 ```ts
-SCIcon.icon_name;
+SCIcon`icon_name`;
 ```
 
 2. When using `ion-icon` in HTML, reference either icons that went through

frontend/app/android/app/build.gradle

@@ -2,7 +2,7 @@ apply plugin: 'com.android.application'
 
 android {
     namespace "de.anyschool.app"
-    compileSdk rootProject.ext.compileSdkVersion
+    compileSdkVersion rootProject.ext.compileSdkVersion
     defaultConfig {
         applicationId "de.anyschool.app"
         minSdkVersion rootProject.ext.minSdkVersion

frontend/app/android/build.gradle

@@ -7,8 +7,8 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:8.2.1'
-        classpath 'com.google.gms:google-services:4.4.0'
+        classpath 'com.android.tools.build:gradle:8.0.0'
+        classpath 'com.google.gms:google-services:4.3.15'
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

frontend/app/android/capacitor.settings.gradle

@@ -1,51 +1,51 @@
 // DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
 include ':capacitor-android'
-project(':capacitor-android').projectDir = new File('../../../node_modules/.pnpm/@capacitor+android@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/android/capacitor')
+project(':capacitor-android').projectDir = new File('../../../node_modules/.pnpm/@capacitor+android@5.5.0_@capacitor+core@5.5.0/node_modules/@capacitor/android/capacitor')
 
 include ':capacitor-app'
-project(':capacitor-app').projectDir = new File('../../../node_modules/.pnpm/@capacitor+app@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/app/android')
+project(':capacitor-app').projectDir = new File('../../../node_modules/.pnpm/@capacitor+app@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/app/android')
 
 include ':capacitor-browser'
-project(':capacitor-browser').projectDir = new File('../../../node_modules/.pnpm/@capacitor+browser@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/browser/android')
+project(':capacitor-browser').projectDir = new File('../../../node_modules/.pnpm/@capacitor+browser@5.1.0_@capacitor+core@5.5.0/node_modules/@capacitor/browser/android')
 
 include ':capacitor-clipboard'
-project(':capacitor-clipboard').projectDir = new File('../../../node_modules/.pnpm/@capacitor+clipboard@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/clipboard/android')
+project(':capacitor-clipboard').projectDir = new File('../../../node_modules/.pnpm/@capacitor+clipboard@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/clipboard/android')
 
 include ':capacitor-device'
-project(':capacitor-device').projectDir = new File('../../../node_modules/.pnpm/@capacitor+device@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/device/android')
+project(':capacitor-device').projectDir = new File('../../../node_modules/.pnpm/@capacitor+device@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/device/android')
 
 include ':capacitor-dialog'
-project(':capacitor-dialog').projectDir = new File('../../../node_modules/.pnpm/@capacitor+dialog@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/dialog/android')
+project(':capacitor-dialog').projectDir = new File('../../../node_modules/.pnpm/@capacitor+dialog@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/dialog/android')
 
 include ':capacitor-filesystem'
-project(':capacitor-filesystem').projectDir = new File('../../../node_modules/.pnpm/@capacitor+filesystem@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/filesystem/android')
+project(':capacitor-filesystem').projectDir = new File('../../../node_modules/.pnpm/@capacitor+filesystem@5.1.4_@capacitor+core@5.5.0/node_modules/@capacitor/filesystem/android')
 
 include ':capacitor-geolocation'
-project(':capacitor-geolocation').projectDir = new File('../../../node_modules/.pnpm/@capacitor+geolocation@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/geolocation/android')
+project(':capacitor-geolocation').projectDir = new File('../../../node_modules/.pnpm/@capacitor+geolocation@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/geolocation/android')
 
 include ':capacitor-haptics'
-project(':capacitor-haptics').projectDir = new File('../../../node_modules/.pnpm/@capacitor+haptics@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/haptics/android')
+project(':capacitor-haptics').projectDir = new File('../../../node_modules/.pnpm/@capacitor+haptics@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/haptics/android')
 
 include ':capacitor-keyboard'
-project(':capacitor-keyboard').projectDir = new File('../../../node_modules/.pnpm/@capacitor+keyboard@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/keyboard/android')
+project(':capacitor-keyboard').projectDir = new File('../../../node_modules/.pnpm/@capacitor+keyboard@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/keyboard/android')
 
 include ':capacitor-local-notifications'
-project(':capacitor-local-notifications').projectDir = new File('../../../node_modules/.pnpm/@capacitor+local-notifications@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/local-notifications/android')
+project(':capacitor-local-notifications').projectDir = new File('../../../node_modules/.pnpm/@capacitor+local-notifications@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/local-notifications/android')
 
 include ':capacitor-network'
-project(':capacitor-network').projectDir = new File('../../../node_modules/.pnpm/@capacitor+network@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/network/android')
+project(':capacitor-network').projectDir = new File('../../../node_modules/.pnpm/@capacitor+network@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/network/android')
 
 include ':capacitor-preferences'
-project(':capacitor-preferences').projectDir = new File('../../../node_modules/.pnpm/@capacitor+preferences@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/preferences/android')
+project(':capacitor-preferences').projectDir = new File('../../../node_modules/.pnpm/@capacitor+preferences@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/preferences/android')
 
 include ':capacitor-share'
-project(':capacitor-share').projectDir = new File('../../../node_modules/.pnpm/@capacitor+share@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/share/android')
+project(':capacitor-share').projectDir = new File('../../../node_modules/.pnpm/@capacitor+share@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/share/android')
 
 include ':capacitor-splash-screen'
-project(':capacitor-splash-screen').projectDir = new File('../../../node_modules/.pnpm/@capacitor+splash-screen@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/splash-screen/android')
+project(':capacitor-splash-screen').projectDir = new File('../../../node_modules/.pnpm/@capacitor+splash-screen@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/splash-screen/android')
 
 include ':transistorsoft-capacitor-background-fetch'
-project(':transistorsoft-capacitor-background-fetch').projectDir = new File('../../../node_modules/.pnpm/@transistorsoft+capacitor-background-fetch@6.0.0_@capacitor+core@6.0.0/node_modules/@transistorsoft/capacitor-background-fetch/android')
+project(':transistorsoft-capacitor-background-fetch').projectDir = new File('../../../node_modules/.pnpm/@transistorsoft+capacitor-background-fetch@5.1.1_@capacitor+core@5.5.0/node_modules/@transistorsoft/capacitor-background-fetch/android')
 
 include ':capacitor-secure-storage-plugin'
-project(':capacitor-secure-storage-plugin').projectDir = new File('../../../node_modules/.pnpm/capacitor-secure-storage-plugin@0.10.0_@capacitor+core@6.0.0/node_modules/capacitor-secure-storage-plugin/android')
+project(':capacitor-secure-storage-plugin').projectDir = new File('../../../node_modules/.pnpm/capacitor-secure-storage-plugin@0.9.0_@capacitor+core@5.5.0/node_modules/capacitor-secure-storage-plugin/android')

frontend/app/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.2.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.0.2-all.zip
 networkTimeout=10000
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

frontend/app/android/variables.gradle

@@ -1,14 +1,14 @@
 ext {
     minSdkVersion = 22
-    compileSdkVersion = 34
-    targetSdkVersion = 34
-    androidxActivityVersion = '1.8.0'
+    compileSdkVersion = 33
+    targetSdkVersion = 33
+    androidxActivityVersion = '1.7.0'
     androidxAppCompatVersion = '1.6.1'
     androidxCoordinatorLayoutVersion = '1.2.0'
-    androidxCoreVersion = '1.12.0'
-    androidxFragmentVersion = '1.6.2'
-    coreSplashScreenVersion = '1.0.1'
-    androidxWebkitVersion = '1.9.0'
+    androidxCoreVersion = '1.10.0'
+    androidxFragmentVersion = '1.5.6'
+    coreSplashScreenVersion = '1.0.0'
+    androidxWebkitVersion = '1.6.1'
     junitVersion = '4.13.2'
     androidxJunitVersion = '1.1.5'
     androidxEspressoCoreVersion = '3.5.1'

frontend/app/angular.json

@@ -21,13 +21,10 @@
             "allowedCommonJsDependencies": [
               "moment",
               "opening_hours",
-              "localforage",
-              "i18next",
-              "semver",
-              "suncalc",
-              "guid-typescript",
-              "fast-deep-equal",
-              "maplibre-gl"
+              "leaflet",
+              "leaflet.markercluster",
+              "localforge",
+              "guid-typescript"
             ],
             "aot": true,
             "assets": [
@@ -35,13 +32,24 @@
                 "glob": "**/*",
                 "input": "src/assets",
                 "output": "assets"
+              },
+              {
+                "glob": "**/*",
+                "input": "./node_modules/leaflet/dist/images",
+                "output": "assets/"
               }
             ],
             "styles": [
+              {
+                "input": "src/theme/variables.scss",
+                "inject": true
+              },
               {
                 "input": "src/global.scss",
                 "inject": true
-              }
+              },
+              "./node_modules/leaflet/dist/leaflet.css",
+              "./node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css"
             ]
           },
           "configurations": {
@@ -124,6 +132,11 @@
                 "glob": "**/*",
                 "input": "src/assets",
                 "output": "/assets"
+              },
+              {
+                "glob": "**/*",
+                "input": "./node_modules/leaflet/dist/images",
+                "output": "assets/"
               }
             ]
           }

frontend/app/icons.config.ts

@@ -12,9 +12,9 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
+import type {IconConfig} from './scripts/icon-config';
 
-/** @type {import('./scripts/icon-config').IconConfig} */
-const config = {
+const config: IconConfig = {
   inputPath: 'node_modules/material-symbols/material-symbols-rounded.woff2',
   outputPath: 'src/assets/icons.min.woff2',
   htmlGlob: 'src/**/*.html',
@@ -38,6 +38,10 @@ const config = {
       'work',
     ],
   },
+  codePoints: {
+    ios_share: 'e6b8',
+    fact_check: 'f0c5',
+  },
 };
 
 export default config;

frontend/app/integration-test.sh

@@ -1,11 +1,11 @@
 #!/usr/bin/env bash
 
-rm coverage/integration-report-junit-*.xml || true
+rm coverage/integration-report-junit-*.xml
 
 ng e2e --watch=false --headless=true --browser="$BROWSER"
 exit_code=$?
 
-jrm coverage/integration-report-junit.xml coverage/integration-report-junit-*.xml || true
-rm coverage/integration-report-junit-*.xml || true
+jrm coverage/integration-report-junit.xml coverage/integration-report-junit-*.xml
+rm coverage/integration-report-junit-*.xml
 
 exit $exit_code

frontend/app/ios/App/Podfile

@@ -1,4 +1,4 @@
-require_relative '../../../../node_modules/.pnpm/@capacitor+ios@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/ios/scripts/pods_helpers'
+require_relative '../../../../node_modules/.pnpm/@capacitor+ios@5.5.0_@capacitor+core@5.5.0/node_modules/@capacitor/ios/scripts/pods_helpers'
 
 platform :ios, '13.0'
 use_frameworks!
@@ -9,24 +9,24 @@ use_frameworks!
 install! 'cocoapods', :disable_input_output_paths => true
 
 def capacitor_pods
-  pod 'Capacitor', :path => '../../../../node_modules/.pnpm/@capacitor+ios@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/ios'
-  pod 'CapacitorCordova', :path => '../../../../node_modules/.pnpm/@capacitor+ios@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/ios'
-  pod 'CapacitorApp', :path => '../../../../node_modules/.pnpm/@capacitor+app@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/app'
-  pod 'CapacitorBrowser', :path => '../../../../node_modules/.pnpm/@capacitor+browser@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/browser'
-  pod 'CapacitorClipboard', :path => '../../../../node_modules/.pnpm/@capacitor+clipboard@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/clipboard'
-  pod 'CapacitorDevice', :path => '../../../../node_modules/.pnpm/@capacitor+device@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/device'
-  pod 'CapacitorDialog', :path => '../../../../node_modules/.pnpm/@capacitor+dialog@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/dialog'
-  pod 'CapacitorFilesystem', :path => '../../../../node_modules/.pnpm/@capacitor+filesystem@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/filesystem'
-  pod 'CapacitorGeolocation', :path => '../../../../node_modules/.pnpm/@capacitor+geolocation@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/geolocation'
-  pod 'CapacitorHaptics', :path => '../../../../node_modules/.pnpm/@capacitor+haptics@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/haptics'
-  pod 'CapacitorKeyboard', :path => '../../../../node_modules/.pnpm/@capacitor+keyboard@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/keyboard'
-  pod 'CapacitorLocalNotifications', :path => '../../../../node_modules/.pnpm/@capacitor+local-notifications@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/local-notifications'
-  pod 'CapacitorNetwork', :path => '../../../../node_modules/.pnpm/@capacitor+network@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/network'
-  pod 'CapacitorPreferences', :path => '../../../../node_modules/.pnpm/@capacitor+preferences@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/preferences'
-  pod 'CapacitorShare', :path => '../../../../node_modules/.pnpm/@capacitor+share@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/share'
-  pod 'CapacitorSplashScreen', :path => '../../../../node_modules/.pnpm/@capacitor+splash-screen@6.0.0_@capacitor+core@6.0.0/node_modules/@capacitor/splash-screen'
-  pod 'TransistorsoftCapacitorBackgroundFetch', :path => '../../../../node_modules/.pnpm/@transistorsoft+capacitor-background-fetch@5.2.0_@capacitor+core@6.0.0/node_modules/@transistorsoft/capacitor-background-fetch'
-  pod 'CapacitorSecureStoragePlugin', :path => '../../../../node_modules/.pnpm/capacitor-secure-storage-plugin@0.9.0_@capacitor+core@6.0.0/node_modules/capacitor-secure-storage-plugin'
+  pod 'Capacitor', :path => '../../../../node_modules/.pnpm/@capacitor+ios@5.5.0_@capacitor+core@5.5.0/node_modules/@capacitor/ios'
+  pod 'CapacitorCordova', :path => '../../../../node_modules/.pnpm/@capacitor+ios@5.5.0_@capacitor+core@5.5.0/node_modules/@capacitor/ios'
+  pod 'CapacitorApp', :path => '../../../../node_modules/.pnpm/@capacitor+app@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/app'
+  pod 'CapacitorBrowser', :path => '../../../../node_modules/.pnpm/@capacitor+browser@5.1.0_@capacitor+core@5.5.0/node_modules/@capacitor/browser'
+  pod 'CapacitorClipboard', :path => '../../../../node_modules/.pnpm/@capacitor+clipboard@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/clipboard'
+  pod 'CapacitorDevice', :path => '../../../../node_modules/.pnpm/@capacitor+device@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/device'
+  pod 'CapacitorDialog', :path => '../../../../node_modules/.pnpm/@capacitor+dialog@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/dialog'
+  pod 'CapacitorFilesystem', :path => '../../../../node_modules/.pnpm/@capacitor+filesystem@5.1.4_@capacitor+core@5.5.0/node_modules/@capacitor/filesystem'
+  pod 'CapacitorGeolocation', :path => '../../../../node_modules/.pnpm/@capacitor+geolocation@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/geolocation'
+  pod 'CapacitorHaptics', :path => '../../../../node_modules/.pnpm/@capacitor+haptics@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/haptics'
+  pod 'CapacitorKeyboard', :path => '../../../../node_modules/.pnpm/@capacitor+keyboard@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/keyboard'
+  pod 'CapacitorLocalNotifications', :path => '../../../../node_modules/.pnpm/@capacitor+local-notifications@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/local-notifications'
+  pod 'CapacitorNetwork', :path => '../../../../node_modules/.pnpm/@capacitor+network@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/network'
+  pod 'CapacitorPreferences', :path => '../../../../node_modules/.pnpm/@capacitor+preferences@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/preferences'
+  pod 'CapacitorShare', :path => '../../../../node_modules/.pnpm/@capacitor+share@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/share'
+  pod 'CapacitorSplashScreen', :path => '../../../../node_modules/.pnpm/@capacitor+splash-screen@5.0.6_@capacitor+core@5.5.0/node_modules/@capacitor/splash-screen'
+  pod 'TransistorsoftCapacitorBackgroundFetch', :path => '../../../../node_modules/.pnpm/@transistorsoft+capacitor-background-fetch@5.1.1_@capacitor+core@5.5.0/node_modules/@transistorsoft/capacitor-background-fetch'
+  pod 'CapacitorSecureStoragePlugin', :path => '../../../../node_modules/.pnpm/capacitor-secure-storage-plugin@0.9.0_@capacitor+core@5.5.0/node_modules/capacitor-secure-storage-plugin'
   pod 'CordovaPlugins', :path => '../capacitor-cordova-ios-plugins'
 end
 

frontend/app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openstapps/app",
   "description": "The generic app tailored to fulfill needs of German universities, written using Ionic Framework.",
-  "version": "3.2.0",
+  "version": "3.1.2",
   "private": true,
   "license": "GPL-3.0-only",
   "author": "Karl-Philipp Wulfert <krlwlfrt@gmail.com>",
@@ -14,12 +14,14 @@
     "Thea Schöbl <dev@theaninova.de>"
   ],
   "scripts": {
-    "build": "pnpm check-icons && ng build --configuration=production --stats-json",
+    "analyze": "webpack-bundle-analyzer www/stats.json",
+    "build": "pnpm check-icons && ng build --configuration=production --stats-json && webpack-bundle-analyzer www/stats.json --mode static --report www/bundle-info.html --no-open",
+    "build:analyze": "npm run build:stats && npm run analyze",
     "build:android": "ionic capacitor build android --no-open && cd android && ./gradlew clean assemble && cd ..",
     "build:prod": "ng build --configuration=production",
     "build:stats": "ng build --configuration=production --stats-json",
     "changelog": "conventional-changelog -p angular -i src/assets/about/CHANGELOG.md -s -r 0",
-    "check-icons": "node scripts/check-icon-correctness.mjs",
+    "check-icons": "ts-node scripts/check-icon-correctness.ts",
     "chromium:no-cors": "chromium --disable-web-security --user-data-dir=\".browser-data/chromium\"",
     "chromium:virtual-host": "chromium --host-resolver-rules=\"MAP mobile.app.uni-frankfurt.de:* localhost:8100\" --ignore-certificate-errors",
     "cypress:open": "cypress open",
@@ -33,10 +35,11 @@
     "e2e": "ng e2e",
     "format": "prettier . -c",
     "format:fix": "prettier --write .",
-    "licenses": "license-checker --json > src/assets/about/licenses.json && node ./scripts/accumulate-licenses.mjs && git add src/assets/about/licenses.json",
+    "licenses": "license-checker --json > src/assets/about/licenses.json && ts-node ./scripts/accumulate-licenses.ts && git add src/assets/about/licenses.json",
     "lint": "ng lint && stylelint \"**/*.scss\"",
     "lint:fix": "eslint --fix -c .eslintrc.json --ignore-path .eslintignore --ext .ts,.html src/ && stylelint --fix \"**/*.scss\"",
-    "minify-icons": "node scripts/minify-icon-font.mjs",
+    "minify-icons": "ts-node-esm scripts/minify-icon-font.ts",
+    "postinstall": "jetify && echo \"skipping jetify in production mode\"",
     "preview": "http-server www --p 8101 -o",
     "push": "git push && git push origin \"v$npm_package_version\"",
     "resources:ios": "capacitor-assets generate --ios --iconBackgroundColor $(grep -oE \"^@include ion-color\\(primary, #[a-fA-F0-9]{3,6}\" src/theme/colors.scss | grep -oE \"#[a-fA-F0-9]{3,6}\") --splashBackgroundColor $(grep -oE \"^@include ion-color\\(primary, #[a-fA-F0-9]{3,6}\" src/theme/colors.scss | grep -oE \"#[a-fA-F0-9]{3,6}\")",
@@ -49,42 +52,44 @@
     "test:integration": "sh integration-test.sh"
   },
   "dependencies": {
-    "@angular/animations": "18.0.1",
-    "@angular/cdk": "18.0.1",
-    "@angular/common": "18.0.1",
-    "@angular/core": "18.0.1",
-    "@angular/forms": "18.0.1",
-    "@angular/platform-browser": "18.0.1",
-    "@angular/router": "18.0.1",
+    "@angular/animations": "17.3.0",
+    "@angular/cdk": "17.3.0",
+    "@angular/common": "17.3.0",
+    "@angular/core": "17.3.0",
+    "@angular/forms": "17.3.0",
+    "@angular/platform-browser": "17.3.0",
+    "@angular/router": "17.3.0",
+    "@asymmetrik/ngx-leaflet": "17.0.0",
+    "@asymmetrik/ngx-leaflet-markercluster": "17.0.0",
     "@awesome-cordova-plugins/calendar": "6.6.0",
     "@awesome-cordova-plugins/core": "6.6.0",
-    "@capacitor/app": "6.0.0",
-    "@capacitor/browser": "6.0.0",
-    "@capacitor/clipboard": "6.0.0",
-    "@capacitor/core": "6.0.0",
-    "@capacitor/device": "6.0.0",
-    "@capacitor/dialog": "6.0.0",
-    "@capacitor/filesystem": "6.0.0",
-    "@capacitor/geolocation": "6.0.0",
-    "@capacitor/haptics": "6.0.0",
-    "@capacitor/keyboard": "6.0.0",
-    "@capacitor/local-notifications": "6.0.0",
-    "@capacitor/network": "6.0.0",
-    "@capacitor/preferences": "6.0.0",
-    "@capacitor/share": "6.0.0",
-    "@capacitor/splash-screen": "6.0.0",
-    "@ionic/angular": "8.2.0",
+    "@capacitor/app": "5.0.7",
+    "@capacitor/browser": "5.2.0",
+    "@capacitor/clipboard": "5.0.7",
+    "@capacitor/core": "5.7.3",
+    "@capacitor/device": "5.0.7",
+    "@capacitor/dialog": "5.0.7",
+    "@capacitor/filesystem": "5.2.1",
+    "@capacitor/geolocation": "5.0.7",
+    "@capacitor/haptics": "5.0.7",
+    "@capacitor/keyboard": "5.0.8",
+    "@capacitor/local-notifications": "5.0.7",
+    "@capacitor/network": "5.0.7",
+    "@capacitor/preferences": "5.0.7",
+    "@capacitor/share": "5.0.7",
+    "@capacitor/splash-screen": "5.0.7",
+    "@ionic-native/core": "5.36.0",
+    "@ionic/angular": "7.8.0",
     "@ionic/storage-angular": "4.0.0",
-    "@maplibre/ngx-maplibre-gl": "17.4.1",
     "@ngx-translate/core": "15.0.0",
     "@ngx-translate/http-loader": "8.0.0",
     "@openid/appauth": "1.3.1",
     "@openstapps/api": "workspace:*",
     "@openstapps/collection-utils": "workspace:*",
     "@openstapps/core": "workspace:*",
-    "@transistorsoft/capacitor-background-fetch": "6.0.0",
+    "@transistorsoft/capacitor-background-fetch": "5.2.0",
     "@types/dom-view-transitions": "1.0.4",
-    "capacitor-secure-storage-plugin": "0.10.0",
+    "capacitor-secure-storage-plugin": "0.9.0",
     "cordova-plugin-calendar": "5.1.6",
     "date-fns": "3.6.0",
     "deepmerge": "4.3.1",
@@ -92,16 +97,15 @@
     "geojson": "0.5.0",
     "ionic-appauth": "0.9.0",
     "jsonpath-plus": "6.0.1",
-    "maplibre-gl": "4.0.2",
-    "material-symbols": "0.17.1",
+    "leaflet": "1.9.4",
+    "leaflet.markercluster": "1.5.3",
+    "material-symbols": "0.17.0",
     "moment": "2.30.1",
     "ngx-date-fns": "11.0.0",
     "ngx-logger": "5.0.12",
-    "ngx-markdown": "18.0.0",
+    "ngx-markdown": "17.1.1",
     "ngx-moment": "6.0.2",
     "opening_hours": "3.8.0",
-    "pmtiles": "3.0.3",
-    "prettier": "3.1.1",
     "rxjs": "7.8.1",
     "semver": "7.6.0",
     "swiper": "8.4.5",
@@ -109,25 +113,25 @@
     "zone.js": "0.14.4"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "0.1800.2",
-    "@angular-devkit/build-angular": "18.0.2",
-    "@angular-devkit/core": "18.0.2",
-    "@angular-devkit/schematics": "18.0.2",
-    "@angular-eslint/builder": "18.0.1",
-    "@angular-eslint/eslint-plugin": "18.0.1",
-    "@angular-eslint/eslint-plugin-template": "18.0.1",
-    "@angular-eslint/schematics": "18.0.1",
-    "@angular-eslint/template-parser": "18.0.1",
-    "@angular/cli": "18.0.2",
-    "@angular/compiler": "18.0.1",
-    "@angular/compiler-cli": "18.0.1",
+    "@angular-devkit/architect": "0.1703.0",
+    "@angular-devkit/build-angular": "17.3.0",
+    "@angular-devkit/core": "17.3.0",
+    "@angular-devkit/schematics": "17.3.0",
+    "@angular-eslint/builder": "17.3.0",
+    "@angular-eslint/eslint-plugin": "17.3.0",
+    "@angular-eslint/eslint-plugin-template": "17.3.0",
+    "@angular-eslint/schematics": "17.3.0",
+    "@angular-eslint/template-parser": "17.3.0",
+    "@angular/cli": "17.3.0",
+    "@angular/compiler": "17.3.0",
+    "@angular/compiler-cli": "17.3.0",
     "@angular/language-server": "17.3.0",
-    "@angular/language-service": "18.0.1",
-    "@angular/platform-browser-dynamic": "18.0.1",
-    "@capacitor/android": "6.0.0",
+    "@angular/language-service": "17.3.0",
+    "@angular/platform-browser-dynamic": "17.3.0",
+    "@capacitor/android": "5.7.3",
     "@capacitor/assets": "3.0.4",
-    "@capacitor/cli": "6.0.0",
-    "@capacitor/ios": "6.0.0",
+    "@capacitor/cli": "5.7.3",
+    "@capacitor/ios": "5.7.3",
     "@compodoc/compodoc": "1.1.23",
     "@cypress/schematic": "2.5.1",
     "@ionic/angular-toolkit": "11.0.1",
@@ -143,12 +147,14 @@
     "@types/karma": "6.3.8",
     "@types/karma-coverage": "2.0.3",
     "@types/karma-jasmine": "4.0.5",
+    "@types/leaflet": "1.9.8",
+    "@types/leaflet.markercluster": "1.5.4",
     "@types/node": "18.15.3",
     "@types/semver": "7.5.8",
     "@typescript-eslint/eslint-plugin": "7.2.0",
     "@typescript-eslint/parser": "7.2.0",
     "cordova-res": "0.15.4",
-    "cypress": "13.10.0",
+    "cypress": "13.7.0",
     "eslint": "8.57.0",
     "eslint-plugin-jsdoc": "48.2.1",
     "eslint-plugin-prettier": "5.1.3",
@@ -160,6 +166,7 @@
     "is-docker": "2.2.1",
     "jasmine-core": "5.1.2",
     "jasmine-spec-reporter": "7.0.0",
+    "jetifier": "2.0.0",
     "junit-report-merger": "6.0.3",
     "karma": "6.4.3",
     "karma-chrome-launcher": "3.2.0",
@@ -168,14 +175,15 @@
     "karma-junit-reporter": "2.0.1",
     "karma-mocha-reporter": "2.2.5",
     "license-checker": "25.0.1",
-    "stylelint": "16.3.1",
+    "stylelint": "16.2.1",
     "stylelint-config-clean-order": "5.4.1",
     "stylelint-config-prettier-scss": "1.0.0",
     "stylelint-config-recommended-scss": "14.0.0",
     "stylelint-config-standard-scss": "13.0.0",
     "surge": "0.23.1",
     "ts-node": "10.9.2",
-    "typescript": "5.4.2"
+    "typescript": "5.4.2",
+    "webpack-bundle-analyzer": "4.10.1"
   },
   "cordova": {
     "plugins": {},

frontend/app/scripts/accumulate-licenses.ts

@@ -12,34 +12,33 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
-import {readFileSync, writeFileSync} from 'fs';
-import {omit, pickBy} from '@openstapps/collection-utils';
+import fs from 'fs';
+import {omit} from '../src/app/_helpers/collections/omit';
+import {pickBy} from '../src/app/_helpers/collections/pick';
 
 /**
  * accumulate and transform licenses based on two license files
- * @param {string} path
- * @param {string} additionalLicensesPath
  */
-function accumulateFile(path, additionalLicensesPath) {
-  const packageJson = JSON.parse(readFileSync('./package.json').toString());
+function accumulateFile(path: string, additionalLicensesPath: string) {
+  const packageJson = JSON.parse(fs.readFileSync('./package.json').toString());
   const dependencies = packageJson.dependencies;
 
   console.log(`Accumulating licenses from ${path}`);
 
-  writeFileSync(
+  fs.writeFileSync(
     path,
     JSON.stringify(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      Object.entries({
-        ...pickBy(JSON.parse(readFileSync(path).toString()), (_, key) => {
-          const parts = /** @type {string} */ (key).split('@');
+      Object.entries<any>({
+        ...pickBy(JSON.parse(fs.readFileSync(path).toString()), (_, key: string) => {
+          const parts = key.split('@');
 
           return dependencies[parts.slice(0, -1).join('@')] === parts[parts.length - 1];
         }),
-        ...JSON.parse(readFileSync(additionalLicensesPath).toString()),
+        ...JSON.parse(fs.readFileSync(additionalLicensesPath).toString()),
       })
         .map(([key, value]) => ({
-          licenseText: value.licenseFile && readFileSync(value.licenseFile, 'utf8'),
+          licenseText: value.licenseFile && fs.readFileSync(value.licenseFile, 'utf8'),
           name: key,
           ...omit(value, 'licenseFile', 'path'),
         }))

frontend/app/scripts/check-icon-correctness.ts

@@ -12,20 +12,18 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
-import {openSync} from 'fontkit';
-import config from '../icons.config.mjs';
+import fontkit, {Font} from 'fontkit';
+import config from '../icons.config';
 import {existsSync} from 'fs';
-import {getUsedIconsHtml, getUsedIconsTS} from './gather-used-icons.mjs';
-import {fetchCodePointMap} from './get-code-points.mjs';
+import {getUsedIconsHtml, getUsedIconsTS} from './gather-used-icons';
 
 const commandName = '"npm run minify-icons"';
+const originalFont = fontkit.openSync(config.inputPath);
 if (!existsSync(config.outputPath)) {
   console.error(`Minified font not found. Run ${commandName} first.`);
   process.exit(-1);
 }
-
-/** @type {import('fontkit').Font} */
-const modifiedFont = openSync(config.outputPath);
+const modifiedFont = fontkit.openSync(config.outputPath);
 
 let success = true;
 
@@ -50,16 +48,25 @@ async function checkAll() {
 }
 
 /**
- * @param {Record<string, string[]>} icons
+ *
  */
-async function check(icons) {
-  const codePoints = await fetchCodePointMap();
-
-  for (const icon of Object.values(icons).flat()) {
-    const codePoint = codePoints.get(icon);
-    if (!codePoint) throw new Error(`"${icon}" is not a valid icon`);
-    if (!modifiedFont.getGlyph(Number.parseInt(codePoint, 16))) {
-      throw new Error(`"${icon}" (code point ${codePoint}) is missing`);
+function check(icons: Record<string, string[]>) {
+  for (const [purpose, iconSet] of Object.entries(icons)) {
+    for (const icon of iconSet) {
+      if (!hasIcon(originalFont, icon)) {
+        success = false;
+        console.error(`${purpose}: ${icon} does not exist. Typo?`);
+      } else if (!hasIcon(modifiedFont, icon)) {
+        success = false;
+        console.error(`${purpose}: ${icon} not found in minified font. Run ${commandName} to regenerate it.`);
+      }
     }
   }
 }
+
+/**
+ *
+ */
+function hasIcon(font: Font, icon: string) {
+  return font.layout(icon).glyphs.some(it => it.isLigature);
+}

frontend/app/scripts/gather-used-icons.ts

@@ -14,39 +14,34 @@
  */
 import {glob} from 'glob';
 import {readFileSync} from 'fs';
-import {
-  matchPropertyAccess,
-  matchPropertyContent,
-  matchTagProperties,
-} from '../src/app/util/ion-icon/icon-match.mjs';
+import {matchPropertyContent, matchTagProperties} from '../src/app/util/ion-icon/icon-match';
 
 /**
- * @returns {Promise<Record<string, string[]>>}
+ *
  */
-export async function getUsedIconsHtml(pattern = 'src/**/*.html') {
+export async function getUsedIconsHtml(pattern = 'src/**/*.html'): Promise<Record<string, string[]>> {
   return Object.fromEntries(
     (await glob(pattern))
       .map(file => [
         file,
-        readFileSync(file, 'utf8')
+        (readFileSync(file, 'utf8')
           .match(matchTagProperties('ion-icon'))
           ?.flatMap(match => {
             return match.match(matchPropertyContent(['name', 'md', 'ios']));
           })
-          .filter(it => !!it) || [],
+          .filter(it => !!it) as string[]) || [],
       ])
-      .filter(([, values]) => values && values.length > 0),
+      .filter(([, values]) => values.length > 0),
   );
 }
 
 /**
- * @returns {Promise<Record<string, string[]>>}
+ *
  */
-export async function getUsedIconsTS(pattern = 'src/**/*.ts') {
-  const regex = matchPropertyAccess('SCIcon');
+export async function getUsedIconsTS(pattern = 'src/**/*.ts'): Promise<Record<string, string[]>> {
   return Object.fromEntries(
     (await glob(pattern))
-      .map(file => [file, readFileSync(file, 'utf8').match(regex) || []])
-      .filter(([, values]) => values && values.length > 0),
+      .map(file => [file, readFileSync(file, 'utf8').match(/(?<=Icon`)[\w-]+(?=`)/g) || []])
+      .filter(([, values]) => values.length > 0),
   );
 }

frontend/app/scripts/get-code-points.mjs

@@ -1,23 +0,0 @@
-const url =
-  'https://raw.githubusercontent.com/google/material-design-icons/master/' +
-  'variablefont/MaterialSymbolsRounded%5BFILL%2CGRAD%2Copsz%2Cwght%5D.codepoints';
-
-export async function fetchCodePointMap() {
-  const icons = await fetch(url)
-    .then(it => it.text())
-    .then(it => new Map(it.split('\n').map(it => /** @type {[string, string]} */ (it.split(' ')))));
-  if (icons.size < 100) throw new Error(`Code point map is very small, is the URL incorrect? ${url}`);
-  return icons;
-}
-
-/**
- * @param {string[]} icons
- */
-export async function getCodePoints(icons) {
-  const codePoints = await fetchCodePointMap();
-  return icons.map(icon => {
-    const code = codePoints.get(icon);
-    if (!code) throw new Error(`Code point for icon ${icon} not found`);
-    return code;
-  });
-}

frontend/app/scripts/icon-config.ts

@@ -19,4 +19,5 @@ export interface IconConfig {
   inputPath: string;
   outputPath: string;
   additionalIcons?: {[purpose: string]: string[]};
+  codePoints?: {[name: string]: string};
 }

frontend/app/scripts/minify-icon-font.ts

@@ -14,17 +14,16 @@
  */
 
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
+import fontkit from 'fontkit';
 import {exec} from 'child_process';
-import config from '../icons.config.mjs';
+import config from '../icons.config';
 import {statSync} from 'fs';
-import {getUsedIconsHtml, getUsedIconsTS} from './gather-used-icons.mjs';
-import {getCodePoints} from './get-code-points.mjs';
+import {getUsedIconsHtml, getUsedIconsTS} from './gather-used-icons';
 
 /**
- * @param {string[] | string} command
- * @returns {Promise<string>}
+ *
  */
-async function run(command) {
+async function run(command: string[] | string): Promise<string> {
   const fullCommand = Array.isArray(command) ? command.join(' ') : command;
   console.log(`>> ${fullCommand}`);
 
@@ -45,8 +44,7 @@ async function run(command) {
  *
  */
 async function minifyIconFont() {
-  /** @type {Set<string>} */
-  const icons = new Set();
+  const icons = new Set<string>();
 
   for (const iconSet of [
     ...Object.values(config.additionalIcons || []),
@@ -58,7 +56,35 @@ async function minifyIconFont() {
     }
   }
 
-  const glyphs = ['5f-7a', '30-39', ...(await getCodePoints([...icons]))].sort();
+  console.log('Icons used:', [...icons.values()].sort());
+  const font = fontkit.openSync(config.inputPath);
+
+  const glyphs: string[] = ['5f-7a', '30-39'];
+  for (const icon of icons) {
+    const iconGlyphs = font.layout(icon).glyphs;
+    if (iconGlyphs.length === 0) {
+      console.error(`${icon} not found in font. Typo?`);
+      process.exit(-1);
+    }
+
+    const codePoints = iconGlyphs
+      .flatMap(it => font.stringsForGlyph(it.id))
+      .flatMap(it => [...it])
+      .map(it => it.codePointAt(0)!.toString(16));
+
+    if (codePoints.length === 0) {
+      if (config.codePoints?.[icon]) {
+        glyphs.push(config.codePoints[icon]);
+      } else {
+        console.log();
+        console.error(`${icon} code point could not be determined. Add it to config.codePoints.`);
+        process.exit(-1);
+      }
+    }
+
+    glyphs.push(...codePoints);
+  }
+  glyphs.sort();
 
   console.log(
     await run([
@@ -88,10 +114,8 @@ minifyIconFont();
 
 /**
  * Bytes to respective units
- * @param {number} value
- * @returns {string}
  */
-function toByteUnit(value) {
+function toByteUnit(value: number): string {
   if (value < 1024) {
     return `${value}B`;
   } else if (value < 1024 * 1024) {

frontend/app/src/app/app.component.spec.ts

@@ -21,7 +21,7 @@ import {ModalController, Platform} from '@ionic/angular';
 
 import {TranslateService} from '@ngx-translate/core';
 import {ThingTranslateService} from './translation/thing-translate.service';
-import {provideHttpClientTesting} from '@angular/common/http/testing';
+import {HttpClientTestingModule} from '@angular/common/http/testing';
 import {AppComponent} from './app.component';
 import {AuthModule} from './modules/auth/auth.module';
 import {ConfigProvider} from './modules/config/config.provider';
@@ -32,7 +32,6 @@ import {ScheduleSyncService} from './modules/background/schedule/schedule-sync.s
 import {sampleAuthConfiguration} from './_helpers/data/sample-configuration';
 import {StorageProvider} from './modules/storage/storage.provider';
 import {SimpleBrowser} from './util/browser.factory';
-import {provideHttpClient, withInterceptorsFromDi} from '@angular/common/http';
 
 describe('AppComponent', () => {
   let platformReadySpy: any;
@@ -76,9 +75,8 @@ describe('AppComponent', () => {
     modalController = jasmine.createSpyObj('ModalController', ['create', 'dismiss', 'getTop']);
 
     TestBed.configureTestingModule({
+      imports: [RouterTestingModule.withRoutes([]), HttpClientTestingModule, AuthModule],
       declarations: [AppComponent],
-      schemas: [CUSTOM_ELEMENTS_SCHEMA],
-      imports: [RouterTestingModule.withRoutes([]), AuthModule],
       providers: [
         {provide: Platform, useValue: platformSpy},
         {provide: TranslateService, useValue: translateServiceSpy},
@@ -90,9 +88,8 @@ describe('AppComponent', () => {
         {provide: StorageProvider, useValue: storageProvider},
         {provide: SimpleBrowser, useValue: simpleBrowser},
         {provide: ModalController, useValue: modalController},
-        provideHttpClient(withInterceptorsFromDi()),
-        provideHttpClientTesting(),
       ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
   });
 

frontend/app/src/app/app.module.ts

@@ -13,7 +13,7 @@
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
 import {CommonModule, LocationStrategy, PathLocationStrategy, registerLocaleData} from '@angular/common';
-import {HTTP_INTERCEPTORS, HttpClient, provideHttpClient, withInterceptorsFromDi} from '@angular/common/http';
+import {HTTP_INTERCEPTORS, HttpClient, HttpClientModule} from '@angular/common/http';
 import localeDe from '@angular/common/locales/de';
 import {APP_INITIALIZER, NgModule} from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
@@ -30,6 +30,7 @@ import {environment} from '../environments/environment';
 import {AppRoutingModule} from './app-routing.module';
 import {AppComponent} from './app.component';
 import {CatalogModule} from './modules/catalog/catalog.module';
+import {ConfigModule} from './modules/config/config.module';
 import {ConfigProvider} from './modules/config/config.provider';
 import {DashboardModule} from './modules/dashboard/dashboard.module';
 import {DataModule} from './modules/data/data.module';
@@ -69,8 +70,6 @@ import {setDefaultOptions} from 'date-fns';
 import {DateFnsConfigurationService} from 'ngx-date-fns';
 import {Capacitor} from '@capacitor/core';
 import {SplashScreen} from '@capacitor/splash-screen';
-import maplibregl from 'maplibre-gl';
-import {Protocol} from 'pmtiles';
 
 registerLocaleData(localeDe);
 
@@ -92,7 +91,6 @@ export function initializerFactory(
 ) {
   return async () => {
     try {
-      maplibregl.addProtocol('pmtiles', new Protocol().tile);
       initLogger(logger);
       await storageProvider.init();
       await configProvider.init();
@@ -153,6 +151,7 @@ export function createTranslateLoader(http: HttpClient) {
     BrowserAnimationsModule,
     CatalogModule,
     CommonModule,
+    ConfigModule,
     DashboardModule,
     DataModule,
     HebisModule,
@@ -161,6 +160,7 @@ export function createTranslateLoader(http: HttpClient) {
     JobModule,
     FavoritesModule,
     LibraryModule,
+    HttpClientModule,
     ProfilePageModule,
     FeedbackModule,
     MapModule,
@@ -220,7 +220,6 @@ export function createTranslateLoader(http: HttpClient) {
       useClass: ServiceHandlerInterceptor,
       multi: true,
     },
-    provideHttpClient(withInterceptorsFromDi()),
   ],
 })
 export class AppModule {

frontend/app/src/app/modules/about/about-page/about-page-content.html

@@ -49,7 +49,7 @@
 @if (content.type === 'router link') {
   <ion-item [routerLink]="content.link">
     @if (content.icon) {
-      <ion-icon [name]="$any(content.icon)" slot="start"></ion-icon>
+      <ion-icon [name]="content.icon" slot="start"></ion-icon>
     }
     <ion-label>{{ 'title' | translateSimple: content }}</ion-label>
   </ion-item>

frontend/app/src/app/modules/about/about.module.ts

@@ -19,6 +19,7 @@ import {FormsModule} from '@angular/forms';
 import {IonicModule} from '@ionic/angular';
 import {TranslateModule} from '@ngx-translate/core';
 import {ThingTranslateModule} from '../../translation/thing-translate.module';
+import {ConfigProvider} from '../config/config.provider';
 import {AboutPageComponent} from './about-page/about-page.component';
 import {MarkdownModule} from 'ngx-markdown';
 import {AboutPageContentComponent} from './about-page/about-page-content.component';
@@ -63,5 +64,6 @@ const settingsRoutes: Routes = [
     ScrollingModule,
     UtilModule,
   ],
+  providers: [ConfigProvider],
 })
 export class AboutModule {}

frontend/app/src/app/modules/auth/auth-helper.service.spec.ts

@@ -22,7 +22,7 @@ import {Requestor, StorageBackend} from '@openid/appauth';
 import {TranslateService} from '@ngx-translate/core';
 import {PAIAAuthService} from './paia/paia-auth.service';
 import {StAppsWebHttpClient} from '../data/stapps-web-http-client.provider';
-import {provideHttpClient, withInterceptorsFromDi} from '@angular/common/http';
+import {HttpClientModule} from '@angular/common/http';
 import {SimpleBrowser} from '../../util/browser.factory';
 import {LoggerTestingModule} from 'ngx-logger/testing';
 
@@ -54,7 +54,7 @@ describe('AuthHelperService', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [LoggerTestingModule],
+      imports: [HttpClientModule, LoggerTestingModule],
       providers: [
         StAppsWebHttpClient,
         {
@@ -88,7 +88,6 @@ describe('AuthHelperService', () => {
           provide: SimpleBrowser,
           useValue: simpleBrowserMock,
         },
-        provideHttpClient(withInterceptorsFromDi()),
       ],
     });
     authHelperService = TestBed.inject(AuthHelperService);

frontend/app/src/app/modules/auth/default-auth.service.spec.ts

@@ -20,7 +20,7 @@ import {Browser} from 'ionic-appauth';
 import {nowInSeconds, Requestor, StorageBackend} from '@openid/appauth';
 import {TranslateService} from '@ngx-translate/core';
 import {StAppsWebHttpClient} from '../data/stapps-web-http-client.provider';
-import {provideHttpClient, withInterceptorsFromDi} from '@angular/common/http';
+import {HttpClientModule} from '@angular/common/http';
 import {IonicStorage} from 'ionic-appauth/lib';
 import {RouterModule} from '@angular/router';
 import {LoggerTestingModule} from 'ngx-logger/testing';
@@ -35,7 +35,7 @@ describe('AuthService', () => {
     storageBackendSpy = jasmine.createSpyObj('StorageBackend', ['getItem']);
 
     TestBed.configureTestingModule({
-      imports: [LoggerTestingModule, RouterModule.forRoot([])],
+      imports: [HttpClientModule, LoggerTestingModule, RouterModule.forRoot([])],
       providers: [
         StAppsWebHttpClient,
         {
@@ -54,7 +54,6 @@ describe('AuthService', () => {
           useValue: storageBackendSpy,
         },
         Requestor,
-        provideHttpClient(withInterceptorsFromDi()),
       ],
     });
     defaultAuthService = TestBed.inject(DefaultAuthService);

frontend/app/src/app/modules/catalog/catalog.component.scss

@@ -15,6 +15,7 @@
 
 ion-segment-button {
   max-width: 100%;
+  text-transform: none;
 }
 
 .margin-top {

frontend/app/src/app/modules/config/config.module.ts

@@ -0,0 +1,27 @@
+/*
+ * Copyright (C) 2019 StApps
+ * This program is free software: you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation, version 3.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
+ * FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import {NgModule} from '@angular/core';
+import {DataModule} from '../data/data.module';
+import {StorageModule} from '../storage/storage.module';
+import {ConfigProvider} from './config.provider';
+
+/**
+ * TODO
+ */
+@NgModule({
+  imports: [StorageModule, DataModule],
+  providers: [ConfigProvider],
+})
+export class ConfigModule {}

frontend/app/src/app/modules/config/config.provider.spec.ts

@@ -104,9 +104,9 @@ describe('ConfigProvider', () => {
 
   it('should throw error on wrong config version in storage', async () => {
     storageProviderSpy.has.and.returnValue(Promise.resolve(true));
-    const wrongConfig = structuredClone(sampleIndexResponse);
+    const wrongConfig = JSON.parse(JSON.stringify(sampleIndexResponse));
     wrongConfig.backend.SCVersion = '0.1.0';
-    storageProviderSpy.get.and.returnValue(Promise.resolve(wrongConfig));
+    storageProviderSpy.get.and.returnValue(wrongConfig);
     spyOn(configProvider.client, 'handshake').and.returnValue(Promise.resolve(sampleIndexResponse));
     await configProvider.init();
 

frontend/app/src/app/modules/config/config.provider.ts

@@ -73,7 +73,6 @@ export class ConfigProvider {
     swHttpClient: StAppsWebHttpClient,
     private readonly logger: NGXLogger,
   ) {
-    console.log('config init');
     this.client = new Client(swHttpClient, environment.backend_url, environment.backend_version);
   }
 

frontend/app/src/app/modules/dashboard/sections/jobs-section/job-section.component.html

@@ -37,5 +37,8 @@
         {{ 'dashboard.jobs.noJobs' | translate }}
       </ion-label>
     </ion-item>
+    <ion-button slot="button-end" fill="clear" color="medium" [routerLink]="['/jobs']">
+      <ion-icon slot="icon-only" name="search" [size]="24"></ion-icon>
+    </ion-button>
   }
 </stapps-section>

frontend/app/src/app/modules/data/chips/data/add-event-action-chip.component.ts

@@ -26,7 +26,6 @@ import {AddEventStates, AddEventStatesMap} from './add-event-action-chip.config'
 import {EditEventSelectionComponent} from '../edit-event-selection.component';
 import {AddEventReviewModalComponent} from '../../../calendar/add-event-review-modal.component';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
-import {MaterialSymbol} from 'material-symbols';
 
 /**
  * Shows a horizontal list of action chips
@@ -56,7 +55,7 @@ export class AddEventActionChipComponent {
   /**
    * Icon
    */
-  icon: MaterialSymbol;
+  icon: string;
 
   /**
    * Current state of icon fill

frontend/app/src/app/modules/data/chips/data/add-event-action-chip.config.ts

@@ -24,28 +24,28 @@ export enum AddEventStates {
 
 export const AddEventStatesMap = {
   [AddEventStates.ADDED_ALL]: {
-    icon: SCIcon.event_available,
+    icon: SCIcon`event_available`,
     fill: true,
     label: 'data.chips.add_events.ADDED_ALL',
     disabled: false,
     color: 'success',
   },
   [AddEventStates.ADDED_SOME]: {
-    icon: SCIcon.event,
+    icon: SCIcon`event`,
     fill: true,
     label: 'data.chips.add_events.ADDED_SOME',
     disabled: false,
     color: 'success',
   },
   [AddEventStates.REMOVED_ALL]: {
-    icon: SCIcon.calendar_today,
+    icon: SCIcon`calendar_today`,
     fill: false,
     label: 'data.chips.add_events.REMOVED_ALL',
     disabled: false,
     color: 'primary',
   },
   [AddEventStates.UNAVAILABLE]: {
-    icon: SCIcon.event_busy,
+    icon: SCIcon`event_busy`,
     fill: false,
     label: 'data.chips.add_events.UNAVAILABLE',
     disabled: true,

frontend/app/src/app/modules/data/data-icon.config.ts

@@ -14,38 +14,37 @@
  */
 import {SCThingType} from '@openstapps/core';
 import {SCIcon} from '../../util/ion-icon/icon';
-import {MaterialSymbol} from 'material-symbols';
 
-export const DataIcons = {
-  'academic event': SCIcon.school,
-  'assessment': SCIcon.fact_check,
-  'article': SCIcon.article,
-  'book': SCIcon.book,
-  'building': SCIcon.location_city,
-  'certification': SCIcon.contract,
-  'catalog': SCIcon.inventory_2,
-  'contact point': SCIcon.contact_page,
-  'course of study': SCIcon.school,
-  'date series': SCIcon.event,
-  'dish': SCIcon.lunch_dining,
-  'favorite': SCIcon.favorite,
-  'floor': SCIcon.foundation,
-  'id card': SCIcon.badge,
-  'message': SCIcon.newspaper,
-  'organization': SCIcon.business_center,
-  'periodical': SCIcon.feed,
-  'person': SCIcon.person,
-  'point of interest': SCIcon.pin_drop,
-  'publication event': SCIcon.campaign,
-  'room': SCIcon.meeting_room,
-  'semester': SCIcon.date_range,
-  'setting': SCIcon.settings,
-  'sport course': SCIcon.sports_soccer,
-  'study module': SCIcon.view_module,
-  'ticket': SCIcon.confirmation_number,
-  'todo': SCIcon.task,
-  'tour': SCIcon.tour,
-  'video': SCIcon.movie,
-  'diff': SCIcon.difference,
-  'job posting': SCIcon.work,
-} satisfies Record<SCThingType, MaterialSymbol>;
+export const DataIcons: Record<SCThingType, string> = {
+  'academic event': SCIcon`school`,
+  'assessment': SCIcon`fact_check`,
+  'article': SCIcon`article`,
+  'book': SCIcon`book`,
+  'building': SCIcon`location_city`,
+  'certification': SCIcon`contract`,
+  'catalog': SCIcon`inventory_2`,
+  'contact point': SCIcon`contact_page`,
+  'course of study': SCIcon`school`,
+  'date series': SCIcon`event`,
+  'dish': SCIcon`lunch_dining`,
+  'favorite': SCIcon`favorite`,
+  'floor': SCIcon`foundation`,
+  'id card': SCIcon`badge`,
+  'message': SCIcon`newspaper`,
+  'organization': SCIcon`business_center`,
+  'periodical': SCIcon`feed`,
+  'person': SCIcon`person`,
+  'point of interest': SCIcon`pin_drop`,
+  'publication event': SCIcon`campaign`,
+  'room': SCIcon`meeting_room`,
+  'semester': SCIcon`date_range`,
+  'setting': SCIcon`settings`,
+  'sport course': SCIcon`sports_soccer`,
+  'study module': SCIcon`view_module`,
+  'ticket': SCIcon`confirmation_number`,
+  'todo': SCIcon`task`,
+  'tour': SCIcon`tour`,
+  'video': SCIcon`movie`,
+  'diff': SCIcon`difference`,
+  'job posting': SCIcon`work`,
+};

frontend/app/src/app/modules/data/data-icon.pipe.ts

@@ -31,7 +31,7 @@ export class DataIconPipe implements PipeTransform {
   /**
    * Provide the icon name from the data type
    */
-  transform(type: SCThingType) {
+  transform(type: SCThingType): string {
     return this.typeIconMap[type];
   }
 }

frontend/app/src/app/modules/data/data.module.ts

@@ -14,9 +14,10 @@
  */
 import {ScrollingModule} from '@angular/cdk/scrolling';
 import {CommonModule} from '@angular/common';
-import {provideHttpClient, withInterceptorsFromDi} from '@angular/common/http';
+import {HttpClientModule} from '@angular/common/http';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
+import {LeafletModule} from '@asymmetrik/ngx-leaflet';
 import {IonicModule, Platform} from '@ionic/angular';
 import {TranslateModule} from '@ngx-translate/core';
 import {MarkdownModule} from 'ngx-markdown';
@@ -29,7 +30,7 @@ import {UtilModule} from '../../util/util.module';
 import {CalendarService} from '../calendar/calendar.service';
 import {ScheduleProvider} from '../calendar/schedule.provider';
 import {GeoNavigationDirective} from '../map/geo-navigation.directive';
-import {MapWidgetComponent} from '../map/map-widget.component';
+import {MapWidgetComponent} from '../map/widget/map-widget.component';
 import {MenuModule} from '../menu/menu.module';
 import {SettingsProvider} from '../settings/settings.provider';
 import {StorageModule} from '../storage/storage.module';
@@ -106,6 +107,7 @@ import {SemesterListItemComponent} from './types/semester/semester-list-item.com
 import {VideoDetailContentComponent} from './types/video/video-detail-content.component';
 import {VideoListItemComponent} from './types/video/video-list-item.component';
 import {ShareButtonComponent} from './elements/share-button.component';
+import {DataFilterComponent} from './filter/data-filter.component';
 
 /**
  * Module for handling data
@@ -141,6 +143,7 @@ import {ShareButtonComponent} from './elements/share-button.component';
     FoodDataListComponent,
     LocateActionChipComponent,
     LongInlineTextComponent,
+    MapWidgetComponent,
     MessageDetailContentComponent,
     MessageListItemComponent,
     JobPostingDetailContentComponent,
@@ -181,34 +184,14 @@ import {ShareButtonComponent} from './elements/share-button.component';
     PeriodicalDetailContentComponent,
     ShareButtonComponent,
   ],
-  exports: [
-    DataDetailComponent,
-    DataDetailContentComponent,
-    DataIconPipe,
-    DataListComponent,
-    DataListItemComponent,
-    DateSeriesListItemComponent,
-    PlaceListItemComponent,
-    SimpleCardComponent,
-    SkeletonListItemComponent,
-    SkeletonSimpleCardComponent,
-    SearchPageComponent,
-    SimpleDataListComponent,
-    OriginDetailComponent,
-    FavoriteButtonComponent,
-    TreeListComponent,
-    ExternalLinkComponent,
-    ArticleDetailContentComponent,
-    BookDetailContentComponent,
-    PeriodicalDetailContentComponent,
-    TitleCardComponent,
-  ],
   imports: [
+    DataFilterComponent,
     CommonModule,
     DataRoutingModule,
     FormsModule,
-    MapWidgetComponent,
+    HttpClientModule,
     IonicModule.forRoot(),
+    LeafletModule,
     MarkdownModule.forRoot(),
     MenuModule,
     IonIconModule,
@@ -239,7 +222,28 @@ import {ShareButtonComponent} from './elements/share-button.component';
       useFactory: browserFactory,
       deps: [Platform],
     },
-    provideHttpClient(withInterceptorsFromDi()),
+  ],
+  exports: [
+    DataDetailComponent,
+    DataDetailContentComponent,
+    DataIconPipe,
+    DataListComponent,
+    DataListItemComponent,
+    DateSeriesListItemComponent,
+    PlaceListItemComponent,
+    SimpleCardComponent,
+    SkeletonListItemComponent,
+    SkeletonSimpleCardComponent,
+    SearchPageComponent,
+    SimpleDataListComponent,
+    OriginDetailComponent,
+    FavoriteButtonComponent,
+    TreeListComponent,
+    ExternalLinkComponent,
+    ArticleDetailContentComponent,
+    BookDetailContentComponent,
+    PeriodicalDetailContentComponent,
+    TitleCardComponent,
   ],
 })
 export class DataModule {}

frontend/app/src/app/modules/data/detail/data-detail-content.scss

@@ -14,10 +14,6 @@
  */
 @import '../../../../theme/util/mixins';
 
-:host {
-  display: contents;
-}
-
 stapps-origin-detail {
   // css hack to make the element stick to the bottom of the scroll container even
   // when the content is not filling it
@@ -53,10 +49,13 @@ stapps-origin-detail {
       background: var(--ion-color-primary);
     }
 
-    & > .expand-when-space,
-    &:has(> .expand-when-space) {
-      flex: 1;
-      height: unset;
+    // Firefox doesn't support this yet...
+    @supports selector(:has(*)) {
+      & > .expand-when-space,
+      &:has(> .expand-when-space) {
+        flex: 1;
+        height: unset;
+      }
     }
   }
 }

frontend/app/src/app/modules/data/detail/data-detail.scss

@@ -17,6 +17,7 @@ ion-content > div {
   display: flex;
   flex: 1;
   flex-direction: column;
+  min-height: 100%;
 }
 
 ion-title {

frontend/app/src/app/modules/data/elements/favorite-button.component.html

@@ -13,11 +13,10 @@
   ~ this program. If not, see <https://www.gnu.org/licenses/>.
   -->
 
-<ion-button (click)="toggle($event)" fill="clear" shape="round">
+<ion-button (click)="toggle($event)" color="medium" size="small" fill="clear">
   <ion-icon
     slot="icon-only"
-    [size]="24"
-    [fill]="(isFavorite$ | async) || false"
+    [fill]="(isFavorite$ | async) ?? false"
     [class.selected]="isFavorite$ | async"
     name="grade"
   ></ion-icon>

frontend/app/src/app/modules/data/elements/favorite-button.component.scss

@@ -13,25 +13,22 @@
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
 
-ion-button {
-  --background-activated: currentcolor;
-  --background-hover: currentcolor;
-  --background-focused: currentcolor;
+:host {
+  ion-button {
+    --border-radius: 50%;
 
-  aspect-ratio: 1;
-  color: inherit;
-}
+    width: 50px;
+    height: 50px;
+  }
 
-.selected {
-  color: #fbc02d;
-}
+  .selected {
+    // TODO
+    color: #fbc02d;
+  }
 
-@media (hover: hover) {
-  ion-button:hover ::ng-deep stapps-icon {
-    --fill: 1 !important;
+  @media (hover: hover) {
+    ion-button:hover ::ng-deep stapps-icon {
+      --fill: 1;
+    }
   }
 }
-
-::ng-deep ion-item stapps-favorite-button ion-button {
-  color: var(--ion-color-medium) !important;
-}

frontend/app/src/app/modules/data/elements/favorite-button.component.ts

@@ -12,7 +12,7 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
-import {ChangeDetectionStrategy, Component, Input} from '@angular/core';
+import {Component, Input} from '@angular/core';
 import {SCIndexableThings} from '@openstapps/core';
 import {FavoritesService} from '../../favorites/favorites.service';
 import {Observable} from 'rxjs';
@@ -25,7 +25,6 @@ import {map, take} from 'rxjs/operators';
   selector: 'stapps-favorite-button',
   templateUrl: './favorite-button.component.html',
   styleUrls: ['./favorite-button.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class FavoriteButtonComponent {
   /**

frontend/app/src/app/modules/data/elements/origin-detail.component.ts

@@ -21,7 +21,6 @@ import {SCThingUserOrigin, SCThingRemoteOrigin} from '@openstapps/core';
 @Component({
   selector: 'stapps-origin-detail',
   templateUrl: 'origin-detail.html',
-  styleUrl: 'origin-detail.scss',
 })
 export class OriginDetailComponent {
   /**

frontend/app/src/app/modules/data/elements/origin-detail.html

@@ -14,61 +14,71 @@
 -->
 
 @if (origin.type === 'user') {
-  <h3>
-    {{ 'data.types.origin.TITLE' | translate | sentencecase }}:
-    {{ 'data.types.origin.USER' | translate | sentencecase }}
-  </h3>
-  <p>
-    {{ 'data.types.origin.detail.CREATED' | translate | sentencecase }}:
-    {{ origin.created | amDateFormat: 'll' }}
-  </p>
-  @if (origin.updated) {
-    <p>
-      {{ 'data.types.origin.detail.UPDATED' | translate | sentencecase }}:
-      {{ origin.updated | amDateFormat: 'll' }}
-    </p>
-  }
-  @if (origin.modified) {
-    <p>
-      {{ 'data.types.origin.detail.MODIFIED' | translate | sentencecase }}:
-      {{ origin.modified | amDateFormat: 'll' }}
-    </p>
-  }
-  @if (origin.maintainer) {
-    <p>
-      {{ 'data.types.origin.detail.MAINTAINER' | translate | sentencecase }}:
-      <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{ origin.maintainer.name }}</a>
-    </p>
-  }
+  <ion-card>
+    <ion-card-header
+      >{{ 'data.types.origin.TITLE' | translate | titlecase }}:
+      {{ 'data.types.origin.USER' | translate | titlecase }}</ion-card-header
+    >
+    <ion-card-content>
+      <p>
+        {{ 'data.types.origin.detail.CREATED' | translate | titlecase }}:
+        {{ origin.created | amDateFormat: 'll' }}
+      </p>
+      @if (origin.updated) {
+        <p>
+          {{ 'data.types.origin.detail.UPDATED' | translate | titlecase }}:
+          {{ origin.updated | amDateFormat: 'll' }}
+        </p>
+      }
+      @if (origin.modified) {
+        <p>
+          {{ 'data.types.origin.detail.MODIFIED' | translate | titlecase }}:
+          {{ origin.modified | amDateFormat: 'll' }}
+        </p>
+      }
+      @if (origin.maintainer) {
+        <p>
+          {{ 'data.types.origin.detail.MAINTAINER' | translate }}:
+          <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{ origin.maintainer.name }}</a>
+        </p>
+      }
+    </ion-card-content>
+  </ion-card>
 }
 @if (origin.type === 'remote') {
-  <h3>
-    {{ 'data.types.origin.TITLE' | translate | sentencecase }}:
-    {{ 'data.types.origin.REMOTE' | translate | sentencecase }}
-  </h3>
-  <p>
-    {{ 'data.types.origin.detail.INDEXED' | translate | sentencecase }}:
-    {{ origin.indexed | amDateFormat: 'll' }}
-  </p>
-  @if (origin.modified) {
-    <p>
-      {{ 'data.types.origin.detail.MODIFIED' | translate | sentencecase }}:
-      {{ origin.modified | amDateFormat: 'll' }}
-    </p>
-  }
-  @if (origin.name) {
-    <p>{{ 'data.types.origin.detail.MAINTAINER' | translate | sentencecase }}: {{ origin.name }}</p>
-  }
-  @if (origin.maintainer) {
-    <p>
-      {{ 'data.types.origin.detail.MAINTAINER' | translate | sentencecase }}:
-      <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{ origin.maintainer.name }}</a>
-    </p>
-  }
-  @if (origin.responsibleEntity) {
-    <p>
-      {{ 'data.types.origin.detail.RESPONSIBLE' | translate | sentencecase }}:
-      <a [routerLink]="['/data-detail', origin.responsibleEntity.uid]">{{ origin.responsibleEntity.name }}</a>
-    </p>
-  }
+  <ion-card>
+    <ion-card-header
+      >{{ 'data.types.origin.TITLE' | translate | titlecase }}:
+      {{ 'data.types.origin.REMOTE' | translate | titlecase }}</ion-card-header
+    >
+    <ion-card-content>
+      <p>
+        {{ 'data.types.origin.detail.INDEXED' | translate | titlecase }}:
+        {{ origin.indexed | amDateFormat: 'll' }}
+      </p>
+      @if (origin.modified) {
+        <p>
+          {{ 'data.types.origin.detail.MODIFIED' | translate | titlecase }}:
+          {{ origin.modified | amDateFormat: 'll' }}
+        </p>
+      }
+      @if (origin.name) {
+        <p>{{ 'data.types.origin.detail.MAINTAINER' | translate }}: {{ origin.name }}</p>
+      }
+      @if (origin.maintainer) {
+        <p>
+          {{ 'data.types.origin.detail.MAINTAINER' | translate | titlecase }}:
+          <a [routerLink]="['/data-detail', origin.maintainer.uid]">{{ origin.maintainer.name }}</a>
+        </p>
+      }
+      @if (origin.responsibleEntity) {
+        <p>
+          {{ 'data.types.origin.detail.RESPONSIBLE' | translate | titlecase }}:
+          <a [routerLink]="['/data-detail', origin.responsibleEntity.uid]">{{
+            origin.responsibleEntity.name
+          }}</a>
+        </p>
+      }
+    </ion-card-content>
+  </ion-card>
 }

frontend/app/src/app/modules/data/elements/origin-detail.scss

@@ -1,15 +0,0 @@
-:host {
-  padding: var(--spacing-lg);
-  padding-top: 0;
-}
-
-h3 {
-  font-weight: bold;
-}
-
-h3,
-p {
-  margin: 0;
-  font-size: 0.8em;
-  opacity: 0.8;
-}

frontend/app/src/app/modules/data/elements/title-card.component.ts

@@ -18,8 +18,8 @@ import {SCThings} from '@openstapps/core';
 import {SCIcon} from '../../../util/ion-icon/icon';
 
 const AccordionButtonState = {
-  collapsed: SCIcon.expand_more,
-  expanded: SCIcon.expand_less,
+  collapsed: SCIcon`expand_more`,
+  expanded: SCIcon`expand_less`,
 };
 
 @Component({
@@ -35,8 +35,7 @@ export class TitleCardComponent implements OnInit, OnChanges {
 
   @ViewChild('accordionTextArea') accordionTextArea: ElementRef;
 
-  buttonState: (typeof AccordionButtonState)[keyof typeof AccordionButtonState] =
-    AccordionButtonState.collapsed;
+  buttonState = AccordionButtonState.collapsed;
 
   buttonShown = true;
 

frontend/app/src/app/modules/data/filter/data-filter.component.ts

@@ -0,0 +1,28 @@
+import {AsyncPipe, CommonModule} from '@angular/common';
+import {ChangeDetectionStrategy, Component, Input} from '@angular/core';
+import {IonicModule} from '@ionic/angular';
+import {IonIconModule} from 'src/app/util/ion-icon/ion-icon.module';
+import {DataFilterProvider} from './data-filter.provider';
+import {ThingTranslateModule} from 'src/app/translation/thing-translate.module';
+import {PropertyValueTranslatePipe} from 'src/app/translation/property-value-translate.pipe';
+
+@Component({
+  selector: 'stapps-data-filter',
+  templateUrl: 'data-filter.html',
+  styleUrls: ['data-filter.scss'],
+  standalone: true,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    CommonModule,
+    IonicModule,
+    IonIconModule,
+    AsyncPipe,
+    ThingTranslateModule,
+    PropertyValueTranslatePipe,
+  ],
+})
+export class DataFilterComponent {
+  @Input() expandBucketCount = 3;
+
+  constructor(readonly filterProvider: DataFilterProvider) {}
+}

frontend/app/src/app/modules/data/filter/data-filter.html

@@ -0,0 +1,75 @@
+<ion-chip (click)="sortMenu.present($event)">
+  <ion-label>Relevance</ion-label>
+  <ion-icon name="expand_more"></ion-icon>
+</ion-chip>
+<ion-popover #sortMenu side="bottom" alignment="start">
+  <ng-template>
+    <ion-content class="ion-padding">
+      <ion-radio-group value="relevance">
+        <ion-radio value="relevance">Relevance</ion-radio>
+        <ion-radio value="name">Name</ion-radio>
+        <ion-radio value="type">Type</ion-radio>
+      </ion-radio-group>
+    </ion-content>
+  </ng-template>
+</ion-popover>
+<div class="separator"></div>
+<ng-container *ngIf="filterProvider.context | async as context">
+  <ng-container *ngFor="let facet of context.facets">
+    <ng-container *ngIf="facet.buckets.length > 1">
+      <ng-template #facetLabel>
+        <ng-container *ngIf="facet.onlyOnType; else notOnlyOnType">
+          <strong>{{facet.onlyOnType | propertyValueTranslate: 'type': facet.onlyOnType | titlecase}}</strong>
+          / {{facet.field | propertyNameTranslate: facet.onlyOnType | titlecase}}
+        </ng-container>
+        <ng-template #notOnlyOnType>
+          {{facet.field | propertyNameTranslate: $any('building') | titlecase}}
+        </ng-template>
+      </ng-template>
+      <ng-template #bucketLabel let-bucket>
+        {{bucket.key | propertyValueTranslate: facet.field: (facet.onlyOnType ?? $any(bucket.key)) |
+        titlecase}}
+      </ng-template>
+
+      <ng-container *ngIf="facet.buckets.length <= expandBucketCount; else expandableFacet">
+        <div class="separator"></div>
+        <div class="expanded-facet">
+          <div class="buckets">
+            <ion-chip *ngFor="let bucket of facet.buckets" [outline]="true">
+              <ion-label>
+                <ng-container *ngTemplateOutlet="bucketLabel; context: {$implicit: bucket}"></ng-container>
+              </ion-label>
+            </ion-chip>
+          </div>
+          <div class="facet-label">
+            <ng-container *ngTemplateOutlet="facetLabel"></ng-container>
+          </div>
+        </div>
+        <div class="separator"></div>
+      </ng-container>
+
+      <ng-template #expandableFacet>
+        <ion-chip (click)="filterMenu.present($event)" [outline]="true">
+          <ion-label>
+            <ng-container *ngTemplateOutlet="facetLabel"></ng-container>
+          </ion-label>
+          <ion-icon name="expand_more"></ion-icon>
+        </ion-chip>
+
+        <ion-popover #filterMenu side="bottom" alignment="start">
+          <ng-template>
+            <ion-content>
+              <ion-list>
+                <ion-item *ngFor="let bucket of facet.buckets">
+                  <ion-checkbox slot="start"></ion-checkbox>
+                  <ion-label>{{bucket.key}}</ion-label>
+                  <ion-note slot="end">{{bucket.count}}</ion-note>
+                </ion-item>
+              </ion-list>
+            </ion-content>
+          </ng-template>
+        </ion-popover>
+      </ng-template>
+    </ng-container>
+  </ng-container>
+</ng-container>

frontend/app/src/app/modules/data/filter/data-filter.provider.ts

@@ -0,0 +1,12 @@
+import {Injectable} from '@angular/core';
+import {SCSearchResult} from '@openstapps/core';
+import {BehaviorSubject} from 'rxjs';
+
+@Injectable()
+export class DataFilterProvider {
+  readonly context = new BehaviorSubject<SCSearchResult | undefined>(undefined);
+
+  readonly userSortOption = new BehaviorSubject<string | undefined>(undefined);
+
+  readonly userFilterOption = new BehaviorSubject(new Map<string, string | number>());
+}

frontend/app/src/app/modules/data/filter/data-filter.scss

@@ -0,0 +1,36 @@
+:host {
+  overflow-x: auto;
+  display: flex;
+  align-items: flex-start;
+  margin-block: var(--spacing-xs);
+
+  > * {
+    flex-shrink: 0;
+  }
+}
+
+.expanded-facet {
+  display: flex;
+  flex-direction: column;
+
+  > .facet-label {
+    margin-inline: var(--spacing-md);
+    font-size: 0.7em;
+  }
+}
+
+.separator {
+  align-self: center;
+
+  width: 1px;
+  height: 1.25em;
+  margin-inline: var(--spacing-xs);
+
+  opacity: 0.2;
+  background: currentcolor;
+
+  &:last-child,
+  + .separator {
+    display: none;
+  }
+}

frontend/app/src/app/modules/data/list/food-data-list.component.ts

@@ -12,94 +12,109 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
-import {Component} from '@angular/core';
-import {PositionService} from '../../map/position.service';
+import {Component, OnInit} from '@angular/core';
+import {MapPosition} from '../../map/position.service';
+import {SearchPageComponent} from './search-page.component';
 import {Geolocation} from '@capacitor/geolocation';
-import {BehaviorSubject, catchError} from 'rxjs';
+import {BehaviorSubject} from 'rxjs';
 import {pauseWhen} from '../../../util/rxjs/pause-when';
-import {SCSearchFilter} from '@openstapps/core';
-import {ContextMenuService} from '../../menu/context/context-menu.service';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 
 /**
  * Presents a list of places for eating/drinking
  */
 @Component({
-  templateUrl: 'food-data-list.html',
+  templateUrl: 'search-page.html',
+  styleUrls: ['../../data/list/search-page.scss'],
 })
-export class FoodDataListComponent {
+export class FoodDataListComponent extends SearchPageComponent implements OnInit {
+  title = 'canteens.title';
+
+  showNavigation = false;
+
   isNotInView$ = new BehaviorSubject(true);
 
-  forcedFilter: SCSearchFilter = {
-    arguments: {
-      filters: [
-        {
-          arguments: {
-            field: 'categories',
-            value: 'canteen',
-          },
-          type: 'value',
-        },
-        {
-          arguments: {
-            field: 'categories',
-            value: 'student canteen',
-          },
-          type: 'value',
-        },
-        {
-          arguments: {
-            field: 'categories',
-            value: 'cafe',
-          },
-          type: 'value',
-        },
-        {
-          arguments: {
-            field: 'categories',
-            value: 'restaurant',
-          },
-          type: 'value',
-        },
-      ],
-      operation: 'or',
-    },
-    type: 'boolean',
-  };
-
-  constructor(positionService: PositionService, contextMenuService: ContextMenuService) {
-    positionService
+  /**
+   * Sets the forced filter to present only places for eating/drinking
+   */
+  ngOnInit() {
+    this.positionService
       .watchCurrentLocation({enableHighAccuracy: false, maximumAge: 1000})
-      .pipe(
-        pauseWhen(this.isNotInView$),
-        takeUntilDestroyed(),
-        catchError(async _error => {
-          await Geolocation.checkPermissions();
-        }),
-      )
+      .pipe(pauseWhen(this.isNotInView$), takeUntilDestroyed(this.destroy$))
       .subscribe({
-        next(position) {
-          if (!position) return;
-          positionService.position = position;
-          contextMenuService.sortQuery.next([
-            {
-              type: 'distance',
-              order: 'asc',
-              arguments: {
-                field: 'geo',
-                position: [position.longitude, position.latitude],
-              },
-            },
-          ]);
+        next: (position: MapPosition) => {
+          this.positionService.position = position;
         },
-        async error() {
-          positionService.position = undefined;
+        error: async _error => {
+          this.positionService.position = undefined;
           await Geolocation.checkPermissions();
         },
       });
+    this.showDefaultData = true;
+
+    this.sortQuery = [
+      {
+        arguments: {field: 'name'},
+        order: 'asc',
+        type: 'ducet',
+      },
+    ];
+
+    this.forcedFilter = {
+      arguments: {
+        filters: [
+          {
+            arguments: {
+              field: 'categories',
+              value: 'canteen',
+            },
+            type: 'value',
+          },
+          {
+            arguments: {
+              field: 'categories',
+              value: 'student canteen',
+            },
+            type: 'value',
+          },
+          {
+            arguments: {
+              field: 'categories',
+              value: 'cafe',
+            },
+            type: 'value',
+          },
+          {
+            arguments: {
+              field: 'categories',
+              value: 'restaurant',
+            },
+            type: 'value',
+          },
+        ],
+        operation: 'or',
+      },
+      type: 'boolean',
+    };
+
+    if (this.positionService.position) {
+      this.sortQuery = [
+        {
+          type: 'distance',
+          order: 'asc',
+          arguments: {
+            field: 'geo',
+            position: [this.positionService.position.longitude, this.positionService.position.latitude],
+          },
+        },
+      ];
+    }
+
+    super.ngOnInit();
   }
 
-  ionViewWillEnter() {
+  async ionViewWillEnter() {
+    await super.ionViewWillEnter();
     this.isNotInView$.next(false);
   }
 

frontend/app/src/app/modules/data/list/food-data-list.html

@@ -1,7 +0,0 @@
-<stapps-search-page
-  [title]="'canteens.title' | translate"
-  [navigation]="[]"
-  [showDefaultData]="true"
-  [forcedFilter]="forcedFilter"
->
-</stapps-search-page>

frontend/app/src/app/modules/data/list/search-page.component.ts

@@ -12,7 +12,7 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
-import {Component, DestroyRef, inject, Input, OnInit} from '@angular/core';
+import {Component, DestroyRef, Inject, inject, Input, OnInit} from '@angular/core';
 import {ActivatedRoute, Router} from '@angular/router';
 import {Keyboard} from '@capacitor/keyboard';
 import {AlertController, AnimationBuilder, AnimationController} from '@ionic/angular';
@@ -36,6 +36,7 @@ import {PositionService} from '../../map/position.service';
 import {ConfigProvider} from '../../config/config.provider';
 import {searchPageSwitchAnimation} from './search-page-switch-animation';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
+import {DataFilterProvider} from '../filter/data-filter.provider';
 
 /**
  * SearchPageComponent queries things and shows list of things as search results and filter as context menu
@@ -44,7 +45,7 @@ import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
   selector: 'stapps-search-page',
   templateUrl: 'search-page.html',
   styleUrls: ['search-page.scss'],
-  providers: [ContextMenuService],
+  providers: [ContextMenuService, DataFilterProvider],
 })
 export class SearchPageComponent implements OnInit {
   @Input() title = 'search.title';
@@ -55,18 +56,17 @@ export class SearchPageComponent implements OnInit {
 
   @Input() backUrl?: string;
 
+  isHebisAvailable = false;
+
   /**
    * Signalizes that the data is being loaded
    */
   loading = false;
 
   /**
-   * Navigation elements between search pages
+   * Display the navigation between default and library search
    */
-  @Input() navigation: Array<{label: string; routerLink?: string[]}> = [
-    {label: 'search.type'},
-    {label: 'hebisSearch.type', routerLink: ['/hebis-search']},
-  ];
+  @Input() showNavigation = true;
 
   /**
    * Show default data (e.g. when there is user interaction)
@@ -83,8 +83,6 @@ export class SearchPageComponent implements OnInit {
    */
   @Input() showTopToolbar = true;
 
-  @Input() showContextMenu = true;
-
   /**
    * Api query filter
    */
@@ -113,7 +111,7 @@ export class SearchPageComponent implements OnInit {
   /**
    * Page size of queries
    */
-  @Input() pageSize = 30;
+  pageSize = 30;
 
   /**
    * Search value from search bar
@@ -147,6 +145,8 @@ export class SearchPageComponent implements OnInit {
 
   destroy$ = inject(DestroyRef);
 
+  dataFilterProvider = inject(DataFilterProvider);
+
   routeAnimation: AnimationBuilder;
 
   /**
@@ -219,6 +219,7 @@ export class SearchPageComponent implements OnInit {
 
     try {
       const result = await this.dataProvider.search(searchOptions);
+      this.dataFilterProvider.context.next(result);
       this.singleTypeResponse = result.facets.find(facet => facet.field === 'type')?.buckets.length === 1;
       if (append) {
         // append results
@@ -346,13 +347,8 @@ export class SearchPageComponent implements OnInit {
         });
     }
     try {
-      // TODO: make this hack more generic
-      if (this.navigation[1]?.routerLink?.[0] === '/hebis-search') {
-        const features = this.configProvider.getValue('features') as SCFeatureConfiguration;
-        if (features.plugins?.['hebis-plugin']?.urlPath === undefined) {
-          this.navigation = [];
-        }
-      }
+      const features = this.configProvider.getValue('features') as SCFeatureConfiguration;
+      this.isHebisAvailable = !!features.plugins?.['hebis-plugin']?.urlPath;
     } catch (error) {
       this.logger.error(error);
     }

frontend/app/src/app/modules/data/list/search-page.html

@@ -13,74 +13,44 @@
 ~ this program. If not, see <https://www.gnu.org/licenses/>.
 -->
 
-@if (showContextMenu) {
-  <stapps-context contentId="data-list"></stapps-context>
-}
+<stapps-context contentId="data-list"></stapps-context>
 <ion-header>
   @if (showDrawer && showTopToolbar) {
-    <ion-toolbar color="primary" mode="ios">
-      <ion-buttons slot="start">
-        <ion-back-button [defaultHref]="backUrl"></ion-back-button>
-      </ion-buttons>
-      <ion-title>{{ title | translate }}</ion-title>
-    </ion-toolbar>
+  <ion-toolbar color="primary" mode="ios">
+    <ion-buttons slot="start">
+      <ion-back-button [defaultHref]="backUrl"></ion-back-button>
+    </ion-buttons>
+    <ion-title>{{ title | translate }}</ion-title>
+  </ion-toolbar>
   }
   <ion-toolbar color="primary">
-    <ion-searchbar
-      (ngModelChange)="searchStringChanged($event)"
-      (keyup.enter)="hideKeyboard()"
-      (search)="hideKeyboard()"
-      [(ngModel)]="queryText"
-      showClearButton="always"
-      placeholder="{{ placeholder | translate }}"
-      mode="md"
-      type="search"
-      enterkeyhint="search"
-      class="filterable"
-      [autofocus]="!showDefaultData"
-    >
-      @if (showContextMenu) {
-        <ion-menu-button menu="context" auto-hide="false">
-          <ion-icon name="tune"></ion-icon>
-        </ion-menu-button>
-      }
+    <ion-searchbar (ngModelChange)="searchStringChanged($event)" (keyup.enter)="hideKeyboard()"
+      (search)="hideKeyboard()" [(ngModel)]="queryText" showClearButton="always"
+      placeholder="{{ placeholder | translate }}" mode="md" type="search" enterkeyhint="search" class="filterable"
+      [autofocus]="!showDefaultData">
+      <ion-menu-button menu="context" auto-hide="false">
+        <ion-icon name="tune"></ion-icon>
+      </ion-menu-button>
     </ion-searchbar>
   </ion-toolbar>
-  @if (navigation.length > 0) {
-    <ion-toolbar color="primary" class="category-tab">
-      <ion-buttons class="ion-justify-content-between">
-        @for (target of navigation; track target) {
-          @if (target.routerLink) {
-            <ion-button
-              [routerLink]="target.routerLink"
-              queryParamsHandling="merge"
-              [routerAnimation]="routeAnimation"
-              fill="outline"
-              size="large"
-              >{{ target.label | translate }}
-            </ion-button>
-          } @else {
-            <ion-button class="button-active" size="large">{{ target.label | translate }}</ion-button>
-          }
-        }
-      </ion-buttons>
-    </ion-toolbar>
+  @if (showNavigation && isHebisAvailable) {
+  <ion-toolbar color="primary" class="category-tab">
+    <ion-buttons class="ion-justify-content-between">
+      <ion-button class="button-active" size="large">{{ 'search.type' | translate }}</ion-button>
+      <ion-button [routerLink]="['/hebis-search']" queryParamsHandling="merge" [routerAnimation]="routeAnimation"
+        fill="outline" size="large">{{ 'hebisSearch.type' | translate }}
+      </ion-button>
+    </ion-buttons>
+  </ion-toolbar>
   }
 </ion-header>
 
 <ion-content class="content">
-  <div
-    [class.no-results]="!showDefaultData && !items && !loading"
-    [style.display]="!showDefaultData && !items && !loading ? 'block' : 'none'"
-  >
+  <div [class.no-results]="!showDefaultData && !items && !loading"
+    [style.display]="!showDefaultData && !items && !loading ? 'block' : 'none'">
     <ion-label class="centered-message-container"> {{ searchInstruction | translate }} </ion-label>
   </div>
-  <stapps-data-list
-    id="data-list"
-    [items]="items | async"
-    [singleType]="singleTypeResponse"
-    (loadmore)="loadMore()"
-    [resetToTop]="queryChanged.asObservable()"
-    [loading]="loading"
-  ></stapps-data-list>
+  <stapps-data-filter></stapps-data-filter>
+  <stapps-data-list id="data-list" [items]="items | async" [singleType]="singleTypeResponse" (loadmore)="loadMore()"
+    [resetToTop]="queryChanged.asObservable()" [loading]="loading"></stapps-data-list>
 </ion-content>

frontend/app/src/app/modules/data/list/search-page.scss

@@ -22,9 +22,6 @@
 
 ion-toolbar {
   --ion-color-base: none !important;
-
-  // account for back button
-  min-height: 42px;
 }
 
 ion-toolbar:first-of-type {
@@ -38,6 +35,7 @@ ion-toolbar:first-of-type {
     ion-button {
       width: 50%;
       margin: 0;
+      text-transform: none;
     }
   }
 }

frontend/app/src/app/modules/data/types/article/article-item.component.ts

@@ -22,7 +22,6 @@ import {DataListItemComponent} from '../../list/data-list-item.component';
 @Component({
   selector: 'stapps-article-item',
   templateUrl: 'article-list-item.html',
-  styleUrl: 'article-list-item.scss',
 })
 export class ArticleListItemComponent extends DataListItemComponent {
   /**

frontend/app/src/app/modules/data/types/article/article-list-item.html

@@ -13,20 +13,26 @@
 ~ this program. If not, see <https://www.gnu.org/licenses/>.
 -->
 
-<ion-label class="title">{{ 'name' | thingTranslate: item }}</ion-label>
-<p class="title-sub">
-  @for (author of item.authors; track author) {
-    {{ 'name' | thingTranslate: author }}
-  }
-  @if (item.authors && item.authors && item.firstPublished) {
-    ,&nbsp;
-  }
-  @if (item.firstPublished && !item.lastPublished) {
-    {{ item.firstPublished }}
-  } @else {
-    @if (item.firstPublished && item.lastPublished) {
-      {{ [item.firstPublished, item.lastPublished] | join: ' - ' }}
-    }
-  }
-</p>
-<ion-note> {{ 'categories' | thingTranslate: item }} </ion-note>
+<ion-grid>
+  <ion-row>
+    <ion-col>
+      <h2 class="name">{{ 'name' | thingTranslate: item }}</h2>
+      <p>
+        @for (author of item.authors; track author) {
+          {{ 'name' | thingTranslate: author }}
+        }
+        @if (item.authors && item.authors && item.firstPublished) {
+          ,&nbsp;
+        }
+        @if (item.firstPublished && !item.lastPublished) {
+          {{ item.firstPublished }}
+        } @else {
+          @if (item.firstPublished && item.lastPublished) {
+            {{ [item.firstPublished, item.lastPublished] | join: ' - ' }}
+          }
+        }
+      </p>
+      <ion-note> {{ 'categories' | thingTranslate: item }} </ion-note>
+    </ion-col>
+  </ion-row>
+</ion-grid>

frontend/app/src/app/modules/data/types/article/article-list-item.scss

@@ -1,3 +0,0 @@
-p.title-sub {
-  white-space: unset;
-}

frontend/app/src/app/modules/data/types/book/book-list-item.component.ts

@@ -22,7 +22,6 @@ import {DataListItemComponent} from '../../list/data-list-item.component';
 @Component({
   selector: 'stapps-book-list-item',
   templateUrl: 'book-list-item.html',
-  styleUrl: 'book-list-item.scss',
 })
 export class BookListItemComponent extends DataListItemComponent {
   /**

frontend/app/src/app/modules/data/types/book/book-list-item.html

@@ -13,20 +13,26 @@
 ~ this program. If not, see <https://www.gnu.org/licenses/>.
 -->
 
-<ion-label class="title">{{ 'name' | thingTranslate: item }}</ion-label>
-<p class="title-sub">
-  @for (author of item.authors; track author) {
-    {{ 'name' | thingTranslate: author }}
-  }
-  @if (item.authors && item.authors && item.firstPublished) {
-    ,&nbsp;
-  }
-  @if (item.firstPublished && !item.lastPublished) {
-    {{ item.firstPublished }}
-  } @else {
-    @if (item.firstPublished && item.lastPublished) {
-      {{ [item.firstPublished, item.lastPublished] | join: ' - ' }}
-    }
-  }
-</p>
-<ion-note> {{ 'categories' | thingTranslate: item }} </ion-note>
+<ion-grid>
+  <ion-row>
+    <ion-col>
+      <h2 class="name">{{ 'name' | thingTranslate: item }}</h2>
+      <p>
+        @for (author of item.authors; track author) {
+          {{ 'name' | thingTranslate: author }}
+        }
+        @if (item.authors && item.authors && item.firstPublished) {
+          ,&nbsp;
+        }
+        @if (item.firstPublished && !item.lastPublished) {
+          {{ item.firstPublished }}
+        } @else {
+          @if (item.firstPublished && item.lastPublished) {
+            {{ [item.firstPublished, item.lastPublished] | join: ' - ' }}
+          }
+        }
+      </p>
+      <ion-note> {{ 'categories' | thingTranslate: item }} </ion-note>
+    </ion-col>
+  </ion-row>
+</ion-grid>

frontend/app/src/app/modules/data/types/book/book-list-item.scss

@@ -1,3 +0,0 @@
-p.title-sub {
-  white-space: unset;
-}

frontend/app/src/app/modules/data/types/date-series/date-series-detail-content.html

@@ -68,5 +68,5 @@
   </ion-card>
 }
 @if (item.inPlace && item.inPlace.geo) {
-  <stapps-map-widget [place]="$any(item.inPlace)"></stapps-map-widget>
+  <stapps-map-widget [place]="item.inPlace"></stapps-map-widget>
 }

frontend/app/src/app/modules/data/types/periodical/periodical-list-item.component.ts

@@ -22,7 +22,6 @@ import {DataListItemComponent} from '../../list/data-list-item.component';
 @Component({
   selector: 'stapps-periodical-list-item',
   templateUrl: 'periodical-list-item.html',
-  styleUrl: 'periodical-list-item.scss',
 })
 export class PeriodicalListItemComponent extends DataListItemComponent {
   /**

frontend/app/src/app/modules/data/types/periodical/periodical-list-item.html

@@ -13,20 +13,26 @@
 ~ this program. If not, see <https://www.gnu.org/licenses/>.
 -->
 
-<ion-label class="title">{{ 'name' | thingTranslate: item }}</ion-label>
-<p class="title-sub">
-  @for (author of item.authors; track author) {
-    {{ 'name' | thingTranslate: author }}
-  }
-  @if (item.authors && item.authors && item.firstPublished) {
-    ,&nbsp;
-  }
-  @if (item.firstPublished && !item.lastPublished) {
-    {{ item.firstPublished }}
-  } @else {
-    @if (item.firstPublished && item.lastPublished) {
-      {{ [item.firstPublished, item.lastPublished] | join: ' - ' }}
-    }
-  }
-</p>
-<ion-note> {{ 'categories' | thingTranslate: item }} </ion-note>
+<ion-grid>
+  <ion-row>
+    <ion-col>
+      <h2 class="name">{{ 'name' | thingTranslate: item }}</h2>
+      <p>
+        @for (author of item.authors; track author) {
+          {{ 'name' | thingTranslate: author }}
+        }
+        @if (item.authors && item.authors && item.firstPublished) {
+          ,&nbsp;
+        }
+        @if (item.firstPublished && !item.lastPublished) {
+          {{ item.firstPublished }}
+        } @else {
+          @if (item.firstPublished && item.lastPublished) {
+            {{ [item.firstPublished, item.lastPublished] | join: ' - ' }}
+          }
+        }
+      </p>
+      <ion-note> {{ 'categories' | thingTranslate: item }} </ion-note>
+    </ion-col>
+  </ion-row>
+</ion-grid>

frontend/app/src/app/modules/data/types/periodical/periodical-list-item.scss

@@ -1,3 +0,0 @@
-p.title-sub {
-  white-space: unset;
-}

frontend/app/src/app/modules/data/types/place/place-list-item.component.ts

@@ -17,6 +17,7 @@ import {PositionService} from '../../../map/position.service';
 import {filter, Observable} from 'rxjs';
 import {hasValidLocation, isSCFloor, PlaceTypes, PlaceTypesWithDistance} from './place-types';
 import {map} from 'rxjs/operators';
+import {LatLng, geoJSON} from 'leaflet';
 import {trigger, transition, style, animate} from '@angular/animations';
 
 /**
@@ -38,14 +39,13 @@ export class PlaceListItemComponent {
   @Input() set item(item: PlaceTypes) {
     this._item = item;
     if (!isSCFloor(item) && hasValidLocation(item)) {
-      this.distance = this.positionService.geoLocation.pipe(
-        map(
-          position =>
-            Math.hypot(
-              position.coords.latitude - item.geo.point.coordinates[1],
-              position.coords.longitude - item.geo.point.coordinates[0],
-            ) * 111_139,
+      this.distance = this.positionService.watchCurrentLocation().pipe(
+        map(position =>
+          new LatLng(position.latitude, position.longitude).distanceTo(
+            geoJSON(item.geo.point).getBounds().getCenter(),
+          ),
         ),
+
         filter(it => it !== undefined),
       );
     }

frontend/app/src/app/modules/data/types/place/place-list-item.html

@@ -12,29 +12,36 @@
 ~ You should have received a copy of the GNU General Public License along with
 ~ this program. If not, see <https://www.gnu.org/licenses/>.
 -->
+<ng-template #distanceView>
+  @if (distance | async; as distance) {
+    <ion-label class="distance" @fade>
+      <ion-icon name="directions_walk"></ion-icon>
+      {{ distance | metersLocalized }}
+    </ion-label>
+  }
+</ng-template>
 <ion-label class="title">{{ 'name' | thingTranslate: _item }}</ion-label>
 @if (_item.type !== 'floor') {
-  <p class="title-sub">
-    <stapps-opening-hours [openingHours]="_item.openingHours"></stapps-opening-hours>
-    @if (_item.type !== 'building' && _item.inPlace) {
-      <ion-icon name="pin_drop"></ion-icon>
-      <ion-label>{{ 'name' | thingTranslate: _item.inPlace }}</ion-label>
-    }
-  </p>
-  <ion-note>
-    @if (_item.categories && _item.type !== 'building') {
+  <stapps-opening-hours [openingHours]="_item.openingHours"></stapps-opening-hours>
+  @if (_item.categories && _item.type !== 'building') {
+    <ion-note>
       <ion-label> {{ 'categories' | thingTranslate: _item | join: ', ' | titlecase }} </ion-label>
-    } @else {
+      <ng-container *ngTemplateOutlet="distanceView"></ng-container>
+    </ion-note>
+  } @else {
+    <ion-note>
       <ion-label> {{ 'type' | thingTranslate: _item | titlecase }} </ion-label>
-    }
-    @if (distance | async; as distance) {
-      <ion-label @fade>
-        <ion-icon name="directions_walk"></ion-icon>
-        {{ distance | metersLocalized }}
-      </ion-label>
-    }
-  </ion-note>
+      <ng-container *ngTemplateOutlet="distanceView"></ng-container>
+    </ion-note>
+  }
 }
 @if (_item.description) {
   <p>{{ 'description' | thingTranslate: _item }}</p>
 }
+@if (_item.type !== 'building') {
+  @if (_item.inPlace) {
+    <ion-col size="auto" class="in-place">
+      <ion-icon name="pin_drop"></ion-icon><ion-label>{{ 'name' | thingTranslate: _item.inPlace }}</ion-label>
+    </ion-col>
+  }
+}

frontend/app/src/app/modules/data/types/place/place-list-item.scss

@@ -15,8 +15,6 @@
 
 ion-note {
   display: flex;
-  align-items: center;
-  justify-content: flex-start;
 
   > ion-label {
     display: inline-flex;
@@ -25,16 +23,17 @@ ion-note {
   }
 }
 
-p.title-sub {
-  display: flex;
-  align-items: center;
-}
-
-ion-label + ion-label::before {
+ion-label + ion-label.distance::before {
   content: '•';
   margin-inline: var(--spacing-xs);
 }
 
+.in-place {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
 stapps-opening-hours ::ng-deep div {
   padding-block: var(--spacing-xs);
 }

frontend/app/src/app/modules/data/types/place/special/mensa/place-mensa-detail.component.ts

@@ -12,6 +12,7 @@
  * You should have received a copy of the GNU General Public License along with
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
+import moment, {Moment} from 'moment';
 import {AfterViewInit, Component, DestroyRef, inject, Input} from '@angular/core';
 import {SCDish, SCISO8601Date, SCPlace} from '@openstapps/core';
 import {PlaceMensaService} from './place-mensa-service';
@@ -52,6 +53,11 @@ export class PlaceMensaDetailComponent implements AfterViewInit {
    */
   selectedDay: string;
 
+  /**
+   * First day to display menu items for
+   */
+  startingDay: Moment;
+
   destroy$ = inject(DestroyRef);
 
   constructor(
@@ -59,7 +65,9 @@ export class PlaceMensaDetailComponent implements AfterViewInit {
     protected router: Router,
     readonly routerOutlet: IonRouterOutlet,
     private readonly dataRoutingService: DataRoutingService,
-  ) {}
+  ) {
+    this.startingDay = moment().startOf('day');
+  }
 
   ngAfterViewInit() {
     if (!this.openAsModal) {

frontend/app/src/app/modules/data/types/place/special/mensa/place-mensa.scss

@@ -13,6 +13,10 @@
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
 
+ion-segment-button {
+  text-transform: none;
+}
+
 ion-segment {
   overflow: auto;
   justify-content: space-between;

frontend/app/src/app/modules/hebis/daia-data.provider.spec.ts

@@ -21,7 +21,7 @@ import {StAppsWebHttpClient} from '../data/stapps-web-http-client.provider';
 import {StorageProvider} from '../storage/storage.provider';
 import {LoggerTestingModule} from 'ngx-logger/testing';
 import {MapModule} from '../map/map.module';
-import {provideHttpClient, withInterceptorsFromDi} from '@angular/common/http';
+import {HttpClientModule} from '@angular/common/http';
 import {StorageModule} from '../storage/storage.module';
 import {DaiaHolding, DaiaService} from './protocol/response';
 import {Observable, of} from 'rxjs';
@@ -47,6 +47,7 @@ describe('DaiaDataProvider', () => {
       imports: [
         HebisModule,
         MapModule,
+        HttpClientModule,
         StorageModule,
         LoggerTestingModule,
         TranslateModule.forRoot({
@@ -61,7 +62,6 @@ describe('DaiaDataProvider', () => {
         StAppsWebHttpClient,
         StorageProvider,
         DaiaDataProvider,
-        provideHttpClient(withInterceptorsFromDi()),
       ],
     });
     daiaDataProvider = TestBed.inject(DaiaDataProvider);

frontend/app/src/app/modules/hebis/hebis-data.provider.ts

@@ -21,7 +21,6 @@ import {StAppsWebHttpClient} from '../data/stapps-web-http-client.provider';
 import {HttpClient} from '@angular/common/http';
 import {DataProvider} from '../data/data.provider';
 import {SCHebisSearchRoute} from './protocol/route';
-import {SCSearchRequest, SCSearchResponse} from '@openstapps/core';
 
 const HEBIS_PREFIX = 'HEB';
 
@@ -47,6 +46,12 @@ export class HebisDataProvider extends DataProvider {
    */
   private readonly hebisSearchRoute = new SCHebisSearchRoute();
 
+  /**
+   * TODO
+   * @param stAppsWebHttpClient TODO
+   * @param storageProvider TODO
+   * @param httpClient TODO
+   */
   constructor(
     stAppsWebHttpClient: StAppsWebHttpClient,
     storageProvider: StorageProvider,
@@ -58,23 +63,6 @@ export class HebisDataProvider extends DataProvider {
     this.client = new Client(stAppsWebHttpClient, this.backendUrl, this.appVersion);
   }
 
-  override async search(query: SCSearchRequest): Promise<SCSearchResponse> {
-    const response = await this.hebisSearch({
-      query: query.query ?? '',
-      page: query.from,
-    });
-    console.log(response.pagination);
-
-    return {
-      data: response.data,
-      facets: [],
-      pagination: response.pagination,
-      stats: {
-        time: Number.NaN,
-      },
-    };
-  }
-
   /**
    * Send a search request to the backend
    *