Implement HTML internal support and organization pages

backend/src/config/links.js

@@ -1,11 +1,11 @@
-// this file is duplicated in `backend/src/config/links.js` and `webapp/constants/links.js` and replaced on rebranding
+// 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 {
-  LANDING_PAGE: '/login', // examples: '/login', '/registration'
-  ORGANIZATION: 'https://ocelot.social',
-  SUPPORT: 'https://ocelot.social',
-
+  LANDING_PAGE: '/login', // examples: '/login', '/registration', '/organization'
+  SUPPORT: 'https://ocelot.social', // example for internal support page: 'https://staging.ocelot.social/support'
+  
   // on null or empty strings internal pages are used, see 'webapp/locales/html/'
   //   you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/
+  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,

webapp/components/PageFooter/PageFooter.spec.js

@@ -47,12 +47,8 @@ describe('PageFooter.vue', () => {
         wrapper = Wrapper()
       })
 
-      it('renders ORGANIZATION', () => {
-        expect(wrapper.find('a[data-test="organization-link"]').exists()).toBe(true)
-      })
-
       it('renders version', () => {
-        expect(wrapper.find('a[data-test="version-link"]').exists()).toBe(true)
+        expect(wrapper.find('a[data-test="version-link"]').exists()).toBeTruthy()
       })
     })
 
@@ -60,6 +56,7 @@ describe('PageFooter.vue', () => {
       beforeEach(async () => {
         const links = {
           ...linksDefault,
+          ORGANIZATION: null,
           IMPRINT: null,
           TERMS_AND_CONDITIONS: null,
           CODE_OF_CONDUCT: null,
@@ -71,24 +68,28 @@ describe('PageFooter.vue', () => {
         await wrapper.vm.$nextTick()
       })
 
+      it('renders ORGANIZATION as nuxt-link', () => {
+        expect(wrapper.find('span[data-test="organization-nuxt-link"]').exists()).toBeTruthy()
+      })
+
       it('renders IMPRINT as nuxt-link', () => {
-        expect(wrapper.find('span[data-test="imprint-nuxt-link"]').exists()).toBe(true)
+        expect(wrapper.find('span[data-test="imprint-nuxt-link"]').exists()).toBeTruthy()
       })
 
       it('renders TERMS_AND_CONDITIONS as nuxt-link', () => {
-        expect(wrapper.find('span[data-test="terms-nuxt-link"]').exists()).toBe(true)
+        expect(wrapper.find('span[data-test="terms-nuxt-link"]').exists()).toBeTruthy()
       })
 
       it('renders CODE_OF_CONDUCT as nuxt-link', () => {
-        expect(wrapper.find('span[data-test="code-nuxt-link"]').exists()).toBe(true)
+        expect(wrapper.find('span[data-test="code-nuxt-link"]').exists()).toBeTruthy()
       })
 
       it('renders DATA_PRIVACY as nuxt-link', () => {
-        expect(wrapper.find('span[data-test="data-nuxt-link"]').exists()).toBe(true)
+        expect(wrapper.find('span[data-test="data-nuxt-link"]').exists()).toBeTruthy()
       })
 
       it('renders FAQ as nuxt-link', () => {
-        expect(wrapper.find('span[data-test="faq-nuxt-link"]').exists()).toBe(true)
+        expect(wrapper.find('span[data-test="faq-nuxt-link"]').exists()).toBeTruthy()
       })
     })
 
@@ -96,6 +97,7 @@ describe('PageFooter.vue', () => {
       beforeEach(async () => {
         const links = {
           ...linksDefault,
+          ORGANIZATION: 'https://ocelot.social',
           IMPRINT: 'https://ocelot.social/IMPRINT',
           TERMS_AND_CONDITIONS: 'https://ocelot.social/TERMS_AND_CONDITIONS',
           CODE_OF_CONDUCT: 'https://ocelot.social/CODE_OF_CONDUCT',
@@ -107,26 +109,28 @@ describe('PageFooter.vue', () => {
         await wrapper.vm.$nextTick()
       })
 
+      it('renders ORGANIZATION as "a" tag link', () => {
+        expect(wrapper.find(`a[href="https://ocelot.social"]`).exists()).toBeTruthy()
+      })
+
       it('renders IMPRINT as "a" tag link', () => {
-        expect(wrapper.find(`a[href="https://ocelot.social/IMPRINT"]`).exists()).toBe(true)
+        expect(wrapper.find(`a[href="https://ocelot.social/IMPRINT"]`).exists()).toBeTruthy()
       })
 
       it('renders TERMS_AND_CONDITIONS as "a" tag link', () => {
-        expect(wrapper.find(`a[href="https://ocelot.social/TERMS_AND_CONDITIONS"]`).exists()).toBe(
-          true,
-        )
+        expect(wrapper.find(`a[href="https://ocelot.social/TERMS_AND_CONDITIONS"]`).exists()).toBeTruthy()
       })
 
       it('renders CODE_OF_CONDUCT as "a" tag link', () => {
-        expect(wrapper.find(`a[href="https://ocelot.social/CODE_OF_CONDUCT"]`).exists()).toBe(true)
+        expect(wrapper.find(`a[href="https://ocelot.social/CODE_OF_CONDUCT"]`).exists()).toBeTruthy()
       })
 
       it('renders DATA_PRIVACY as "a" tag link', () => {
-        expect(wrapper.find(`a[href="https://ocelot.social/DATA_PRIVACY"]`).exists()).toBe(true)
+        expect(wrapper.find(`a[href="https://ocelot.social/DATA_PRIVACY"]`).exists()).toBeTruthy()
       })
 
       it('renders FAQ as "a" tag link', () => {
-        expect(wrapper.find(`a[href="https://ocelot.social/FAQ"]`).exists()).toBe(true)
+        expect(wrapper.find(`a[href="https://ocelot.social/FAQ"]`).exists()).toBeTruthy()
       })
     })
   })

webapp/components/PageFooter/PageFooter.vue

@@ -1,7 +1,10 @@
 <template>
   <div id="footer" class="ds-footer">
     <!-- made with ❤️ -->
-    <a :href="links.ORGANIZATION" target="_blank" data-test="organization-link">
+    <nuxt-link v-if="noLinkDefined(links.ORGANIZATION)" to="/organization" data-test="organization-nuxt-link">
+      {{ $t('site.made') }}
+    </nuxt-link>
+    <a v-else :href="links.ORGANIZATION" target="_blank" data-test="organization-link">
       {{ $t('site.made') }}
     </a>
     <span>-</span>

webapp/constants/links.js

@@ -1,11 +1,11 @@
-// this file is duplicated in `backend/src/config/links.js` and `webapp/constants/links.js` and replaced on rebranding
+// 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 {
-  LANDING_PAGE: '/login', // examples: '/login', '/registration'
-  ORGANIZATION: 'https://ocelot.social',
-  SUPPORT: 'https://ocelot.social',
-
+  LANDING_PAGE: '/login', // examples: '/login', '/registration', '/organization'
+  SUPPORT: 'https://ocelot.social', // example for internal support page: 'https://staging.ocelot.social/support'
+  
   // on null or empty strings internal pages are used, see 'webapp/locales/html/'
   //   you can find and store templates at https://github.com/Ocelot-Social-Community/Ocelot-Social-Deploy-Rebranding/tree/master/branding/templates/
+  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,

webapp/locales/de.json

@@ -788,6 +788,7 @@
     "made": "Mit ❤️ gemacht",
     "register": "Registernummer",
     "responsible": "Verantwortlich für Inhalte dieser Seite (§ 55 Abs. 2 RStV)",
+    "support": "Support",
     "taxident": "Umsatzsteuer-Identifikationsnummer gemäß § 27 a Umsatzsteuergesetz (Deutschland)",
     "termsAndConditions": "Nutzungsbedingungen",
     "thanks": "Danke!",

webapp/locales/en.json

@@ -788,6 +788,7 @@
     "made": "Made with ❤️",
     "register": "Registry number",
     "responsible": "responsible for contents of this page (§ 55 Abs. 2 RStV)",
+    "support": "Support",
     "taxident": "USt-ID. according to §27a of the German Sales Tax Law:",
     "termsAndConditions": "Terms and conditions",
     "thanks": "Thanks!",

webapp/locales/html/de/index.js

@@ -1,3 +1,5 @@
+import organization from './organization.html'
+import support from './support.html'
 import termsAndConditions from './terms-and-conditions.html'
 import codeOfConduct from './code-of-conduct.html'
 import dataPrivacy from './data-privacy.html'
@@ -5,6 +7,8 @@ import faq from './faq.html'
 import imprint from './imprint.html'
 
 export default {
+  organization,
+  support,
   termsAndConditions,
   codeOfConduct,
   dataPrivacy,

webapp/locales/html/de/organization.html

@@ -0,0 +1,5 @@
+<!-- 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>
+<p>Hier wird das Netzwerk beschrieben.</p>

webapp/locales/html/de/support.html

@@ -0,0 +1,5 @@
+<!-- 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>
+<p>Ich bin der Inhalt vom Support.</p>

webapp/locales/html/en/index.js

@@ -1,3 +1,5 @@
+import organization from './organization.html'
+import support from './support.html'
 import termsAndConditions from './terms-and-conditions.html'
 import codeOfConduct from './code-of-conduct.html'
 import dataPrivacy from './data-privacy.html'
@@ -5,6 +7,8 @@ import faq from './faq.html'
 import imprint from './imprint.html'
 
 export default {
+  organization,
+  support,
   termsAndConditions,
   codeOfConduct,
   dataPrivacy,

webapp/locales/html/en/organization.html

@@ -0,0 +1,5 @@
+<!-- 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>
+<p>Here the network is described.</p>

webapp/locales/html/en/support.html

@@ -0,0 +1,5 @@
+<!-- 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>
+<p>I am the content of the support.</p>

webapp/nuxt.config.js

@@ -37,6 +37,8 @@ export default {
       'password-reset-change-password',
       'registration',
       'pages-slug',
+      'organization',
+      'support',
       'terms-and-conditions',
       'code-of-conduct',
       'changelog',

webapp/pages/organization.spec.js

@@ -0,0 +1,38 @@
+import { mount } from '@vue/test-utils'
+import Organization from './organization.vue'
+import VueMeta from 'vue-meta'
+
+const localVue = global.localVue
+localVue.use(VueMeta, { keyName: 'head' })
+
+describe('organization.vue', () => {
+  let wrapper
+  let mocks
+
+  beforeEach(() => {
+    mocks = {
+      $t: (t) => t,
+    }
+  })
+
+  describe('mount', () => {
+    const Wrapper = () => {
+      return mount(Organization, {
+        mocks,
+        localVue,
+      })
+    }
+
+    beforeEach(() => {
+      wrapper = Wrapper()
+    })
+
+    it('renders', () => {
+      expect(wrapper.is('div')).toBe(true)
+    })
+
+    it('has correct <head> content', () => {
+      expect(wrapper.vm.$metaInfo.title).toBe('site.made')
+    })
+  })
+})

webapp/pages/organization.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <ds-space margin="small">
+      <ds-heading tag="h2">{{ $t('site.made') }}</ds-heading>
+    </ds-space>
+    <ds-container>
+      <div v-html="$t('html.organization')" />
+    </ds-container>
+  </div>
+</template>
+
+<script>
+export default {
+  layout: 'basic',
+  head() {
+    return {
+      title: this.$t('site.made'),
+    }
+  },
+}
+</script>

webapp/pages/support.spec.js

@@ -0,0 +1,38 @@
+import { mount } from '@vue/test-utils'
+import Support from './support.vue'
+import VueMeta from 'vue-meta'
+
+const localVue = global.localVue
+localVue.use(VueMeta, { keyName: 'head' })
+
+describe('support.vue', () => {
+  let wrapper
+  let mocks
+
+  beforeEach(() => {
+    mocks = {
+      $t: (t) => t,
+    }
+  })
+
+  describe('mount', () => {
+    const Wrapper = () => {
+      return mount(Support, {
+        mocks,
+        localVue,
+      })
+    }
+
+    beforeEach(() => {
+      wrapper = Wrapper()
+    })
+
+    it('renders', () => {
+      expect(wrapper.is('div')).toBe(true)
+    })
+
+    it('has correct <head> content', () => {
+      expect(wrapper.vm.$metaInfo.title).toBe('site.support')
+    })
+  })
+})

webapp/pages/support.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <ds-space margin="small">
+      <ds-heading tag="h2">{{ $t('site.support') }}</ds-heading>
+    </ds-space>
+    <ds-container>
+      <div v-html="$t('html.support')" />
+    </ds-container>
+  </div>
+</template>
+
+<script>
+export default {
+  layout: 'basic',
+  head() {
+    return {
+      title: this.$t('site.support'),
+    }
+  },
+}
+</script>