From 77c355d56982b36181f374e88342b0fa1625f9c9 Mon Sep 17 00:00:00 2001
From: Daniel Egger <daniel.egger@gmail.com>
Date: Tue, 10 May 2022 15:03:55 +0200
Subject: [PATCH] MS-474: Add myKV-specific terms

---
 client/config/prod-my-kv.env.js               |  1 -
 client/config/prod.env.js                     |  7 ++-
 .../components/AssignmentWithSubmissions.vue  |  6 ++-
 client/src/components/BackLink.vue            | 14 +++--
 client/src/components/ContentBlock.vue        | 14 ++---
 .../book-navigation/ContentNavigation.vue     |  7 +--
 .../content-blocks/InstrumentWidget.vue       |  7 ++-
 .../components/modules/SnapshotCreated.vue    |  6 ++-
 .../src/components/modules/SnapshotHeader.vue |  7 +--
 .../components/profile/DeactivatePerson.vue   |  5 +-
 .../components/toggle-menu/ToggleEditing.vue  | 10 ++--
 client/src/mixins/app-flavor-terms.js         | 52 +++++++++++++++++++
 client/src/mixins/page-title.js               |  7 ---
 client/src/pages/hello.vue                    |  6 +--
 client/src/pages/index.vue                    |  5 +-
 client/src/pages/license-activation.vue       | 10 ++--
 client/src/pages/module/moduleSettings.vue    |  5 +-
 client/src/pages/onboarding/start.vue         |  6 +--
 client/src/pages/onboarding/step1.vue         |  8 +--
 client/src/pages/snapshot/snapshots.vue       |  5 +-
 client/src/pages/start.vue                    | 17 +++---
 client/src/pages/topic-page.vue               |  6 ++-
 22 files changed, 142 insertions(+), 69 deletions(-)
 create mode 100644 client/src/mixins/app-flavor-terms.js
 delete mode 100644 client/src/mixins/page-title.js

diff --git a/client/config/prod-my-kv.env.js b/client/config/prod-my-kv.env.js
index ad0831fc..b6e3d76f 100644
--- a/client/config/prod-my-kv.env.js
+++ b/client/config/prod-my-kv.env.js
@@ -7,7 +7,6 @@ module.exports = {
   VUE_APP_LOGO: '"https://skillbox-my-kv-prod.s3-eu-west-1.amazonaws.com/mykv-logo.png"',
   VUE_APP_ENABLE_PORTFOLIO: "true",
   VUE_APP_ENABLE_SPELLCHECK: !!process.env.TASKBASE_BASEURL,
-  VUE_APP_JS_TITLE: '"My KV"',
   VUE_APP_ENABLE_FOOTER: "false",
   VUE_APP_SHOW_OBJECTIVES_TITLE: "false",
 
diff --git a/client/config/prod.env.js b/client/config/prod.env.js
index 39d811c2..f70b3b7a 100644
--- a/client/config/prod.env.js
+++ b/client/config/prod.env.js
@@ -7,7 +7,7 @@ const values = {
   MATOMO_HOST: JSON.stringify(process.env.MATOMO_HOST),
   MATOMO_SITE_ID: JSON.stringify(process.env.MATOMO_SITE_ID),
   LOGOUT_REDIRECT_URL: JSON.stringify(process.env.LOGOUT_REDIRECT_URL),
-  VUE_APP_TYPE: JSON.stringify(process.env.APP_TYPE),
+  VUE_APP_FLAVOR: JSON.stringify(process.env.APP_FLAVOR),
   /*
   * ENV variables used in JS code need to be stringyfied, as they will be replaced (in place) in the code,
   * and JS needs quotes around strings
@@ -16,7 +16,6 @@ const values = {
   VUE_APP_LOGO: '"/static/logo.png"',
   VUE_APP_ENABLE_PORTFOLIO: "true",
   VUE_APP_ENABLE_SPELLCHECK: !!process.env.TASKBASE_BASEURL,
-  VUE_APP_JS_TITLE: '"mySkillbox"',
   VUE_APP_ENABLE_FOOTER: "true",
   VUE_APP_SHOW_OBJECTIVES_TITLE: "true",
 
@@ -30,10 +29,10 @@ const values = {
   // ^^^^ HTML PROPERTIES TO HERE, NOT STRINGIFIED ^^^^
 }
 
-if (process.env.APP_TYPE === 'my-kv') {
+if (process.env.APP_FLAVOR === 'my-kv') {
   module.exports = merge(values, require('./prod-my-kv.env.js'));
 } else {
-  // we are on the skillbox APP_TYPE
+  // we are on the skillbox APP_FLAVOR
   module.exports = values;
 }
 
diff --git a/client/src/components/AssignmentWithSubmissions.vue b/client/src/components/AssignmentWithSubmissions.vue
index f27a9181..944e0867 100644
--- a/client/src/components/AssignmentWithSubmissions.vue
+++ b/client/src/components/AssignmentWithSubmissions.vue
@@ -9,7 +9,7 @@
       <a
         class="button button--primary submissions-page__back"
         @click="$emit('back')"
-      >Aufgabe im Modul anzeigen</a>
+      >Aufgabe im {{ flavorTextModul }} anzeigen</a>
     </div>
 
     <div
@@ -64,11 +64,13 @@
 
 <script>
   import StudentSubmission from '@/components/StudentSubmission';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
-  import {meQuery} from '@/graphql/queries';
+  import { meQuery } from '@/graphql/queries';
 
   export default {
     props: ['assignment'],
+    mixins: [appFlavorTermsMixin],
 
     components: {
       StudentSubmission
diff --git a/client/src/components/BackLink.vue b/client/src/components/BackLink.vue
index 377d2c35..0f490e79 100644
--- a/client/src/components/BackLink.vue
+++ b/client/src/components/BackLink.vue
@@ -9,9 +9,11 @@
 </template>
 
 <script>
-  import {MODULE_PAGE} from '@/router/module.names';
-  import {ROOMS_PAGE} from '@/router/room.names';
-  import {PROJECTS_PAGE} from '@/router/portfolio.names';
+  import { MODULE_PAGE } from '@/router/module.names';
+  import { ROOMS_PAGE } from '@/router/room.names';
+  import { PROJECTS_PAGE } from '@/router/portfolio.names';
+
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   const ChevronLeft = () => import(/* webpackChunkName: "icons" */'@/components/icons/ChevronLeft');
 
@@ -31,6 +33,8 @@
       },
     },
 
+    mixins: [appFlavorTermsMixin],
+
     components: {
       ChevronLeft,
     },
@@ -51,9 +55,9 @@
       fullTitle() {
         switch (this.type) {
           case 'topic':
-            return `Thema: ${this.title}`;
+            return `${this.flavorTextThema}: ${this.title}`;
           case 'module':
-            return `Modul: ${this.title}`;
+            return `${this.flavorTextModul}: ${this.title}`;
           default:
             return this.title;
         }
diff --git a/client/src/components/ContentBlock.vue b/client/src/components/ContentBlock.vue
index 7781d9d3..363c893c 100644
--- a/client/src/components/ContentBlock.vue
+++ b/client/src/components/ContentBlock.vue
@@ -81,11 +81,13 @@
   import DELETE_CONTENT_BLOCK_MUTATION from '@/graphql/gql/mutations/deleteContentBlock.gql';
 
   import me from '@/mixins/me';
-  import {hidden} from '@/helpers/visibility';
-  import {CONTENT_TYPE} from '@/consts/types';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
+
+  import { hidden } from '@/helpers/visibility';
+  import { CONTENT_TYPE } from '@/consts/types';
   import PopoverLink from '@/components/ui/PopoverLink';
-  import {removeAtIndex} from '@/graphql/immutable-operations';
-  import {EDIT_CONTENT_BLOCK_PAGE} from '@/router/module.names';
+  import { removeAtIndex } from '@/graphql/immutable-operations';
+  import { EDIT_CONTENT_BLOCK_PAGE } from '@/router/module.names';
 
   const ContentComponent = () => import(/* webpackChunkName: "content-components" */'@/components/content-blocks/ContentComponent');
 
@@ -113,7 +115,7 @@
       },
     },
 
-    mixins: [me],
+    mixins: [me, appFlavorTermsMixin],
 
     components: {
       PopoverLink,
@@ -137,7 +139,7 @@
           return '';
         }
 
-        return `Instrument - ${instruments[contentType]}`;
+        return `${this.flavorTextInstrument} - ${instruments[contentType]}`;
       },
       canEditContentBlock() {
         return this.contentBlock.mine && !this.contentBlock.indent;
diff --git a/client/src/components/book-navigation/ContentNavigation.vue b/client/src/components/book-navigation/ContentNavigation.vue
index 00984939..289e124f 100644
--- a/client/src/components/book-navigation/ContentNavigation.vue
+++ b/client/src/components/book-navigation/ContentNavigation.vue
@@ -12,7 +12,7 @@
           class="content-navigation__link"
           @click.native="close"
         >
-          Themen
+          {{ flavorTextThemen }}
         </router-link>
 
         <book-topic-navigation
@@ -27,7 +27,7 @@
           class="content-navigation__link"
           @click.native="close"
         >
-          Instrumente
+          {{ flavorTextInstrumente }}
         </router-link>
       </div>
 
@@ -99,6 +99,7 @@
 <script>
   import BookTopicNavigation from '@/components/book-navigation/BookTopicNavigation';
 
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
   import sidebarMixin from '@/mixins/sidebar';
   import meMixin from '@/mixins/me';
 
@@ -111,7 +112,7 @@
       }
     },
 
-    mixins: [sidebarMixin, meMixin],
+    mixins: [sidebarMixin, meMixin, appFlavorTermsMixin],
 
     components: {
       BookTopicNavigation,
diff --git a/client/src/components/content-blocks/InstrumentWidget.vue b/client/src/components/content-blocks/InstrumentWidget.vue
index 183df474..1470ac84 100644
--- a/client/src/components/content-blocks/InstrumentWidget.vue
+++ b/client/src/components/content-blocks/InstrumentWidget.vue
@@ -9,14 +9,17 @@
       :to="{name: 'instrument', params: { slug: value.slug }}"
       class="instrument-widget__button button"
     >
-      Instrument anzeigen
+      {{ flavorTextInstrument }} anzeigen
     </router-link>
   </div>
 </template>
 
 <script>
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
+
   export default {
-    props: ['value']
+    props: ['value'],
+    mixins: [appFlavorTermsMixin],
   };
 </script>
 
diff --git a/client/src/components/modules/SnapshotCreated.vue b/client/src/components/modules/SnapshotCreated.vue
index 687db00f..b63eb12f 100644
--- a/client/src/components/modules/SnapshotCreated.vue
+++ b/client/src/components/modules/SnapshotCreated.vue
@@ -25,7 +25,7 @@
         <a
           class="button"
           @click="close"
-        >Zurück zum Modul</a>
+        >Zurück zum {{ flavorTextModul }}</a>
       </div>
     </template>
   </modal>
@@ -33,10 +33,12 @@
 
 <script>
   import Modal from '@/components/Modal';
-  import {SNAPSHOT_LIST} from '@/router/module.names';
+  import { SNAPSHOT_LIST } from '@/router/module.names';
   import dateformat from '@/helpers/date-format';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   export default {
+    mixins: [appFlavorTermsMixin],
     components: {
       Modal,
     },
diff --git a/client/src/components/modules/SnapshotHeader.vue b/client/src/components/modules/SnapshotHeader.vue
index eb15a669..f913389b 100644
--- a/client/src/components/modules/SnapshotHeader.vue
+++ b/client/src/components/modules/SnapshotHeader.vue
@@ -37,7 +37,7 @@
         <checkbox
           :checked="agreement"
           data-cy="apply-checkbox"
-          label="Ich will die Anpassungen aus diesem Snapshot in das Modul kopieren."
+          :label="`Ich will die Anpassungen aus diesem Snapshot in das ${flavorTextModul} kopieren.`"
           @input="agreement = $event"
         />
       </div>
@@ -68,9 +68,10 @@
   import Checkbox from '@/components/ui/Checkbox';
 
   import me from '@/mixins/me';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   import APPLY_SNAPSHOT_MUTATION from 'gql/mutations/snapshots/applySnapshot.gql';
-  import {MODULE_PAGE} from '@/router/module.names';
+  import { MODULE_PAGE } from '@/router/module.names';
 
   const _getChange = (snapshot, index) => {
     try {
@@ -88,7 +89,7 @@
       },
     },
 
-    mixins: [me],
+    mixins: [me, appFlavorTermsMixin],
 
     components: {
       Checkbox,
diff --git a/client/src/components/profile/DeactivatePerson.vue b/client/src/components/profile/DeactivatePerson.vue
index 0fbcb7f1..40a3be2b 100644
--- a/client/src/components/profile/DeactivatePerson.vue
+++ b/client/src/components/profile/DeactivatePerson.vue
@@ -46,7 +46,7 @@
         <template v-else>
           Diese Person kann
         </template>
-        weiterhin Module und Instrumente lesen.
+        weiterhin {{ flavorTextModule }} und {{ flavorTextInstrumente }} lesen.
       </li>
       <li class="deactivate-user__text deactivate-user__list-item">
         <template v-if="myself">
@@ -75,8 +75,11 @@
 
 <script>
   import Modal from '@/components/Modal';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   export default {
+    mixins: [appFlavorTermsMixin],
+
     components: {
       Modal
     },
diff --git a/client/src/components/toggle-menu/ToggleEditing.vue b/client/src/components/toggle-menu/ToggleEditing.vue
index 70afefed..ca977030 100644
--- a/client/src/components/toggle-menu/ToggleEditing.vue
+++ b/client/src/components/toggle-menu/ToggleEditing.vue
@@ -2,7 +2,7 @@
   <toggle
     :checked="module.inEditMode"
     data-cy="toggle-editing"
-    label="Modul anpassen"
+    :label="`${flavorTextModul} anpassen`"
     @input="toggle"
   />
 </template>
@@ -10,8 +10,10 @@
 <script>
   import Toggle from '@/components/ui/Toggle';
   // import MODULE_DETAILS_QUERY from '@/graphql/gql/queries/modules/moduleDetailsQuery.gql';
-  import {gql} from '@apollo/client/core';
-  import {setModuleEditMode} from '@/graphql/cache-operations';
+  import { gql } from '@apollo/client/core';
+  import { setModuleEditMode } from '@/graphql/cache-operations';
+
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   const QUERY = gql`
           query ModuleEditModeQuery ($slug: String) {
@@ -23,6 +25,8 @@
           `;
 
   export default {
+    mixins: [appFlavorTermsMixin],
+
     components: {
       Toggle
     },
diff --git a/client/src/mixins/app-flavor-terms.js b/client/src/mixins/app-flavor-terms.js
new file mode 100644
index 00000000..5ee66dd8
--- /dev/null
+++ b/client/src/mixins/app-flavor-terms.js
@@ -0,0 +1,52 @@
+export default {
+  computed: {
+    flavorPageTitle() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv': return 'My KV';
+      }
+      return 'my Skillbox';
+    },
+    flavorTextModul() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv':
+          return 'Lernfeld';
+      }
+      return 'Modul';
+    },
+    flavorTextModule() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv':
+          return 'Lernfelder';
+      }
+      return 'Module';
+    },
+    flavorTextThema() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv':
+          return 'HKB';
+      }
+      return 'Thema';
+    },
+    flavorTextThemen() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv':
+          return 'HKB';
+      }
+      return 'Themen';
+    },
+    flavorTextInstrument() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv':
+          return 'Grundlagenwissen';
+      }
+      return 'Instrument';
+    },
+    flavorTextInstrumente() {
+      switch(process.env.VUE_APP_FLAVOR) {
+        case 'my-kv':
+          return 'Grundlagenwissen';
+      }
+      return 'Instrumente';
+    },
+  }
+};
diff --git a/client/src/mixins/page-title.js b/client/src/mixins/page-title.js
deleted file mode 100644
index 502730d4..00000000
--- a/client/src/mixins/page-title.js
+++ /dev/null
@@ -1,7 +0,0 @@
-export default {
-  data() {
-    return {
-      pageTitle: process.env.VUE_APP_JS_TITLE
-    };
-  }
-};
diff --git a/client/src/pages/hello.vue b/client/src/pages/hello.vue
index 2bce19ba..15e66fc3 100644
--- a/client/src/pages/hello.vue
+++ b/client/src/pages/hello.vue
@@ -29,7 +29,7 @@
         class="login-actions__title"
         data-cy="hello-title"
       >
-        Wollen Sie {{ pageTitle }} im Unterricht verwenden?
+        Wollen Sie {{ flavorPageTitle }} im Unterricht verwenden?
       </h2>
       <a
         class="button button--primary button--big actions__submit"
@@ -71,13 +71,13 @@
 </template>
 
 <script>
-  import pageTitleMixin from '@/mixins/page-title';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
   const HepLogoNoClaim = () => import(/* webpackChunkName: "icons" */'@/components/icons/HepLogoNoClaim');
   const EhbLogo = () => import(/* webpackChunkName: "icons" */'@/components/icons/EhbLogo');
   const Logo = () => import(/* webpackChunkName: "icons" */'@/components/icons/Logo');
 
   export default {
-    mixins: [pageTitleMixin],
+    mixins: [appFlavorTermsMixin],
     components: {
       HepLogoNoClaim,
       EhbLogo,
diff --git a/client/src/pages/index.vue b/client/src/pages/index.vue
index 42778bef..4901a5cc 100644
--- a/client/src/pages/index.vue
+++ b/client/src/pages/index.vue
@@ -14,7 +14,7 @@
       </li>
       <li>
         <router-link to="/module">
-          Modul
+          {{ flavorTextModul }}
         </router-link>
       </li>
       <li>
@@ -28,8 +28,11 @@
 
 <script>
   import ALL_MODULES from '@/graphql/gql/queries/allModules.gql';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   export default {
+    mixins: [appFlavorTermsMixin],
+
     data() {
       return {
         modules: []
diff --git a/client/src/pages/license-activation.vue b/client/src/pages/license-activation.vue
index b9a71071..ade4a71f 100644
--- a/client/src/pages/license-activation.vue
+++ b/client/src/pages/license-activation.vue
@@ -50,13 +50,13 @@
           <a
             :href="teacherEditionUrl"
             class="hep-link"
-          >{{ pageTitle }} für Lehrpersonen</a>
+          >{{ flavorPageTitle }} für Lehrpersonen</a>
         </li>
         <li class="license-links__item">
           <a
             :href="studentEditionUrl"
             class="hep-link"
-          >{{ pageTitle }} für Lernende</a>
+          >{{ flavorPageTitle }} für Lernende</a>
         </li>
       </ul>
     </section>
@@ -68,16 +68,16 @@
   import REDEEM_COUPON from '@/graphql/gql/mutations/redeemCoupon.gql';
   import ME_QUERY from '@/graphql/gql/queries/meQuery.gql';
   import LoadingButton from '@/components/LoadingButton';
-  import {ValidationObserver} from 'vee-validate';
+  import { ValidationObserver } from 'vee-validate';
 
   import me from '@/mixins/me';
   import logout from '@/mixins/logout';
-  import pageTitleMixin from '@/mixins/page-title';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   const ValidatedInput = () => import('@/components/validation/ValidatedInput');
 
   export default {
-    mixins: [me, logout, pageTitleMixin],
+    mixins: [me, logout, appFlavorTermsMixin],
     components: {
       LoadingButton,
       ValidationObserver,
diff --git a/client/src/pages/module/moduleSettings.vue b/client/src/pages/module/moduleSettings.vue
index 493929dd..85eb8fa0 100644
--- a/client/src/pages/module/moduleSettings.vue
+++ b/client/src/pages/module/moduleSettings.vue
@@ -8,7 +8,7 @@
         Lösungen
       </h2>
       <p class="module-settings__paragraph">
-        Wollen Sie die Lösungen in diesem Modul für die Lernenden der ausgewählten Klasse anzeigen?
+        Wollen Sie die Lösungen in diesem {{ flavorTextModul }} für die Lernenden der ausgewählten Klasse anzeigen?
       </p>
       <toggle-solutions-for-module />
     </section>
@@ -36,8 +36,11 @@
 
 <script>
   import ToggleSolutionsForModule from '@/components/toggle-menu/ToggleSolutionsForModule';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   export default {
+    mixins: [appFlavorTermsMixin],
+
     components: {
       ToggleSolutionsForModule,
     }
diff --git a/client/src/pages/onboarding/start.vue b/client/src/pages/onboarding/start.vue
index f847b2d9..9b97c8c5 100644
--- a/client/src/pages/onboarding/start.vue
+++ b/client/src/pages/onboarding/start.vue
@@ -6,19 +6,19 @@
     </h1>
 
     <p class="onboarding__claim">
-      Schauen Sie sich die Einführung an und lernen Sie {{ pageTitle }} kennen.
+      Schauen Sie sich die Einführung an und lernen Sie {{ flavorPageTitle }} kennen.
     </p>
   </div>
 </template>
 
 <script>
-  import pageTitleMixin from '@/mixins/page-title';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   const Logo = () => import(/* webpackChunkName: "icons" */'@/components/icons/Logo');
 
   export default {
 
-    mixins: [pageTitleMixin],
+    mixins: [appFlavorTermsMixin],
     components: {
       Logo
     },
diff --git a/client/src/pages/onboarding/step1.vue b/client/src/pages/onboarding/step1.vue
index 208de789..fa1ceec6 100644
--- a/client/src/pages/onboarding/step1.vue
+++ b/client/src/pages/onboarding/step1.vue
@@ -7,16 +7,16 @@
       Ihr Lernbereich
     </h1>
     <h2 class="onboarding__heading">
-      Themen
+      {{ flavorTextThemen }}
     </h2>
     <p class="onboarding__paragraph">
-      In den «Themen» finden Sie aktuelle Module mit Aufträgen und Situationen.
+      In den «{{ flavorTextThemen }}» finden Sie aktuelle {{ flavorTextModule }} mit Aufträgen und Situationen.
     </p>
     <h2 class="onboarding__heading">
-      Instrumente
+      {{ flavorTextInstrumente }}
     </h2>
     <p class="onboarding__paragraph">
-      Die «Instrumente» helfen Ihnen dabei, Aufträge und Situationen zu bearbeiten. Zudem erweitern Sie so Ihre Kompetenzen.
+      Die «{{ flavorTextInstrumente }}» helfen Ihnen dabei, Aufträge und Situationen zu bearbeiten. Zudem erweitern Sie so Ihre Kompetenzen.
     </p>
     <h2 class="onboarding__heading">
       News
diff --git a/client/src/pages/snapshot/snapshots.vue b/client/src/pages/snapshot/snapshots.vue
index 95a5e3b7..8448fc13 100644
--- a/client/src/pages/snapshot/snapshots.vue
+++ b/client/src/pages/snapshot/snapshots.vue
@@ -2,7 +2,7 @@
   <div class="snapshots">
     <h1>Snapshots</h1>
     <p class="snapshots__details">
-      Thema: {{ module.topic.title }} - {{ module.metaTitle }}: {{ module.title }}
+      {{ flavorTextThema }}: {{ module.topic.title }} - {{ module.metaTitle }}: {{ module.title }}
     </p>
     <snapshot-team-menu
       :selected="selectedLink"
@@ -24,13 +24,14 @@
 
 <script>
   import SnapshotListItem from '@/components/modules/SnapshotListItem';
-
   import MODULE_SNAPSHOTS_QUERY from '@/graphql/gql/queries/moduleSnapshots.gql';
   import SnapshotTeamMenu from '@/components/modules/SnapshotTeamMenu';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   const defaultModule = {topic: {}, snapshots: []};
 
   export default {
+    mixins: [appFlavorTermsMixin],
     components: {
       SnapshotTeamMenu,
       SnapshotListItem,
diff --git a/client/src/pages/start.vue b/client/src/pages/start.vue
index e7b33cff..c668aa9f 100644
--- a/client/src/pages/start.vue
+++ b/client/src/pages/start.vue
@@ -9,14 +9,14 @@
           class="start-page__heading"
           data-cy="start-page-heading"
         >
-          Letzte Module
+          Letzte {{ flavorTextModule }}
         </h2>
         <h3
           class="start-page__no-modules"
           data-cy="no-modules-yet"
           v-if="!me.recentModules.length"
         >
-          Sie haben sich noch kein Modul angeschaut. Legen Sie jetzt los!
+          Sie haben sich noch kein {{ flavorTextModul }} angeschaut. Legen Sie jetzt los!
         </h3>
         <div class="start-page__modules-list">
           <module-teaser
@@ -34,7 +34,7 @@
           tag="div"
           class="button"
         >
-          Alle Module anzeigen
+          Alle {{ flavorTextModule }} anzeigen
         </router-link>
       </div>
       <div
@@ -63,10 +63,10 @@
 
       <div class="start-page__onboarding">
         <h2 class="start-page__heading">
-          Kennen Sie schon alle Bereiche von {{ pageTitle }}?
+          Kennen Sie schon alle Bereiche von {{ flavorPageTitle }}?
         </h2>
         <p class="start-page__paragraph">
-          Schauen Sie sich jetzt die Einführung zu {{ pageTitle }} an.
+          Schauen Sie sich jetzt die Einführung zu {{ flavorPageTitle }} an.
         </p>
         <router-link
           :to="{name: 'onboarding-start'}"
@@ -82,15 +82,14 @@
   import NewsTeaser from '@/components/news/NewsTeaser.vue';
   import ModuleTeaser from '@/components/modules/ModuleTeaser';
 
-
   import meQuery from '@/mixins/me';
   import news from '@/mixins/news';
 
-  import pageTitleMixin from '@/mixins/page-title';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
 
   export default {
 
-    mixins: [meQuery, news, pageTitleMixin],
+    mixins: [meQuery, news, appFlavorTermsMixin],
 
     components: {
       NewsTeaser,
@@ -106,7 +105,7 @@
       },
       moduleText() {
         if (this.me.lastModule && this.me.lastModule.slug) {
-          return 'Aktuelles Modul anzeigen';
+          return `Aktuelles ${this.flavorTextModul} anzeigen`;
         }
         return 'Alle Inhalte anzeigen';
       },
diff --git a/client/src/pages/topic-page.vue b/client/src/pages/topic-page.vue
index 79a92934..7d1ef1d7 100644
--- a/client/src/pages/topic-page.vue
+++ b/client/src/pages/topic-page.vue
@@ -30,7 +30,7 @@
           v-if="me.isTeacher && topic.instructions"
         >
           <bulb-icon class="topic__instruction-icon topic__link-icon" />
-          <span class="topic__link-description">Anweisungen zum Thema anzeigen</span>
+          <span class="topic__link-description">Anweisungen zum {{ flavorTextThema }} anzeigen</span>
         </a>
       </div>
       <div class="topic__modules">
@@ -48,16 +48,18 @@
   import ModuleTeaser from '@/components/modules/ModuleTeaser.vue';
   import TOPIC_QUERY from '@/graphql/gql/queries/topicQuery.gql';
   import me from '@/mixins/me';
+  import appFlavorTermsMixin from '@/mixins/app-flavor-terms';
   import BookTopicNavigation from '@/components/book-navigation/BookTopicNavigation';
 
   import UPDATE_LAST_TOPIC_MUTATION from '@/graphql/gql/mutations/updateLastTopic.gql';
   import ME_QUERY from '@/graphql/gql/queries/meQuery.gql';
+
   const PlayIcon = () => import(/* webpackChunkName: "icons" */'@/components/icons/Play');
   const BulbIcon = () => import(/* webpackChunkName: "icons" */'@/components/icons/BulbIcon');
 
   export default {
 
-    mixins: [me],
+    mixins: [me, appFlavorTermsMixin],
     components: {
       BookTopicNavigation,
       ModuleTeaser,