feat: new color system

2026-01-22 17:42:57 +00:00 · 2024-10-02 13:01:56 +02:00
69 changed files with 1061 additions and 3047 deletions
--- a/.changeset/pink-crabs-bathe.md
+++ b/.changeset/pink-crabs-bathe.md
@@ -1,5 +0,0 @@
 ---
 "@openstapps/app": minor
 ---
 Use user facing changelogs in the about pages as the primary source, with the technical changes accessible through a sub menu.
--- a/backend/backend/package.json
+++ b/backend/backend/package.json
@@ -53,7 +53,7 @@
    "@types/geojson": "1.0.6",
    "@types/node": "18.15.3",
    "@types/node-cron": "3.0.7",
-    "@types/nodemailer": "6.4.15",
+    "@types/nodemailer": "6.4.7",
    "@types/promise-queue": "2.2.0",
    "@types/uuid": "8.3.4",
    "body-parser": "1.20.2",
@@ -69,7 +69,7 @@
    "nock": "13.3.1",
    "node-cache": "5.1.2",
    "node-cron": "3.0.2",
-    "nodemailer": "6.9.14",
+    "nodemailer": "6.9.1",
    "prom-client": "14.1.1",
    "promise-queue": "2.2.5",
    "uuid": "8.3.2"
--- a/backend/mail-plugin/app.js
+++ b/backend/mail-plugin/app.js
@@ -1,2 +0,0 @@
 #!/usr/bin/env node
 import './lib/cli.js';
--- a/backend/mail-plugin/package.json
+++ b/backend/mail-plugin/package.json
@@ -1,68 +0,0 @@
 {
  "name": "@openstapps/mail-plugin",
  "description": "Mail Plugin",
  "version": "3.2.0",
  "private": true,
  "type": "module",
  "license": "GPL-3.0-only",
  "author": "Thea Schöbl",
  "bin": "app.js",
  "files": [
    "app.js",
    "lib",
    "README.md",
    "CHANGELOG.md",
    "Dockerfile"
  ],
  "scripts": {
    "build": "tsup-node --dts",
    "deploy": "pnpm --prod --filter=@openstapps/minimal-plugin deploy ../../.deploy/minimal-plugin",
    "dev": "tsup-node --watch --onSuccess \"pnpm run start\"",
    "format": "prettier . -c --ignore-path ../../.gitignore",
    "format:fix": "prettier --write . --ignore-path ../../.gitignore",
    "lint": "eslint --ext .ts src/",
    "lint:fix": "eslint --fix --ext .ts src/",
    "start": "node app.js"
  },
  "dependencies": {
    "@openstapps/core": "workspace:*",
    "@openstapps/core-tools": "workspace:*",
    "@openstapps/logger": "workspace:*",
    "commander": "10.0.0",
    "dotenv": "16.4.5",
    "express": "4.18.2",
    "imapflow": "1.0.162",
    "mailparser": "3.7.1",
    "node-forge": "1.3.1",
    "nodemailer": "6.9.14",
    "ts-node": "10.9.2"
  },
  "devDependencies": {
    "@openstapps/eslint-config": "workspace:*",
    "@openstapps/prettier-config": "workspace:*",
    "@openstapps/tsconfig": "workspace:*",
    "@types/express": "4.17.17",
    "@types/imapflow": "1.0.18",
    "@types/mailparser": "3.4.4",
    "@types/node": "18.15.3",
    "@types/node-forge": "1.3.11",
    "@types/nodemailer": "6.4.15",
    "tsup": "6.7.0",
    "typescript": "5.4.2"
  },
  "tsup": {
    "entry": [
      "src/cli.ts"
    ],
    "sourcemap": true,
    "clean": true,
    "format": "esm",
    "outDir": "lib"
  },
  "prettier": "@openstapps/prettier-config",
  "eslintConfig": {
    "extends": [
      "@openstapps"
    ]
  }
 }
--- a/backend/mail-plugin/src/cli.ts
+++ b/backend/mail-plugin/src/cli.ts
@@ -1,123 +0,0 @@
 import {config} from 'dotenv';
 import {ImapFlow} from 'imapflow';
 import express from 'express';
 config({path: '.env.local'});
 const app = express();
 const port = process.env.PORT || 4000;
 app.use(async (request, response, next) => {
  try {
    const [user, pass] = Buffer.from(request.headers['authorization']!.replace(/^Basic /, ''), 'base64')
      .toString('utf8')
      .split(':');
    const client = new ImapFlow({
      host: 'imap.server.uni-frankfurt.de',
      port: 993,
      secure: true,
      emitLogs: false,
      auth: {user, pass},
    });
    response.locals.client = client;
    await client.connect();
    response.on('finish', async () => {
      await client.logout();
      client.close();
    });
    next();
  } catch {
    response.status(401).send();
  }
 });
 app.get('/', async (_request, response) => {
  const result = await response.locals.client.listTree();
  response.json(result);
 });
 app.get('/:mailbox', async (request, response) => {
  try {
    await response.locals.client.mailboxOpen(request.params.mailbox);
    const since = Number(request.query.since) || undefined;
    const preData = await response.locals.client.status(request.params.mailbox, {messages: true});
    if (preData.messages === 0) {
      response.json([]);
      return;
    }
    const data = response.locals.client.fetch(
      '1:*',
      {},
      {
        // caution, BigInt can throw
        changedSince: typeof since === 'string' ? BigInt(since) : undefined,
      },
    );
    const messages = [];
    for await (const message of data) {
      messages.push(message.seq.toString());
    }
    response.json(messages);
  } catch (error) {
    console.error(error);
    response.status(404).send();
  }
 });
 app.get('/:mailbox/:id', async (request, response) => {
  try {
    await response.locals.client.mailboxOpen(request.params.mailbox);
    const message = await response.locals.client.fetchOne(request.params.id, {
      envelope: true,
      labels: true,
      flags: true,
      bodyStructure: true,
    });
    response.json({
      bodyStructure: message.bodyStructure,
      labels: [...(message.labels ?? [])],
      flags: [...(message.flags ?? [])],
      envelope: message.envelope,
      seq: message.seq,
    });
  } catch (error) {
    console.error(error);
    response.status(404).send();
  }
 });
 app.get('/:mailbox/:id/:part', async (request, response) => {
  try {
    await response.locals.client.mailboxOpen(request.params.mailbox, {readOnly: true});
    if (request.query.raw) {
      const message = await response.locals.client.fetchOne(request.params.id, {
        bodyParts: [`${request.params.part}.mime`, request.params.part],
      });
      response.write(message.bodyParts.get(`${request.params.part}.mime`));
      response.write(message.bodyParts.get(request.params.part));
      response.end();
    } else {
      const message = await response.locals.client.download(request.params.id, request.params.part);
      message.content.on('data', chunk => {
        response.write(chunk);
      });
      message.content.on('end', () => {
        response.end();
      });
    }
  } catch (error) {
    console.error(error);
    response.status(404).send();
  }
 });
 app.listen(port, () => {
  console.log(`Server listening on port ${port}`);
 });
--- a/backend/mail-plugin/src/types.d.ts
+++ b/backend/mail-plugin/src/types.d.ts
@@ -1,9 +0,0 @@
 import {ImapFlow} from 'imapflow';
 declare global {
  namespace Express {
    interface Locals {
      client: ImapFlow;
    }
  }
 }
--- a/backend/mail-plugin/tsconfig.json
+++ b/backend/mail-plugin/tsconfig.json
@@ -1,4 +0,0 @@
 {
  "extends": "@openstapps/tsconfig",
  "exclude": ["lib", "app.js"]
 }
--- a/frontend/app/.gitignore
+++ b/frontend/app/.gitignore
@@ -32,7 +32,6 @@ platforms/
 /plugins/
 $RECYCLE.BIN/
 dist/
 .nx/
 # ignore generated resources
 resources/*/icon/
 resources/*/splash/
--- a/frontend/app/CHANGELOG.md
+++ b/frontend/app/CHANGELOG.md
@@ -1,11 +1,5 @@
 # @openstapps/app
 ## 3.3.3
 ### Patch Changes
 - 496b50d8: Bug fixes and Android target sdk version is now 34
 ## 3.3.2
 ### Patch Changes
@@ -322,225 +316,3 @@
 - Updated dependencies [64caebaf]
  - @openstapps/api@3.0.0-next.0
  - @openstapps/core@3.0.0-next.0
 ## 2.1.1
 ### Bug Fixes
 - autofocus searchbar only when no default data is displayed ([e90286f](https://gitlab.com/openstapps/app/commit/e90286fc6814f5c40af3e297be42f23128b991be))
 - breadcrumbs are under parallax ([9e160e8](https://gitlab.com/openstapps/app/commit/9e160e8d1ee9409e4fbe518c9dd9748705e680e1))
 - browser logout only if endSession url defined ([7f6de94](https://gitlab.com/openstapps/app/commit/7f6de94ab572be66d7f10758c37dcf10af46b4e0)), closes [#395](https://gitlab.com/openstapps/app/issues/395)
 - can't select some list elements on safari 16.4 ([3e99d7f](https://gitlab.com/openstapps/app/commit/3e99d7fa8fcae4538e1afe6a017570b0cb6ff45e))
 - canteen view removes item select listener on view exit ([05e996a](https://gitlab.com/openstapps/app/commit/05e996ae9052b11c23dc1093ef526f08e3e2e6b6))
 - catalog module semester selection ([afbd1fc](https://gitlab.com/openstapps/app/commit/afbd1fc048997acbc0113f8957016f8947b58626))
 - catalog semester selection ([a8c7d5a](https://gitlab.com/openstapps/app/commit/a8c7d5ab5934adf853cc40c1df311178df54057e))
 - data detail local favorite fallback causing duplicate nested favorite view ([dff4a95](https://gitlab.com/openstapps/app/commit/dff4a95acc55574b4872b0e4e39555cce0b2fd60))
 - data-detail favorite button color leaking to list items ([95f2da2](https://gitlab.com/openstapps/app/commit/95f2da2def39ec56f40a660a63e5f7fddb4b3d53))
 - location flow on iOS devices ([f207e02](https://gitlab.com/openstapps/app/commit/f207e029f1b30624bf411a57b3c552ef259e13ed))
 - parallax broken since safari 16.4 ([0f970fa](https://gitlab.com/openstapps/app/commit/0f970fa1f164a310e24a85140d8bf0da21e5a5f1))
 - remove infinite scroll e2e test ([47565e5](https://gitlab.com/openstapps/app/commit/47565e51b0dda5c8227238b6dc19f0d277408429))
 - replace breadcrumb popover with simply expanding the breadcrumbs ([1318cbc](https://gitlab.com/openstapps/app/commit/1318cbca7f0cf72e10d96fff1a1116ba073fe8dc))
 - schedule tabs navigating to the wrong url ([abf2ab6](https://gitlab.com/openstapps/app/commit/abf2ab6a5a94941d439adf54ec677332823892db))
 - translate simple pipe doesn't update on language changes ([f5ca150](https://gitlab.com/openstapps/app/commit/f5ca1508fb9d95693615bfb9e03bc127bd83be00))
 - typo in catalog provider query ([f49c44f](https://gitlab.com/openstapps/app/commit/f49c44f5c53780e4794dc1ef4cbacfb20cabbd97))
 - workaround for side menu items not being active on page load ([947cab4](https://gitlab.com/openstapps/app/commit/947cab458ca770f116d28a1f22687ae620e71b59))
 ### Features
 - add content to empty catalogs ([982fb16](https://gitlab.com/openstapps/app/commit/982fb1653b3c1253aac9366733f14c22c94d2537))
 - add easy way to configure search filtering for nested properties ([2220ab2](https://gitlab.com/openstapps/app/commit/2220ab24b385188515da7c176bf9c1ac72651fd9))
 - dark theme ([e75a466](https://gitlab.com/openstapps/app/commit/e75a46633ca3685d6044eb9a8b2fd670f2cd030f))
 - dashboard search rework ([8c30a47](https://gitlab.com/openstapps/app/commit/8c30a47706f07eb222fac47ad7fed61f9044328a))
 - implement custom cdk virtual scroll behavior ([968cb72](https://gitlab.com/openstapps/app/commit/968cb729575c529fd6d1d35da1b50a8689057c46))
 - optional logout from identity provider ([8cd2d77](https://gitlab.com/openstapps/app/commit/8cd2d777ab3a67b1ab24f03aa50a3ff73550c3d2)), closes [#372](https://gitlab.com/openstapps/app/issues/372)
 - revamp dashboard mensa section ([33a74d9](https://gitlab.com/openstapps/app/commit/33a74d96ae92137f53a775e90bff99e5f2d41f6a))
 - rework settings page design ([2f1298c](https://gitlab.com/openstapps/app/commit/2f1298c9d7df25d2a16576245ea62c1b6094e507))
 - show in-place in date series modal, resolves [#385](https://gitlab.com/openstapps/app/issues/385) ([22e70ae](https://gitlab.com/openstapps/app/commit/22e70ae92b35578b559e6644dccb8d4bfd06af1e)), closes [#386](https://gitlab.com/openstapps/app/issues/386) [#388](https://gitlab.com/openstapps/app/issues/388)
 - transition to full sidebar at xl instead of lg ([cc939f3](https://gitlab.com/openstapps/app/commit/cc939f38873833b7cc0260525a2ecd536f27bfa5))
 ## 2.0.1
 ### Bug Fixes
 - assessment segments can become unreadable ([939fb6e](https://gitlab.com/openstapps/app/commit/939fb6ef0f11b40cb71fbe61da90f50b1f75c3f7))
 - login button not easily found ([11d1ac3](https://gitlab.com/openstapps/app/commit/11d1ac3f7ce27c2822ea8f839df3f3dffbd6c020))
 - remove misleading assessment calculations ([aefae33](https://gitlab.com/openstapps/app/commit/aefae33d5c9fa9ee3efe346e45429aca79ae3c48))
 - right-align add event detail chip ([1eee652](https://gitlab.com/openstapps/app/commit/1eee652533c6b8f613ce09df9c3421f89209419a))
 ### Features
 - offline notice ([9b4caf5](https://gitlab.com/openstapps/app/commit/9b4caf526ffb53ec8d8885342323fcc52fd9fc09))
 - separate prettier from eslint ([a88d000](https://gitlab.com/openstapps/app/commit/a88d000ccd6cbdeb5fbb07d209f2491023f9d76c))
 # 2.0.0
 ### Bug Fixes
 - daia_url missing in environment configs ([863a3ff](https://gitlab.com/openstapps/app/commit/863a3ffd488425e3313ab9b812c4b6d50c68a244))
 - 404 on all surge links ([f1b4930](https://gitlab.com/openstapps/app/commit/f1b4930a3068e73aee20b4c3d71dac551ab60c35))
 - add areaServed to person detail ([488150f](https://gitlab.com/openstapps/app/commit/488150f7f5558c05c1ec8a71afcb9f9a37e68a37))
 - add event popover expanding beyond screen width ([046a95b](https://gitlab.com/openstapps/app/commit/046a95ba1dca3f5ded7e5555d3167f52f95be107))
 - add location info to dates from timetable ([92adb9d](https://gitlab.com/openstapps/app/commit/92adb9dd2db18027dcc327433027e28c81ecbd4b)), closes [#344](https://gitlab.com/openstapps/app/issues/344)
 - add missing profile translation ([cdb6ac4](https://gitlab.com/openstapps/app/commit/cdb6ac4084f8704d7f2336387a837b86f78c062b))
 - add nav button to schedule page ([e628f39](https://gitlab.com/openstapps/app/commit/e628f396e22e51da2c9f2489fe89e42ccf474e2b))
 - add openingHours config and catch its errors ([6125d43](https://gitlab.com/openstapps/app/commit/6125d43e8c18f2bf2afda67c0ff72e00d98ab34f))
 - add PKCE parameters for PAIA auth ([f3e83bf](https://gitlab.com/openstapps/app/commit/f3e83bfcc88423f0935a060ccd0bf6198da58351))
 - address late init from ionic components ([0bce9e5](https://gitlab.com/openstapps/app/commit/0bce9e5452fc5d05123756348dc30308de675bfa))
 - adjust code to overcome the breaking changes (ionic 4 to 5) ([f779042](https://gitlab.com/openstapps/app/commit/f7790426cd2da4a6b33e2aa73783943f45b3de02)), closes [#70](https://gitlab.com/openstapps/app/issues/70)
 - adjust hebis catalog templates ([83d9a4a](https://gitlab.com/openstapps/app/commit/83d9a4a8b8fe5b8687c72a717b3a2964524006e0))
 - adjust library account user info ([bafabb1](https://gitlab.com/openstapps/app/commit/bafabb1d4ec299e2bea43cd4b8442ef33be2329a)), closes [#331](https://gitlab.com/openstapps/app/issues/331)
 - adjust npm docker scripts and typos ([82bb15b](https://gitlab.com/openstapps/app/commit/82bb15b863e2d2e4df20244fda2f2e0d049ff43f))
 - angular1 ng-if leftover ([25434d5](https://gitlab.com/openstapps/app/commit/25434d54e3800fd72a6c5d9188fb11f441d73aa9))
 - assign navigation app name dynamically ([90b9733](https://gitlab.com/openstapps/app/commit/90b97339d3948b0864f634519416fe4a458b459f))
 - background fetch crashing android app ([3316ad9](https://gitlab.com/openstapps/app/commit/3316ad9169ed2b29a2755405589213f824aec9d1))
 - calculating SCDateSeries for next unit view ([82ba5f8](https://gitlab.com/openstapps/app/commit/82ba5f81211fb10cc5fde04991856567c4ac9680))
 - canteen module layout ([b89f5c4](https://gitlab.com/openstapps/app/commit/b89f5c4edd1ed14f7529edc4e4ea54f9d98fda7c))
 - canteen module layout ([6f7c680](https://gitlab.com/openstapps/app/commit/6f7c680ed89f027d863ebc02f5b24895d84f32e4))
 - cards not having rounded corners in safari ([8a04a43](https://gitlab.com/openstapps/app/commit/8a04a439032920ead799f8b7483f29b896797c37))
 - catch error `Setting "language" not provided` ([584878d](https://gitlab.com/openstapps/app/commit/584878d9503b8406b6ee7ec69dde5b8b3c4fd954))
 - CI stage/job setup ([ae429ca](https://gitlab.com/openstapps/app/commit/ae429ca5fb3b5f10cad377d37b251806b3dabf6c))
 - config.get issue by updating ionic ([9386351](https://gitlab.com/openstapps/app/commit/93863510fac32ed5b887011175a4807df3f522b8))
 - **config:** fix catch ConfigFetchError in getValue ([161da63](https://gitlab.com/openstapps/app/commit/161da630ea59f6205ee53dece950972d4f36ada5)), closes [#46](https://gitlab.com/openstapps/app/issues/46)
 - correct data path color ([0d755bc](https://gitlab.com/openstapps/app/commit/0d755bcbd3d6fea59a4f7a59981fd28844ff90d5))
 - correct html whitespace handling for icon detection ([9bc3642](https://gitlab.com/openstapps/app/commit/9bc3642990b687dd524470fd26df80351aa85f1e))
 - daia availability ([13cee2d](https://gitlab.com/openstapps/app/commit/13cee2d4261c7301c1c763446ae44dcdd005172d))
 - dashboard next unit structural directive causing animation issues ([c8f6a27](https://gitlab.com/openstapps/app/commit/c8f6a27c571e51bcc0ac0120968e6bc9a20c8dd7))
 - **data:** fix and adjust detail test using translation ([478f49a](https://gitlab.com/openstapps/app/commit/478f49a8744211b3c9458b3dadc791d62a46ae46)), closes [#50](https://gitlab.com/openstapps/app/issues/50)
 - **data:** fix template and other consistency issues ([c3bc227](https://gitlab.com/openstapps/app/commit/c3bc227a3ca4a295b2b31bfe7fd34830b33c9f05))
 - detail page when dish of mensa selected ([e5c2270](https://gitlab.com/openstapps/app/commit/e5c227073a183a1c562e17f3fe14a51048d01637)), closes [#140](https://gitlab.com/openstapps/app/issues/140)
 - download events should respect selection ([28fbfef](https://gitlab.com/openstapps/app/commit/28fbfef18cc3b457f7020a70157ea7a4fff345d0))
 - enable background fetch on iOS ([a1592f8](https://gitlab.com/openstapps/app/commit/a1592f84cc48f7cae8c55ef806cddbe806034bb5))
 - enable overflow for day labels in schedule ([1195c5f](https://gitlab.com/openstapps/app/commit/1195c5ffc8cea07f1e224d92a7fb25aa5858bf0a))
 - encode URI parameter to proxy URI ([bc13cc5](https://gitlab.com/openstapps/app/commit/bc13cc5e1fe6144fe0a0e53c0748a154844a5c29)), closes [#326](https://gitlab.com/openstapps/app/issues/326)
 - extend landing period button not working on android ([0caa69c](https://gitlab.com/openstapps/app/commit/0caa69c28cbb2f962b70a1da13659739c1c6dd3e)), closes [#333](https://gitlab.com/openstapps/app/issues/333)
 - failing native http requests with body ([fed4f20](https://gitlab.com/openstapps/app/commit/fed4f20c3cf43221512f3d2b6dd3c3fe7a4cf43a))
 - feedback not allowing valid emails ([cf74c8e](https://gitlab.com/openstapps/app/commit/cf74c8e19f8bd34a31d5af931781e84be2c04dea)), closes [#349](https://gitlab.com/openstapps/app/issues/349)
 - fix issues found by ng build for production ([a503811](https://gitlab.com/openstapps/app/commit/a503811c1cfcf909571af766ccd884856aad8ec9)), closes [#48](https://gitlab.com/openstapps/app/issues/48)
 - fix various typos ([ad0dae4](https://gitlab.com/openstapps/app/commit/ad0dae46ff04d28551d2ece950d9a4d3442541d2))
 - fixate webdriver to match used chrome version ([24dbb42](https://gitlab.com/openstapps/app/commit/24dbb42b345458b7dbdd17b2759824b3b68cb0e4))
 - generate library online links properly ([9854541](https://gitlab.com/openstapps/app/commit/9854541a0c062c31bce167673586dccc8af81785)), closes [#340](https://gitlab.com/openstapps/app/issues/340)
 - handle prices as an optional property ([9e71efc](https://gitlab.com/openstapps/app/commit/9e71efca9f7b1086db26f580192d6b349bdcb964)), closes [#219](https://gitlab.com/openstapps/app/issues/219)
 - header logo changing size on ios navigate ([38f0a30](https://gitlab.com/openstapps/app/commit/38f0a300769a5b7cda35af0927c17099f93981b8))
 - ignore null-island location ([d3188f5](https://gitlab.com/openstapps/app/commit/d3188f50905d610097de6c90bc58e6373d30e0dc)), closes [#149](https://gitlab.com/openstapps/app/issues/149)
 - item not available in offer template ([7b402d6](https://gitlab.com/openstapps/app/commit/7b402d61c30aed81a5671d778a38c8393a5bc7c8)), closes [#110](https://gitlab.com/openstapps/app/issues/110)
 - library account missing ready for pickup ([e504d8c](https://gitlab.com/openstapps/app/commit/e504d8cf6dd1c12fcb8f6a315527337313662385)), closes [#330](https://gitlab.com/openstapps/app/issues/330)
 - library fines should load item title only if needed ([cbb949e](https://gitlab.com/openstapps/app/commit/cbb949e3977a5821e6bd1b654dec66a82e4d8c81)), closes [#342](https://gitlab.com/openstapps/app/issues/342)
 - links of timetable tabs ([837c69b](https://gitlab.com/openstapps/app/commit/837c69bb21c92a91259051d5680e1073b390fc0e)), closes [#144](https://gitlab.com/openstapps/app/issues/144)
 - logged out button not showing on profile ([ebdc14d](https://gitlab.com/openstapps/app/commit/ebdc14d3c398ac7564c077757c564f4e414fe244)), closes [#239](https://gitlab.com/openstapps/app/issues/239)
 - make action chips react to changes of their item ([c0d0b1b](https://gitlab.com/openstapps/app/commit/c0d0b1bd9934e8d9e23f47825cae6a5d8ea2f38a))
 - make keyboard dismissable on mobile devices ([b2cc1fd](https://gitlab.com/openstapps/app/commit/b2cc1fd91fc5bd66c994dcbe10771a22d91a1b3e))
 - map search on iOS ([7d449b4](https://gitlab.com/openstapps/app/commit/7d449b43d0d86825f711848110ac6f044084eba0)), closes [#148](https://gitlab.com/openstapps/app/issues/148)
 - map widget not loading tiles properly ([09aa7bb](https://gitlab.com/openstapps/app/commit/09aa7bb5c59e8d167fa91c69745f5f80229094d7)), closes [#127](https://gitlab.com/openstapps/app/issues/127)
 - missing init (config setup) in default auth service ([f16e539](https://gitlab.com/openstapps/app/commit/f16e5394cce5a8019f4dfe367e5e0a2f0cca4ce2)), closes [#227](https://gitlab.com/openstapps/app/issues/227)
 - missing translations ([30d801a](https://gitlab.com/openstapps/app/commit/30d801a3b419b382d40d96dda995bd35e493523d))
 - modals not reacting after several uses ([f39c29f](https://gitlab.com/openstapps/app/commit/f39c29f10bc05ab986b74dfa8a8648df5fb307b4))
 - news module not scrollable on large screens ([44b6a4a](https://gitlab.com/openstapps/app/commit/44b6a4aea008ca6c89f6cb289467429fb3f8c1fa))
 - ngx-translate defaultLanguage not set ([581a5b2](https://gitlab.com/openstapps/app/commit/581a5b2e55ceda99cf7c41200366c3c5e09f1c63))
 - omit sync native calendar when no uuids ([c9720dc](https://gitlab.com/openstapps/app/commit/c9720dc104cce78ae1a422d5efed7b8a58946836)), closes [#177](https://gitlab.com/openstapps/app/issues/177)
 - opening hours pipe refreshing too often ([95e1734](https://gitlab.com/openstapps/app/commit/95e1734d26b175d8d1156abb10863155fed89ec0))
 - overhaul auth to avoid issues ([99e8d6c](https://gitlab.com/openstapps/app/commit/99e8d6c9bcbc68b639b035af36bc05de0237b1f9)), closes [#336](https://gitlab.com/openstapps/app/issues/336)
 - overview search bar scrolling behind header ([a037090](https://gitlab.com/openstapps/app/commit/a037090eec06e867a703b88a43620a74770287fe))
 - performance degradation when scrolling ([f0a45d1](https://gitlab.com/openstapps/app/commit/f0a45d1b8eb2b33a6c68b94ed7f96f81db3a728b))
 - person list should use long-inline-text ([8b2b853](https://gitlab.com/openstapps/app/commit/8b2b853942ac76904ff49d940dfef625b0397150))
 - prevent multiple heavy setting inits ([f772637](https://gitlab.com/openstapps/app/commit/f7726378f443d9809a6174411d25a811e1d0b5e9))
 - prevent opening invalid links ([fdee2db](https://gitlab.com/openstapps/app/commit/fdee2db8a42b8f6c99c4a72b3104ae0ba1a41c5a)), closes [#328](https://gitlab.com/openstapps/app/issues/328)
 - profile module items show click effect on scroll ([8b2f2c0](https://gitlab.com/openstapps/app/commit/8b2f2c063c65278580d9469b00d9e67f01caaffb))
 - recurring schedule offset and event limit ([9c6b513](https://gitlab.com/openstapps/app/commit/9c6b5131cd4cadb2572769d368b346054f19de1c))
 - refresh token not used by default auth provider ([15ccbe4](https://gitlab.com/openstapps/app/commit/15ccbe4c1879417f2fc5849204fa9f6bdcce87fc)), closes [#311](https://gitlab.com/openstapps/app/issues/311)
 - remove "extend landing" button when renewal not possible ([f60a228](https://gitlab.com/openstapps/app/commit/f60a22839200019a38586a14a0cce32e2c0029e7)), closes [#338](https://gitlab.com/openstapps/app/issues/338)
 - remove item before adding it to secure storage ([ec511fb](https://gitlab.com/openstapps/app/commit/ec511fb8f40219e2559b08c62bd915d773d2a36f))
 - schedule navigation bar layout ([e7d5f83](https://gitlab.com/openstapps/app/commit/e7d5f83100f43564b55249909a6658e583e3a9b2))
 - set android status bar color correctly ([b38a969](https://gitlab.com/openstapps/app/commit/b38a96996a10e4e43ff1b06ecd2235a0e3bdfa1c))
 - setting of default language ([ccf8b1a](https://gitlab.com/openstapps/app/commit/ccf8b1a5cc9fe834ba3e04a1ed67b2d082004403))
 - show nothing for empty array properties ([1c56c89](https://gitlab.com/openstapps/app/commit/1c56c891e15b034826b5d6b2b35141fc872c922d)), closes [#154](https://gitlab.com/openstapps/app/issues/154)
 - single map place width ([88684f0](https://gitlab.com/openstapps/app/commit/88684f068ab130f43e520c87f1d7383e0ae43944)), closes [#147](https://gitlab.com/openstapps/app/issues/147)
 - some android devices don't support implied css animation units ([54cc883](https://gitlab.com/openstapps/app/commit/54cc8838aefe8f8c2d25d9228a136ef727a08230))
 - status bar being black on Android 13 devices ([feee9e8](https://gitlab.com/openstapps/app/commit/feee9e8db90e66cf2346f7c5cc24f075eb70676c))
 - suppress router event logs in console ([28caaf1](https://gitlab.com/openstapps/app/commit/28caaf1d21f7961b678cf339a712abf860ade5e7)), closes [#207](https://gitlab.com/openstapps/app/issues/207)
 - swap missing icon after ionic update ([643b6c9](https://gitlab.com/openstapps/app/commit/643b6c967f3268cb305a24d614c3bc91275b0ac3))
 - temporary disable flaky ui test ([6b9b1fa](https://gitlab.com/openstapps/app/commit/6b9b1fa8548d5c5fca04b2c1d63e893de39278a2))
 - timetable dates cannot be removed ([9242438](https://gitlab.com/openstapps/app/commit/924243813207fa791d3c4938f8653a999b6382ff))
 - translate back button title ([b8db0f3](https://gitlab.com/openstapps/app/commit/b8db0f3e70a46f2b493e183a244cb29d1954c257))
 - translations ([5e1a902](https://gitlab.com/openstapps/app/commit/5e1a902d4c0d2345f21500fba5394c1907e04eb8))
 - typo in translation ([7928534](https://gitlab.com/openstapps/app/commit/7928534d88a26db28b098bbceb47bc1103022a57))
 - update core and apply stricter tslint rules ([911492d](https://gitlab.com/openstapps/app/commit/911492d064ff0280dd6626244cd8038cbfc0f408))
 - use HashLocationStrategy for routes ([9d68212](https://gitlab.com/openstapps/app/commit/9d682125db55c87cab2b33c7633bfa133d2fc5a9)), closes [#54](https://gitlab.com/openstapps/app/issues/54)
 - use localized date and time ([6ca0b97](https://gitlab.com/openstapps/app/commit/6ca0b9763761c5204a757a243056a087c5f35fd9))
 - use stapps core version to compare with backends' core version ([66b8720](https://gitlab.com/openstapps/app/commit/66b8720da0f264824a396f2d9e598b0e48c8e3d1)), closes [#77](https://gitlab.com/openstapps/app/issues/77)
 - user info card ([998edcb](https://gitlab.com/openstapps/app/commit/998edcb5cdfb588c2986f466f4a2951f172a8bb4)), closes [#305](https://gitlab.com/openstapps/app/issues/305)
 ### Features
 - add "no results" screen to search ([c75ca68](https://gitlab.com/openstapps/app/commit/c75ca68c440a20e197213ecbb47d05fc293afd9c))
 - add about module ([d420008](https://gitlab.com/openstapps/app/commit/d42000892694f4a3b29fa623c43fb45f8ba54687))
 - add action chips to search results ([67fb4a4](https://gitlab.com/openstapps/app/commit/67fb4a43c95043caba50d43ace2ab276f3319b81))
 - add auth support (default and paia) ([b5f239e](https://gitlab.com/openstapps/app/commit/b5f239ea4edebd0d27b1cdaad4a830998ce2f681))
 - add backend toggle ([c1d3330](https://gitlab.com/openstapps/app/commit/c1d33303aa11da3b3e150c6717d77ef484a16ac1))
 - add basic templates for data list items ([3e697b1](https://gitlab.com/openstapps/app/commit/3e697b17b4448c15781d0f6dd55577b638e9d974))
 - add catalog module ([03084b1](https://gitlab.com/openstapps/app/commit/03084b1c966de98b3723d0bee2b2475589393c59))
 - add ConfigModule and FakeBackendInterceptor ([406f400](https://gitlab.com/openstapps/app/commit/406f40055567bfde4ec5edf26cff942411bd073e)), closes [#34](https://gitlab.com/openstapps/app/issues/34) [#37](https://gitlab.com/openstapps/app/issues/37)
 - add detail view for news ([2566a71](https://gitlab.com/openstapps/app/commit/2566a71a81a3408dbb16b97d3a453d95e25d1f00))
 - add duration pipe with frequency capabilites ([49a1758](https://gitlab.com/openstapps/app/commit/49a1758da358958ffe590700c19aaf90ec748ee5))
 - add favorites support ([e9452d6](https://gitlab.com/openstapps/app/commit/e9452d6520c34f6513623c16e291dc23d6ea9757))
 - add feedback module ([867f9e9](https://gitlab.com/openstapps/app/commit/867f9e9b832e3bd54c04801fef63a11543e8f3dd))
 - add filter chips for news ([5435f85](https://gitlab.com/openstapps/app/commit/5435f85cc43dc3baa774a5008d2920ac7b3783f6))
 - add formatting pipes basted on Intl ([4b932af](https://gitlab.com/openstapps/app/commit/4b932af1c07e1af4369414667a987d31181c073c))
 - add HeBIS HDS search ([9a3241c](https://gitlab.com/openstapps/app/commit/9a3241c42ab59e15c0084178f76dc4a2450a2bb8))
 - add library account screens ([080e6fa](https://gitlab.com/openstapps/app/commit/080e6fa3e8c18e9608d7fa2efc95e4fd65c43a15))
 - add library action confirmations ([42b860e](https://gitlab.com/openstapps/app/commit/42b860e41793fc3983a39237a4f7128416485fae)), closes [#334](https://gitlab.com/openstapps/app/issues/334)
 - add logger ([a0c798f](https://gitlab.com/openstapps/app/commit/a0c798f765d87c5eebcbed65b70f3b05f285d0ce))
 - add map module ([c1c9a92](https://gitlab.com/openstapps/app/commit/c1c9a92ec900403218b887fdebfe5132b232e1e0))
 - add new font and new icons ([915fd72](https://gitlab.com/openstapps/app/commit/915fd72bd4bfed16e15fcc3c57879db0ec0379e2))
 - add not found screen ([e3d9ef4](https://gitlab.com/openstapps/app/commit/e3d9ef40ccd626c81c67ea2d790eecbe6e025780))
 - add permission check for geoLocation setting ([d5fa2fd](https://gitlab.com/openstapps/app/commit/d5fa2fd9a578d48cd2513eeb1380f1d2bc4d3754))
 - add service and pipe for core translator ([4565600](https://gitlab.com/openstapps/app/commit/456560026cc9550a10a9f42657d942122be34d53))
 - apply new layout overhaul ([7bbdba5](https://gitlab.com/openstapps/app/commit/7bbdba5c0b886e2789d2a603c4be627dfd16b60e))
 - assessment tree view ([0b037f9](https://gitlab.com/openstapps/app/commit/0b037f96e634b412fbaaee24747df08afdc0e565))
 - assessments module ([e68d1b7](https://gitlab.com/openstapps/app/commit/e68d1b73f94b36abcefe9b2bf42e98de00b69188))
 - calendar plugin ([a57c302](https://gitlab.com/openstapps/app/commit/a57c3029df61ac3157c856744380a85dc001abc6))
 - dashboard ui tests ([9f8ab5c](https://gitlab.com/openstapps/app/commit/9f8ab5c7a15a918f7bd05423f0a43f22a33d9228))
 - **data:** add basic methods of data provider ([ffe05e4](https://gitlab.com/openstapps/app/commit/ffe05e4548fc399183ef651047cb02a3cdc80c67)), closes [#1](https://gitlab.com/openstapps/app/issues/1)
 - **data:** add data detail templates ([5855acc](https://gitlab.com/openstapps/app/commit/5855accc169579d87f5779fd602d4f00f2b479a1))
 - **data:** add method that checks if data item has been saved ([017fc67](https://gitlab.com/openstapps/app/commit/017fc67765bdb75542045830fb85f8eb4b899485))
 - **data:** implement basic facets handling ([b6f92a7](https://gitlab.com/openstapps/app/commit/b6f92a74494e1a39d5c828d593eb70c7002bb0f6)), closes [#1](https://gitlab.com/openstapps/app/issues/1)
 - **data:** show skeleton screens before data is loaded ([e1039aa](https://gitlab.com/openstapps/app/commit/e1039aa2260a0e9d8ccca5a18ded480bf2f12530)), closes [#4](https://gitlab.com/openstapps/app/issues/4)
 - **data:** use data provider for list and detail view ([7caaa18](https://gitlab.com/openstapps/app/commit/7caaa18b7eb94ed8e4ff4e54d760ba1dba3ae3be))
 - **data:** use general template for all offers ([58960a2](https://gitlab.com/openstapps/app/commit/58960a29ea0cd73f26a43186b41f5b53864810e0))
 - display availability and item data for library items ([d571b1d](https://gitlab.com/openstapps/app/commit/d571b1dbe59f8e2270d88dd050b94283bf0a7056))
 - dynamic news page rows ([848d257](https://gitlab.com/openstapps/app/commit/848d2574c7046d6f84b91e32aa83ca57fca8ad2e))
 - expandable accordion in grades module ([3f81afd](https://gitlab.com/openstapps/app/commit/3f81afda82cf87bb393fbb3b71d27eee77ae42d9))
 - get tab navigation items from config ([c3130a3](https://gitlab.com/openstapps/app/commit/c3130a392a53c9ec3657e24a53ed0b3333ba162b))
 - Implement variable for styling ([8ecf347](https://gitlab.com/openstapps/app/commit/8ecf347c9a8abac9347dca45e99ebe35eca8f252))
 - include font licenses in the licenses section ([82479f4](https://gitlab.com/openstapps/app/commit/82479f463cbee834507a0c8faf895a729631eb06))
 - Ionic v6 breadcrumbs in catalog module ([7b491ed](https://gitlab.com/openstapps/app/commit/7b491ed3bb5466a845493bd8ea0bbb836a4f03d2))
 - lazy load all news ([e48134e](https://gitlab.com/openstapps/app/commit/e48134eddcd1ca4d5ec5dbf910571e33a3311ba1))
 - **menu:** add context menu ([1dbf451](https://gitlab.com/openstapps/app/commit/1dbf4515fe57cc8250a7fa2213ced682e3e5e0fc)), closes [#3](https://gitlab.com/openstapps/app/issues/3)
 - navigation rail ([6b08af6](https://gitlab.com/openstapps/app/commit/6b08af6a746bf12005d3297ec97c130e84477615))
 - news module ([22cd0af](https://gitlab.com/openstapps/app/commit/22cd0af1bf92a4576316f5510c22f012e085a237))
 - profile page sections ([e395e9d](https://gitlab.com/openstapps/app/commit/e395e9d270f41bd4f6e5ecd88e438a28dde92465)), closes [#233](https://gitlab.com/openstapps/app/issues/233) [#261](https://gitlab.com/openstapps/app/issues/261) [#267](https://gitlab.com/openstapps/app/issues/267)
 - refresh on pull for news module ([1f3d9ad](https://gitlab.com/openstapps/app/commit/1f3d9ad5f0c0557add2dcf242cf0b7dd7685bb1b))
 - resume at origin path after login ([a5e5a5b](https://gitlab.com/openstapps/app/commit/a5e5a5b40799e7505557f7ebd764b9c563be0f4b)), closes [#168](https://gitlab.com/openstapps/app/issues/168)
 - schedule layout ([e416590](https://gitlab.com/openstapps/app/commit/e4165901bb5efa6b38e397cdf5d66138e396d7f2))
 - scroll schedule cursor into view ([bc4c3d7](https://gitlab.com/openstapps/app/commit/bc4c3d78dbd906243dcddac4db9ac8ccaca79056))
 - search url query param handling ([f349bd7](https://gitlab.com/openstapps/app/commit/f349bd72335c47d292d0a007b1a4ce7f5c694a61))
 - seperate dishes by menu sections ([400c6b8](https://gitlab.com/openstapps/app/commit/400c6b8d8c5300035862186096e38883f781d297))
 - show availability in offers ([5fdef95](https://gitlab.com/openstapps/app/commit/5fdef95c065e7b467a13045adbb56a641cb2dc12))
 - show feedback when map search yields no results ([c54ea86](https://gitlab.com/openstapps/app/commit/c54ea867bd64af187446dbf8dc03967aae600961))
 - show menu for multiple days for canteens and cafes ([3c079cd](https://gitlab.com/openstapps/app/commit/3c079cd189e3b75d3b203bd46ab57378f99e88cc)), closes [#19](https://gitlab.com/openstapps/app/issues/19) [#79](https://gitlab.com/openstapps/app/issues/79)
 - **storage:** add search using regex ([86b9bff](https://gitlab.com/openstapps/app/commit/86b9bff09a51b17151efa5ec322cddcc50a54cb2))
 - **storage:** support deletion of multiple entries ([63266f5](https://gitlab.com/openstapps/app/commit/63266f588f6ddb2476e2cea4bab42a3864f77470))
 - **storage:** support search using a string ([4334cad](https://gitlab.com/openstapps/app/commit/4334cad68c7d0abb7443e245b6eb983804547925))
 - support deep links ([2e3f668](https://gitlab.com/openstapps/app/commit/2e3f6684ef5fbac8e4fb127c536b2b438399ce37))
 - support overlapping timetable dates ([93c37b2](https://gitlab.com/openstapps/app/commit/93c37b26cca7764dea66fb12c0e53acc8fd78d2b))
 - tab navigation bar animations and state ([7ecba0b](https://gitlab.com/openstapps/app/commit/7ecba0b7819ae5a7ab32d86f6049de0ab6c68e55))
 - timetable module - schedule and calendar ([d8ede00](https://gitlab.com/openstapps/app/commit/d8ede006dfbd613dfbc752eb6de80db2e7e84531))
 - turn on oauth2 state check for PAIA ([5bd0b50](https://gitlab.com/openstapps/app/commit/5bd0b50816973548a0a4aa5dbed3f2d0902590dd)), closes [#172](https://gitlab.com/openstapps/app/issues/172)
 - use http interceptor for backendless development ([2558163](https://gitlab.com/openstapps/app/commit/2558163ad6c3038445a79e6338f1827cb1e6510e)), closes [#37](https://gitlab.com/openstapps/app/issues/37)
 - use school-neutral news image fallback via css ([bb94c71](https://gitlab.com/openstapps/app/commit/bb94c71761ca5d3bf6639476ba0c143678cfabbd))
 - webpack bundle analyzer ([552911c](https://gitlab.com/openstapps/app/commit/552911cfcfecec8d9be8b8bbb155b597d1f70fa2))
 ## 0.0.1
 ### Features
 - add the app ([8b23159](https://gitlab.com/openstapps/app/commit/8b23159e678773b08252bc5826510de2a302fa1d))
--- a/frontend/app/angular.json
+++ b/frontend/app/angular.json
@@ -35,11 +35,6 @@
                "glob": "**/*",
                "input": "src/assets",
                "output": "assets"
              },
              {
                "glob": "CHANGELOG.md",
                "input": ".",
                "output": "assets"
              }
            ],
            "styles": [
--- a/frontend/app/package.json
+++ b/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.3.3",
+  "version": "3.3.2",
  "private": true,
  "license": "GPL-3.0-only",
  "author": "Karl-Philipp Wulfert <krlwlfrt@gmail.com>",
@@ -82,6 +82,7 @@
    "@ionic/angular": "7.8.0",
    "@ionic/storage-angular": "4.0.0",
    "@maplibre/ngx-maplibre-gl": "17.4.1",
    "@material/material-color-utilities": "0.3.0",
    "@ngx-translate/core": "15.0.0",
    "@ngx-translate/http-loader": "8.0.0",
    "@openid/appauth": "1.3.1",
@@ -90,7 +91,6 @@
    "@openstapps/core": "workspace:*",
    "@transistorsoft/capacitor-background-fetch": "5.2.0",
    "@types/dom-view-transitions": "1.0.4",
    "asn1js": "3.0.5",
    "capacitor-secure-storage-plugin": "0.9.0",
    "cordova-plugin-calendar": "5.1.6",
    "date-fns": "3.6.0",
@@ -98,9 +98,7 @@
    "form-data": "4.0.0",
    "geojson": "0.5.0",
    "ionic-appauth": "0.9.0",
-    "jsonpath-plus": "10.0.6",
+    "jsonpath-plus": "6.0.1",
    "libbase64": "1.3.0",
    "libqp": "2.1.0",
    "maplibre-gl": "4.0.2",
    "material-symbols": "0.17.1",
    "moment": "2.30.1",
@@ -109,14 +107,11 @@
    "ngx-markdown": "17.1.1",
    "ngx-moment": "6.0.2",
    "opening_hours": "3.8.0",
    "pkijs": "3.1.0",
    "pmtiles": "3.0.3",
    "postal-mime": "2.2.5",
    "rxjs": "7.8.1",
    "semver": "7.6.0",
    "swiper": "8.4.5",
    "tslib": "2.6.2",
    "zod": "3.23.8",
    "zone.js": "0.14.4"
  },
  "devDependencies": {
@@ -145,11 +140,9 @@
    "@ionic/cli": "7.2.0",
    "@openstapps/prettier-config": "workspace:*",
    "@openstapps/tsconfig": "workspace:*",
    "@types/dompurify": "3.0.5",
    "@types/fontkit": "2.0.7",
    "@types/geojson": "1.0.6",
    "@types/glob": "8.1.0",
    "@types/imapflow": "1.0.18",
    "@types/jasmine": "5.1.4",
    "@types/jasminewd2": "2.0.13",
    "@types/jsonpath": "0.2.0",
@@ -162,7 +155,6 @@
    "@typescript-eslint/parser": "7.2.0",
    "cordova-res": "0.15.4",
    "cypress": "13.7.0",
    "dompurify": "3.1.6",
    "eslint": "8.57.0",
    "eslint-plugin-jsdoc": "48.2.1",
    "eslint-plugin-prettier": "5.1.3",
--- a/frontend/app/package.json.orig
+++ b/frontend/app/package.json.orig
@@ -1,214 +0,0 @@
 {
  "name": "@openstapps/app",
  "description": "The generic app tailored to fulfill needs of German universities, written using Ionic Framework.",
  "version": "3.3.2",
  "private": true,
  "license": "GPL-3.0-only",
  "author": "Karl-Philipp Wulfert <krlwlfrt@gmail.com>",
  "contributors": [
    "Frank Nagel <frank.nagel@hrz.uni-marburg.de>",
    "Jovan Krunić <jovan.krunic@gmail.com>",
    "Michel Jonathan Schmitz <michel.jonathan.schmitz@its.thm.de>",
    "Rainer Killinger <mail-openstapps@killinger.co>",
    "Sebastian Lange <sebastianlange87@gmail.com>",
    "Thea Schöbl <dev@theaninova.de>"
  ],
  "scripts": {
    "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",
    "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",
    "cypress:run": "cypress run",
    "docker:build": "sudo docker run -p 8100:8100 -p 35729:35729 -p 53703:53703 -v $PWD:/app -it registry.gitlab.com/openstapps/app bash -c \"npm install && npm run build\"",
    "docker:build:android": "sudo docker run -p 8100:8100 -p 35729:35729 -p 53703:53703 -v $PWD:/app -it registry.gitlab.com/openstapps/app bash -c \"npm run build:android\"",
    "docker:enter": "sudo docker run -p 8100:8100 -p 35729:35729 -p 53703:53703 -v $PWD:/app -it registry.gitlab.com/openstapps/app bash",
    "docker:pull": "sudo docker pull registry.gitlab.com/openstapps/app",
    "docker:run:android": "sudo docker run -v $PWD:/app --privileged -v /dev/bus/usb:/dev/bus/usb --net=host -it registry.gitlab.com/openstapps/app bash -c \"npm run run:android\"",
    "docker:serve": "sudo docker run -p 8100:8100 -p 35729:35729 -p 53703:53703 -v $PWD:/app -it registry.gitlab.com/openstapps/app bash -c \"npm run start:external\"",
    "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",
    "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",
    "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}\")",
    "run:android": "ionic capacitor run android --livereload --external",
    "start": "ionic serve",
    "start:external": "ionic serve --external",
    "start:prod": "ionic serve --prod",
    "start:virtual-host": "ionic serve --public-host=mobile.app.uni-frankfurt.de --ssl=true --open=false",
    "test": "ng test --code-coverage",
    "test:integration": "sh integration-test.sh"
  },
  "dependencies": {
    "@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",
    "@awesome-cordova-plugins/calendar": "6.6.0",
    "@awesome-cordova-plugins/core": "6.6.0",
    "@capacitor-community/screen-brightness": "6.0.0",
    "@capacitor/app": "6.0.0",
    "@capacitor/browser": "6.0.1",
    "@capacitor/clipboard": "6.0.0",
    "@capacitor/core": "6.1.1",
    "@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.1",
    "@capacitor/local-notifications": "6.0.0",
    "@capacitor/network": "6.0.1",
    "@capacitor/preferences": "6.0.1",
    "@capacitor/screen-orientation": "6.0.1",
    "@capacitor/share": "6.0.1",
    "@capacitor/splash-screen": "6.0.1",
    "@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": "5.2.0",
    "@types/dom-view-transitions": "1.0.4",
    "asn1js": "3.0.5",
    "capacitor-secure-storage-plugin": "0.9.0",
    "cordova-plugin-calendar": "5.1.6",
    "date-fns": "3.6.0",
    "deepmerge": "4.3.1",
    "form-data": "4.0.0",
    "geojson": "0.5.0",
    "ionic-appauth": "0.9.0",
 <<<<<<< HEAD
    "jsonpath-plus": "10.0.6",
    "libbase64": "1.3.0",
    "libqp": "2.1.0",
 ||||||| parent of cff9b026 (fix: pipeline)
    "jsonpath-plus": "6.0.1",
    "libbase64": "^1.3.0",
    "libqp": "^2.1.0",
 =======
    "jsonpath-plus": "6.0.1",
    "libbase64": "1.3.0",
    "libqp": "2.1.0",
 >>>>>>> cff9b026 (fix: pipeline)
    "maplibre-gl": "4.0.2",
    "material-symbols": "0.17.1",
    "moment": "2.30.1",
    "ngx-date-fns": "11.0.0",
    "ngx-logger": "5.0.12",
    "ngx-markdown": "17.1.1",
    "ngx-moment": "6.0.2",
    "opening_hours": "3.8.0",
    "pkijs": "3.1.0",
    "pmtiles": "3.0.3",
    "postal-mime": "2.2.5",
    "rxjs": "7.8.1",
    "semver": "7.6.0",
    "swiper": "8.4.5",
    "tslib": "2.6.2",
    "zod": "3.23.8",
    "zone.js": "0.14.4"
  },
  "devDependencies": {
    "@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": "17.3.0",
    "@angular/platform-browser-dynamic": "17.3.0",
    "@capacitor/android": "6.1.1",
    "@capacitor/assets": "3.0.4",
    "@capacitor/cli": "6.1.1",
    "@capacitor/ios": "6.1.1",
    "@compodoc/compodoc": "1.1.23",
    "@cypress/schematic": "2.5.1",
    "@ionic/angular-toolkit": "11.0.1",
    "@ionic/cli": "7.2.0",
    "@openstapps/prettier-config": "workspace:*",
    "@openstapps/tsconfig": "workspace:*",
    "@types/dompurify": "3.0.5",
    "@types/fontkit": "2.0.7",
    "@types/geojson": "1.0.6",
    "@types/glob": "8.1.0",
    "@types/imapflow": "1.0.18",
    "@types/jasmine": "5.1.4",
    "@types/jasminewd2": "2.0.13",
    "@types/jsonpath": "0.2.0",
    "@types/karma": "6.3.8",
    "@types/karma-coverage": "2.0.3",
    "@types/karma-jasmine": "4.0.5",
    "@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.7.0",
    "dompurify": "3.1.6",
    "eslint": "8.57.0",
    "eslint-plugin-jsdoc": "48.2.1",
    "eslint-plugin-prettier": "5.1.3",
    "eslint-plugin-unicorn": "51.0.1",
    "fast-deep-equal": "3.1.3",
    "fontkit": "2.0.2",
    "glob": "10.3.10",
    "http-server": "14.1.1",
    "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",
    "karma-coverage": "2.2.1",
    "karma-jasmine": "5.1.0",
    "karma-junit-reporter": "2.0.1",
    "karma-mocha-reporter": "2.2.5",
    "license-checker": "25.0.1",
    "stylelint": "16.3.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",
    "webpack-bundle-analyzer": "4.10.1"
  },
  "cordova": {
    "plugins": {},
    "platforms": [
      "ios",
      "browser",
      "android"
    ]
  }
 }
--- a/frontend/app/src/app/app.module.ts
+++ b/frontend/app/src/app/app.module.ts
@@ -15,11 +15,12 @@
 import {CommonModule, LocationStrategy, PathLocationStrategy, registerLocaleData} from '@angular/common';
 import {HTTP_INTERCEPTORS, HttpClient, HttpClientModule} from '@angular/common/http';
 import localeDe from '@angular/common/locales/de';
-import {APP_INITIALIZER, Injectable, NgModule} from '@angular/core';
+import {APP_INITIALIZER, NgModule} from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
 import {RouteReuseStrategy} from '@angular/router';
 import {IonicModule, IonicRouteStrategy, Platform} from '@ionic/angular';
 import {TranslateLoader, TranslateModule, TranslateService} from '@ngx-translate/core';
 import {TranslateHttpLoader} from '@ngx-translate/http-loader';
 import moment from 'moment';
 import 'moment/min/locales';
 import {LoggerModule, NGXLogger, NgxLoggerLevel} from 'ngx-logger';
@@ -70,8 +71,7 @@ import {Capacitor} from '@capacitor/core';
 import {SplashScreen} from '@capacitor/splash-screen';
 import maplibregl from 'maplibre-gl';
 import {Protocol} from 'pmtiles';
-import {MailModule} from './modules/mail/mail.module';
+import {ThemeProvider} from './util/theme.provider';
 import {Observable, from} from 'rxjs';
 registerLocaleData(localeDe);
@@ -90,6 +90,7 @@ export function initializerFactory(
  defaultAuthService: DefaultAuthService,
  paiaAuthService: PAIAAuthService,
  dateFnsConfigurationService: DateFnsConfigurationService,
  _themeProvider: ThemeProvider,
 ) {
  return async () => {
    try {
@@ -130,16 +131,12 @@ export function initializerFactory(
  };
 }
-@Injectable({providedIn: 'root'})
+/**
-export class ImportTranslateLoader {
+ * TODO
-  static translations: Record<string, () => Promise<{default: object}>> = {
+ * @param http TODO
-    de: () => import('../assets/i18n/de.json'),
+ */
-    en: () => import('../assets/i18n/en.json'),
+export function createTranslateLoader(http: HttpClient) {
-  };
+  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
  getTranslation(lang: string): Observable<object> {
    return from(ImportTranslateLoader.translations[lang]().then(it => it.default));
  }
 }
 /**
@@ -170,7 +167,6 @@ export class ImportTranslateLoader {
    ProfilePageModule,
    FeedbackModule,
    MapModule,
    MailModule,
    MenuModule,
    NavigationModule,
    NewsModule,
@@ -183,7 +179,7 @@ export class ImportTranslateLoader {
      loader: {
        deps: [HttpClient],
        provide: TranslateLoader,
-        useClass: ImportTranslateLoader,
+        useFactory: createTranslateLoader,
      },
    }),
    UtilModule,
@@ -219,6 +215,7 @@ export class ImportTranslateLoader {
        DefaultAuthService,
        PAIAAuthService,
        DateFnsConfigurationService,
        ThemeProvider,
      ],
      useFactory: initializerFactory,
    },
--- a/frontend/app/src/app/modules/about/about-changelog.component.ts
+++ b/frontend/app/src/app/modules/about/about-changelog.component.ts
@@ -13,15 +13,11 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
-import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
+import {Component} from '@angular/core';
 import {ConfigProvider} from '../config/config.provider';
@Component({
  selector: 'about-changelog',
  templateUrl: 'about-changelog.html',
-  styleUrls: ['about-changelog.scss', './about-page/about-page.scss', 'release-notes-markdown.scss'],
+  styleUrls: ['about-changelog.scss', './about-page/about-page.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class AboutChangelogComponent {
+export class AboutChangelogComponent {}
  config = inject(ConfigProvider);
 }
--- a/frontend/app/src/app/modules/about/about-changelog.html
+++ b/frontend/app/src/app/modules/about/about-changelog.html
@@ -16,14 +16,14 @@
 <ion-header>
  <ion-toolbar color="primary" mode="ios">
    <ion-buttons slot="start">
-      <ion-back-button defaultHref="/about/changelog"></ion-back-button>
+      <ion-back-button></ion-back-button>
    </ion-buttons>
-    <ion-title>{{ 'about.TECHNICAL_CHANGELOG' | translate }}</ion-title>
+    <ion-title>Changelog</ion-title>
    <!-- TODO: translation -->
  </ion-toolbar>
 </ion-header>
 <ion-content parallax>
  <p class="disclaimer">{{ 'about.TECHNICAL_CHANGELOG_DISCLAIMER' | translate }}</p>
  <div class="about-changelog">
-    <markdown class="release-notes" src="assets/CHANGELOG.md"></markdown>
+    <markdown src="assets/about/CHANGELOG.md"></markdown>
  </div>
 </ion-content>
--- a/frontend/app/src/app/modules/about/about-changelog.scss
+++ b/frontend/app/src/app/modules/about/about-changelog.scss
@@ -13,13 +13,6 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
-ion-toggle {
+ion-content {
-  width: fit-content;
+  --padding-start: 16px;
  padding-inline: var(--spacing-md);
  color: var(--ion-color-primary-contrast);
 }
 .disclaimer {
  margin-block: var(--spacing-xs);
  color: var(--ion-color-primary-contrast);
 }
--- a/frontend/app/src/app/modules/about/about-release-notes.component.ts
+++ b/frontend/app/src/app/modules/about/about-release-notes.component.ts
@@ -1,27 +0,0 @@
 /*
 * Copyright (C) 2023 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 {ChangeDetectionStrategy, Component, inject} from '@angular/core';
 import {ConfigProvider} from '../config/config.provider';
@Component({
  selector: 'about-changelog',
  templateUrl: 'about-release-notes.html',
  styleUrls: ['about-release-notes.scss', './about-page/about-page.scss', 'release-notes-markdown.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AboutReleaseNotesComponent {
  config = inject(ConfigProvider);
 }
--- a/frontend/app/src/app/modules/about/about-release-notes.html
+++ b/frontend/app/src/app/modules/about/about-release-notes.html
@@ -1,32 +0,0 @@
 <!--
  ~ Copyright (C) 2023 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/>.
  -->
 <ion-header>
  <ion-toolbar color="primary" mode="ios">
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/about"></ion-back-button>
    </ion-buttons>
    <ion-title>{{ 'about.CHANGELOG' | translate }}</ion-title>
  </ion-toolbar>
 </ion-header>
 <ion-content parallax>
  <ion-button fill="clear" [routerLink]="['/about', 'stapps-changelog']"
    >{{ 'about.TECHNICAL_CHANGELOG' | translate
    }}<ion-icon slot="end" name="arrow_forward" ios="arrow_forward_ios"></ion-icon
  ></ion-button>
  @for (version of config.config.app.versionHistory; track version) {
    <markdown class="release-notes" [data]="'releaseNotes' | translateSimple: version"></markdown>
  }
 </ion-content>
--- a/frontend/app/src/app/modules/about/about-release-notes.scss
+++ b/frontend/app/src/app/modules/about/about-release-notes.scss
@@ -1,31 +0,0 @@
 /*!
 * Copyright (C) 2021 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 '../../../theme/util/mixins';
 ion-button {
  --color: var(--ion-color-primary-contrast);
  width: fit-content;
  margin-block: 0;
 }
 .release-notes {
  @include border-radius-in-parallax(var(--border-radius-default));
  display: block;
  margin: var(--spacing-md);
  margin-block-start: 0;
  background: var(--ion-item-background);
 }
--- a/frontend/app/src/app/modules/about/about.module.ts
+++ b/frontend/app/src/app/modules/about/about.module.ts
@@ -29,12 +29,10 @@ import {AboutLicenseModalComponent} from './about-license-modal.component';
 import {AboutChangelogComponent} from './about-changelog.component';
 import {UtilModule} from '../../util/util.module';
 import {IonIconModule} from '../../util/ion-icon/ion-icon.module';
 import {AboutReleaseNotesComponent} from './about-release-notes.component';
 const settingsRoutes: Routes = [
  {path: 'about', component: AboutPageComponent},
-  {path: 'about/changelog', component: AboutReleaseNotesComponent},
+  {path: 'about/changelog', component: AboutChangelogComponent},
  {path: 'about/stapps-changelog', component: AboutChangelogComponent},
  {path: 'about/imprint', component: AboutPageComponent},
  {path: 'about/privacy', component: AboutPageComponent},
  {path: 'about/terms', component: AboutPageComponent},
@@ -51,7 +49,6 @@ const settingsRoutes: Routes = [
    AboutLicensesComponent,
    AboutLicenseModalComponent,
    AboutChangelogComponent,
    AboutReleaseNotesComponent,
  ],
  imports: [
    CommonModule,
--- a/frontend/app/src/app/modules/about/app-version.service.ts
+++ b/frontend/app/src/app/modules/about/app-version.service.ts
@@ -2,11 +2,11 @@ import {Injectable} from '@angular/core';
 import {StorageProvider} from '../storage/storage.provider';
 import {ConfigProvider} from '../config/config.provider';
 import {ModalController} from '@ionic/angular';
 import {Capacitor} from '@capacitor/core';
 import {ReleaseNotesComponent} from './release-notes.component';
 import {SCAppVersionInfo} from '@openstapps/core';
 import {App} from '@capacitor/app';
 import {coerce} from 'semver';
 import {Capacitor} from '@capacitor/core';
 export const RELEASE_NOTES_SHOWN_KEY = 'release_notes_shown';
@@ -25,11 +25,12 @@ export class AppVersionService {
    if (Capacitor.getPlatform() === 'web') {
      return;
    }
    const storedVersion = coerce(
      (await this.storage.has(RELEASE_NOTES_SHOWN_KEY))
        ? await this.storage.get<string>(RELEASE_NOTES_SHOWN_KEY)
        : '0.0.0',
    )!;
    const currentVersion = coerce(await App.getInfo().then(info => info.version))!;
    if (!(await this.storage.has(RELEASE_NOTES_SHOWN_KEY))) {
      await this.storage.put(RELEASE_NOTES_SHOWN_KEY, currentVersion);
    }
    const storedVersion = coerce(await this.storage.get<string>(RELEASE_NOTES_SHOWN_KEY))!;
    return this.config.config.app.versionHistory
      ?.filter(({version}) => {
@@ -38,7 +39,7 @@ export class AppVersionService {
        const isNotFutureVersion = semanticVersion.compare(currentVersion) <= 0;
        return wasNotShown && isNotFutureVersion;
      })
-      ?.sort((a, b) => -coerce(a.version)!.compare(b.version));
+      ?.sort((a, b) => coerce(a.version)!.compare(b.version));
  }
  /**
--- a/frontend/app/src/app/modules/about/release-notes-markdown.scss
+++ b/frontend/app/src/app/modules/about/release-notes-markdown.scss
@@ -1,26 +0,0 @@
 .release-notes {
  max-width: 16cm;
 }
 .release-notes ::ng-deep {
  h1 {
    font-size: 1.5em;
    font-weight: bold;
    color: var(--ion-color-primary);
  }
  h2 {
    font-size: 1.2em;
    font-weight: bold;
  }
  h3 {
    font-size: 1.1em;
    font-weight: bold;
  }
  blockquote {
    background: var(--ion-item-background);
    border-left: 0.25em solid var(--ion-color-medium);
  }
 }
--- a/frontend/app/src/app/modules/about/release-notes.component.ts
+++ b/frontend/app/src/app/modules/about/release-notes.component.ts
@@ -9,7 +9,7 @@ import {UtilModule} from '../../util/util.module';
@Component({
  selector: 'stapps-release-notes',
  templateUrl: 'release-notes.html',
-  styleUrls: ['release-notes.scss', 'release-notes-markdown.scss'],
+  styleUrls: ['release-notes.scss'],
  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [UtilModule, MarkdownModule, ThingTranslateModule, IonicModule, TranslateModule],
--- a/frontend/app/src/app/modules/about/release-notes.html
+++ b/frontend/app/src/app/modules/about/release-notes.html
@@ -13,7 +13,7 @@
 <ion-content parallax>
  @for (versionInfo of versionInfos; track versionInfo) {
    <markdown
-      class="content-card ion-padding release-notes"
+      class="content-card ion-padding"
      [data]="'releaseNotes' | translateSimple: versionInfo"
    ></markdown>
  }
--- a/frontend/app/src/app/modules/about/release-notes.scss
+++ b/frontend/app/src/app/modules/about/release-notes.scss
@@ -9,6 +9,5 @@ ion-title {
  display: block;
  margin: var(--spacing-md);
  margin-block-start: 0;
  background: var(--ion-item-background);
 }
--- a/frontend/app/src/app/modules/auth/auth-helper.service.ts
+++ b/frontend/app/src/app/modules/auth/auth-helper.service.ts
@@ -81,6 +81,7 @@ export class AuthHelperService {
      user[key as keyof SCUserConfiguration] = JSONPath({
        path: this.userConfigurationMap[key as keyof SCUserConfiguration] as string,
        json: userInfo,
        preventEval: true,
      })[0];
    }
    if (user.givenName && user.givenName.length > 0 && user.familyName && user.familyName.length > 0) {
--- a/frontend/app/src/app/modules/mail/mail-adapter.service.ts
+++ b/frontend/app/src/app/modules/mail/mail-adapter.service.ts
@@ -1,237 +0,0 @@
 import {HttpClient} from '@angular/common/http';
 import {Injectable, inject} from '@angular/core';
 import {Observable, map, catchError, tap, mergeMap, forkJoin, of} from 'rxjs';
 import {Email, MailboxTreeRoot, RawEmail, RawEmailBodyStructure, Signature, SignedValue} from './schema';
 import {ContentInfo, SignedData} from 'pkijs';
 import PostalMime from 'postal-mime';
 import {z} from 'zod';
 function value(value: undefined): undefined;
 function value<T>(value: T): SignedValue<T>;
 /**
 *
 */
 function value<T>(value: T | undefined): SignedValue<T> | undefined {
  return value === undefined ? undefined : {value};
 }
@Injectable({providedIn: 'root'})
 export class MailAdapterService {
  httpClient = inject(HttpClient);
  request<T>(options: {
    method?: string;
    path?: string[];
    options?: Record<string, string>;
    responseType?: 'json' | 'arraybuffer';
    credentials?: string;
  }): Observable<T> {
    return this.httpClient.request<T>(
      options.method ?? 'GET',
      `http://localhost:4000/${options.path?.map(encodeURIComponent).join('/') ?? ''}${
        options.options
          ? `?${Object.entries(options.options).map(item => item.map(encodeURIComponent).join('='))}`
          : ''
      }`,
      {
        responseType: options.responseType as 'json',
        headers: options.credentials ? {authorization: `Basic ${options.credentials}`} : undefined,
      },
    );
  }
  checkCredentials(credentials: string): Observable<boolean> {
    return this.request<unknown>({
      path: [],
      options: {},
      responseType: 'json',
      credentials,
    }).pipe(
      map(() => true),
      catchError(error => {
        if (error.status === 401) {
          return of(false);
        } else {
          throw error;
        }
      }),
    );
  }
  listMailboxes(credentials: string): Observable<MailboxTreeRoot> {
    return this.request<string[]>({credentials}).pipe(mergeMap(it => MailboxTreeRoot.parseAsync(it)));
  }
  listRawEmails(credentials: string, mailbox: string, since?: string): Observable<string[]> {
    return this.request<unknown>({
      credentials,
      path: [mailbox],
      options: since === undefined ? undefined : {since},
    }).pipe(
      mergeMap(it => z.array(z.string()).parseAsync(it)),
      tap(console.log),
    );
  }
  private getRawEmail(credentials: string, mailbox: string, id: string): Observable<RawEmail> {
    return this.request<unknown>({
      credentials,
      path: [mailbox, id],
      options: {raw: 'true'},
    }).pipe(mergeMap(it => RawEmail.parseAsync(it)));
  }
  private getPart(credentials: string, mailbox: string, id: string, part: string): Observable<ArrayBuffer> {
    return this.request<ArrayBuffer>({path: [mailbox, id, part], credentials, responseType: 'arraybuffer'});
  }
  private getRawPart(
    credentials: string,
    mailbox: string,
    id: string,
    part: string,
  ): Observable<ArrayBuffer> {
    return this.request({
      path: [mailbox, id, part],
      options: {raw: 'true'},
      responseType: 'arraybuffer',
      credentials,
    });
  }
  private resolveRawEmail(credentials: string, mailbox: string, email: RawEmail): Observable<Email> {
    console.log(email);
    if (
      email.bodyStructure.type === 'application/x-pkcs7-mime' ||
      email.bodyStructure.type === 'application/pkcs7-mime'
    ) {
      return this.getRawPart(credentials, mailbox, email.seq, email.bodyStructure.part ?? 'TEXT').pipe(
        mergeMap(async buffer => {
          const info = ContentInfo.fromBER(buffer);
          const signedData = new SignedData({schema: info.content});
          const valid = await signedData
            .verify({signer: 0, data: signedData.encapContentInfo.eContent?.valueBeforeDecodeView})
            .catch(() => false);
          const content = new TextDecoder().decode(
            signedData.encapContentInfo.eContent?.valueBeforeDecodeView,
          );
          const signedEmail = await PostalMime.parse(content);
          function signed(value: undefined): undefined;
          function signed<T>(value: T): SignedValue<T>;
          /**
           *
           */
          function signed<T>(value: T | undefined): SignedValue<T> | undefined {
            return value === undefined
              ? undefined
              : {
                  value,
                  signature: {
                    type: 'pkcs7',
                    valid,
                  },
                };
          }
          const result: Email = {
            id: email.seq,
            mailbox,
            subject: signedEmail.subject ? signed(signedEmail.subject) : value(email.envelope.subject),
            flags: new Set<string>(), //TODO
            from: signed({
              name: signedEmail.from.name || undefined,
              address: signedEmail.from.address || undefined,
            }),
            to: signedEmail.to?.map(({name, address}) =>
              signed({
                name,
                address,
              }),
            ),
            date: signedEmail.date ? signed(new Date(signedEmail.date)) : value(email.envelope.date),
            html: signedEmail.html ? signed(signedEmail.html) : undefined,
            text: signedEmail.text ? signed(signedEmail.text) : undefined,
            attachments: [],
          };
          return result;
        }),
      );
    }
    const traverse = (
      item: RawEmailBodyStructure,
      result: Pick<Email, 'attachments' | 'text' | 'html'>,
      signature?: Signature,
    ): Observable<Pick<Email, 'attachments' | 'text' | 'html'>> => {
      // https://datatracker.ietf.org/doc/html/rfc1847#section-2.1
      if (item.type === 'multipart/signed' && item.parameters?.protocol === 'application/pkcs7-signature') {
        return forkJoin({
          data: this.getPart(credentials, mailbox, email.seq, item.childNodes![0].part!),
          signature: this.getRawPart(credentials, mailbox, email.seq, item.childNodes![1].part!),
        }).pipe(
          mergeMap(({data, signature}) => {
            const info = ContentInfo.fromBER(signature);
            const signedData = new SignedData({schema: info.content});
            return signedData.verify({signer: 0, data});
          }),
          catchError(error => {
            console.log(error);
            return of(false);
          }),
          mergeMap(valid => traverse(item.childNodes![0], result, {type: 'pkcs7', valid})),
        );
      } else if (item.type.startsWith('multipart/')) {
        return forkJoin(item.childNodes!.map(child => traverse(child, result, signature))).pipe(
          map(children => children[0]),
        );
      } else if (item.type === 'text/plain') {
        return this.getPart(credentials, mailbox, email.seq, item.part ?? 'TEXT').pipe(
          map(text => {
            result.html = {value: new TextDecoder().decode(text), signature};
            return result;
          }),
        );
      } else if (item.type === 'text/html') {
        return this.getPart(credentials, mailbox, email.seq, item.part ?? 'TEXT').pipe(
          map(html => {
            result.html = {value: new TextDecoder().decode(html), signature};
            return result;
          }),
        );
      } else if (item.part === undefined) {
        return of(result);
      } else {
        result.attachments.push({value: {part: item.part, size: item.size ?? Number.NaN, filename: ''}});
        return of(result);
      }
    };
    return traverse(email.bodyStructure, {attachments: []}).pipe(
      map(
        partial =>
          ({
            ...partial,
            id: email.seq,
            mailbox,
            flags: new Set<string>(email.flags),
            subject: value(email.envelope.subject),
            from: value({
              name: email.envelope.from[0]?.name || undefined,
              address: email.envelope.from[0]?.address || undefined,
            }),
            date: value(email.envelope.date),
          }) satisfies Email,
      ),
      tap(console.log),
    );
  }
  getEmail(credentials: string, mailbox: string, id: string): Observable<Email> {
    return this.getRawEmail(credentials, mailbox, id).pipe(
      mergeMap(it => this.resolveRawEmail(credentials, mailbox, it)),
    );
  }
 }
--- a/frontend/app/src/app/modules/mail/mail-detail.component.ts
+++ b/frontend/app/src/app/modules/mail/mail-detail.component.ts
@@ -1,58 +0,0 @@
 import {ChangeDetectionStrategy, Component, inject, signal} from '@angular/core';
 import {AsyncPipe, TitleCasePipe} from '@angular/common';
 import {IonicModule} from '@ionic/angular';
 import {DataModule} from '../data/data.module';
 import {IonIconModule} from 'src/app/util/ion-icon/ion-icon.module';
 import {UtilModule} from 'src/app/util/util.module';
 import {FormatPurePipeModule, ParseIsoPipeModule} from 'ngx-date-fns';
 import {ActivatedRoute, RouterModule} from '@angular/router';
 import {map, mergeMap} from 'rxjs';
 import {DomSanitizer} from '@angular/platform-browser';
 import {materialFade} from 'src/app/animation/material-motion';
 import {TranslateModule} from '@ngx-translate/core';
 import {ShadowHtmlDirective} from 'src/app/util/shadow-html.directive';
 import {MailStorageProvider} from './mail-storage.provider';
@Component({
  selector: 'stapps-mail-detail',
  templateUrl: 'mail-detail.html',
  styleUrl: 'mail-detail.scss',
  animations: [materialFade],
  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [
    AsyncPipe,
    IonicModule,
    DataModule,
    IonIconModule,
    UtilModule,
    FormatPurePipeModule,
    ParseIsoPipeModule,
    RouterModule,
    ShadowHtmlDirective,
    TranslateModule,
    TitleCasePipe,
  ],
 })
 export class MailDetailComponent {
  readonly activatedRoute = inject(ActivatedRoute);
  readonly mailStorage = inject(MailStorageProvider);
  readonly sanitizer = inject(DomSanitizer);
  parameters = this.activatedRoute.paramMap.pipe(
    map(parameters => ({
      mailbox: parameters.get('mailbox')!,
      id: parameters.get('id')!,
    })),
  );
  mail = this.parameters.pipe(mergeMap(({mailbox, id}) => this.mailStorage.getEmail(mailbox, id)));
  collapse = signal(false);
  todo() {
    alert('TODO');
  }
 }
--- a/frontend/app/src/app/modules/mail/mail-detail.html
+++ b/frontend/app/src/app/modules/mail/mail-detail.html
@@ -1,93 +0,0 @@
 <ion-header>
  <ion-toolbar color="primary" mode="ios">
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title
      [style.opacity]="(collapse() ? '1' : '0') + '!important'"
      [style.translate]="collapse() ? '0' : '0 10px'"
    >
      @if (mail | async; as mail) {
        {{ mail.subject?.value }}
      } @else {
        <ion-skeleton-text animated style="width: 100px; height: 20px"></ion-skeleton-text>
      }
    </ion-title>
    <ion-buttons slot="end">
      <ion-button (click)="todo()">
        <ion-icon slot="icon-only" name="delete"></ion-icon>
      </ion-button>
      <ion-button (click)="todo()">
        <ion-icon slot="icon-only" name="mark_email_unread"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
 </ion-header>
 <ion-content [scrollEvents]="true" (ionScroll)="collapse.set($any($event).detail.scrollTop > 50)">
  @if (mail | async; as mail) {
    <h1 @materialFade>{{ mail.subject?.value }}</h1>
    <aside @materialFade>
      <strong class="from">
        {{ mail.from.value.name || mail.from.value.address }}
        @if (mail.from.signature?.valid === true) {
          <ion-icon name="verified" [fill]="true" @materialFade></ion-icon>
        } @else if (mail.from.signature?.valid === false) {
          <ion-icon name="gpp_bad" color="danger" [fill]="true" @materialFade></ion-icon>
        }
      </strong>
      <div class="to">
        to
        @for (to of mail.to; track to) {
          <span>{{ to.value.name || to.value.address }}</span>
        }
      </div>
      @if (mail.cc) {
        <div class="cc">
          cc
          @for (cc of mail.cc; track cc) {
            <span>{{ cc.value.name || cc.value.address }}</span>
          }
        </div>
      }
    </aside>
    @if (mail.html) {
      <main @materialFade>
        <div class="html" [shadowHTML]="mail.html.value"></div>
      </main>
    } @else if (mail.text) {
      <main @materialFade>
        <pre>{{ mail.text.value }}</pre>
      </main>
    }
    <ion-list>
      @for (attachment of mail.attachments; track attachment) {
        <ion-card>
          <ion-card-header>
            <ion-card-title>{{ attachment.value.filename }}</ion-card-title>
            <ion-card-subtitle>{{ attachment.value.size }}</ion-card-subtitle>
          </ion-card-header>
          <ion-card-content>
            <ion-button fill="clear" (click)="todo()">
              <ion-icon slot="icon-only" name="download"></ion-icon>
            </ion-button>
          </ion-card-content>
        </ion-card>
      }
    </ion-list>
    <footer>
      <div>
        <table>
          @if (mail.date) {
            <tr>
              <th>{{ 'mail.DATE' | translate | titlecase }}</th>
              <td>
                <time [dateTime]="mail.date">{{ mail.date.value | dfnsFormatPure: 'PPp' }}</time>
              </td>
            </tr>
          }
        </table>
      </div>
    </footer>
  }
 </ion-content>
--- a/frontend/app/src/app/modules/mail/mail-detail.scss
+++ b/frontend/app/src/app/modules/mail/mail-detail.scss
@@ -1,97 +0,0 @@
@import '../../../theme/util/mixins';
 ion-item {
  margin-block-end: var(--spacing-xl);
 }
 ion-title {
  transition:
    opacity 0.2s ease,
    translate 0.2s ease;
 }
 h1 {
  margin: var(--spacing-sm) var(--spacing-md);
  font-weight: var(--font-weight-bold);
  color: var(--ion-color-primary-contrast);
 }
 aside {
  display: flex;
  flex-direction: column;
  margin: var(--spacing-xs) var(--spacing-md);
  color: var(--ion-color-primary-contrast);
 }
 .to {
  display: flex;
  gap: var(--spacing-xs);
  align-items: center;
  justify-content: flex-start;
  > span:has(+ span)::after {
    content: ',';
  }
 }
 .from {
  display: flex;
  gap: var(--spacing-xs);
  align-items: center;
  justify-content: flex-start;
 }
 main {
  @include border-radius-in-parallax(var(--border-radius-default));
  margin: var(--spacing-md);
  padding: var(--spacing-md);
  background: var(--ion-item-background);
 }
 .html {
  overflow-x: auto;
 }
 pre {
  font-family: inherit;
  word-wrap: break-word;
  white-space: pre-wrap;
 }
 footer {
  // css hack to make the element stick to the bottom of the scroll container even
  // when the content is not filling it
  position: sticky;
  top: 100vh;
  > div {
    margin: var(--spacing-lg);
    opacity: 0.8;
  }
  td {
    padding-inline-start: var(--spacing-md);
    word-break: break-word;
  }
  code {
    font-size: inherit;
  }
 }
 .attachment {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: var(--spacing-md) 0;
  padding: var(--spacing-md);
  border: 1px solid var(--ion-border-color);
  border-radius: var(--border-radius-default);
 }
 ion-content::part(background) {
  background: none;
 }
--- a/frontend/app/src/app/modules/mail/mail-login.component.ts
+++ b/frontend/app/src/app/modules/mail/mail-login.component.ts
@@ -1,65 +0,0 @@
 import {AsyncPipe, TitleCasePipe} from '@angular/common';
 import {ChangeDetectionStrategy, Component, WritableSignal, computed, inject, signal} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {IonicModule} from '@ionic/angular';
 import {TranslateModule} from '@ngx-translate/core';
 import {IonIconModule} from 'src/app/util/ion-icon/ion-icon.module';
 import {UtilModule} from 'src/app/util/util.module';
 import {MailService} from './mail.service';
 import {Observable, of, map, catchError, startWith, shareReplay, tap, take} from 'rxjs';
 import {ActivatedRoute, Router} from '@angular/router';
@Component({
  selector: 'stapps-mail-login',
  templateUrl: 'mail-login.html',
  styleUrl: 'mail-login.scss',
  changeDetection: ChangeDetectionStrategy.OnPush,
  standalone: true,
  imports: [IonicModule, UtilModule, TranslateModule, TitleCasePipe, IonIconModule, FormsModule, AsyncPipe],
 })
 export class MailLoginComponent {
  showPassword = signal(false);
  email = signal('');
  password = signal('');
  // eslint-disable-next-line unicorn/no-useless-undefined
  error: WritableSignal<Observable<string | undefined>> = signal(of(undefined));
  loading = computed(() =>
    this.error().pipe(
      map(() => false),
      startWith(true),
    ),
  );
  mailService = inject(MailService);
  router = inject(Router);
  activatedRoute = inject(ActivatedRoute);
  submit(event: SubmitEvent) {
    event.preventDefault();
    const form = event.target as HTMLFormElement;
    if (form.checkValidity()) {
      this.error.set(
        this.mailService.login(this.email(), this.password()).pipe(
          tap(success => {
            if (success) {
              this.activatedRoute.data.pipe(take(1)).subscribe(data => {
                this.router.navigate(data.redirectTo);
              });
            }
          }),
          map(success => (success ? undefined : 'mail.login.error.INVALID_CREDENTIALS')),
          catchError(error => of(error.message)),
          shareReplay(1),
        ),
      );
    } else {
      form.reportValidity();
    }
  }
 }
--- a/frontend/app/src/app/modules/mail/mail-login.html
+++ b/frontend/app/src/app/modules/mail/mail-login.html
@@ -1,67 +0,0 @@
 <ion-header>
  <ion-toolbar color="primary" mode="ios">
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
  </ion-toolbar>
 </ion-header>
 <ion-content parallax>
  <h1>{{ 'mail.login.TITLE' | translate | titlecase }}</h1>
  <form (ngSubmit)="submit($event)">
    <ion-input
      [attr.aria-label]="'mail.login.PLACEHOLDER_USERNAME' | translate | titlecase"
      [placeholder]="'mail.login.PLACEHOLDER_USERNAME' | translate | titlecase"
      [(ngModel)]="email"
      [required]="true"
      [disabled]="(error() | async) !== null ? false : true"
      autocomplete="username"
      enterkeyhint="next"
      color="primary"
      name="username"
      type="text"
    >
      <ion-icon slot="start" name="account_circle" aria-hiden="true"></ion-icon>
    </ion-input>
    <ion-input
      [attr.aria-label]="'mail.login.PLACEHOLDER_PASSWORD' | translate | titlecase"
      [placeholder]="'mail.login.PLACEHOLDER_PASSWORD' | translate | titlecase"
      [(ngModel)]="password"
      [required]="true"
      [disabled]="(error() | async) !== null ? false : true"
      autocomplete="current-password"
      enterkeyhint="go"
      name="password"
      [type]="showPassword() ? 'text' : 'password'"
    >
      <ion-icon slot="start" name="password" aria-hidden="true"></ion-icon>
      <ion-button
        fill="clear"
        slot="end"
        color="medium"
        aria-label="Show/hide"
        (click)="showPassword.set(!showPassword())"
      >
        <ion-icon
          [size]="20"
          [fill]="!showPassword()"
          slot="icon-only"
          name="visibility"
          aria-hidden="true"
        ></ion-icon>
      </ion-button>
    </ion-input>
    @if (error() | async; as error) {
      <ion-note color="danger">{{ error | translate | titlecase }}</ion-note>
    }
    <ion-button
      fill="outline"
      color="primary"
      type="submit"
      [disabled]="(error() | async) !== null ? false : true"
    >
      <ion-icon slot="start" name="login" aria-hidden="true"></ion-icon>
      {{ 'mail.login.LOGIN' | translate | titlecase }}
    </ion-button>
  </form>
 </ion-content>
--- a/frontend/app/src/app/modules/mail/mail-login.scss
+++ b/frontend/app/src/app/modules/mail/mail-login.scss
@@ -1,17 +0,0 @@
 h1 {
  margin-inline: auto;
  color: var(--ion-color-primary-contrast);
 }
 form {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: 30em;
  margin: var(--spacing-xxl) auto;
  padding: var(--spacing-xl);
  background: var(--ion-item-background);
  border-radius: var(--border-radius-default);
 }
--- a/frontend/app/src/app/modules/mail/mail-page.component.ts
+++ b/frontend/app/src/app/modules/mail/mail-page.component.ts
@@ -1,60 +0,0 @@
 import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
 import {MailService} from './mail.service';
 import {AsyncPipe, TitleCasePipe} from '@angular/common';
 import {IonicModule} from '@ionic/angular';
 import {DataModule} from '../data/data.module';
 import {IonIconModule} from 'src/app/util/ion-icon/ion-icon.module';
 import {UtilModule} from 'src/app/util/util.module';
 import {FormatPurePipeModule, IsTodayPipeModule} from 'ngx-date-fns';
 import {ActivatedRoute, RouterModule} from '@angular/router';
 import {map, mergeMap} from 'rxjs';
 import {MailStorageProvider} from './mail-storage.provider';
 import {MailboxTreeItem} from './schema';
 import {SCIcon} from 'src/app/util/ion-icon/icon';
 import {TranslateModule} from '@ngx-translate/core';
@Component({
  selector: 'stapps-mail-page',
  templateUrl: 'mail-page.html',
  styleUrl: 'mail-page.scss',
  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [
    AsyncPipe,
    IonicModule,
    DataModule,
    IonIconModule,
    UtilModule,
    FormatPurePipeModule,
    IsTodayPipeModule,
    RouterModule,
    TranslateModule,
    TitleCasePipe,
  ],
 })
 export class MailPageComponent {
  readonly activatedRoute = inject(ActivatedRoute);
  readonly mailService = inject(MailService);
  readonly mailStorage = inject(MailStorageProvider);
  mailIcons: Record<Exclude<MailboxTreeItem['specialUse'], undefined>, keyof typeof SCIcon> = {
    '\\Inbox': SCIcon.inbox,
    '\\All': SCIcon.all_inbox,
    '\\Archive': SCIcon.archive,
    '\\Drafts': SCIcon.drafts,
    '\\Flagged': SCIcon.flag,
    '\\Junk': SCIcon.folder,
    '\\Sent': SCIcon.send,
    '\\Trash': SCIcon.delete,
  };
  mailbox = this.activatedRoute.paramMap.pipe(
    mergeMap(parameters =>
      this.mailStorage.mailboxes.pipe(
        map(mailboxes => mailboxes.folders.find(it => it.path === parameters.get('mailbox')!)!),
      ),
    ),
  );
 }
--- a/frontend/app/src/app/modules/mail/mail-page.html
+++ b/frontend/app/src/app/modules/mail/mail-page.html
@@ -1,45 +0,0 @@
 <ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
      <ion-menu-button menu="mailboxes"></ion-menu-button>
    </ion-buttons>
    <ion-title>Mail</ion-title>
  </ion-toolbar>
 </ion-header>
 <ion-content parallax>
  <ion-split-pane contentId="mailbox-content">
    <ion-menu contentId="mailbox-content" menuId="mailboxes">
      @if (mailStorage.mailboxes | async; as mailboxes) {
        <ion-list>
          @for (folder of mailboxes.folders; track folder) {
            <ion-item
              [routerLink]="['/mail', folder.path]"
              [class.active]="folder.path === (mailbox | async)?.path"
            >
              @if (folder.specialUse) {
                <ion-icon
                  slot="start"
                  [fill]="folder.path === (mailbox | async)?.path"
                  [name]="mailIcons[folder.specialUse]"
                ></ion-icon>
                <ion-label>{{ 'mail.mailboxes.' + folder.specialUse | translate | titlecase }}</ion-label>
              } @else {
                <ion-icon
                  slot="start"
                  [fill]="folder.path === (mailbox | async)?.path"
                  name="folder"
                ></ion-icon>
                <ion-label>{{ folder.name }}</ion-label>
              }
            </ion-item>
          }
        </ion-list>
      }
    </ion-menu>
    <ion-router-outlet id="mailbox-content"></ion-router-outlet>
  </ion-split-pane>
 </ion-content>
--- a/frontend/app/src/app/modules/mail/mail-page.scss
+++ b/frontend/app/src/app/modules/mail/mail-page.scss
@@ -1,26 +0,0 @@
 ion-list {
  margin: var(--spacing-md);
  border-radius: var(--border-radius-default);
 }
 ion-split-pane {
  --border: none;
 }
 ion-menu,
 ion-menu::part(container),
 ion-menu::part(backdrop) {
  background: none;
 }
 ion-menu:not(.menu-pane-visible) {
  &::part(container) {
    box-shadow: none;
  }
  > ion-list {
    height: 100%;
    margin-inline-end: var(--spacing-xl);
    box-shadow: rgba(0 0 0 / 18%) 4px 0 16px;
  }
 }
--- a/frontend/app/src/app/modules/mail/mail-storage.provider.ts
+++ b/frontend/app/src/app/modules/mail/mail-storage.provider.ts
@@ -1,243 +0,0 @@
 /* eslint-disable unicorn/no-useless-undefined */
 import {Injectable, inject} from '@angular/core';
 import {Capacitor} from '@capacitor/core';
 import {SecureStoragePlugin} from 'capacitor-secure-storage-plugin';
 import {
  BehaviorSubject,
  Observable,
  catchError,
  defer,
  distinctUntilChanged,
  filter,
  from,
  fromEvent,
  map,
  merge,
  mergeMap,
  of,
  shareReplay,
  startWith,
  take,
  firstValueFrom,
  Subject,
 } from 'rxjs';
 import {Email, EmailMeta, MailboxTreeRoot} from './schema';
 import equal from 'fast-deep-equal';
 import {MailAdapterService} from './mail-adapter.service';
 import {StorageProvider} from '../storage/storage.provider';
@Injectable({providedIn: 'root'})
 export class MailStorageProvider {
  static readonly DB_NAME = 'mail';
  static readonly MAILBOX_STORE_NAME = 'mailboxes';
  static readonly EMAIL_STORE_NAME = 'emails';
  static readonly CREDENTIALS_KEY = 'email-credentials';
  static readonly EMAIL_MAILBOX_INDEX = 'email';
  static readonly EMAIL_FLAGS_INDEX = 'flags';
  static readonly EMAIL_DATE_INDEX = 'date';
  storageProvider = inject(StorageProvider);
  mailAdapter = inject(MailAdapterService);
  database = defer(() => {
    const request = indexedDB.open(MailStorageProvider.DB_NAME, 1);
    return merge(
      fromEvent(request, 'upgradeneeded').pipe(
        map(event => {
          const database = (event.target as IDBOpenDBRequest).result;
          const mailStore = database.createObjectStore(MailStorageProvider.EMAIL_STORE_NAME, {
            keyPath: ['id', 'mailbox'],
          });
          mailStore.createIndex(MailStorageProvider.EMAIL_MAILBOX_INDEX, 'mailbox', {unique: false});
          mailStore.createIndex(MailStorageProvider.EMAIL_FLAGS_INDEX, 'flags', {
            unique: false,
            multiEntry: true,
          });
          mailStore.createIndex(MailStorageProvider.EMAIL_DATE_INDEX, 'date', {unique: false});
          return database;
        }),
      ),
      fromEvent(request, 'success').pipe(
        take(1),
        map(event => (event.target as IDBOpenDBRequest).result),
      ),
      fromEvent(request, 'error').pipe(
        take(1),
        map(event => {
          throw (event.target as IDBOpenDBRequest).error;
        }),
      ),
      fromEvent(request, 'blocked').pipe(
        take(1),
        map(() => {
          throw new Error('Database blocked');
        }),
      ),
    );
  }).pipe(shareReplay(1));
  private mailboxesChanged = new BehaviorSubject<void>(undefined);
  mailboxes: Observable<MailboxTreeRoot> = this.mailboxesChanged.pipe(
    mergeMap(() =>
      this.storageProvider
        .get<MailboxTreeRoot>(MailStorageProvider.MAILBOX_STORE_NAME)
        .catch(() => undefined!),
    ),
    filter(it => it !== undefined),
    distinctUntilChanged((a, b) => equal(a, b)),
    shareReplay(1),
  );
  async setMailboxes(root: MailboxTreeRoot | undefined): Promise<void> {
    await this.storageProvider.put(MailStorageProvider.MAILBOX_STORE_NAME, root);
    this.mailboxesChanged.next();
  }
  private credentialsChanged = new BehaviorSubject<void>(undefined);
  credentials: Observable<string | undefined> = this.credentialsChanged.pipe(
    mergeMap(() => {
      return Capacitor.isNativePlatform()
        ? from(SecureStoragePlugin.get({key: MailStorageProvider.CREDENTIALS_KEY})).pipe(
            map(({value}) => value),
            catchError(() => of(undefined)),
          )
        : of(localStorage.getItem(MailStorageProvider.CREDENTIALS_KEY) ?? undefined);
    }),
  );
  async setCredentials(credentials: string | undefined): Promise<void> {
    if (Capacitor.isNativePlatform()) {
      await (credentials === undefined
        ? SecureStoragePlugin.remove({key: MailStorageProvider.CREDENTIALS_KEY})
        : SecureStoragePlugin.set({key: MailStorageProvider.CREDENTIALS_KEY, value: credentials}));
    } else {
      if (credentials === undefined) {
        localStorage.removeItem(MailStorageProvider.CREDENTIALS_KEY);
      } else {
        localStorage.setItem(MailStorageProvider.CREDENTIALS_KEY, credentials);
      }
    }
    this.credentialsChanged.next();
  }
  private emailChanged = new Subject<Set<string>>();
  private mailboxContentChanged = new Subject<Set<string>>();
  getEmails(mailbox: string): Observable<EmailMeta[]> {
    return this.mailboxContentChanged.pipe(
      filter(it => it.has(mailbox)),
      startWith(undefined),
      mergeMap(() => this.database),
      mergeMap(database => {
        return defer(() => {
          const transaction = database.transaction([MailStorageProvider.EMAIL_STORE_NAME], 'readonly');
          const store = transaction.objectStore(MailStorageProvider.EMAIL_STORE_NAME);
          const index = store.index(MailStorageProvider.EMAIL_MAILBOX_INDEX);
          const request = index.getAll(IDBKeyRange.only(mailbox));
          return merge(
            fromEvent(request, 'success').pipe(map(() => request.result as Array<EmailMeta | Email>)),
            fromEvent(request, 'error').pipe(
              map(event => {
                throw (event.target as IDBRequest).error;
              }),
            ),
          ).pipe(take(1));
        });
      }),
      map<Array<Email | EmailMeta>, EmailMeta[]>(emails =>
        emails
          .map(email => ({id: email.id, mailbox: email.mailbox, incomplete: true}) satisfies EmailMeta)
          .sort((a, b) => Number(b.id) - Number(a.id)),
      ),
      shareReplay(1),
    );
  }
  getEmail(mailbox: string, id: string): Observable<Email> {
    return this.emailChanged.pipe(
      filter(it => it.has(JSON.stringify([id, mailbox]))),
      startWith(undefined),
      mergeMap(() => this.database),
      mergeMap(database => {
        return defer(() => {
          const transaction = database.transaction([MailStorageProvider.EMAIL_STORE_NAME], 'readonly');
          const store = transaction.objectStore(MailStorageProvider.EMAIL_STORE_NAME);
          const request = store.get([id, mailbox]);
          return merge(
            fromEvent(request, 'success').pipe(map(() => request.result as EmailMeta | Email)),
            fromEvent(request, 'error').pipe(
              map(event => {
                throw (event.target as IDBRequest).error;
              }),
            ),
          ).pipe(take(1));
        });
      }),
      mergeMap(email =>
        'incomplete' in email
          ? this.credentials.pipe(
              filter(it => it !== undefined),
              take(1),
              mergeMap(credentials =>
                this.mailAdapter.getEmail(credentials!, mailbox, id).pipe(
                  mergeMap(async email => {
                    console.log('fetiching');
                    await this.setEmail(email, true);
                    console.log('done');
                    return email;
                  }),
                ),
              ),
            )
          : of(email),
      ),
      shareReplay(1),
    );
  }
  async setEmail(email: Email | EmailMeta | Array<Email | EmailMeta>, quiet = false): Promise<void> {
    const database = await firstValueFrom(this.database);
    const transaction = database.transaction([MailStorageProvider.EMAIL_STORE_NAME], 'readwrite');
    const store = transaction.objectStore(MailStorageProvider.EMAIL_STORE_NAME);
    const mailboxesAffected = new Set<string>();
    const emailsAffected = new Set<string>();
    for (const it of Array.isArray(email) ? email : [email]) {
      mailboxesAffected.add(it.mailbox);
      emailsAffected.add(JSON.stringify([it.id, it.mailbox]));
      store.put(it);
    }
    await firstValueFrom(
      merge(
        fromEvent(transaction, 'complete').pipe(
          map(() => {
            if (!quiet) {
              this.emailChanged.next(emailsAffected);
            }
          }),
        ),
        fromEvent(transaction, 'error').pipe(
          map(event => {
            throw (event.target as IDBRequest).error;
          }),
        ),
      ),
    );
  }
 }
--- a/frontend/app/src/app/modules/mail/mail.module.ts
+++ b/frontend/app/src/app/modules/mail/mail.module.ts
@@ -1,60 +0,0 @@
 /*
 * Copyright (C) 2024 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 {Router, RouterModule} from '@angular/router';
 import {NgModule, inject} from '@angular/core';
 import {MailService} from './mail.service';
 import {map, take} from 'rxjs';
 function mailLoginGuard() {
  const router = inject(Router);
  return inject(MailService).isLoggedIn.pipe(
    map(isLoggedIn => (isLoggedIn ? true : router.createUrlTree(['/mail-login']))),
    take(1),
  );
 }
@NgModule({
  imports: [
    RouterModule.forChild([
      {
        path: 'mail-login',
        data: {redirectTo: ['/mail']},
        loadComponent: () => import('./mail-login.component').then(m => m.MailLoginComponent),
      },
      {
        path: 'mail',
        loadComponent: () => import('./mail-page.component').then(m => m.MailPageComponent),
        canActivate: [mailLoginGuard],
        canActivateChild: [mailLoginGuard],
        children: [
          {
            path: '',
            redirectTo: 'INBOX',
            pathMatch: 'full',
          },
          {
            path: ':mailbox',
            loadComponent: () => import('./mailbox-page.component').then(m => m.MailboxPageComponent),
          },
          {
            path: ':mailbox/:id',
            loadComponent: () => import('./mail-detail.component').then(m => m.MailDetailComponent),
          },
        ],
      },
    ]),
  ],
 })
 export class MailModule {}
--- a/frontend/app/src/app/modules/mail/mail.pipe.ts
+++ b/frontend/app/src/app/modules/mail/mail.pipe.ts
@@ -1,17 +0,0 @@
 import {Pipe, PipeTransform, inject} from '@angular/core';
 import {Observable} from 'rxjs';
 import {MailStorageProvider} from './mail-storage.provider';
 import {Email} from './schema';
@Pipe({
  name: 'mail',
  pure: true,
  standalone: true,
 })
 export class MailPipe implements PipeTransform {
  mailStorage = inject(MailStorageProvider);
  transform(value: {mailbox: string; id: string}): Observable<Email> {
    return this.mailStorage.getEmail(value.mailbox, value.id);
  }
 }
--- a/frontend/app/src/app/modules/mail/mail.service.ts
+++ b/frontend/app/src/app/modules/mail/mail.service.ts
@@ -1,84 +0,0 @@
 import {Injectable} from '@angular/core';
 import {
  Observable,
  map,
  mergeMap,
  filter,
  from,
  combineLatest,
  tap,
  of,
  catchError,
  BehaviorSubject,
 } from 'rxjs';
 import {MailStorageProvider} from './mail-storage.provider';
 import {MailAdapterService} from './mail-adapter.service';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 import {EmailMeta} from './schema';
@Injectable({providedIn: 'root'})
 export class MailService {
  isLoggedIn = this.mailStorage.credentials.pipe(map(it => it !== undefined));
  manualSync = new BehaviorSubject<void>(undefined);
  constructor(
    private mailStorage: MailStorageProvider,
    private mailAdapter: MailAdapterService,
  ) {
    this.mailStorage.credentials
      .pipe(
        takeUntilDestroyed(),
        mergeMap(credentials => this.manualSync.pipe(map(() => credentials))),
        mergeMap(credentials => {
          return credentials === undefined
            ? of()
            : this.mailAdapter
                .listMailboxes(credentials)
                .pipe(mergeMap(mailboxes => this.mailStorage.setMailboxes(mailboxes)));
        }),
      )
      .subscribe(() => {});
    combineLatest([
      this.mailStorage.credentials.pipe(filter(it => it !== undefined)),
      this.mailStorage.mailboxes,
    ])
      .pipe(
        takeUntilDestroyed(),
        mergeMap(([credentials, mailboxes]) =>
          from(mailboxes.folders).pipe(
            mergeMap(async mailbox => {
              return this.mailAdapter.listRawEmails(credentials!, mailbox.path).pipe(
                map<string[], EmailMeta[]>(emails =>
                  emails.map(it => ({id: it, mailbox: mailbox.path, incomplete: true}) satisfies EmailMeta),
                ),
                catchError(error => {
                  console.error(error);
                  return of();
                }),
              );
            }),
            mergeMap(emails => emails),
          ),
        ),
        mergeMap(emails => this.mailStorage.setEmail(emails)),
      )
      .subscribe(() => {});
  }
  login(username: string, password: string): Observable<boolean> {
    const credentials = btoa(`${username}:${password}`);
    return this.mailAdapter.checkCredentials(credentials).pipe(
      tap(success => {
        if (success) {
          this.mailStorage.setCredentials(credentials);
        }
      }),
    );
  }
  logout() {
    this.mailStorage.setCredentials(undefined);
    this.mailStorage.setMailboxes(undefined);
  }
 }
--- a/frontend/app/src/app/modules/mail/mailbox-page.component.ts
+++ b/frontend/app/src/app/modules/mail/mailbox-page.component.ts
@@ -1,54 +0,0 @@
 import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
 import {ActivatedRoute, RouterModule} from '@angular/router';
 import {MailService} from './mail.service';
 import {MailStorageProvider} from './mail-storage.provider';
 import {mergeMap, map, filter} from 'rxjs';
 import {IonicModule} from '@ionic/angular';
 import {IonIconModule} from 'src/app/util/ion-icon/ion-icon.module';
 import {TranslateModule} from '@ngx-translate/core';
 import {AsyncPipe, TitleCasePipe} from '@angular/common';
 import {LazyComponent} from 'src/app/util/lazy.component';
 import {MailPipe} from './mail.pipe';
 import {FormatPurePipeModule, IsTodayPipeModule} from 'ngx-date-fns';
 import {LazyLoadPipe} from 'src/app/util/lazy-load.pipe';
@Component({
  selector: 'stapps-mailbox-page',
  templateUrl: 'mailbox-page.html',
  styleUrl: 'mailbox-page.scss',
  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [
    IonicModule,
    IonIconModule,
    TranslateModule,
    AsyncPipe,
    LazyComponent,
    MailPipe,
    IsTodayPipeModule,
    FormatPurePipeModule,
    RouterModule,
    LazyLoadPipe,
    TitleCasePipe,
  ],
 })
 export class MailboxPageComponent {
  readonly activatedRoute = inject(ActivatedRoute);
  readonly mailService = inject(MailService);
  readonly mailStorage = inject(MailStorageProvider);
  mailbox = this.activatedRoute.paramMap.pipe(
    mergeMap(parameters =>
      this.mailStorage.mailboxes.pipe(
        map(mailboxes => mailboxes.folders.find(it => it.path === parameters.get('mailbox')!)!),
      ),
    ),
  );
  mails = this.mailbox.pipe(
    filter(mailbox => mailbox !== undefined),
    mergeMap(mailbox => this.mailStorage.getEmails(mailbox.path)),
  );
 }
--- a/frontend/app/src/app/modules/mail/mailbox-page.html
+++ b/frontend/app/src/app/modules/mail/mailbox-page.html
@@ -1,54 +0,0 @@
 <ion-content>
  <h1>
    @if (mailbox | async; as mailbox) {
      @if (mailbox.specialUse) {
        {{ 'mail.mailboxes.' + mailbox.specialUse | translate | titlecase }}
      } @else {
        {{ mailbox.name }}
      }
    } @else {
      <ion-skeleton-text animated style="width: 100px; height: 20px"></ion-skeleton-text>
    }
  </h1>
  @if (mails | async; as mails) {
    <ion-list>
      @for (mail of mails; track mail.id) {
        <ion-item #item [routerLink]="['/mail', mail.mailbox, mail.id]">
          @if (mail | mail | lazyLoad: item | async; as mail) {
            <div slot="start" class="avatar">
              @if (mail.from; as from) {
                <div>
                  {{ (from.value.name || from.value.address)?.charAt(0)?.toUpperCase() }}
                </div>
              }
            </div>
            <ion-label>
              <h2 [class.unread]="!mail.flags.has('\\Seen')">
                {{ mail.from.value.name || mail.from.value.address }}
              </h2>
              @if (mail.subject) {
                <p>{{ mail.subject.value }}</p>
              }
            </ion-label>
            <ion-note slot="end">
              @if (mail.date.value | dfnsIsToday) {
                {{ mail.date.value | dfnsFormatPure: 'p' }}
              } @else {
                {{ mail.date.value | dfnsFormatPure: 'P' }}
              }
            </ion-note>
          } @else {
            <div slot="start" class="avatar">
              <ion-skeleton-text animated></ion-skeleton-text>
            </div>
            <ion-label>
              <h2><ion-skeleton-text animated></ion-skeleton-text></h2>
              <p><ion-skeleton-text animated></ion-skeleton-text></p>
            </ion-label>
          }
        </ion-item>
      }
    </ion-list>
  }
 </ion-content>
--- a/frontend/app/src/app/modules/mail/mailbox-page.scss
+++ b/frontend/app/src/app/modules/mail/mailbox-page.scss
@@ -1,44 +0,0 @@
 .avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2em;
  height: 2em;
  color: var(--ion-color-light-contrast);
  background: var(--ion-color-light);
  border-radius: 50%;
 }
 h1 {
  margin-inline: var(--spacing-md);
  color: var(--ion-color-primary-contrast);
 }
 h2 > ion-skeleton-text {
  width: min(60%, 20em);
 }
 p > ion-skeleton-text {
  width: min(80%, 20em);
 }
 .avatar > ion-skeleton-text {
  border-radius: 50%;
 }
 ion-item.unread h2 {
  font-weight: bold;
 }
 ion-item p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }
 ion-content::part(background) {
  background: none;
 }
--- a/frontend/app/src/app/modules/mail/schema.ts
+++ b/frontend/app/src/app/modules/mail/schema.ts
@@ -1,128 +0,0 @@
 import {z} from 'zod';
 export const RawEmailAddress = z.object({
  name: z.optional(z.string()),
  address: z.optional(z.string()),
 });
 export type RawEmailAddress = z.infer<typeof RawEmailAddress>;
 export const RawEmailEnvelope = z.object({
  date: z.coerce.date(),
  subject: z.string(),
  messageId: z.string(),
  inReplyTo: z.optional(z.string()),
  from: z.array(RawEmailAddress),
  sender: z.array(RawEmailAddress),
  replyTo: z.array(RawEmailAddress),
  to: z.array(RawEmailAddress),
  cc: z.optional(z.array(RawEmailAddress)),
  bcc: z.optional(z.array(RawEmailAddress)),
 });
 export type RawEmailEnvelope = z.infer<typeof RawEmailEnvelope>;
 const RawEmailBodyStructureBase = z.object({
  part: z.optional(z.string()),
  type: z.string(),
  parameters: z.optional(z.record(z.string(), z.string())),
  encoding: z.optional(z.enum(['7bit', '8bit', 'binary', 'base64', 'quoted-printable'])),
  size: z.optional(z.number()),
  envelope: z.optional(RawEmailEnvelope),
  disposition: z.optional(z.string()),
  dispositionParameters: z.optional(z.record(z.string(), z.string())),
 });
 export type RawEmailBodyStructure = z.infer<typeof RawEmailBodyStructureBase> & {
  childNodes?: RawEmailBodyStructure[];
 };
 export const RawEmailBodyStructure: z.ZodType<RawEmailBodyStructure> = RawEmailBodyStructureBase.extend({
  childNodes: z.optional(z.lazy(() => z.array(RawEmailBodyStructure))),
 });
 export const RawEmail = z.object({
  bodyStructure: RawEmailBodyStructure,
  labels: z.array(z.string()).transform(it => new Set(it)),
  flags: z.array(z.string()).transform(it => new Set(it)),
  envelope: RawEmailEnvelope,
  seq: z.coerce.string(),
 });
 export type RawEmail = z.infer<typeof RawEmail>;
 const MailboxTreeItemBase = z.object({
  path: z.string(),
  name: z.string(),
  delimiter: z.string(),
  flags: z.array(z.string()).or(z.object({})),
  specialUse: z.optional(
    z.enum(['\\All', '\\Archive', '\\Drafts', '\\Flagged', '\\Junk', '\\Sent', '\\Trash', '\\Inbox']),
  ),
  listed: z.boolean(),
  subscribed: z.boolean(),
  disabled: z.boolean().optional(),
 });
 export type MailboxTreeItem = z.infer<typeof MailboxTreeItemBase> & {
  folders?: MailboxTreeItem[];
 };
 export const MailboxTreeItem: z.ZodType<MailboxTreeItem> = MailboxTreeItemBase.extend({
  folders: z.optional(z.lazy(() => z.array(MailboxTreeItem))),
 });
 export const MailboxTreeRoot = z.object({
  path: z.literal('').default(''),
  root: z.literal(true),
  folders: z.array(MailboxTreeItem),
 });
 export type MailboxTreeRoot = z.infer<typeof MailboxTreeRoot>;
 export interface Signature {
  type: 'pkcs7';
  valid: boolean;
 }
 export interface SignedValue<T> {
  value: T;
  signature?: Signature;
 }
 export interface EmailAddress {
  name?: string;
  address?: string;
 }
 export interface EmailAttachmentBase {
  filename: string;
  size: number;
 }
 export interface EmailAttachmentRemote extends EmailAttachmentBase {
  part: string;
 }
 export interface EmailAttachmentLocal extends EmailAttachmentBase {
  content: ArrayBuffer;
 }
 export type EmailAttachment = EmailAttachmentRemote | EmailAttachmentLocal;
 export interface Email {
  id: string;
  mailbox: string;
  flags: Set<string>;
  subject?: SignedValue<string>;
  date: SignedValue<Date>;
  from: SignedValue<EmailAddress>;
  to?: SignedValue<EmailAddress>[];
  cc?: SignedValue<EmailAddress>[];
  bcc?: SignedValue<EmailAddress>[];
  html?: SignedValue<string>;
  text?: SignedValue<string>;
  attachments: SignedValue<EmailAttachment>[];
 }
 export type EmailMeta = Pick<Email, 'id' | 'mailbox'> & {incomplete: true};
--- a/frontend/app/src/app/modules/profile/id-cards.provider.ts
+++ b/frontend/app/src/app/modules/profile/id-cards.provider.ts
@@ -41,7 +41,7 @@ export class IdCardsProvider {
                mergeMap(user => this.fetchFallbackIdCards(user)),
                startWith([]),
              )
-          : of([]).pipe(tap({next: () => this.encryptedStorageProvider.delete('id-cards')})),
+          : of([]).pipe(tap(() => this.encryptedStorageProvider.delete('id-cards'))),
      ),
    );
  }
@@ -54,7 +54,7 @@ export class IdCardsProvider {
        },
        responseType: 'json',
      })
-      .pipe(tap({next: idCards => this.encryptedStorageProvider.set('id-cards', idCards)}));
+      .pipe(tap(idCards => this.encryptedStorageProvider.set('id-cards', idCards)));
  }
  private fetchFallbackIdCards(user: SCUserConfiguration): Observable<SCIdCard[]> {
--- a/frontend/app/src/app/modules/profile/page/profile-page-section.html
+++ b/frontend/app/src/app/modules/profile/page/profile-page-section.html
@@ -39,11 +39,6 @@
          }
          <ion-label>{{ 'name' | translateSimple: link }}</ion-label>
        </div>
        @if (link.beta) {
          <ion-note>
            <ion-badge color="warning">{{ 'beta' | translate }}</ion-badge>
          </ion-note>
        }
      </ion-item>
    }
  </simple-swiper>
--- a/frontend/app/src/app/modules/profile/page/profile-page-section.scss
+++ b/frontend/app/src/app/modules/profile/page/profile-page-section.scss
@@ -50,13 +50,6 @@ ion-item {
  }
 }
 ion-note {
  position: absolute;
  top: 0;
  right: 0;
  padding: var(--spacing-xs);
 }
 simple-swiper {
  --swiper-slide-width: #{$width};
--- a/frontend/app/src/app/util/data-size.pipe.ts
+++ b/frontend/app/src/app/util/data-size.pipe.ts
@@ -1,25 +0,0 @@
 import {Pipe, PipeTransform} from '@angular/core';
 /**
 * Format a data size in bytes to a human readable string
 */
 export function formatDataSize(value: number, precision = 2): string {
  const units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
  let unit = 0;
  while (value >= 1024 && unit < units.length - 1) {
    value /= 1024;
    unit++;
  }
  return `${value.toFixed(precision)} ${units[unit]}`;
 }
@Pipe({
  name: 'dataSize',
  pure: true,
  standalone: true,
 })
 export class DataSizePipe implements PipeTransform {
  transform(value: number, precision = 2): string {
    return formatDataSize(value, precision);
  }
 }
--- a/frontend/app/src/app/util/lazy-load.pipe.ts
+++ b/frontend/app/src/app/util/lazy-load.pipe.ts
@@ -1,36 +0,0 @@
 import {OnDestroy, Pipe, PipeTransform} from '@angular/core';
 import {Observable, Subject, mergeMap} from 'rxjs';
@Pipe({
  name: 'lazyLoad',
  pure: true,
  standalone: true,
 })
 export class LazyLoadPipe implements PipeTransform, OnDestroy {
  intersectionObserver?: IntersectionObserver;
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  transform<T>(value: Observable<T>, element: any): Observable<T> {
    if (element.el instanceof Element) {
      const isInView = new Subject<void>();
      this.intersectionObserver?.disconnect();
      this.intersectionObserver = new IntersectionObserver(entries => {
        if (entries.some(it => it.isIntersecting)) {
          this.intersectionObserver?.disconnect();
          delete this.intersectionObserver;
          isInView.next();
          isInView.complete();
        }
      });
      this.intersectionObserver.observe(element.el);
      return isInView.pipe(mergeMap(() => value));
    } else {
      console.error('LazyLoadPipe: not an element', element);
      return value;
    }
  }
  ngOnDestroy() {
    this.intersectionObserver?.disconnect();
  }
 }
--- a/frontend/app/src/app/util/lazy.component.ts
+++ b/frontend/app/src/app/util/lazy.component.ts
@@ -1,46 +0,0 @@
 import {NgTemplateOutlet} from '@angular/common';
 import {
  ChangeDetectionStrategy,
  Component,
  ContentChild,
  ElementRef,
  OnDestroy,
  OnInit,
  Renderer2,
  TemplateRef,
  signal,
 } from '@angular/core';
@Component({
  selector: 'stapps-lazy',
  templateUrl: 'lazy.html',
  styleUrl: 'lazy.scss',
  standalone: true,
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [NgTemplateOutlet],
 })
 export class LazyComponent implements OnInit, OnDestroy {
  @ContentChild(TemplateRef) template!: TemplateRef<void>;
  isIntersecting = signal(false);
  intersectionObserver = new IntersectionObserver(entries => {
    this.isIntersecting.set(this.isIntersecting() || entries.some(entry => entry.isIntersecting));
    if (this.isIntersecting()) {
      this.intersectionObserver.disconnect();
    }
  });
  constructor(
    readonly element: ElementRef,
    readonly renderer: Renderer2,
  ) {}
  ngOnInit() {
    this.intersectionObserver.observe(this.element.nativeElement);
  }
  ngOnDestroy() {
    this.intersectionObserver.disconnect();
  }
 }
--- a/frontend/app/src/app/util/lazy.html
+++ b/frontend/app/src/app/util/lazy.html
@@ -1,3 +0,0 @@
@if (isIntersecting()) {
  <ng-container *ngTemplateOutlet="template"></ng-container>
 }
--- a/frontend/app/src/app/util/lazy.scss
+++ b/frontend/app/src/app/util/lazy.scss
--- a/frontend/app/src/app/util/media-query.pipe.ts
+++ b/frontend/app/src/app/util/media-query.pipe.ts
@@ -1,6 +1,7 @@
 import {PipeTransform} from '@angular/core';
 import {Pipe} from '@angular/core';
-import {Observable, fromEvent, map, startWith} from 'rxjs';
+import {Observable} from 'rxjs';
 import {fromMediaQuery} from './rxjs/from-media-query';
@Pipe({
  name: 'mediaQuery',
@@ -9,10 +10,6 @@ import {Observable, fromEvent, map, startWith} from 'rxjs';
 })
 export class MediaQueryPipe implements PipeTransform {
  transform(query: string): Observable<boolean> {
-    const match = window.matchMedia(query);
+    return fromMediaQuery(query);
    return fromEvent<MediaQueryListEvent>(match, 'change').pipe(
      map(event => event.matches),
      startWith(match.matches),
    );
  }
 }
--- a/frontend/app/src/app/util/rxjs/from-cursor.ts
+++ b/frontend/app/src/app/util/rxjs/from-cursor.ts
@@ -1,22 +0,0 @@
 import {EMPTY, Observable, concat, defer, of} from 'rxjs';
 /**
 * Turns an IDBCursorWithValue into an Observable of values.
 *
 * Values are emitted lazily, i.e. the next value is only emitted when the
 * previous one has been consumed.
 * @example fromCursor(cursor).pipe(take(10)).subscribe(console.log);
 */
 export function fromCursor<T>(cursor: IDBCursorWithValue): Observable<T> {
  if (cursor.key === null) {
    return EMPTY;
  }
  const value = cursor.value as T;
  cursor.continue();
  return concat(
    of(value),
    defer(() => fromCursor<T>(cursor)),
  );
 }
--- a/frontend/app/src/app/util/rxjs/from-media-query.ts
+++ b/frontend/app/src/app/util/rxjs/from-media-query.ts
@@ -0,0 +1,38 @@
 import {Observable, combineLatest, defer, distinctUntilChanged, fromEvent, map, startWith} from 'rxjs';
 /**
 * Lazily creates an Observable that emits whether the given media query matches.
 * @example
 * fromMediaQuery('(prefers-color-scheme: dark)').subscribe(matches => console.log(matches))
 */
 export function fromMediaQuery(query: string): Observable<boolean> {
  return defer(() => {
    const match = window.matchMedia(query);
    return fromEvent<MediaQueryListEvent>(match, 'change').pipe(
      map(event => event.matches),
      startWith(match.matches),
    );
  });
 }
 /**
 * Like `fromMediaQuery`, but combines multiple matches.
 * Since the list of values may not be exhaustive, the result can be `undefined`
 * @example
 * fromMediaQueryValues('prefers-color-scheme', ['dark', 'light']).subscribe(value => console.log(value))
 */
 export function fromMediaQueryValues<T extends string>(
  property: string,
  values: T[],
 ): Observable<T | undefined> {
  return defer(() =>
    combineLatest(
      values.map(value =>
        fromMediaQuery(`(${property}: ${value})`).pipe(map(matches => [value, matches] as const)),
      ),
    ).pipe(
      map(matches => matches.find(([, matches]) => matches)?.[0]),
      distinctUntilChanged(),
    ),
  );
 }
--- a/frontend/app/src/app/util/shadow-html.directive.ts
+++ b/frontend/app/src/app/util/shadow-html.directive.ts
@@ -1,18 +0,0 @@
 import {Directive, ElementRef, Host, Input} from '@angular/core';
 import {sanitize} from 'dompurify';
@Directive({
  selector: '[shadowHTML]',
  standalone: true,
 })
 export class ShadowHtmlDirective {
  @Input({required: true})
  set shadowHTML(content: string) {
    this.shadowRoot.innerHTML = '';
    this.shadowRoot.append(sanitize(content, {RETURN_DOM_FRAGMENT: true, USE_PROFILES: {html: true}}));
  }
  shadowRoot = (this.elementRef.nativeElement as HTMLElement).attachShadow({mode: 'open'});
  constructor(@Host() readonly elementRef: ElementRef) {}
 }
--- a/frontend/app/src/app/util/theme-ionic-utils.ts
+++ b/frontend/app/src/app/util/theme-ionic-utils.ts
@@ -0,0 +1,288 @@
 import {Hct, argbFromHex, hexFromArgb} from '@material/material-color-utilities';
 import {
  IonTheme,
  IonThemeColorDarkLight,
  IonThemeOptions,
  ThemeCustomColor,
  ThemeCustomColorOptions,
 } from './theme-types';
 import {dynamicScheme, makeCustomColor} from './theme-utils';
 /**
 * Turn a custom material color to a color that can be used in Ionic
 */
 export function ionColorFromCustomColor(color: ThemeCustomColor): IonThemeColorDarkLight {
  return {
    palette: color.palette,
    light: {
      color: color.light.color,
      colorContrast: color.light.onColor,
      colorShade: color.fixed.dim,
      colorTint: color.fixed.color,
    },
    dark: {
      color: color.dark.color,
      colorContrast: color.dark.onColor,
      colorShade: color.fixed.dim,
      colorTint: color.fixed.color,
    },
  };
 }
 /**
 * Create an Ionic theme
 */
 export function makeIonicTheme(options: IonThemeOptions): IonTheme {
  const light = dynamicScheme(
    options.variant,
    Hct.fromInt(options.sourceColor),
    false,
    options.contrastLevel,
  );
  const dark = dynamicScheme(options.variant, Hct.fromInt(options.sourceColor), true, options.contrastLevel);
  const customColorOptions: Omit<ThemeCustomColorOptions, 'color'> = {
    blend: true,
    sourceColor: options.sourceColor,
    variant: options.variant,
    contrastLevel: options.contrastLevel,
  };
  return {
    success: ionColorFromCustomColor(makeCustomColor({color: argbFromHex('#00ff00'), ...customColorOptions})),
    warning: ionColorFromCustomColor(makeCustomColor({color: argbFromHex('#ffdd00'), ...customColorOptions})),
    danger: ionColorFromCustomColor(makeCustomColor({color: argbFromHex('#ff4444'), ...customColorOptions})),
    primary: {
      palette: light.primaryPalette,
      light: {
        color: light.primary,
        colorContrast: light.onPrimary,
        colorShade: light.primaryFixedDim,
        colorTint: light.primaryFixed,
      },
      dark: {
        color: dark.primary,
        colorContrast: dark.onPrimary,
        colorShade: dark.primaryFixedDim,
        colorTint: dark.primaryFixed,
      },
    },
    secondary: {
      palette: light.secondaryPalette,
      light: {
        color: light.secondary,
        colorContrast: light.onSecondary,
        colorShade: light.secondaryFixedDim,
        colorTint: light.secondaryFixed,
      },
      dark: {
        color: dark.secondary,
        colorContrast: dark.onSecondary,
        colorShade: dark.secondaryFixedDim,
        colorTint: dark.secondaryFixed,
      },
    },
    tertiary: {
      palette: light.tertiaryPalette,
      light: {
        color: light.tertiary,
        colorContrast: light.onTertiary,
        colorShade: light.tertiaryFixedDim,
        colorTint: light.tertiaryFixed,
      },
      dark: {
        color: dark.tertiary,
        colorContrast: dark.onTertiary,
        colorShade: dark.tertiaryFixedDim,
        colorTint: dark.tertiaryFixed,
      },
    },
    light: {
      palette: light.neutralPalette,
      light: {
        color: light.neutralPalette.tone(90),
        colorContrast: light.onSurface,
        colorShade: light.neutralPalette.tone(85),
        colorTint: light.neutralPalette.tone(95),
      },
      dark: {
        color: dark.surfaceContainerLowest,
        colorContrast: dark.onSurface,
        // TODO: find a better color for these
        colorShade: dark.surfaceBright,
        colorTint: dark.surfaceBright,
      },
    },
    medium: {
      palette: light.neutralVariantPalette,
      light: {
        color: light.neutralPalette.tone(50),
        colorContrast: light.onSurfaceVariant,
        colorShade: light.neutralPalette.tone(45),
        colorTint: light.neutralPalette.tone(55),
      },
      dark: {
        color: dark.surfaceVariant,
        colorContrast: dark.onSurfaceVariant,
        // TODO: find a better color for these
        colorShade: dark.surfaceContainerLow,
        colorTint: dark.surfaceContainerHigh,
      },
    },
    dark: {
      palette: light.neutralPalette,
      light: {
        color: light.surfaceContainerHigh,
        colorContrast: light.onSurface,
        colorShade: light.surfaceContainerHighest,
        colorTint: light.surfaceContainer,
      },
      dark: {
        color: dark.surfaceContainerHighest,
        colorContrast: dark.onSurface,
        // TODO: find a better color for these
        colorShade: dark.surfaceDim,
        colorTint: dark.surfaceDim,
      },
    },
    background: {
      palette: light.neutralPalette,
      light: {
        backgroundColor: light.background,
        textColor: light.onBackground,
        boxShadowColor: light.shadow,
        placeholderColor: light.onSurfaceVariant,
      },
      dark: {
        backgroundColor: dark.background,
        textColor: dark.onBackground,
        boxShadowColor: dark.shadow,
        placeholderColor: dark.onSurfaceVariant,
      },
    },
    item: {
      palette: light.neutralPalette,
      light: {
        itemBackground: light.surface,
        itemColor: light.onSurface,
        cardBackground: light.surfaceContainer,
        itemBorderColor: light.outline,
        borderColor: light.outline,
      },
      dark: {
        itemBackground: dark.surface,
        itemColor: dark.onSurface,
        cardBackground: dark.surfaceContainer,
        itemBorderColor: dark.outline,
        borderColor: dark.outline,
      },
    },
  };
 }
 /**
 * Simple color
 */
 function color(element: HTMLElement, name: string, argb: number) {
  element.style.setProperty(name, hexFromArgb(argb));
 }
 /**
 * Color, in RGB
 */
 function colorRgb(element: HTMLElement, name: string, argb: number) {
  element.style.setProperty(name, `${(argb >> 16) & 0xff}, ${(argb >> 8) & 0xff}, ${argb & 0xff}`);
 }
 /**
 * Apply the Ionic color to an element
 */
 export function applyIonicAccentColor(
  element: HTMLElement,
  name: string,
  colors: IonThemeColorDarkLight,
  dark: boolean,
 ) {
  const operations = [
    ['', dark ? colors.dark : colors.light],
    ['-dark', colors.dark],
    ['-light', colors.light],
  ] as const;
  for (const [suffix, colors] of operations) {
    color(element, `--ion-color-${name}${suffix}`, colors.color);
    color(element, `--ion-color-${name}-contrast${suffix}`, colors.colorContrast);
    color(element, `--ion-color-${name}-shade${suffix}`, colors.colorShade);
    color(element, `--ion-color-${name}-tint${suffix}`, colors.colorTint);
    colorRgb(element, `--ion-color-${name}-rgb${suffix}`, colors.color);
    colorRgb(element, `--ion-color-${name}-contrast-rgb${suffix}`, colors.colorContrast);
    colorRgb(element, `--ion-color-${name}-shade-rgb${suffix}`, colors.colorShade);
    colorRgb(element, `--ion-color-${name}-tint-rgb${suffix}`, colors.colorTint);
  }
 }
 /**
 * Apply the theme
 */
 export function applyIonicTheme(element: HTMLElement, theme: IonTheme, dark: boolean) {
  applyIonicAccentColor(element, 'primary', theme.primary, dark);
  applyIonicAccentColor(element, 'secondary', theme.secondary, dark);
  applyIonicAccentColor(element, 'tertiary', theme.tertiary, dark);
  applyIonicAccentColor(element, 'success', theme.success, dark);
  applyIonicAccentColor(element, 'warning', theme.warning, dark);
  applyIonicAccentColor(element, 'danger', theme.danger, dark);
  applyIonicAccentColor(element, 'dark', theme.dark, dark);
  applyIonicAccentColor(element, 'medium', theme.medium, dark);
  applyIonicAccentColor(element, 'light', theme.light, dark);
  const backgroundOps = [
    ['', dark ? theme.background.dark : theme.background.light],
    ['-dark', theme.background.dark],
    ['-light', theme.background.light],
  ] as const;
  for (const [suffix, background] of backgroundOps) {
    color(element, `--ion-background-color${suffix}`, background.backgroundColor);
    color(element, `--ion-text-color${suffix}`, background.textColor);
    color(element, `--ion-box-shadow-color${suffix}`, background.boxShadowColor);
    color(element, `--ion-placeholder-color${suffix}`, background.placeholderColor);
    colorRgb(element, `--ion-background-color-rgb${suffix}`, background.backgroundColor);
    colorRgb(element, `--ion-text-color-rgb${suffix}`, background.textColor);
    colorRgb(element, `--ion-box-shadow-color-rgb${suffix}`, background.boxShadowColor);
    colorRgb(element, `--ion-placeholder-color-rgb${suffix}`, background.placeholderColor);
  }
  const stepOps = [
    ['', dark ? true : false],
    ['-dark', true],
    ['-light', false],
  ] as const;
  for (const [suffix, reverse] of stepOps) {
    for (let i = 5; i < 100; i += 5) {
      const ionicTone = 10 * (reverse ? 100 - i : i);
      color(element, `--ion-color-step-${ionicTone}${suffix}`, theme.background.palette.tone(i));
    }
  }
  const itemOps = [
    ['', dark ? theme.item.dark : theme.item.light],
    ['-dark', theme.item.dark],
    ['-light', theme.item.light],
  ] as const;
  for (const [suffix, item] of itemOps) {
    color(element, `--ion-item-background${suffix}`, item.itemBackground);
    color(element, `--ion-card-background${suffix}`, item.cardBackground);
    color(element, `--ion-item-border-color${suffix}`, item.itemBorderColor);
    color(element, `--ion-border-color${suffix}`, item.borderColor);
    color(element, `--ion-item-color${suffix}`, item.itemColor);
    colorRgb(element, `--ion-item-background-rgb${suffix}`, item.itemBackground);
    colorRgb(element, `--ion-card-background-rgb${suffix}`, item.cardBackground);
    colorRgb(element, `--ion-item-border-color-rgb${suffix}`, item.itemBorderColor);
    colorRgb(element, `--ion-border-color-rgb${suffix}`, item.borderColor);
    colorRgb(element, `--ion-item-color-rgb${suffix}`, item.itemColor);
  }
 }
--- a/frontend/app/src/app/util/theme-types.ts
+++ b/frontend/app/src/app/util/theme-types.ts
@@ -0,0 +1,109 @@
 import {TonalPalette} from '@material/material-color-utilities';
 export const THEME_VARIANTS = [
  'content',
  'neutral',
  'rainbow',
  'vibrant',
  'fidelity',
  'expressive',
  'monochrome',
  'tonal-spot',
  'fruit-salad',
 ] as const;
 export type ThemeVariant = (typeof THEME_VARIANTS)[number];
 export interface ThemeCustomColorOptions {
  color: number;
  blend: boolean;
  sourceColor: number;
  variant: ThemeVariant;
  contrastLevel: number;
 }
 export interface ThemeColorNormal {
  color: number;
  onColor: number;
  container: number;
  onContainer: number;
 }
 /**
 * Palette that can be used in both light and dark mode.
 * Caution: check contrast level before using
 * @see https://m3.material.io/styles/color/roles#26b6a882-064d-4668-b096-c51142477850
 */
 export interface ThemeColorFixed {
  color: number;
  onColor: number;
  /**
   * Lower emphasis against fixed color
   */
  onVariant: number;
  dim: number;
 }
 export interface ThemeCustomColor {
  color: number;
  source: number;
  palette: TonalPalette;
  light: ThemeColorNormal;
  dark: ThemeColorNormal;
  fixed: ThemeColorFixed;
 }
 export interface IonThemeOptions {
  sourceColor: number;
  contrastLevel: number;
  variant: ThemeVariant;
 }
 export interface IonThemeColor {
  color: number;
  colorContrast: number;
  colorShade: number;
  colorTint: number;
 }
 export interface IonThemeColorDarkLight {
  palette: TonalPalette;
  dark: IonThemeColor;
  light: IonThemeColor;
 }
 export interface IonThemeBackground {
  backgroundColor: number;
  textColor: number;
  boxShadowColor: number;
  placeholderColor: number;
 }
 export interface IonThemeItem {
  itemBackground: number;
  cardBackground: number;
  itemBorderColor: number;
  borderColor: number;
  itemColor: number;
 }
 export interface IonTheme {
  primary: IonThemeColorDarkLight;
  secondary: IonThemeColorDarkLight;
  tertiary: IonThemeColorDarkLight;
  success: IonThemeColorDarkLight;
  warning: IonThemeColorDarkLight;
  danger: IonThemeColorDarkLight;
  dark: IonThemeColorDarkLight;
  medium: IonThemeColorDarkLight;
  light: IonThemeColorDarkLight;
  background: {
    palette: TonalPalette;
    light: IonThemeBackground;
    dark: IonThemeBackground;
  };
  item: {
    palette: TonalPalette;
    light: IonThemeItem;
    dark: IonThemeItem;
  };
 }
--- a/frontend/app/src/app/util/theme-utils.ts
+++ b/frontend/app/src/app/util/theme-utils.ts
@@ -0,0 +1,93 @@
 import {
  Blend,
  Hct,
  SchemeContent,
  SchemeExpressive,
  SchemeFidelity,
  SchemeFruitSalad,
  SchemeMonochrome,
  SchemeNeutral,
  SchemeRainbow,
  SchemeTonalSpot,
  SchemeVibrant,
 } from '@material/material-color-utilities';
 import {ThemeCustomColor, ThemeCustomColorOptions, ThemeVariant} from './theme-types';
 export const DEFAULT_CONTRAST = 0;
 export const GLOBAL_CONTRAST = {
  'more': 4,
  'less': 0,
  'no-preference': 0,
 };
 /**
 * Creates a DynamicScheme based on the variant.
 */
 export function dynamicScheme(
  variant: ThemeVariant,
  sourceColorHct: Hct,
  isDark: boolean,
  contrastLevel: number,
 ) {
  switch (variant) {
    case 'content': {
      return new SchemeContent(sourceColorHct, isDark, contrastLevel);
    }
    case 'neutral': {
      return new SchemeNeutral(sourceColorHct, isDark, contrastLevel);
    }
    case 'rainbow': {
      return new SchemeRainbow(sourceColorHct, isDark, contrastLevel);
    }
    case 'vibrant': {
      return new SchemeVibrant(sourceColorHct, isDark, contrastLevel);
    }
    case 'fidelity': {
      return new SchemeFidelity(sourceColorHct, isDark, contrastLevel);
    }
    case 'expressive': {
      return new SchemeExpressive(sourceColorHct, isDark, contrastLevel);
    }
    case 'monochrome': {
      return new SchemeMonochrome(sourceColorHct, isDark, contrastLevel);
    }
    case 'tonal-spot': {
      return new SchemeTonalSpot(sourceColorHct, isDark, contrastLevel);
    }
    case 'fruit-salad': {
      return new SchemeFruitSalad(sourceColorHct, isDark, contrastLevel);
    }
  }
 }
 /**
 * Create a custom color that works with the theme
 */
 export function makeCustomColor(options: ThemeCustomColorOptions): ThemeCustomColor {
  const color = options.blend ? Blend.harmonize(options.color, options.sourceColor) : options.color;
  const light = dynamicScheme(options.variant, Hct.fromInt(color), false, options.contrastLevel);
  const dark = dynamicScheme(options.variant, Hct.fromInt(color), true, options.contrastLevel);
  return {
    color,
    source: options.color,
    palette: light.primaryPalette,
    light: {
      color: light.primary,
      onColor: light.onPrimary,
      container: light.primaryContainer,
      onContainer: light.onPrimaryContainer,
    },
    dark: {
      color: dark.primary,
      onColor: dark.onPrimary,
      container: dark.primaryContainer,
      onContainer: dark.onPrimaryContainer,
    },
    fixed: {
      color: light.primaryFixed,
      onColor: light.onPrimaryFixed,
      dim: light.primaryFixedDim,
      onVariant: light.onPrimaryFixedVariant,
    },
  };
 }
--- a/frontend/app/src/app/util/theme.provider.ts
+++ b/frontend/app/src/app/util/theme.provider.ts
@@ -0,0 +1,61 @@
 import {Injectable} from '@angular/core';
 import {fromMediaQuery, fromMediaQueryValues} from './rxjs/from-media-query';
 import {BehaviorSubject, Observable, combineLatest, distinctUntilChanged, map} from 'rxjs';
 import {argbFromHex} from '@material/material-color-utilities';
 import {applyIonicTheme, makeIonicTheme} from './theme-ionic-utils';
 import {DEFAULT_CONTRAST, GLOBAL_CONTRAST} from './theme-utils';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 import {ThemeVariant} from './theme-types';
@Injectable({
  providedIn: 'root',
 })
 export class ThemeProvider {
  prefersDark = fromMediaQuery('(prefers-color-scheme: dark)');
  constrastPreference = fromMediaQueryValues('prefers-contrast', ['more', 'less', 'no-preference']);
  // TODO: fetch the color from somewhere
  settingThemeColor = new BehaviorSubject<string>('#3880FF');
  settingThemeVariant = new BehaviorSubject<ThemeVariant>('content');
  settingThemeContrast = new BehaviorSubject<number | undefined>(undefined);
  settingThemeMode = new BehaviorSubject<'light' | 'dark' | undefined>(undefined);
  themeSourceColor = this.settingThemeColor.pipe(map(argbFromHex));
  themeVariant = this.settingThemeVariant.asObservable();
  themeContrastLevel: Observable<number> = combineLatest([
    this.constrastPreference,
    this.settingThemeContrast,
  ]).pipe(
    map(([prefersContrast, customContrast]) =>
      customContrast === undefined
        ? prefersContrast === undefined
          ? DEFAULT_CONTRAST
          : GLOBAL_CONTRAST[prefersContrast]
        : customContrast,
    ),
    distinctUntilChanged(),
  );
  themeIsDark = combineLatest([this.prefersDark, this.settingThemeMode]).pipe(
    map(([prefersDark, customMode]) => (customMode === undefined ? prefersDark : customMode === 'dark')),
    distinctUntilChanged(),
  );
  ionicTheme = combineLatest([this.themeContrastLevel, this.themeVariant, this.themeSourceColor]).pipe(
    map(([contrastLevel, variant, sourceColor]) => makeIonicTheme({variant, sourceColor, contrastLevel})),
  );
  constructor() {
    combineLatest([this.ionicTheme, this.themeIsDark])
      .pipe(takeUntilDestroyed())
      .subscribe(([theme, isDark]) => {
        applyIonicTheme(document.documentElement, theme, isDark);
      });
  }
 }
--- a/frontend/app/src/assets/about/CHANGELOG.md
+++ b/frontend/app/src/assets/about/CHANGELOG.md
@@ -0,0 +1,221 @@
 ## [2.1.1](https://gitlab.com/openstapps/app/compare/v2.0.1...v2.1.1) (2023-05-10)
 ### Bug Fixes
 - autofocus searchbar only when no default data is displayed ([e90286f](https://gitlab.com/openstapps/app/commit/e90286fc6814f5c40af3e297be42f23128b991be))
 - breadcrumbs are under parallax ([9e160e8](https://gitlab.com/openstapps/app/commit/9e160e8d1ee9409e4fbe518c9dd9748705e680e1))
 - browser logout only if endSession url defined ([7f6de94](https://gitlab.com/openstapps/app/commit/7f6de94ab572be66d7f10758c37dcf10af46b4e0)), closes [#395](https://gitlab.com/openstapps/app/issues/395)
 - can't select some list elements on safari 16.4 ([3e99d7f](https://gitlab.com/openstapps/app/commit/3e99d7fa8fcae4538e1afe6a017570b0cb6ff45e))
 - canteen view removes item select listener on view exit ([05e996a](https://gitlab.com/openstapps/app/commit/05e996ae9052b11c23dc1093ef526f08e3e2e6b6))
 - catalog module semester selection ([afbd1fc](https://gitlab.com/openstapps/app/commit/afbd1fc048997acbc0113f8957016f8947b58626))
 - catalog semester selection ([a8c7d5a](https://gitlab.com/openstapps/app/commit/a8c7d5ab5934adf853cc40c1df311178df54057e))
 - data detail local favorite fallback causing duplicate nested favorite view ([dff4a95](https://gitlab.com/openstapps/app/commit/dff4a95acc55574b4872b0e4e39555cce0b2fd60))
 - data-detail favorite button color leaking to list items ([95f2da2](https://gitlab.com/openstapps/app/commit/95f2da2def39ec56f40a660a63e5f7fddb4b3d53))
 - location flow on iOS devices ([f207e02](https://gitlab.com/openstapps/app/commit/f207e029f1b30624bf411a57b3c552ef259e13ed))
 - parallax broken since safari 16.4 ([0f970fa](https://gitlab.com/openstapps/app/commit/0f970fa1f164a310e24a85140d8bf0da21e5a5f1))
 - remove infinite scroll e2e test ([47565e5](https://gitlab.com/openstapps/app/commit/47565e51b0dda5c8227238b6dc19f0d277408429))
 - replace breadcrumb popover with simply expanding the breadcrumbs ([1318cbc](https://gitlab.com/openstapps/app/commit/1318cbca7f0cf72e10d96fff1a1116ba073fe8dc))
 - schedule tabs navigating to the wrong url ([abf2ab6](https://gitlab.com/openstapps/app/commit/abf2ab6a5a94941d439adf54ec677332823892db))
 - translate simple pipe doesn't update on language changes ([f5ca150](https://gitlab.com/openstapps/app/commit/f5ca1508fb9d95693615bfb9e03bc127bd83be00))
 - typo in catalog provider query ([f49c44f](https://gitlab.com/openstapps/app/commit/f49c44f5c53780e4794dc1ef4cbacfb20cabbd97))
 - workaround for side menu items not being active on page load ([947cab4](https://gitlab.com/openstapps/app/commit/947cab458ca770f116d28a1f22687ae620e71b59))
 ### Features
 - add content to empty catalogs ([982fb16](https://gitlab.com/openstapps/app/commit/982fb1653b3c1253aac9366733f14c22c94d2537))
 - add easy way to configure search filtering for nested properties ([2220ab2](https://gitlab.com/openstapps/app/commit/2220ab24b385188515da7c176bf9c1ac72651fd9))
 - dark theme ([e75a466](https://gitlab.com/openstapps/app/commit/e75a46633ca3685d6044eb9a8b2fd670f2cd030f))
 - dashboard search rework ([8c30a47](https://gitlab.com/openstapps/app/commit/8c30a47706f07eb222fac47ad7fed61f9044328a))
 - implement custom cdk virtual scroll behavior ([968cb72](https://gitlab.com/openstapps/app/commit/968cb729575c529fd6d1d35da1b50a8689057c46))
 - optional logout from identity provider ([8cd2d77](https://gitlab.com/openstapps/app/commit/8cd2d777ab3a67b1ab24f03aa50a3ff73550c3d2)), closes [#372](https://gitlab.com/openstapps/app/issues/372)
 - revamp dashboard mensa section ([33a74d9](https://gitlab.com/openstapps/app/commit/33a74d96ae92137f53a775e90bff99e5f2d41f6a))
 - rework settings page design ([2f1298c](https://gitlab.com/openstapps/app/commit/2f1298c9d7df25d2a16576245ea62c1b6094e507))
 - show in-place in date series modal, resolves [#385](https://gitlab.com/openstapps/app/issues/385) ([22e70ae](https://gitlab.com/openstapps/app/commit/22e70ae92b35578b559e6644dccb8d4bfd06af1e)), closes [#386](https://gitlab.com/openstapps/app/issues/386) [#388](https://gitlab.com/openstapps/app/issues/388)
 - transition to full sidebar at xl instead of lg ([cc939f3](https://gitlab.com/openstapps/app/commit/cc939f38873833b7cc0260525a2ecd536f27bfa5))
 ## [2.0.1](https://gitlab.com/openstapps/app/compare/v2.0.0...v2.0.1) (2023-02-13)
 ### Bug Fixes
 - assessment segments can become unreadable ([939fb6e](https://gitlab.com/openstapps/app/commit/939fb6ef0f11b40cb71fbe61da90f50b1f75c3f7))
 - login button not easily found ([11d1ac3](https://gitlab.com/openstapps/app/commit/11d1ac3f7ce27c2822ea8f839df3f3dffbd6c020))
 - remove misleading assessment calculations ([aefae33](https://gitlab.com/openstapps/app/commit/aefae33d5c9fa9ee3efe346e45429aca79ae3c48))
 - right-align add event detail chip ([1eee652](https://gitlab.com/openstapps/app/commit/1eee652533c6b8f613ce09df9c3421f89209419a))
 ### Features
 - offline notice ([9b4caf5](https://gitlab.com/openstapps/app/commit/9b4caf526ffb53ec8d8885342323fcc52fd9fc09))
 - separate prettier from eslint ([a88d000](https://gitlab.com/openstapps/app/commit/a88d000ccd6cbdeb5fbb07d209f2491023f9d76c))
 # [2.0.0](https://gitlab.com/openstapps/app/compare/v0.0.1...v2.0.0) (2023-01-11)
 ### Bug Fixes
 - daia_url missing in environment configs ([863a3ff](https://gitlab.com/openstapps/app/commit/863a3ffd488425e3313ab9b812c4b6d50c68a244))
 - 404 on all surge links ([f1b4930](https://gitlab.com/openstapps/app/commit/f1b4930a3068e73aee20b4c3d71dac551ab60c35))
 - add areaServed to person detail ([488150f](https://gitlab.com/openstapps/app/commit/488150f7f5558c05c1ec8a71afcb9f9a37e68a37))
 - add event popover expanding beyond screen width ([046a95b](https://gitlab.com/openstapps/app/commit/046a95ba1dca3f5ded7e5555d3167f52f95be107))
 - add location info to dates from timetable ([92adb9d](https://gitlab.com/openstapps/app/commit/92adb9dd2db18027dcc327433027e28c81ecbd4b)), closes [#344](https://gitlab.com/openstapps/app/issues/344)
 - add missing profile translation ([cdb6ac4](https://gitlab.com/openstapps/app/commit/cdb6ac4084f8704d7f2336387a837b86f78c062b))
 - add nav button to schedule page ([e628f39](https://gitlab.com/openstapps/app/commit/e628f396e22e51da2c9f2489fe89e42ccf474e2b))
 - add openingHours config and catch its errors ([6125d43](https://gitlab.com/openstapps/app/commit/6125d43e8c18f2bf2afda67c0ff72e00d98ab34f))
 - add PKCE parameters for PAIA auth ([f3e83bf](https://gitlab.com/openstapps/app/commit/f3e83bfcc88423f0935a060ccd0bf6198da58351))
 - address late init from ionic components ([0bce9e5](https://gitlab.com/openstapps/app/commit/0bce9e5452fc5d05123756348dc30308de675bfa))
 - adjust code to overcome the breaking changes (ionic 4 to 5) ([f779042](https://gitlab.com/openstapps/app/commit/f7790426cd2da4a6b33e2aa73783943f45b3de02)), closes [#70](https://gitlab.com/openstapps/app/issues/70)
 - adjust hebis catalog templates ([83d9a4a](https://gitlab.com/openstapps/app/commit/83d9a4a8b8fe5b8687c72a717b3a2964524006e0))
 - adjust library account user info ([bafabb1](https://gitlab.com/openstapps/app/commit/bafabb1d4ec299e2bea43cd4b8442ef33be2329a)), closes [#331](https://gitlab.com/openstapps/app/issues/331)
 - adjust npm docker scripts and typos ([82bb15b](https://gitlab.com/openstapps/app/commit/82bb15b863e2d2e4df20244fda2f2e0d049ff43f))
 - angular1 ng-if leftover ([25434d5](https://gitlab.com/openstapps/app/commit/25434d54e3800fd72a6c5d9188fb11f441d73aa9))
 - assign navigation app name dynamically ([90b9733](https://gitlab.com/openstapps/app/commit/90b97339d3948b0864f634519416fe4a458b459f))
 - background fetch crashing android app ([3316ad9](https://gitlab.com/openstapps/app/commit/3316ad9169ed2b29a2755405589213f824aec9d1))
 - calculating SCDateSeries for next unit view ([82ba5f8](https://gitlab.com/openstapps/app/commit/82ba5f81211fb10cc5fde04991856567c4ac9680))
 - canteen module layout ([b89f5c4](https://gitlab.com/openstapps/app/commit/b89f5c4edd1ed14f7529edc4e4ea54f9d98fda7c))
 - canteen module layout ([6f7c680](https://gitlab.com/openstapps/app/commit/6f7c680ed89f027d863ebc02f5b24895d84f32e4))
 - cards not having rounded corners in safari ([8a04a43](https://gitlab.com/openstapps/app/commit/8a04a439032920ead799f8b7483f29b896797c37))
 - catch error `Setting "language" not provided` ([584878d](https://gitlab.com/openstapps/app/commit/584878d9503b8406b6ee7ec69dde5b8b3c4fd954))
 - CI stage/job setup ([ae429ca](https://gitlab.com/openstapps/app/commit/ae429ca5fb3b5f10cad377d37b251806b3dabf6c))
 - config.get issue by updating ionic ([9386351](https://gitlab.com/openstapps/app/commit/93863510fac32ed5b887011175a4807df3f522b8))
 - **config:** fix catch ConfigFetchError in getValue ([161da63](https://gitlab.com/openstapps/app/commit/161da630ea59f6205ee53dece950972d4f36ada5)), closes [#46](https://gitlab.com/openstapps/app/issues/46)
 - correct data path color ([0d755bc](https://gitlab.com/openstapps/app/commit/0d755bcbd3d6fea59a4f7a59981fd28844ff90d5))
 - correct html whitespace handling for icon detection ([9bc3642](https://gitlab.com/openstapps/app/commit/9bc3642990b687dd524470fd26df80351aa85f1e))
 - daia availability ([13cee2d](https://gitlab.com/openstapps/app/commit/13cee2d4261c7301c1c763446ae44dcdd005172d))
 - dashboard next unit structural directive causing animation issues ([c8f6a27](https://gitlab.com/openstapps/app/commit/c8f6a27c571e51bcc0ac0120968e6bc9a20c8dd7))
 - **data:** fix and adjust detail test using translation ([478f49a](https://gitlab.com/openstapps/app/commit/478f49a8744211b3c9458b3dadc791d62a46ae46)), closes [#50](https://gitlab.com/openstapps/app/issues/50)
 - **data:** fix template and other consistency issues ([c3bc227](https://gitlab.com/openstapps/app/commit/c3bc227a3ca4a295b2b31bfe7fd34830b33c9f05))
 - detail page when dish of mensa selected ([e5c2270](https://gitlab.com/openstapps/app/commit/e5c227073a183a1c562e17f3fe14a51048d01637)), closes [#140](https://gitlab.com/openstapps/app/issues/140)
 - download events should respect selection ([28fbfef](https://gitlab.com/openstapps/app/commit/28fbfef18cc3b457f7020a70157ea7a4fff345d0))
 - enable background fetch on iOS ([a1592f8](https://gitlab.com/openstapps/app/commit/a1592f84cc48f7cae8c55ef806cddbe806034bb5))
 - enable overflow for day labels in schedule ([1195c5f](https://gitlab.com/openstapps/app/commit/1195c5ffc8cea07f1e224d92a7fb25aa5858bf0a))
 - encode URI parameter to proxy URI ([bc13cc5](https://gitlab.com/openstapps/app/commit/bc13cc5e1fe6144fe0a0e53c0748a154844a5c29)), closes [#326](https://gitlab.com/openstapps/app/issues/326)
 - extend landing period button not working on android ([0caa69c](https://gitlab.com/openstapps/app/commit/0caa69c28cbb2f962b70a1da13659739c1c6dd3e)), closes [#333](https://gitlab.com/openstapps/app/issues/333)
 - failing native http requests with body ([fed4f20](https://gitlab.com/openstapps/app/commit/fed4f20c3cf43221512f3d2b6dd3c3fe7a4cf43a))
 - feedback not allowing valid emails ([cf74c8e](https://gitlab.com/openstapps/app/commit/cf74c8e19f8bd34a31d5af931781e84be2c04dea)), closes [#349](https://gitlab.com/openstapps/app/issues/349)
 - fix issues found by ng build for production ([a503811](https://gitlab.com/openstapps/app/commit/a503811c1cfcf909571af766ccd884856aad8ec9)), closes [#48](https://gitlab.com/openstapps/app/issues/48)
 - fix various typos ([ad0dae4](https://gitlab.com/openstapps/app/commit/ad0dae46ff04d28551d2ece950d9a4d3442541d2))
 - fixate webdriver to match used chrome version ([24dbb42](https://gitlab.com/openstapps/app/commit/24dbb42b345458b7dbdd17b2759824b3b68cb0e4))
 - generate library online links properly ([9854541](https://gitlab.com/openstapps/app/commit/9854541a0c062c31bce167673586dccc8af81785)), closes [#340](https://gitlab.com/openstapps/app/issues/340)
 - handle prices as an optional property ([9e71efc](https://gitlab.com/openstapps/app/commit/9e71efca9f7b1086db26f580192d6b349bdcb964)), closes [#219](https://gitlab.com/openstapps/app/issues/219)
 - header logo changing size on ios navigate ([38f0a30](https://gitlab.com/openstapps/app/commit/38f0a300769a5b7cda35af0927c17099f93981b8))
 - ignore null-island location ([d3188f5](https://gitlab.com/openstapps/app/commit/d3188f50905d610097de6c90bc58e6373d30e0dc)), closes [#149](https://gitlab.com/openstapps/app/issues/149)
 - item not available in offer template ([7b402d6](https://gitlab.com/openstapps/app/commit/7b402d61c30aed81a5671d778a38c8393a5bc7c8)), closes [#110](https://gitlab.com/openstapps/app/issues/110)
 - library account missing ready for pickup ([e504d8c](https://gitlab.com/openstapps/app/commit/e504d8cf6dd1c12fcb8f6a315527337313662385)), closes [#330](https://gitlab.com/openstapps/app/issues/330)
 - library fines should load item title only if needed ([cbb949e](https://gitlab.com/openstapps/app/commit/cbb949e3977a5821e6bd1b654dec66a82e4d8c81)), closes [#342](https://gitlab.com/openstapps/app/issues/342)
 - links of timetable tabs ([837c69b](https://gitlab.com/openstapps/app/commit/837c69bb21c92a91259051d5680e1073b390fc0e)), closes [#144](https://gitlab.com/openstapps/app/issues/144)
 - logged out button not showing on profile ([ebdc14d](https://gitlab.com/openstapps/app/commit/ebdc14d3c398ac7564c077757c564f4e414fe244)), closes [#239](https://gitlab.com/openstapps/app/issues/239)
 - make action chips react to changes of their item ([c0d0b1b](https://gitlab.com/openstapps/app/commit/c0d0b1bd9934e8d9e23f47825cae6a5d8ea2f38a))
 - make keyboard dismissable on mobile devices ([b2cc1fd](https://gitlab.com/openstapps/app/commit/b2cc1fd91fc5bd66c994dcbe10771a22d91a1b3e))
 - map search on iOS ([7d449b4](https://gitlab.com/openstapps/app/commit/7d449b43d0d86825f711848110ac6f044084eba0)), closes [#148](https://gitlab.com/openstapps/app/issues/148)
 - map widget not loading tiles properly ([09aa7bb](https://gitlab.com/openstapps/app/commit/09aa7bb5c59e8d167fa91c69745f5f80229094d7)), closes [#127](https://gitlab.com/openstapps/app/issues/127)
 - missing init (config setup) in default auth service ([f16e539](https://gitlab.com/openstapps/app/commit/f16e5394cce5a8019f4dfe367e5e0a2f0cca4ce2)), closes [#227](https://gitlab.com/openstapps/app/issues/227)
 - missing translations ([30d801a](https://gitlab.com/openstapps/app/commit/30d801a3b419b382d40d96dda995bd35e493523d))
 - modals not reacting after several uses ([f39c29f](https://gitlab.com/openstapps/app/commit/f39c29f10bc05ab986b74dfa8a8648df5fb307b4))
 - news module not scrollable on large screens ([44b6a4a](https://gitlab.com/openstapps/app/commit/44b6a4aea008ca6c89f6cb289467429fb3f8c1fa))
 - ngx-translate defaultLanguage not set ([581a5b2](https://gitlab.com/openstapps/app/commit/581a5b2e55ceda99cf7c41200366c3c5e09f1c63))
 - omit sync native calendar when no uuids ([c9720dc](https://gitlab.com/openstapps/app/commit/c9720dc104cce78ae1a422d5efed7b8a58946836)), closes [#177](https://gitlab.com/openstapps/app/issues/177)
 - opening hours pipe refreshing too often ([95e1734](https://gitlab.com/openstapps/app/commit/95e1734d26b175d8d1156abb10863155fed89ec0))
 - overhaul auth to avoid issues ([99e8d6c](https://gitlab.com/openstapps/app/commit/99e8d6c9bcbc68b639b035af36bc05de0237b1f9)), closes [#336](https://gitlab.com/openstapps/app/issues/336)
 - overview search bar scrolling behind header ([a037090](https://gitlab.com/openstapps/app/commit/a037090eec06e867a703b88a43620a74770287fe))
 - performance degradation when scrolling ([f0a45d1](https://gitlab.com/openstapps/app/commit/f0a45d1b8eb2b33a6c68b94ed7f96f81db3a728b))
 - person list should use long-inline-text ([8b2b853](https://gitlab.com/openstapps/app/commit/8b2b853942ac76904ff49d940dfef625b0397150))
 - prevent multiple heavy setting inits ([f772637](https://gitlab.com/openstapps/app/commit/f7726378f443d9809a6174411d25a811e1d0b5e9))
 - prevent opening invalid links ([fdee2db](https://gitlab.com/openstapps/app/commit/fdee2db8a42b8f6c99c4a72b3104ae0ba1a41c5a)), closes [#328](https://gitlab.com/openstapps/app/issues/328)
 - profile module items show click effect on scroll ([8b2f2c0](https://gitlab.com/openstapps/app/commit/8b2f2c063c65278580d9469b00d9e67f01caaffb))
 - recurring schedule offset and event limit ([9c6b513](https://gitlab.com/openstapps/app/commit/9c6b5131cd4cadb2572769d368b346054f19de1c))
 - refresh token not used by default auth provider ([15ccbe4](https://gitlab.com/openstapps/app/commit/15ccbe4c1879417f2fc5849204fa9f6bdcce87fc)), closes [#311](https://gitlab.com/openstapps/app/issues/311)
 - remove "extend landing" button when renewal not possible ([f60a228](https://gitlab.com/openstapps/app/commit/f60a22839200019a38586a14a0cce32e2c0029e7)), closes [#338](https://gitlab.com/openstapps/app/issues/338)
 - remove item before adding it to secure storage ([ec511fb](https://gitlab.com/openstapps/app/commit/ec511fb8f40219e2559b08c62bd915d773d2a36f))
 - schedule navigation bar layout ([e7d5f83](https://gitlab.com/openstapps/app/commit/e7d5f83100f43564b55249909a6658e583e3a9b2))
 - set android status bar color correctly ([b38a969](https://gitlab.com/openstapps/app/commit/b38a96996a10e4e43ff1b06ecd2235a0e3bdfa1c))
 - setting of default language ([ccf8b1a](https://gitlab.com/openstapps/app/commit/ccf8b1a5cc9fe834ba3e04a1ed67b2d082004403))
 - show nothing for empty array properties ([1c56c89](https://gitlab.com/openstapps/app/commit/1c56c891e15b034826b5d6b2b35141fc872c922d)), closes [#154](https://gitlab.com/openstapps/app/issues/154)
 - single map place width ([88684f0](https://gitlab.com/openstapps/app/commit/88684f068ab130f43e520c87f1d7383e0ae43944)), closes [#147](https://gitlab.com/openstapps/app/issues/147)
 - some android devices don't support implied css animation units ([54cc883](https://gitlab.com/openstapps/app/commit/54cc8838aefe8f8c2d25d9228a136ef727a08230))
 - status bar being black on Android 13 devices ([feee9e8](https://gitlab.com/openstapps/app/commit/feee9e8db90e66cf2346f7c5cc24f075eb70676c))
 - suppress router event logs in console ([28caaf1](https://gitlab.com/openstapps/app/commit/28caaf1d21f7961b678cf339a712abf860ade5e7)), closes [#207](https://gitlab.com/openstapps/app/issues/207)
 - swap missing icon after ionic update ([643b6c9](https://gitlab.com/openstapps/app/commit/643b6c967f3268cb305a24d614c3bc91275b0ac3))
 - temporary disable flaky ui test ([6b9b1fa](https://gitlab.com/openstapps/app/commit/6b9b1fa8548d5c5fca04b2c1d63e893de39278a2))
 - timetable dates cannot be removed ([9242438](https://gitlab.com/openstapps/app/commit/924243813207fa791d3c4938f8653a999b6382ff))
 - translate back button title ([b8db0f3](https://gitlab.com/openstapps/app/commit/b8db0f3e70a46f2b493e183a244cb29d1954c257))
 - translations ([5e1a902](https://gitlab.com/openstapps/app/commit/5e1a902d4c0d2345f21500fba5394c1907e04eb8))
 - typo in translation ([7928534](https://gitlab.com/openstapps/app/commit/7928534d88a26db28b098bbceb47bc1103022a57))
 - update core and apply stricter tslint rules ([911492d](https://gitlab.com/openstapps/app/commit/911492d064ff0280dd6626244cd8038cbfc0f408))
 - use HashLocationStrategy for routes ([9d68212](https://gitlab.com/openstapps/app/commit/9d682125db55c87cab2b33c7633bfa133d2fc5a9)), closes [#54](https://gitlab.com/openstapps/app/issues/54)
 - use localized date and time ([6ca0b97](https://gitlab.com/openstapps/app/commit/6ca0b9763761c5204a757a243056a087c5f35fd9))
 - use stapps core version to compare with backends' core version ([66b8720](https://gitlab.com/openstapps/app/commit/66b8720da0f264824a396f2d9e598b0e48c8e3d1)), closes [#77](https://gitlab.com/openstapps/app/issues/77)
 - user info card ([998edcb](https://gitlab.com/openstapps/app/commit/998edcb5cdfb588c2986f466f4a2951f172a8bb4)), closes [#305](https://gitlab.com/openstapps/app/issues/305)
 ### Features
 - add "no results" screen to search ([c75ca68](https://gitlab.com/openstapps/app/commit/c75ca68c440a20e197213ecbb47d05fc293afd9c))
 - add about module ([d420008](https://gitlab.com/openstapps/app/commit/d42000892694f4a3b29fa623c43fb45f8ba54687))
 - add action chips to search results ([67fb4a4](https://gitlab.com/openstapps/app/commit/67fb4a43c95043caba50d43ace2ab276f3319b81))
 - add auth support (default and paia) ([b5f239e](https://gitlab.com/openstapps/app/commit/b5f239ea4edebd0d27b1cdaad4a830998ce2f681))
 - add backend toggle ([c1d3330](https://gitlab.com/openstapps/app/commit/c1d33303aa11da3b3e150c6717d77ef484a16ac1))
 - add basic templates for data list items ([3e697b1](https://gitlab.com/openstapps/app/commit/3e697b17b4448c15781d0f6dd55577b638e9d974))
 - add catalog module ([03084b1](https://gitlab.com/openstapps/app/commit/03084b1c966de98b3723d0bee2b2475589393c59))
 - add ConfigModule and FakeBackendInterceptor ([406f400](https://gitlab.com/openstapps/app/commit/406f40055567bfde4ec5edf26cff942411bd073e)), closes [#34](https://gitlab.com/openstapps/app/issues/34) [#37](https://gitlab.com/openstapps/app/issues/37)
 - add detail view for news ([2566a71](https://gitlab.com/openstapps/app/commit/2566a71a81a3408dbb16b97d3a453d95e25d1f00))
 - add duration pipe with frequency capabilites ([49a1758](https://gitlab.com/openstapps/app/commit/49a1758da358958ffe590700c19aaf90ec748ee5))
 - add favorites support ([e9452d6](https://gitlab.com/openstapps/app/commit/e9452d6520c34f6513623c16e291dc23d6ea9757))
 - add feedback module ([867f9e9](https://gitlab.com/openstapps/app/commit/867f9e9b832e3bd54c04801fef63a11543e8f3dd))
 - add filter chips for news ([5435f85](https://gitlab.com/openstapps/app/commit/5435f85cc43dc3baa774a5008d2920ac7b3783f6))
 - add formatting pipes basted on Intl ([4b932af](https://gitlab.com/openstapps/app/commit/4b932af1c07e1af4369414667a987d31181c073c))
 - add HeBIS HDS search ([9a3241c](https://gitlab.com/openstapps/app/commit/9a3241c42ab59e15c0084178f76dc4a2450a2bb8))
 - add library account screens ([080e6fa](https://gitlab.com/openstapps/app/commit/080e6fa3e8c18e9608d7fa2efc95e4fd65c43a15))
 - add library action confirmations ([42b860e](https://gitlab.com/openstapps/app/commit/42b860e41793fc3983a39237a4f7128416485fae)), closes [#334](https://gitlab.com/openstapps/app/issues/334)
 - add logger ([a0c798f](https://gitlab.com/openstapps/app/commit/a0c798f765d87c5eebcbed65b70f3b05f285d0ce))
 - add map module ([c1c9a92](https://gitlab.com/openstapps/app/commit/c1c9a92ec900403218b887fdebfe5132b232e1e0))
 - add new font and new icons ([915fd72](https://gitlab.com/openstapps/app/commit/915fd72bd4bfed16e15fcc3c57879db0ec0379e2))
 - add not found screen ([e3d9ef4](https://gitlab.com/openstapps/app/commit/e3d9ef40ccd626c81c67ea2d790eecbe6e025780))
 - add permission check for geoLocation setting ([d5fa2fd](https://gitlab.com/openstapps/app/commit/d5fa2fd9a578d48cd2513eeb1380f1d2bc4d3754))
 - add service and pipe for core translator ([4565600](https://gitlab.com/openstapps/app/commit/456560026cc9550a10a9f42657d942122be34d53))
 - apply new layout overhaul ([7bbdba5](https://gitlab.com/openstapps/app/commit/7bbdba5c0b886e2789d2a603c4be627dfd16b60e))
 - assessment tree view ([0b037f9](https://gitlab.com/openstapps/app/commit/0b037f96e634b412fbaaee24747df08afdc0e565))
 - assessments module ([e68d1b7](https://gitlab.com/openstapps/app/commit/e68d1b73f94b36abcefe9b2bf42e98de00b69188))
 - calendar plugin ([a57c302](https://gitlab.com/openstapps/app/commit/a57c3029df61ac3157c856744380a85dc001abc6))
 - dashboard ui tests ([9f8ab5c](https://gitlab.com/openstapps/app/commit/9f8ab5c7a15a918f7bd05423f0a43f22a33d9228))
 - **data:** add basic methods of data provider ([ffe05e4](https://gitlab.com/openstapps/app/commit/ffe05e4548fc399183ef651047cb02a3cdc80c67)), closes [#1](https://gitlab.com/openstapps/app/issues/1)
 - **data:** add data detail templates ([5855acc](https://gitlab.com/openstapps/app/commit/5855accc169579d87f5779fd602d4f00f2b479a1))
 - **data:** add method that checks if data item has been saved ([017fc67](https://gitlab.com/openstapps/app/commit/017fc67765bdb75542045830fb85f8eb4b899485))
 - **data:** implement basic facets handling ([b6f92a7](https://gitlab.com/openstapps/app/commit/b6f92a74494e1a39d5c828d593eb70c7002bb0f6)), closes [#1](https://gitlab.com/openstapps/app/issues/1)
 - **data:** show skeleton screens before data is loaded ([e1039aa](https://gitlab.com/openstapps/app/commit/e1039aa2260a0e9d8ccca5a18ded480bf2f12530)), closes [#4](https://gitlab.com/openstapps/app/issues/4)
 - **data:** use data provider for list and detail view ([7caaa18](https://gitlab.com/openstapps/app/commit/7caaa18b7eb94ed8e4ff4e54d760ba1dba3ae3be))
 - **data:** use general template for all offers ([58960a2](https://gitlab.com/openstapps/app/commit/58960a29ea0cd73f26a43186b41f5b53864810e0))
 - display availability and item data for library items ([d571b1d](https://gitlab.com/openstapps/app/commit/d571b1dbe59f8e2270d88dd050b94283bf0a7056))
 - dynamic news page rows ([848d257](https://gitlab.com/openstapps/app/commit/848d2574c7046d6f84b91e32aa83ca57fca8ad2e))
 - expandable accordion in grades module ([3f81afd](https://gitlab.com/openstapps/app/commit/3f81afda82cf87bb393fbb3b71d27eee77ae42d9))
 - get tab navigation items from config ([c3130a3](https://gitlab.com/openstapps/app/commit/c3130a392a53c9ec3657e24a53ed0b3333ba162b))
 - Implement variable for styling ([8ecf347](https://gitlab.com/openstapps/app/commit/8ecf347c9a8abac9347dca45e99ebe35eca8f252))
 - include font licenses in the licenses section ([82479f4](https://gitlab.com/openstapps/app/commit/82479f463cbee834507a0c8faf895a729631eb06))
 - Ionic v6 breadcrumbs in catalog module ([7b491ed](https://gitlab.com/openstapps/app/commit/7b491ed3bb5466a845493bd8ea0bbb836a4f03d2))
 - lazy load all news ([e48134e](https://gitlab.com/openstapps/app/commit/e48134eddcd1ca4d5ec5dbf910571e33a3311ba1))
 - **menu:** add context menu ([1dbf451](https://gitlab.com/openstapps/app/commit/1dbf4515fe57cc8250a7fa2213ced682e3e5e0fc)), closes [#3](https://gitlab.com/openstapps/app/issues/3)
 - navigation rail ([6b08af6](https://gitlab.com/openstapps/app/commit/6b08af6a746bf12005d3297ec97c130e84477615))
 - news module ([22cd0af](https://gitlab.com/openstapps/app/commit/22cd0af1bf92a4576316f5510c22f012e085a237))
 - profile page sections ([e395e9d](https://gitlab.com/openstapps/app/commit/e395e9d270f41bd4f6e5ecd88e438a28dde92465)), closes [#233](https://gitlab.com/openstapps/app/issues/233) [#261](https://gitlab.com/openstapps/app/issues/261) [#267](https://gitlab.com/openstapps/app/issues/267)
 - refresh on pull for news module ([1f3d9ad](https://gitlab.com/openstapps/app/commit/1f3d9ad5f0c0557add2dcf242cf0b7dd7685bb1b))
 - resume at origin path after login ([a5e5a5b](https://gitlab.com/openstapps/app/commit/a5e5a5b40799e7505557f7ebd764b9c563be0f4b)), closes [#168](https://gitlab.com/openstapps/app/issues/168)
 - schedule layout ([e416590](https://gitlab.com/openstapps/app/commit/e4165901bb5efa6b38e397cdf5d66138e396d7f2))
 - scroll schedule cursor into view ([bc4c3d7](https://gitlab.com/openstapps/app/commit/bc4c3d78dbd906243dcddac4db9ac8ccaca79056))
 - search url query param handling ([f349bd7](https://gitlab.com/openstapps/app/commit/f349bd72335c47d292d0a007b1a4ce7f5c694a61))
 - seperate dishes by menu sections ([400c6b8](https://gitlab.com/openstapps/app/commit/400c6b8d8c5300035862186096e38883f781d297))
 - show availability in offers ([5fdef95](https://gitlab.com/openstapps/app/commit/5fdef95c065e7b467a13045adbb56a641cb2dc12))
 - show feedback when map search yields no results ([c54ea86](https://gitlab.com/openstapps/app/commit/c54ea867bd64af187446dbf8dc03967aae600961))
 - show menu for multiple days for canteens and cafes ([3c079cd](https://gitlab.com/openstapps/app/commit/3c079cd189e3b75d3b203bd46ab57378f99e88cc)), closes [#19](https://gitlab.com/openstapps/app/issues/19) [#79](https://gitlab.com/openstapps/app/issues/79)
 - **storage:** add search using regex ([86b9bff](https://gitlab.com/openstapps/app/commit/86b9bff09a51b17151efa5ec322cddcc50a54cb2))
 - **storage:** support deletion of multiple entries ([63266f5](https://gitlab.com/openstapps/app/commit/63266f588f6ddb2476e2cea4bab42a3864f77470))
 - **storage:** support search using a string ([4334cad](https://gitlab.com/openstapps/app/commit/4334cad68c7d0abb7443e245b6eb983804547925))
 - support deep links ([2e3f668](https://gitlab.com/openstapps/app/commit/2e3f6684ef5fbac8e4fb127c536b2b438399ce37))
 - support overlapping timetable dates ([93c37b2](https://gitlab.com/openstapps/app/commit/93c37b26cca7764dea66fb12c0e53acc8fd78d2b))
 - tab navigation bar animations and state ([7ecba0b](https://gitlab.com/openstapps/app/commit/7ecba0b7819ae5a7ab32d86f6049de0ab6c68e55))
 - timetable module - schedule and calendar ([d8ede00](https://gitlab.com/openstapps/app/commit/d8ede006dfbd613dfbc752eb6de80db2e7e84531))
 - turn on oauth2 state check for PAIA ([5bd0b50](https://gitlab.com/openstapps/app/commit/5bd0b50816973548a0a4aa5dbed3f2d0902590dd)), closes [#172](https://gitlab.com/openstapps/app/issues/172)
 - use http interceptor for backendless development ([2558163](https://gitlab.com/openstapps/app/commit/2558163ad6c3038445a79e6338f1827cb1e6510e)), closes [#37](https://gitlab.com/openstapps/app/issues/37)
 - use school-neutral news image fallback via css ([bb94c71](https://gitlab.com/openstapps/app/commit/bb94c71761ca5d3bf6639476ba0c143678cfabbd))
 - webpack bundle analyzer ([552911c](https://gitlab.com/openstapps/app/commit/552911cfcfecec8d9be8b8bbb155b597d1f70fa2))
 ## [0.0.1](https://gitlab.com/openstapps/app/compare/8b23159e678773b08252bc5826510de2a302fa1d...v0.0.1) (2018-12-11)
 ### Features
 - add the app ([8b23159](https://gitlab.com/openstapps/app/commit/8b23159e678773b08252bc5826510de2a302fa1d))
--- a/frontend/app/src/assets/i18n/de.json
+++ b/frontend/app/src/assets/i18n/de.json
@@ -8,7 +8,6 @@
  "export": "Exportieren",
  "share": "Teilen",
  "timeSuffix": "Uhr",
  "beta": "Beta",
  "ratings": {
    "thank_you": "Vielen Dank für die Bewertung!"
  },
@@ -30,10 +29,7 @@
    "TITLE_COPIED": "In die Zwischenablage kopiert"
  },
  "about": {
-    "VERSION_INFO": "{{name}} {{version}} basierend auf StApps {{stappsVersion}}",
+    "VERSION_INFO": "{{name}} {{version}} basierend auf StApps {{stappsVersion}}"
    "CHANGELOG": "Versionshistorie",
    "TECHNICAL_CHANGELOG": "StApps Basis Versionshistorie",
    "TECHNICAL_CHANGELOG_DISCLAIMER": "Die StApps Basis ist anders versioniert als die App. Versionsnummern zwischen StApps und App weichen daher ab."
  },
  "releaseNotes": {
    "TITLE_UPDATED": "Deine App wurde aktualisiert!"
@@ -390,35 +386,6 @@
      }
    }
  },
  "mail": {
    "SIGNATURE_VALID": "Signatur gültig",
    "SIGNATURE_INVALID": "Signatur ungültig",
    "SIGNATURE_UNSUPPORTED": "Signatur nicht unterstützt",
    "ID": "ID",
    "FROM": "von",
    "SENDER": "Absender",
    "TO": "an",
    "DATE": "Datum",
    "login": {
      "TITLE": "E-Mail Login",
      "LOGIN": "Login",
      "PLACEHOLDER_USERNAME": "Nutzername",
      "PLACEHOLDER_PASSWORD": "Passwort",
      "error": {
        "INVALID_CREDENTIALS": "ungültige Zugangsdaten"
      }
    },
    "mailboxes": {
      "\\Inbox": "Posteingang",
      "\\All": "Alle",
      "\\Archive": "Archiv",
      "\\Drafts": "Entwürfe",
      "\\Flagged": "Markiert",
      "\\Junk": "Spam",
      "\\Sent": "Gesendet",
      "\\Trash": "Papierkorb"
    }
  },
  "menu": {
    "context": {
      "title": "Kontext Menü",
--- a/frontend/app/src/assets/i18n/en.json
+++ b/frontend/app/src/assets/i18n/en.json
@@ -7,7 +7,6 @@
  "back": "back",
  "export": "Export",
  "share": "Share",
  "beta": "beta",
  "timeSuffix": "",
  "ratings": {
    "thank_you": "Thank you for your feedback!"
@@ -30,10 +29,7 @@
    "TITLE_COPIED": "Copied to clipboard"
  },
  "about": {
-    "VERSION_INFO": "{{name}} {{version}} based on StApps {{stappsVersion}}",
+    "VERSION_INFO": "{{name}} {{version}} based on StApps {{stappsVersion}}"
    "CHANGELOG": "Changelog",
    "TECHNICAL_CHANGELOG": "StApps Base Changelog",
    "TECHNICAL_CHANGELOG_DISCLAIMER": "The StApps base is versioned separately from the app. Version numbers will not match those of the app itself."
  },
  "releaseNotes": {
    "TITLE_UPDATED": "Your app was updated!"
@@ -390,35 +386,6 @@
      }
    }
  },
  "mail": {
    "SIGNATURE_VALID": "signature valid",
    "SIGNATURE_INVALID": "signature invalid",
    "SIGNATURE_UNSUPPORTED": "signature unsupported",
    "ID": "ID",
    "FROM": "from",
    "SENDER": "sender",
    "TO": "to",
    "DATE": "date",
    "login": {
      "TITLE": "email login",
      "LOGIN": "login",
      "PLACEHOLDER_USERNAME": "username",
      "PLACEHOLDER_PASSWORD": "password",
      "error": {
        "INVALID_CREDENTIALS": "invalid credentials"
      }
    },
    "mailboxes": {
      "\\Inbox": "inbox",
      "\\All": "all inboxes",
      "\\Archive": "archive",
      "\\Drafts": "drafts",
      "\\Flagged": "flagged",
      "\\Junk": "spam",
      "\\Sent": "sent",
      "\\Trash": "trash"
    }
  },
  "menu": {
    "context": {
      "title": "context menu",
--- a/frontend/app/src/assets/icons.min.woff2
+++ b/frontend/app/src/assets/icons.min.woff2
--- a/frontend/app/src/config/profile-page-sections.ts
+++ b/frontend/app/src/config/profile-page-sections.ts
@@ -49,7 +49,6 @@ export interface SCSectionLink extends SCThing {
  link: string[];
  needsAuth?: true;
  icon?: string;
  beta?: true;
 }
 export interface SCSection extends SCThing {
@@ -151,18 +150,6 @@ export const profilePageSections: SCSection[] = [
        },
        ...SCSectionLinkConstantValues,
      },
      {
        name: 'Mail',
        icon: SCIcon.mail,
        link: ['/mail'],
        beta: true,
        translations: {
          de: {
            name: 'Email',
          },
        },
        ...SCSectionLinkConstantValues,
      },
    ],
    translations: {
      de: {
--- a/frontend/app/src/index.html
+++ b/frontend/app/src/index.html
@@ -18,7 +18,7 @@
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
-    <link rel="icon" type="image/png" href="./assets/icon/favicon.png" />
+    <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
    <!-- add to homescreen for ios -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
--- a/frontend/app/src/theme/colors.scss
+++ b/frontend/app/src/theme/colors.scss
@@ -13,7 +13,7 @@
 * this program. If not, see <https://www.gnu.org/licenses/>.
 */
@import './util/color-system';
-
+/*
@include ion-color(primary, #3880ff);
@include ion-color(secondary, #32db64);
@include ion-color(tertiary, #f4a942);
@@ -26,6 +26,7 @@
@include ion-background-color(#f5f5f5, #000);
@include ion-item-color(#fff, #0e0e0e);
 */
 :root {
  --calender-lecture-card: var(--ion-color-primary-tint);
--- a/packages/logger/package.json
+++ b/packages/logger/package.json
@@ -28,10 +28,10 @@
    "test": "c8 mocha"
  },
  "dependencies": {
-    "@types/nodemailer": "6.4.15",
+    "@types/nodemailer": "6.4.7",
    "chalk": "5.2.0",
    "flatted": "3.2.7",
-    "nodemailer": "6.9.14"
+    "nodemailer": "6.9.1"
  },
  "devDependencies": {
    "@openstapps/eslint-config": "workspace:*",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
		`@@ -1,2 +0,0 @@`
			`#!/usr/bin/env node`
			`import './lib/cli.js';`