From 393a05c358b5a8066bdaae22a85c6a3c122fa779 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Tue, 2 Mar 2021 12:33:47 +0100
Subject: [PATCH] Implement 'no-public-registration' slider

---
 .../ComponentSlider/ComponentSlider.vue       |  2 +-
 .../Registration/RegistrationSlideCreate.vue  |  1 +
 .../Registration/RegistrationSlideEmail.vue   |  1 +
 .../Registration/RegistrationSlideInvite.vue  |  1 +
 .../RegistrationSlideNoPublic.vue             | 35 ++++++++++
 .../Registration/RegistrationSlideNonce.vue   |  2 +-
 .../Registration/RegistrationSlider.story.js  |  8 +++
 .../Registration/RegistrationSlider.vue       | 66 ++++++++++++-------
 webapp/middleware/authenticated.js            |  2 +-
 webapp/pages/registration.vue                 |  7 +-
 10 files changed, 96 insertions(+), 29 deletions(-)
 create mode 100644 webapp/components/Registration/RegistrationSlideNoPublic.vue

diff --git a/webapp/components/ComponentSlider/ComponentSlider.vue b/webapp/components/ComponentSlider/ComponentSlider.vue
index 9ecaa5711..483c46dbf 100644
--- a/webapp/components/ComponentSlider/ComponentSlider.vue
+++ b/webapp/components/ComponentSlider/ComponentSlider.vue
@@ -9,7 +9,7 @@
     <slot :name="sliderData.sliders[sliderIndex].name" />
 
     <ds-flex>
-      <ds-flex-item :centered="true">
+      <ds-flex-item v-if="sliderData.sliders.length > 1" :centered="true">
         <div
           v-for="(slider, index) in sliderData.sliders"
           :key="slider.name"
diff --git a/webapp/components/Registration/RegistrationSlideCreate.vue b/webapp/components/Registration/RegistrationSlideCreate.vue
index 160bec536..532bf0bc1 100644
--- a/webapp/components/Registration/RegistrationSlideCreate.vue
+++ b/webapp/components/Registration/RegistrationSlideCreate.vue
@@ -180,6 +180,7 @@ export default {
   mounted: function () {
     this.$nextTick(function () {
       // Code that will run only after the entire view has been rendered
+
       this.formData.name = this.sliderData.collectedInputData.name
         ? this.sliderData.collectedInputData.name
         : ''
diff --git a/webapp/components/Registration/RegistrationSlideEmail.vue b/webapp/components/Registration/RegistrationSlideEmail.vue
index efd803326..4c190f64e 100644
--- a/webapp/components/Registration/RegistrationSlideEmail.vue
+++ b/webapp/components/Registration/RegistrationSlideEmail.vue
@@ -115,6 +115,7 @@ export default {
   mounted: function () {
     this.$nextTick(function () {
       // Code that will run only after the entire view has been rendered
+
       this.formData.email = this.sliderData.collectedInputData.email
         ? this.sliderData.collectedInputData.email
         : ''
diff --git a/webapp/components/Registration/RegistrationSlideInvite.vue b/webapp/components/Registration/RegistrationSlideInvite.vue
index 25370fc95..d3879ac4d 100644
--- a/webapp/components/Registration/RegistrationSlideInvite.vue
+++ b/webapp/components/Registration/RegistrationSlideInvite.vue
@@ -53,6 +53,7 @@ export default {
   mounted: function () {
     this.$nextTick(function () {
       // Code that will run only after the entire view has been rendered
+
       this.formData.inviteCode = this.sliderData.collectedInputData.inviteCode
         ? this.sliderData.collectedInputData.inviteCode
         : ''
diff --git a/webapp/components/Registration/RegistrationSlideNoPublic.vue b/webapp/components/Registration/RegistrationSlideNoPublic.vue
new file mode 100644
index 000000000..1d26cc8e2
--- /dev/null
+++ b/webapp/components/Registration/RegistrationSlideNoPublic.vue
@@ -0,0 +1,35 @@
+<template>
+  <ds-space centered>
+    <hc-empty icon="events" :message="$t('components.registration.signup.unavailable')" />
+    <slot></slot>
+  </ds-space>
+</template>
+
+<script>
+import HcEmpty from '~/components/Empty/Empty'
+
+export default {
+  name: 'RegistrationSlideNoPublic',
+  components: {
+    HcEmpty,
+  },
+  props: {
+    sliderData: { type: Object, required: true },
+  },
+  mounted: function () {
+    this.$nextTick(function () {
+      // Code that will run only after the entire view has been rendered
+
+      this.sliderData.setSliderValuesCallback(true, {
+        sliderSettings: { buttonSliderCallback: this.onNextClick },
+      })
+    })
+  },
+  methods: {
+    onNextClick() {
+      this.$router.history.push('/login')
+      return true
+    },
+  },
+}
+</script>
diff --git a/webapp/components/Registration/RegistrationSlideNonce.vue b/webapp/components/Registration/RegistrationSlideNonce.vue
index 5b619641e..bb01263bd 100644
--- a/webapp/components/Registration/RegistrationSlideNonce.vue
+++ b/webapp/components/Registration/RegistrationSlideNonce.vue
@@ -52,7 +52,7 @@ export default {
   mounted: function () {
     this.$nextTick(function () {
       // Code that will run only after the entire view has been rendered
-      // console.log('mounted !!! ')
+
       this.formData.nonce = this.sliderData.collectedInputData.nonce
         ? this.sliderData.collectedInputData.nonce
         : ''
diff --git a/webapp/components/Registration/RegistrationSlider.story.js b/webapp/components/Registration/RegistrationSlider.story.js
index 65555dfb0..a801000eb 100644
--- a/webapp/components/Registration/RegistrationSlider.story.js
+++ b/webapp/components/Registration/RegistrationSlider.story.js
@@ -158,3 +158,11 @@ storiesOf('RegistrationSlider', module)
       <registration-slider registrationType="invite-mail" :overwriteSliderData="overwriteSliderData" />
     `,
   }))
+  .add('no-public-registration', () => ({
+    components: { RegistrationSlider },
+    store: helpers.store,
+    data: () => ({}),
+    template: `
+      <registration-slider registrationType="no-public-registration" />
+    `,
+  }))
diff --git a/webapp/components/Registration/RegistrationSlider.vue b/webapp/components/Registration/RegistrationSlider.vue
index 5b57c167c..c10cc93e6 100644
--- a/webapp/components/Registration/RegistrationSlider.vue
+++ b/webapp/components/Registration/RegistrationSlider.vue
@@ -14,23 +14,19 @@
           </ds-heading>
         </template>
 
-        <template v-if="['invite-code'].includes(registrationType)" #enter-invite>
+        <template #no-public-registration>
+          <registration-slide-no-public :sliderData="sliderData" />
+        </template>
+
+        <template #enter-invite>
           <registration-slide-invite :sliderData="sliderData" />
         </template>
 
-        <template
-          v-if="['invite-code', 'public-registration'].includes(registrationType)"
-          #enter-email
-        >
-          <!-- Wolle !!! may create same source with 'webapp/pages/registration/signup.vue' -->
-          <!-- <signup v-if="publicRegistration" :invitation="false" @submit="handleSubmitted"> -->
+        <template #enter-email>
           <registration-slide-email :sliderData="sliderData" :invitation="false" />
         </template>
 
-        <template
-          v-if="['invite-code', 'public-registration', 'invite-mail'].includes(registrationType)"
-          #enter-nonce
-        >
+        <template #enter-nonce>
           <registration-slide-nonce :sliderData="sliderData" />
         </template>
 
@@ -38,7 +34,7 @@
           <registration-slide-create :sliderData="sliderData" />
         </template>
 
-        <template #footer>
+        <template v-if="registrationType !== 'no-public-registration'" #footer>
           <ds-space margin-bottom="xxx-small" margin-top="small" centered>
             <nuxt-link to="/login">{{ $t('site.back-to-login') }}</nuxt-link>
           </ds-space>
@@ -61,6 +57,7 @@ import RegistrationSlideCreate from './RegistrationSlideCreate'
 import RegistrationSlideEmail from '~/components/Registration/RegistrationSlideEmail'
 import RegistrationSlideInvite from './RegistrationSlideInvite'
 import RegistrationSlideNonce from './RegistrationSlideNonce'
+import RegistrationSlideNoPublic from './RegistrationSlideNoPublic'
 
 export default {
   name: 'RegistrationSlider',
@@ -71,14 +68,28 @@ export default {
     RegistrationSlideEmail,
     RegistrationSlideInvite,
     RegistrationSlideNonce,
+    RegistrationSlideNoPublic,
   },
   props: {
     registrationType: { type: String, required: true },
     overwriteSliderData: { type: Object, default: () => {} },
   },
   data() {
-    const slidersPortfolio = [
-      {
+    const slidersPortfolio = {
+      noPublicRegistration: {
+        name: 'no-public-registration',
+        // title: this.$t('components.registration.create-user-account.title'),
+        title: 'No Public Registration', // Wolle
+        validated: false,
+        data: { request: null, response: null },
+        button: {
+          title: this.$t('site.back-to-login'), // Wolle
+          icon: 'arrow-right',
+          callback: this.buttonCallback,
+          sliderCallback: null, // optional set by slot
+        },
+      },
+      enterInvite: {
         name: 'enter-invite',
         // title: this.$t('components.registration.create-user-account.title'),
         title: 'Invitation', // Wolle
@@ -91,7 +102,7 @@ export default {
           sliderCallback: null, // optional set by slot
         },
       },
-      {
+      enterEmail: {
         name: 'enter-email',
         title: 'E-Mail', // Wolle
         validated: false,
@@ -103,7 +114,7 @@ export default {
           sliderCallback: null, // optional set by slot
         },
       },
-      {
+      enterNonce: {
         name: 'enter-nonce',
         title: 'E-Mail Confirmation', // Wolle
         validated: false,
@@ -115,7 +126,7 @@ export default {
           sliderCallback: null, // optional set by slot
         },
       },
-      {
+      createUserAccount: {
         name: 'create-user-account',
         title: this.$t('components.registration.create-user-account.title'),
         validated: false,
@@ -128,22 +139,29 @@ export default {
           sliderCallback: null, // optional set by slot
         },
       },
-    ]
+    }
     let sliders = []
     switch (this.registrationType) {
+      case 'no-public-registration':
+        sliders = [slidersPortfolio.noPublicRegistration]
+        break
       case 'invite-code':
         sliders = [
-          slidersPortfolio[0],
-          slidersPortfolio[1],
-          slidersPortfolio[2],
-          slidersPortfolio[3],
+          slidersPortfolio.enterInvite,
+          slidersPortfolio.enterEmail,
+          slidersPortfolio.enterNonce,
+          slidersPortfolio.createUserAccount,
         ]
         break
       case 'public-registration':
-        sliders = [slidersPortfolio[1], slidersPortfolio[2], slidersPortfolio[3]]
+        sliders = [
+          slidersPortfolio.enterEmail,
+          slidersPortfolio.enterNonce,
+          slidersPortfolio.createUserAccount,
+        ]
         break
       case 'invite-mail':
-        sliders = [slidersPortfolio[2], slidersPortfolio[3]]
+        sliders = [slidersPortfolio.enterNonce, slidersPortfolio.createUserAccount]
         break
     }
 
diff --git a/webapp/middleware/authenticated.js b/webapp/middleware/authenticated.js
index e9417963b..9ec15dd29 100644
--- a/webapp/middleware/authenticated.js
+++ b/webapp/middleware/authenticated.js
@@ -22,5 +22,5 @@ export default async ({ store, env, route, redirect }) => {
     params.path = route.path
   }
 
-  return redirect('/registration/signup', params)
+  return redirect('/registration/signup', params) // Wolle
 }
diff --git a/webapp/pages/registration.vue b/webapp/pages/registration.vue
index b6c3334dd..216d4aa4d 100644
--- a/webapp/pages/registration.vue
+++ b/webapp/pages/registration.vue
@@ -43,7 +43,10 @@ export default {
       },
     }
   },
-  asyncData({ app }) {
+  asyncData({ app, store, redirect }) {
+    if (store.getters['auth/isLoggedIn']) {
+      redirect('/')
+    }
     return {
       publicRegistration: app.$env.PUBLIC_REGISTRATION === 'true',
       inviteRegistration: app.$env.INVITE_REGISTRATION === 'true',
@@ -54,7 +57,7 @@ export default {
       if (this.method && ['invite-code', 'invite-mail'].includes(this.method)) {
         return this.method
       }
-      return this.publicRegistration ? 'public-registration' : false
+      return this.publicRegistration ? 'public-registration' : 'no-public-registration'
     },
   },
 }