Refactor pageParams, third step

- Implement emails.js in backend as well.
- Move backend links.js into emails.js, because code is not a duplicate of webapp anymore.

backend/src/config/emails.js

@@ -0,0 +1,8 @@
+// this file is duplicated in `backend/src/config/` and `webapp/constants/` and replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/constants/
+export default {
+  SUPPORT_EMAIL: 'devops@ocelot.social',
+  MODERATION_EMAIL: 'devops@ocelot.social',
+  // ATTENTION: the following links have to be defined even for internal pages with full URLs as example like 'https://staging.ocelot.social/support', because they are used in e-mails!
+  ORGANIZATION_LINK: 'https://ocelot.social',
+  SUPPORT_LINK: 'https://ocelot.social',
+}

backend/src/config/index.js

@@ -1,5 +1,5 @@
 import dotenv from 'dotenv'
-import links from './links.js'
+import emails from './emails.js'
 import metadata from './metadata.js'
 
 // Load env file
@@ -79,9 +79,9 @@ const s3 = {
 
 const options = {
   EMAIL_DEFAULT_SENDER: env.EMAIL_DEFAULT_SENDER,
-  SUPPORT_URL: links.SUPPORT,
+  SUPPORT_URL: emails.SUPPORT_LINK,
   APPLICATION_NAME: metadata.APPLICATION_NAME,
-  ORGANIZATION_URL: links.ORGANIZATION,
+  ORGANIZATION_URL: emails.ORGANIZATION_LINK,
   PUBLIC_REGISTRATION: env.PUBLIC_REGISTRATION === 'true' || false,
   INVITE_REGISTRATION: env.INVITE_REGISTRATION !== 'false', // default = true
 }

backend/src/config/links.js

@@ -1,18 +0,0 @@
-// this file is duplicated in `backend/src/config/links.js` and `webapp/constants/links.js` and replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/constants/
-export default {
-  // Wolle LANDING_PAGE: '/login', // examples: '/login', '/registration', '/organization', or external 'https://ocelot.social'
-  LANDING_PAGE: '/organization', // examples: '/login', '/registration', '/organization', or external 'https://ocelot.social'
-
-  // you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/
-
-  SUPPORT: 'https://ocelot.social', // example for internal support page: 'https://staging.ocelot.social/support'. set a full URL please, because it is used in e-mails as well!
-
-  // on null or empty strings internal pages are used, see 'webapp/locales/html/'
-  ORGANIZATION: 'https://ocelot.social',
-  DONATE: 'https://ocelot-social.herokuapp.com/donations', // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
-  IMPRINT: 'https://ocelot-social.herokuapp.com/imprint', // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
-  TERMS_AND_CONDITIONS: null,
-  CODE_OF_CONDUCT: null,
-  DATA_PRIVACY: null,
-  FAQ: 'https://ocelot.social',
-}

webapp/components/ContributionForm/ContributionForm.vue

@@ -25,10 +25,10 @@
         <div v-if="formData.image" class="blur-toggle">
           <label for="blur-img">{{ $t('contribution.inappropriatePicture') }}</label>
           <input type="checkbox" id="blur-img" v-model="formData.imageBlurred" />
-          <a :href="links.FAQ" target="_blank" class="link">
+          <page-params-link class="link" :pageParams="links.FAQ">
-            {{ $t('contribution.inappropriatePictureText') }}
+            {{ $t('contribution.inappropriatePicture') }}
             <base-icon name="question-circle" />
-          </a>
+          </page-params-link>
         </div>
         <ds-input
           model="title"
@@ -71,11 +71,13 @@ import HcEditor from '~/components/Editor/Editor'
 import PostMutations from '~/graphql/PostMutations.js'
 import ImageUploader from '~/components/ImageUploader/ImageUploader'
 import links from '~/constants/links.js'
+import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
 
 export default {
   components: {
     HcEditor,
     ImageUploader,
+    PageParamsLink,
   },
   props: {
     contribution: {

webapp/components/DonationInfo/DonationInfo.vue

@@ -1,9 +1,7 @@
 <template>
   <div class="donation-info">
     <progress-bar :title="title" :label="label" :goal="goal" :progress="progress" />
-    <a target="_blank" :href="links.DONATE">
+    <base-button filled @click="redirectToPage(links.DONATE)">{{ $t('donations.donate-now') }}</base-button>
-      <base-button filled>{{ $t('donations.donate-now') }}</base-button>
-    </a>
   </div>
 </template>
 
@@ -36,6 +34,11 @@ export default {
       })
     },
   },
+  methods: {
+    redirectToPage(pageParams) {
+      pageParams.redirectToPage(this)
+    },
+  },
   apollo: {
     Donations: {
       query() {

webapp/components/LoginForm/LoginForm.vue

@@ -6,9 +6,9 @@
     </blockquote>
     <base-card>
       <template #imageColumn>
-        <a :href="links.ORGANIZATION.link" :title="$t('login.moreInfo', metadata)" target="_blank">
+        <page-params-link :pageParams="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)">
           <logo logoType="welcome" />
-        </a>
+        </page-params-link>
       </template>
       <h2 class="title">{{ $t('login.login') }}</h2>
       <form :disabled="pending" @submit.prevent="onSubmit">
@@ -54,6 +54,7 @@
 <script>
 import links from '~/constants/links.js'
 import metadata from '~/constants/metadata.js'
+import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
 import Logo from '~/components/Logo/Logo'
 import ShowPassword from '../ShowPassword/ShowPassword.vue'
@@ -62,6 +63,7 @@ export default {
   components: {
     LocaleSwitch,
     Logo,
+    PageParamsLink,
     ShowPassword,
   },
   data() {

webapp/components/PageFooter/PageFooter.vue

@@ -2,21 +2,9 @@
   <div id="footer" class="ds-footer">
     <!-- links to internal or external pages -->
     <span v-for="pageParams in links.FOOTER_LINK_LIST" :key="pageParams.name">
-      <nuxt-link
+      <page-params-link :pageParams="pageParams">
-        v-if="isInternalPage(pageParams)"
-        :to="pageParams.internalLink"
-        :data-test="pageParams.name + '-nuxt-link'"
-      >
         {{ $t(pageParams.internalPage.footerIdent) }}
-      </nuxt-link>
+      </page-params-link>
-      <a
-        v-else
-        :href="pageParams.externalLink"
-        target="_blank"
-        :data-test="pageParams.name + '-link'"
-      >
-        {{ $t(pageParams.internalPage.footerIdent) }}
-      </a>
       <span class="division-line">-</span>
     </span>
     <!-- version -->
@@ -32,11 +20,14 @@
 
 <script>
 import links from '~/constants/links.js'
-import { isInternalPage } from '~/components/utils/InternalPages.js'
+import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
 
 export default {
+  components: {
+    PageParamsLink,
+  },
   data() {
-    return { links, isInternalPage, version: `v${this.$env.VERSION}` }
+    return { links, version: `v${this.$env.VERSION}` }
   },
 }
 </script>

webapp/components/PasswordReset/ChangePassword.vue

@@ -79,7 +79,7 @@ export default {
   data() {
     const passwordForm = PasswordForm({ translate: this.$t })
     return {
-      supportEmail: emails.SUPPORT,
+      supportEmail: emails.SUPPORT_EMAIL,
       formData: {
         ...passwordForm.formData,
       },

webapp/components/Registration/RegistrationSlideCreate.vue

@@ -142,7 +142,7 @@ export default {
     const passwordForm = PasswordForm({ translate: this.$t })
     return {
       links,
-      supportEmail: emails.SUPPORT,
+      supportEmail: emails.SUPPORT_EMAIL,
       formData: {
         name: '',
         ...passwordForm.formData,

webapp/components/Registration/RegistrationSlider.vue

@@ -2,9 +2,9 @@
   <section class="login-form">
     <base-card>
       <template #imageColumn>
-        <a :href="links.ORGANIZATION.link" :title="$t('login.moreInfo', metadata)" target="_blank">
+        <page-params-link :pageParams="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)">
           <logo logoType="signup" />
-        </a>
+        </page-params-link>
       </template>
 
       <component-slider :sliderData="sliderData">
@@ -48,6 +48,7 @@ import metadata from '~/constants/metadata.js'
 import ComponentSlider from '~/components/ComponentSlider/ComponentSlider'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
 import Logo from '~/components/Logo/Logo'
+import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
 import RegistrationSlideCreate from './RegistrationSlideCreate'
 import RegistrationSlideEmail from './RegistrationSlideEmail'
 import RegistrationSlideInvite from './RegistrationSlideInvite'
@@ -60,6 +61,7 @@ export default {
     ComponentSlider,
     LocaleSwitch,
     Logo,
+    PageParamsLink,
     RegistrationSlideCreate,
     RegistrationSlideEmail,
     RegistrationSlideInvite,

webapp/components/_new/features/InternalPage/InternalPage.vue

@@ -4,9 +4,7 @@
       <ds-heading v-if="pageParams.internalPage.headlineIdent !== null" tag="h2">
         {{
           $t(
-            pageParams.internalPage.headlineIdent === ''
+            pageParams.internalPage.headlineIdent,
-              ? pageParams.internalPage.defaultHeadlineIdent
-              : pageParams.internalPage.headlineIdent,
           )
         }}
       </ds-heading>

webapp/components/_new/features/PageParamsLink/PageParamsLink.vue

@@ -0,0 +1,26 @@
+<template>
+  <nuxt-link
+    v-if="pageParams.isInternalPage"
+    :to="pageParams.internalPage.pageRoute"
+    :data-test="pageParams.name + '-nuxt-link'"
+  >
+    <slot />
+  </nuxt-link>
+  <a
+    v-else
+    :href="pageParams.externalLink"
+    target="_blank"
+    :data-test="pageParams.name + '-link'"
+  >
+    <slot />
+  </a>
+</template>
+
+<script>
+export default {
+  name: 'PageParamsLink',
+  props: {
+    pageParams: { type: Object, required: true },
+  },
+}
+</script>

webapp/components/utils/InternalPages.js

@@ -1,35 +1,42 @@
-export function isInternalPage(pageParams) {
-  return noStringDefined(pageParams.externalLink)
-}
-
 function noStringDefined(string) {
   return !string || string === 0
 }
 
-function pageLink(pageParams) {
-  return isInternalPage(pageParams) ? pageParams.internalLink : pageParams.externalLink
-}
-
 class PageParams {
   constructor(pageParams) {
     this.name = pageParams.name
     this.externalLink = pageParams.externalLink
-    this.internalLink = pageParams.internalLink
     this.internalPage = pageParams.internalPage
   }
 
-  assign(assignPageParams) {
+  overwrite(assignPageParams) {
     let pageParams = this
-    pageParams = {
+    if (assignPageParams.name !== undefined) {
-      ...pageParams,
+      pageParams.name = assignPageParams.name
-      ...assignPageParams,
+    }
-      internalPage: { ...pageParams.internalPage, ...assignPageParams.internalPage },
+    if (assignPageParams.externalLink !== undefined) {
+      pageParams.externalLink = assignPageParams.externalLink
+    }
+    if (assignPageParams.internalPage !== undefined) {
+      pageParams.internalPage = { ...pageParams.internalPage, ...assignPageParams.internalPage }
     }
     return pageParams
   }
 
+  get isInternalPage() {
+    return noStringDefined(this.externalLink)
+  }
+
   get link() {
-    return pageLink(this)
+    return this.isInternalPage ? this.internalPage.pageRoute : this.externalLink
+  }
+
+  redirectToPage(thisComponent) {
+    if (this.isInternalPage) {
+      thisComponent.$router.push(this.internalPage.pageRoute)
+    } else {
+      window.location.href = this.externalLink
+    }
   }
 }
 
@@ -39,17 +46,15 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/organization', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/organization', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.made', // localized string identifier
       headTitleIdent: 'site.made', // localized string identifier
       headlineIdent: 'site.made', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.made',
       htmlIdent: 'html.organization',
     },
   }),
@@ -58,17 +63,15 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/donate', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/donate', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.donate', // localized string identifier
       headTitleIdent: 'site.donate', // localized string identifier
       headlineIdent: 'site.donate', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.donate',
       htmlIdent: 'html.donate',
     },
   }),
@@ -77,17 +80,15 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/imprint', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/imprint', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.imprint', // localized string identifier
       headTitleIdent: 'site.imprint', // localized string identifier
       headlineIdent: 'site.imprint', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.imprint',
       htmlIdent: 'html.imprint',
     },
   }),
@@ -96,17 +97,15 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.termsAndConditions', // localized string identifier
       headTitleIdent: 'site.termsAndConditions', // localized string identifier
       headlineIdent: 'site.termsAndConditions', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.termsAndConditions',
       htmlIdent: 'html.termsAndConditions',
     },
   }),
@@ -115,17 +114,15 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/code-of-conduct', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/code-of-conduct', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.code-of-conduct', // localized string identifier
       headTitleIdent: 'site.code-of-conduct', // localized string identifier
       headlineIdent: 'site.code-of-conduct', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.code-of-conduct',
       htmlIdent: 'html.codeOfConduct',
     },
   }),
@@ -134,17 +131,15 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/data-privacy', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/data-privacy', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.data-privacy', // localized string identifier
       headTitleIdent: 'site.data-privacy', // localized string identifier
       headlineIdent: 'site.data-privacy', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.data-privacy',
       htmlIdent: 'html.dataPrivacy',
     },
   }),
@@ -153,38 +148,32 @@ export const defaultPageParamsPages = {
 
     externalLink: null, // if string is defined and not empty it's dominating
 
-    // in case internal page content is here 'webapp/locales/html/'
-    internalLink: '/faq', // static, don't change! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/faq', // static, don't change! internal page in case no external is defined
       footerIdent: 'site.faq', // localized string identifier
       headTitleIdent: 'site.faq', // localized string identifier
       headlineIdent: 'site.faq', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.faq',
       htmlIdent: 'html.faq',
     },
   }),
   SUPPORT: new PageParams({
     name: 'support',
 
-    // ATTENTION: has to be defined even for internal page with full URL as example like 'https://staging.ocelot.social/support', because it is used in e-mails as well!
+    externalLink: null,
-    externalLink: 'https://ocelot.social',
 
-    // in case internal page content is here 'webapp/locales/html/'
-    // ATTENTION: example for internal support page: 'https://staging.ocelot.social/support'. set a full URL please, because it is used in e-mails as well!
-    internalLink: '/support', // static, don't change '*/support'! internal page in case no external is defined
     internalPage: {
+      pageRoute: '/support', // static, don't change '*/support'! internal page in case no external is defined
       footerIdent: 'site.support', // localized string identifier
       headTitleIdent: 'site.support', // localized string identifier
       headlineIdent: 'site.support', // localized string identifier. on null it's hidden, on empty string default is used
       hasContainer: true,
       hasBaseCard: true,
       hasLoginInHeader: true,
-
+      // in case internal page content is here 'webapp/locales/html/'
-      defaultHeadlineIdent: 'site.support',
       htmlIdent: 'html.support',
     },
   }),

webapp/constants/emails.js

@@ -1,4 +1,8 @@
+// this file is duplicated in `backend/src/config/` and `webapp/constants/` and replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/constants/
 export default {
-  SUPPORT: 'devops@ocelot.social',
+  SUPPORT_EMAIL: 'devops@ocelot.social',
-  MODERATION: 'devops@ocelot.social',
+  MODERATION_EMAIL: 'devops@ocelot.social',
+  // ATTENTION: the following links have to be defined even for internal pages with full URLs as example like 'https://staging.ocelot.social/support', because they are used in e-mails!
+  ORGANIZATION_LINK: 'https://ocelot.social',
+  SUPPORT_LINK: 'https://ocelot.social',
 }

webapp/constants/links.js

@@ -1,119 +1,113 @@
-// this file is duplicated in `backend/src/config/links.js` and `webapp/constants/links.js` and replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/constants/
+// this file is replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/constants/
 
 import { defaultPageParamsPages } from '~/components/utils/InternalPages.js'
 
-const ORGANIZATION = defaultPageParamsPages.ORGANIZATION.assign({
+const ORGANIZATION = defaultPageParamsPages.ORGANIZATION.overwrite({
-  // Wolle externalLink: 'https://ocelot.social',
+  // Wolle externalLink: 'https://ocelot.social', // if string is defined and not empty it's dominating
-  //
-  externalLink: null, // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.made', // localized string identifier
+    // footerIdent: 'site.made', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.made', // localized string identifier
+    // headTitleIdent: 'site.made', // localized string identifier, if undefined default is used
-    // Wolle headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
+    // headlineIdent: 'site.made', // localized string identifier, on null it's hidden, if undefined default is used
-    headlineIdent: null, // localized string identifier. on null it's hidden, on empty string default is used
+    // Wolle
+    headlineIdent: null, // localized string identifier, on null it's hidden, if undefined default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const DONATE = defaultPageParamsPages.DONATE.assign({
+const DONATE = defaultPageParamsPages.DONATE.overwrite({
-  // Wolle externalLink: 'https://ocelot-social.herokuapp.com/donations', // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
+  // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
-  externalLink: '', // if string is defined and not empty it's dominating
+  // Wolle externalLink: 'https://ocelot-social.herokuapp.com/donations', // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.donate', // localized string identifier
+    // footerIdent: 'site.donate', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.donate', // localized string identifier
+    // headTitleIdent: 'site.donate', // localized string identifier, if undefined default is used
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
+    // headlineIdent: 'site.donate', // localized string identifier, on null it's hidden, if undefined default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const IMPRINT = defaultPageParamsPages.IMPRINT.assign({
+const IMPRINT = defaultPageParamsPages.IMPRINT.overwrite({
-  // Wolle externalLink: 'https://ocelot-social.herokuapp.com/imprint', // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
+  // we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
-  externalLink: '', // if string is defined and not empty it's dominating
+  // Wolle externalLink: 'https://ocelot-social.herokuapp.com/imprint', // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.imprint', // localized string identifier
+    // footerIdent: 'site.imprint', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.imprint', // localized string identifier
+    // headTitleIdent: 'site.imprint', // localized string identifier, if undefined default is used
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
+    // headlineIdent: 'site.imprint', // localized string identifier, on null it's hidden, if undefined default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const TERMS_AND_CONDITIONS = defaultPageParamsPages.TERMS_AND_CONDITIONS.assign({
+const TERMS_AND_CONDITIONS = defaultPageParamsPages.TERMS_AND_CONDITIONS.overwrite({
-  externalLink: null, // if string is defined and not empty it's dominating
+  // externalLink: null, // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.termsAndConditions', // localized string identifier
+    // footerIdent: 'site.termsAndConditions', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.termsAndConditions', // localized string identifier
+    // headTitleIdent: 'site.termsAndConditions', // localized string identifier, if undefined default is used
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
+    // headlineIdent: 'site.termsAndConditions', // localized string identifier, on null it's hidden, if undefined default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const CODE_OF_CONDUCT = defaultPageParamsPages.CODE_OF_CONDUCT.assign({
+const CODE_OF_CONDUCT = defaultPageParamsPages.CODE_OF_CONDUCT.overwrite({
-  externalLink: null, // if string is defined and not empty it's dominating
+  // externalLink: null, // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.code-of-conduct', // localized string identifier
+    // footerIdent: 'site.code-of-conduct', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.code-of-conduct', // localized string identifier
+    // headTitleIdent: 'site.code-of-conduct', // localized string identifier, if undefined default is used
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
+    // headlineIdent: 'site.code-of-conduct', // localized string identifier, on null it's hidden, if undefined default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const DATA_PRIVACY = defaultPageParamsPages.DATA_PRIVACY.assign({
+const DATA_PRIVACY = defaultPageParamsPages.DATA_PRIVACY.overwrite({
-  externalLink: null, // if string is defined and not empty it's dominating
+  // externalLink: null, // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.data-privacy', // localized string identifier
+    // footerIdent: 'site.data-privacy', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.data-privacy', // localized string identifier
+    // headTitleIdent: 'site.data-privacy', // localized string identifier, if undefined default is used
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
+    // headlineIdent: 'site.data-privacy', // localized string identifier, on null it's hidden, if undefined default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const FAQ = defaultPageParamsPages.FAQ.assign({
+const FAQ = defaultPageParamsPages.FAQ.overwrite({
-  // Wolle externalLink: 'https://ocelot.social',
+  // Wolle externalLink: 'https://ocelot.social', // if string is defined and not empty it's dominating
-  externalLink: null, // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.faq', // localized string identifier
+    // footerIdent: 'site.faq', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.faq', // localized string identifier
+    // headTitleIdent: 'site.faq', // localized string identifier, if undefined default is used
-    // Wolle headlineIdent: '', // on null default is used, on empty string it's hidden
+    // headlineIdent: 'site.faq', // on null default is used, on empty string it's hidden
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
-const SUPPORT = defaultPageParamsPages.SUPPORT.assign({
+const SUPPORT = defaultPageParamsPages.SUPPORT.overwrite({
-  // ATTENTION: has to be defined even for internal page with full URL as example like 'https://staging.ocelot.social/support', because it is used in e-mails as well!
+  // Wolle externalLink: 'https://ocelot.social', // if string is defined and not empty it's dominating
-  // Wolle externalLink: 'https://ocelot.social',
-  externalLink: 'http://localhost:3000/support', // if string is defined and not empty it's dominating
 
-  // in case internal page content is here 'webapp/locales/html/'
   internalPage: {
-    footerIdent: 'site.support', // localized string identifier
+    // footerIdent: 'site.support', // localized string identifier, if undefined default is used
-    headTitleIdent: 'site.support', // localized string identifier
+    // headTitleIdent: 'site.support', // localized string identifier, if undefined default is used
-    // Wolle headlineIdent: '', // on null default is used, on empty string it's hidden
+    // headlineIdent: 'site.support', // on null default is used, on empty string it's hidden
-    headlineIdent: '', // localized string identifier. on null it's hidden, on empty string default is used
     hasContainer: true,
     hasBaseCard: true,
     hasLoginInHeader: true,
+    // in case internal page content is here 'webapp/locales/html/'
   },
 })
 

webapp/locales/html/de/organization.html

@@ -1,29 +1,15 @@
 <!-- this file is replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/locales/html/ -->
 <!-- you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/ -->
 
-<!-- <br> -->
-<!-- <h1 class="h3-headline-big">
-  sender.fm
-</h1> -->
-<!-- <img class="logo" alt="ocelot.social Header" src="/img/custom/logo-horizontal.svg" style="width: 360px;"><br> -->
-<!-- <p class="paragraph">
-  Hier wird sender.fm in Zukunft vorgestellt …
-</p> -->
-<!-- <p class="link">
-  <a href="/login" target="_blank">
-    Zum Login …
-  </a><br>
-</p>
-<br> -->
 <h1 class="h1-headline">
-  Unser Radio-Stream
+  Press Play
 </h1>
 <br>
 <!-- <iframe id="embed_player" frameborder="0" width="280" height="216" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=1"></iframe> -->
 <iframe class="player" id="embed_player" frameborder="0" width="510px" height="396px" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=2"></iframe>
 <br>
 <h3 class="h3-headline">
-  Sende-Wochenplan
+  Sendeplan
 </h3>
 <iframe class="weekly-plan" height="802px" width="550px" scrolling="yes" frameborder="0" src=https://senderfm.airtime.pro/embed/weekly-program></iframe>
 <br>

webapp/locales/html/en/organization.html

@@ -1,29 +1,15 @@
 <!-- this file is replaced on rebranding by https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/locales/html/ -->
 <!-- you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/ -->
 
-<!-- <br> -->
-<!-- <h1 class="h3-headline-big">
-  sender.fm
-</h1> -->
-<!-- <img class="logo" alt="ocelot.social Header" src="/img/custom/logo-horizontal.svg" style="width: 360px;"><br> -->
-<!-- <p class="paragraph">
-  Here sender.fm will be described in the future …
-</p> -->
-<!-- <p class="link">
-  <a href="/login" target="_blank">
-    Login …
-  </a><br>
-</p>
-<br> -->
 <h1 class="h1-headline">
-  Our Radio Stream
+  Press Play
 </h1>
 <br>
 <!-- <iframe id="embed_player" frameborder="0" width="280" height="216" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=1"></iframe> -->
 <iframe class="player" id="embed_player" frameborder="0" width="510px" height="396px" src="https://senderfm.airtime.pro/embed/player?stream=s1&skin=2"></iframe>
 <br>
 <h3 class="h3-headline">
-  Radio Weekly Plan
+  Broadcast Schedule
 </h3>
 <iframe class="weekly-plan" height="802px" width="550px" scrolling="yes" frameborder="0" src=https://senderfm.airtime.pro/embed/weekly-program></iframe>
 <br>

webapp/maintenance/source/pages/index.vue

@@ -8,9 +8,11 @@
         <ds-flex>
           <ds-flex-item :width="{ base: '100%', sm: 1, md: 1 }">
             <ds-space>
-              <a :href="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)" target="_blank">
+              <!-- Wolle -->
+              <a v-if="!links.ORGANIZATION.isInternalPage" :href="links.ORGANIZATION.link" :title="$t('login.moreInfo', metadata)" target="_blank">
                 <img class="image" alt="Under maintenance" src="/img/custom/logo-squared.svg" />
               </a>
+              <img v-else class="image" alt="Under maintenance" src="/img/custom/logo-squared.svg" :title="$t('login.moreInfo', metadata)" />
             </ds-space>
           </ds-flex-item>
           <ds-flex-item :width="{ base: '100%', sm: 1, md: 1 }">
@@ -45,7 +47,7 @@ export default {
     LocaleSwitch,
   },
   data() {
-    return { links, metadata, supportEmail: emails.SUPPORT }
+    return { links, metadata, supportEmail: emails.SUPPORT_EMAIL }
   },
 }
 </script>

webapp/pages/donate.vue

@@ -14,5 +14,10 @@ export default {
   data() {
     return { links }
   },
+  created() {
+    if (!this.links.DONATE.isInternalPage) {
+      window.location.href = this.links.DONATE.externalLink
+    }
+  },
 }
 </script>

webapp/pages/index.vue

@@ -5,11 +5,9 @@
         <hashtags-filter :hashtag="hashtag" @clearSearch="clearSearch" />
       </ds-grid-item>
       <ds-grid-item :row-span="2" column-span="fullWidth" class="top-info-bar">
-        <!--<donation-info /> -->
+        <!-- <donation-info /> -->
         <div>
-          <a target="_blank" :href="links.DONATE">
+          <base-button filled @click="redirectToPage(links.DONATE)">{{ $t('donations.donate-now') }}</base-button>
-            <base-button filled>{{ $t('donations.donate-now') }}</base-button>
-          </a>
         </div>
         <div class="sorting-dropdown">
           <ds-select
@@ -172,6 +170,9 @@ export default {
       this.resetPostList()
       this.$apollo.queries.Post.refetch()
     },
+    redirectToPage(pageParams) {
+      pageParams.redirectToPage(this)
+    },
   },
   apollo: {
     Post: {

webapp/pages/password-reset.vue

@@ -2,9 +2,9 @@
   <ds-container width="small" class="password-reset">
     <base-card>
       <template #imageColumn>
-        <a :href="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)" target="_blank">
+        <page-params-link :pageParams="links.ORGANIZATION" :title="$t('login.moreInfo', metadata)">
           <logo logoType="passwordReset" />
-        </a>
+        </page-params-link>
       </template>
       <nuxt-child />
       <template #topMenu>
@@ -19,11 +19,13 @@ import links from '~/constants/links.js'
 import metadata from '~/constants/metadata.js'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
 import Logo from '~/components/Logo/Logo'
+import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
 
 export default {
   components: {
     LocaleSwitch,
     Logo,
+    PageParamsLink,
   },
   layout: 'no-header',
   data() {

webapp/pages/post/_id/_slug/index.vue

@@ -80,7 +80,9 @@
           {{ $t('settings.blocked-users.explanation.commenting-disabled') }}
           <br />
           {{ $t('settings.blocked-users.explanation.commenting-explanation') }}
-          <a :href="links.FAQ" target="_blank">FAQ</a>
+          <page-params-link :pageParams="links.FAQ">
+            {{ $t('site.faq') }}
+          </page-params-link>
         </ds-placeholder>
       </ds-section>
     </base-card>
@@ -95,6 +97,7 @@ import UserTeaser from '~/components/UserTeaser/UserTeaser'
 import HcShoutButton from '~/components/ShoutButton.vue'
 import CommentForm from '~/components/CommentForm/CommentForm'
 import CommentList from '~/components/CommentList/CommentList'
+import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
 import {
   postMenuModalsData,
   deletePostMutation,
@@ -111,13 +114,14 @@ export default {
     mode: 'out-in',
   },
   components: {
-    HcHashtag,
-    UserTeaser,
-    HcShoutButton,
     ContentMenu,
     CommentForm,
     CommentList,
     ContentViewer,
+    HcHashtag,
+    HcShoutButton,
+    PageParamsLink,
+    UserTeaser,
   },
   head() {
     return {

webapp/pages/settings/my-email-address/verify.vue

@@ -60,7 +60,7 @@ export default {
   },
   data() {
     return {
-      supportEmail: emails.SUPPORT,
+      supportEmail: emails.SUPPORT_EMAIL,
     }
   },
   async asyncData(context) {