feat(core): allow changing app language to english and italian

client/angular.json

@@ -88,6 +88,18 @@
               "extractLicenses": false,
               "sourceMap": true,
               "namedChunks": true
+            },
+            "e2e": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.e2e.ts"
+                }
+              ]
             }
           },
           "defaultConfiguration": "production"
@@ -100,6 +112,9 @@
             },
             "development": {
               "buildTarget": "client:build:development"
+            },
+            "e2e": {
+              "buildTarget": "client:build:e2e"
             }
           },
           "defaultConfiguration": "development"

client/cypress.config.ts

@@ -1,9 +1,15 @@
 import { defineConfig } from 'cypress';
 
+// Allow overriding the frontend base URL via env var. Defaults to http://localhost:4200
+const baseUrl = process.env.FRONTEND_URL || 'http://localhost:4200';
+
 export default defineConfig({
   e2e: {
+    baseUrl,
     setupNodeEvents(on, config) {
       // implement node event listeners here
+      // return config in case other plugins rely on it
+      return config;
     },
     projectId: '8687wo',
   },

client/cypress/e2e/ascents.cy.ts

@@ -3,16 +3,14 @@ describe('Ascent lifespan workflow', () => {
     cy.viewport(1920, 1080);
     cy.login();
 
-    cy.visit(
-      'localhost:4200/topo/brione/schattental/dritter-block-von-links/topo-images',
-    );
+    cy.visit('/topo/brione/schattental/dritter-block-von-links/topo-images');
     cy.get('[data-cy="tick-button"]').eq(1).click();
     cy.get('[data-cy="rating"] .p-rating-option').eq(3).click();
     cy.get('[data-cy="comment"]').focus().type('Guter Boulder Yo!');
     cy.get('[data-cy="withKneepad"]').click();
     cy.get('[data-cy="submit"]').click();
 
-    cy.visit('localhost:4200/users/admin-admin');
+    cy.visit('/users/admin-admin');
     cy.get('[data-cy="kneepadtag"]').should('have.length', 2);
     cy.get('[data-cy="ascent-actions-button"]').eq(0).click();
     cy.get('#edit-ascent').eq(0).click();

client/cypress/e2e/boulder-lookup-workflow.cy.ts

@@ -1,6 +1,6 @@
 describe('Boulder lookup workflow', () => {
   it('navigates step by step to a boulder detail page', () => {
-    cy.visit('localhost:4200');
+    cy.visit('/');
     cy.get('[data-cy="main-menu"] .root-child').eq(1).click();
     cy.get('[data-cy="crag-list-item"]').eq(0).click();
     cy.get('[data-cy="sector-list-item"]').eq(0).click();

client/cypress/e2e/cookies.cy.ts

@@ -1,6 +1,6 @@
 describe('Cookie test', () => {
   it('accepts the cookies', () => {
-    cy.visit('localhost:4200');
+    cy.visit('/');
     cy.get('[data-cy="accept-cookies"]').click();
     cy.get('[data-cy="accept-cookies"]').should('not.exist');
   });

client/cypress/e2e/create-area.cy.ts

@@ -1,7 +1,7 @@
 describe('Create area', () => {
   it('creates an area', () => {
     cy.login();
-    cy.visit('localhost:4200/topo/brione/schattental/create-area');
+    cy.visit('/topo/brione/schattental/create-area');
     cy.get('[data-cy="area-form-name"]').type('Oben');
     cy.get('[data-cy="area-form-shortDescription"] .ql-editor')
       .focus()
@@ -19,7 +19,7 @@ describe('Create area', () => {
     cy.get('[data-cy="lng"]').focus().type('180');
     cy.get('[data-cy="save-marker"]').click();
     cy.get('[data-cy="submit"]').click();
-    cy.visit('localhost:4200/topo/brione/schattental/areas');
+    cy.visit('/topo/brione/schattental/areas');
     cy.get('[data-cy="area-list-item"]').last().contains('Oben');
   });
 });

client/cypress/e2e/create-crag.cy.ts

@@ -1,7 +1,7 @@
 describe('Create crag', () => {
   it('creates a crag', () => {
     cy.login();
-    cy.visit('localhost:4200/topo/create-crag');
+    cy.visit('/topo/create-crag');
     cy.get('[data-cy="crag-form-name"]').type('Ferschweiler');
     cy.get('[data-cy="crag-form-shortDescription"] .ql-editor')
       .focus()
@@ -22,7 +22,7 @@ describe('Create crag', () => {
     cy.get('[data-cy="lng"]').focus().type('180');
     cy.get('[data-cy="save-marker"]').click();
     cy.get('[data-cy="submit"]').click();
-    cy.visit('localhost:4200/topo/crags');
+    cy.visit('/topo/crags');
     cy.get('[data-cy="crag-list-item"]').last().contains('Ferschweiler');
   });
 });

client/cypress/e2e/create-line.cy.ts

@@ -1,9 +1,7 @@
 describe('Create line', () => {
   it('creates a line', () => {
     cy.login();
-    cy.visit(
-      'localhost:4200/topo/brione/schattental/dritter-block-von-links/create-line',
-    );
+    cy.visit('/topo/brione/schattental/dritter-block-von-links/create-line');
     cy.get('[data-cy="line-form-name"]').focus().type('Alphane');
     cy.get('[data-cy="line-form-description"] .ql-editor')
       .focus()
@@ -18,9 +16,7 @@ describe('Create line', () => {
     cy.get('.p-datepicker-year').eq(0).click();
     cy.get('[data-cy="line-form-highball"]').click();
     cy.get('[data-cy="submit"]').click();
-    cy.visit(
-      'localhost:4200/topo/brione/schattental/dritter-block-von-links/lines',
-    );
+    cy.visit('/topo/brione/schattental/dritter-block-von-links/lines');
     cy.get('[data-cy="line-list-item"]').first().contains('Alphane');
   });
 });

client/cypress/e2e/create-sector.cy.ts

@@ -1,7 +1,7 @@
 describe('Create sector', () => {
   it('creates a sector', () => {
     cy.login();
-    cy.visit('localhost:4200/topo/brione/create-sector');
+    cy.visit('/topo/brione/create-sector');
     cy.get('[data-cy="sector-form-name"]').type('Düsterwald');
     cy.get('[data-cy="sector-form-shortDescription"] .ql-editor')
       .focus()
@@ -22,7 +22,7 @@ describe('Create sector', () => {
     cy.get('[data-cy="lng"]').focus().type('180');
     cy.get('[data-cy="save-marker"]').click();
     cy.get('[data-cy="submit"]').click();
-    cy.visit('localhost:4200/topo/brione/sectors');
+    cy.visit('/topo/brione/sectors');
     cy.get('[data-cy="sector-list-item"]').last().contains('Düsterwald');
   });
 });

client/cypress/e2e/todos.cy.ts

@@ -3,12 +3,10 @@ describe('Todo lifespan workflow', () => {
     cy.viewport(1920, 1080);
     cy.login();
 
-    cy.visit(
-      'localhost:4200/topo/brione/schattental/dritter-block-von-links/lines',
-    );
+    cy.visit('/topo/brione/schattental/dritter-block-von-links/lines');
     cy.get('[data-cy="todo-button"]').eq(0).click();
 
-    cy.visit('localhost:4200/todos');
+    cy.visit('/todos');
     cy.get('[data-cy="todo-list-item"]').should('have.length', 1);
 
     cy.get('[data-cy="delete-todo"]').eq(0).click();

client/cypress/e2e/topo-images.cy.ts

@@ -2,14 +2,12 @@ describe('Topo images test', () => {
   it('adds a topo image and draws a line on it', () => {
     cy.viewport(1920, 1080);
     cy.login();
-    cy.visit(
-      'localhost:4200/topo/brione/schattental/dritter-block-von-links/topo-images',
-    );
+    cy.visit('/topo/brione/schattental/dritter-block-von-links/topo-images');
     cy.get('[data-cy="topo-image-list-item"]')
       .its('length')
       .then((numBefore) => {
         cy.visit(
-          'localhost:4200/topo/brione/schattental/dritter-block-von-links/add-topo-image',
+          '/topo/brione/schattental/dritter-block-von-links/add-topo-image',
         );
         cy.get('[data-cy="topo-image-input"] input')
           .focus()
@@ -31,7 +29,7 @@ describe('Topo images test', () => {
           .type('Sehr großer Block eh');
         cy.get('[data-cy="submit"]').click();
         cy.visit(
-          'localhost:4200/topo/brione/schattental/dritter-block-von-links/topo-images',
+          '/topo/brione/schattental/dritter-block-von-links/topo-images',
         );
         cy.get('[data-cy="topo-image-list-item"]').should(
           'have.length',
@@ -44,7 +42,7 @@ describe('Topo images test', () => {
           .then((id) => {
             topoImageId = id;
             cy.visit(
-              `localhost:4200/topo/brione/schattental/dritter-block-von-links/topo-images/${topoImageId}/add-line-path`,
+              `/topo/brione/schattental/dritter-block-von-links/topo-images/${topoImageId}/add-line-path`,
             );
             cy.wait(2000);
             cy.get('[data-cy="line-dropdown"] > div').click();
@@ -55,7 +53,7 @@ describe('Topo images test', () => {
             cy.get('lc-line-path-editor').click(200, 250);
             cy.get('[data-cy="submit"]').click();
             cy.visit(
-              'localhost:4200/topo/brione/schattental/dritter-block-von-links/topo-images',
+              '/topo/brione/schattental/dritter-block-von-links/topo-images',
             );
             cy.get(
               '[data-cy="topo-image-list-item"]:nth-child(3) [data-cy="line-row"]',

client/cypress/support/commands.ts

@@ -1,10 +1,11 @@
 Cypress.Commands.add('login' as any, () => {
-  cy.visit('localhost:4200');
+  cy.visit('/');
   cy.get('[data-cy="navbar-login"]').click();
   cy.get('[data-cy="login-form-email"]')
     .focus()
     .type('admin@localcrag.invalid.org');
   cy.get('[data-cy="login-form-password"] input').focus().type('admin');
   cy.get('[data-cy="login-form-submit"]').click();
-  cy.url().should('not.eq', 'http://localhost:4200/login');
+  // Ensure we left the login page. Use inclusion check so tests work with any baseUrl.
+  cy.url().should('not.include', '/login');
 });

client/package.json

@@ -8,7 +8,7 @@
     "watch": "ng build --watch --configuration development",
     "test": "ng test",
     "test:ci": "ng test --no-watch --no-progress --code-coverage --browsers=ChromeHeadless",
-    "i18n:extract": "transloco-keys-manager extract -d \"\" -l de -R",
+    "i18n:extract": "transloco-keys-manager extract -d \"\" -l de en it -R",
     "i18n:find": "transloco-keys-manager find",
     "cypress": "cypress open",
     "cypress:run-test-backend": "cd ../server/src && export PYTHONPATH=. && export LOCALCRAG_CONFIG=config/test-ci-e2e.cfg && pipenv run flask run",
@@ -46,6 +46,7 @@
     "ngx-matomo-client": "^9.0.1",
     "primeflex": "^4.0.0",
     "primeicons": "^7.0.0",
+    "primelocale": "^2.3.1",
     "primeng": "^21.1.1",
     "quill": "^1.3.7",
     "quill-blot-formatter": "^1.0.5",

client/src/app/models/account-settings.ts

@@ -1,15 +1,20 @@
+import { LanguageCode } from '../utility/types/language';
+
 export class AccountSettings {
   commentReplyMailsEnabled: boolean;
+  language: LanguageCode;
 
   public static deserialize(payload: any): AccountSettings {
     const accountSettings = new AccountSettings();
     accountSettings.commentReplyMailsEnabled = payload.commentReplyMailsEnabled;
+    accountSettings.language = payload.language;
     return accountSettings;
   }
 
   public static serialize(accountSettings: AccountSettings): any {
     return {
       commentReplyMailsEnabled: accountSettings.commentReplyMailsEnabled,
+      language: accountSettings.language,
     };
   }
 }

client/src/app/models/comment.ts

@@ -72,17 +72,4 @@ export class Comment extends AbstractModel {
       parentId: comment.parentId ?? null,
     };
   }
-
-  // TODO not used
-  public static serializeForUpdate(comment: Comment): any {
-    return {
-      message: comment.message,
-    };
-  }
-}
-
-// TODO not used
-export interface PaginatedComments {
-  items: Comment[];
-  hasNext: boolean;
 }

client/src/app/models/instance-settings.ts

@@ -1,6 +1,7 @@
 import { File } from './file';
 import { FaDefaultFormat } from '../enums/fa-default-format';
 import { StartingPosition } from '../enums/starting-position';
+import { LanguageCode } from '../utility/types/language';
 
 export class InstanceSettings {
   timeUpdated: Date;
@@ -28,6 +29,7 @@ export class InstanceSettings {
   defaultStartingPosition: StartingPosition;
   rankingPastWeeks: number | null;
   disableFAInAscents: boolean;
+  language: LanguageCode;
 
   public static deserialize(payload: any): InstanceSettings {
     const instanceSettings = new InstanceSettings();
@@ -65,6 +67,7 @@ export class InstanceSettings {
     instanceSettings.defaultStartingPosition = payload.defaultStartingPosition;
     instanceSettings.rankingPastWeeks = payload.rankingPastWeeks;
     instanceSettings.disableFAInAscents = payload.disableFAInAscents;
+    instanceSettings.language = payload.language;
     return instanceSettings;
   }
 
@@ -100,6 +103,7 @@ export class InstanceSettings {
       defaultStartingPosition: instanceSettings.defaultStartingPosition,
       rankingPastWeeks: instanceSettings.rankingPastWeeks,
       disableFAInAscents: instanceSettings.disableFAInAscents,
+      language: instanceSettings.language,
     };
   }
 }

client/src/app/models/user.ts

@@ -1,5 +1,6 @@
 import { AbstractModel } from './abstract-model';
 import { File } from './file';
+import { LanguageCode } from '../utility/types/language';
 
 /**
  * Model of a user.
@@ -18,6 +19,7 @@ export class User extends AbstractModel {
   member: boolean;
   activatedAt: Date;
   avatar: File;
+  accountLanguage: LanguageCode;
 
   fullname: string;
   routerLink: string;
@@ -46,6 +48,7 @@ export class User extends AbstractModel {
     user.fullname = `${user.firstname} ${user.lastname}`;
     user.avatar = payload.avatar ? File.deserialize(payload.avatar) : null;
     user.routerLink = `/users/${user.slug}`;
+    user.accountLanguage = payload.accountLanguage;
     return user;
   }