Implement 'no-public-registration' slider

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"

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
         : ''

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
         : ''

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
         : ''

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>

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
         : ''

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" />
+    `,
+  }))

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
+        <template #enter-email>
-          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"> -->
           <registration-slide-email :sliderData="sliderData" :invitation="false" />
         </template>
 
-        <template
+        <template #enter-nonce>
-          v-if="['invite-code', 'public-registration', 'invite-mail'].includes(registrationType)"
-          #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.enterInvite,
-          slidersPortfolio[1],
+          slidersPortfolio.enterEmail,
-          slidersPortfolio[2],
+          slidersPortfolio.enterNonce,
-          slidersPortfolio[3],
+          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
     }
 

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
 }

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'
     },
   },
 }