Merge branch 'improve-registration-page' into 'master'

Improve registration page and add a rules option

See merge request framasoft/mobilizon!467

js/src/graphql/admin.ts

@@ -111,6 +111,7 @@ export const ADMIN_SETTINGS_FRAGMENT = gql`
     instanceTerms
     instanceTermsType
     instanceTermsUrl
+    instanceRules
     registrationsOpen
   }
 `;
@@ -131,6 +132,7 @@ export const SAVE_ADMIN_SETTINGS = gql`
     $instanceTerms: String
     $instanceTermsType: InstanceTermsType
     $instanceTermsUrl: String
+    $instanceRules: String
     $registrationsOpen: Boolean
   ) {
     saveAdminSettings(
@@ -139,6 +141,7 @@ export const SAVE_ADMIN_SETTINGS = gql`
       instanceTerms: $instanceTerms
       instanceTermsType: $instanceTermsType
       instanceTermsUrl: $instanceTermsUrl
+      instanceRules: $instanceRules
       registrationsOpen: $registrationsOpen
     ) {
       ...adminSettingsFragment

js/src/graphql/config.ts

@@ -78,6 +78,14 @@ export const TERMS = gql`
   }
 `;
 
+export const RULES = gql`
+  query Rules {
+    config {
+      rules
+    }
+  }
+`;
+
 export const TIMEZONES = gql`
   query {
     config {

js/src/i18n/be.json

@@ -27,7 +27,7 @@
   "Are you sure you want to cancel your participation at event \"{title}\"?": "Вы сапраўды хочаце адмовіцца ад удзелу ў падзеі «{title}»?",
   "Are you sure you want to delete this event? This action cannot be reverted.": "Вы сапраўды хочаце выдаліць гэту падзею? Гэта дзеянне нельга адмяніць.",
   "Avatar": "Аватар",
-  "Before you can login, you need to click on the link inside it to validate your account": "Каб увайсці з уліковым запісам, патрэбна спачатку перайсці па спасылцы, якая прыйшла вам у лісце",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Каб увайсці з уліковым запісам, патрэбна спачатку перайсці па спасылцы, якая прыйшла вам у лісце.",
   "By @{username}": "Ад @{username}",
   "Cancel": "Адмяніць",
   "Cancel creation": "Адмяніць стварэнне",

js/src/i18n/ca.json

@@ -37,7 +37,7 @@
   "Are you sure you want to delete this event? This action cannot be reverted.": "Segur que vols esborrar aquesta activitat? Aquesta acció és irreversible.",
   "Avatar": "Avatar",
   "Back to previous page": "Tornar a la pàgina anterior",
-  "Before you can login, you need to click on the link inside it to validate your account": "Per a validar el compte i poder entrar, has de clicar l'enllaç que t'hem enviat en el mail",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Per a validar el compte i poder entrar, has de clicar l'enllaç que t'hem enviat en el mail.",
   "By @{username}": "De @{username}",
   "Cancel": "Canceŀla",
   "Cancel anonymous participation": "Cancelar la participació anònima",

js/src/i18n/de.json

@@ -34,7 +34,7 @@
   "Are you sure you want to delete this event? This action cannot be reverted.": "Bist Du dir sicher, dass Du diese Veranstaltung löschen möchtest? Dies kann nicht rückgängig gemacht werden.",
   "Avatar": "Profilbild",
   "Back to previous page": "Zurück zur vorherigen Seite",
-  "Before you can login, you need to click on the link inside it to validate your account": "Bevor Du dich einloggen kannst, musst Du den Link anklicken, um deinen Account zu überprüfen.",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Bevor Du dich einloggen kannst, musst Du den Link anklicken, um deinen Account zu überprüfen.",
   "By @{username}": "Nach @{username}",
   "Cancel": "Abbrechen",
   "Cancel creation": "Erstellung abbrechen",
@@ -415,4 +415,4 @@
   "{license} guarantees {respect} of the people who will use it. Since {source}, anyone can audit it, which guarantees its transparency.": "{license} garantiert den {respect} der Leute die es Nutzen. Da {sources}, kann jeder ihn einsehen und analysieren, was Tranzparenz verspricht.",
   "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks": "© Das Mobilizon Team {date} - Entwickelt mit Elixir, Phoenix, VueJS & viel liebe und viel Zeit",
   "© The OpenStreetMap Contributors": "© OpenStreetMap-Mitwirkende"
-}
+}

js/src/i18n/en_US.json

@@ -36,7 +36,7 @@
   "Are you sure you want to delete this event? This action cannot be reverted.": "Are you sure you want to delete this event? This action cannot be reverted.",
   "Avatar": "Avatar",
   "Back to previous page": "Back to previous page",
-  "Before you can login, you need to click on the link inside it to validate your account": "Before you can login, you need to click on the link inside it to validate your account",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Before you can login, you need to click on the link inside it to validate your account.",
   "By @{username}": "By @{username}",
   "By {username} and {group}": "By {username} and {group}",
   "Cancel anonymous participation": "Cancel anonymous participation",
@@ -119,7 +119,6 @@
   "Either the participation has already been validated, either the validation token is incorrect.": "Either the participation has already been validated, either the validation token is incorrect.",
   "Email": "Email",
   "Ends on…": "Ends on…",
-  "Enjoy discovering Mobilizon!": "Enjoy discovering Mobilizon!",
   "Enter the link URL": "Enter the link URL",
   "Enter your own terms. HTML tags allowed. Mobilizon.org's terms are provided as template.": "Enter your own terms. HTML tags allowed. Mobilizon.org's terms are provided as template.",
   "Error while changing email": "Error while changing email",
@@ -289,7 +288,6 @@
   "Please contact this instance's Mobilizon admin if you think this is a mistake.": "Please contact this instance's Mobilizon admin if you think this is a mistake.",
   "Please enter your password to confirm this action.": "Please enter your password to confirm this action.",
   "Please make sure the address is correct and that the page hasn't been moved.": "Please make sure the address is correct and that the page hasn't been moved.",
-  "Please read the full rules": "Please read the full rules",
   "Please refresh the page and retry.": "Please refresh the page and retry.",
   "Post a comment": "Post a comment",
   "Post a reply": "Post a reply",
@@ -461,7 +459,6 @@
   "Your email is not whitelisted, you can't register.": "Your email is not whitelisted, you can't register.",
   "Your email will only be used to confirm that you're a real person and send you eventual updates for this event. It will NOT be transmitted to other instances or to the event organizer.": "Your email will only be used to confirm that you're a real person and send you eventual updates for this event. It will NOT be transmitted to other instances or to the event organizer.",
   "Your federated identity": "Your federated identity",
-  "Your local administrator resumed its policy:": "Your local administrator resumed its policy:",
   "Your participation has been confirmed": "Your participation has been confirmed",
   "Your participation has been rejected": "Your participation has been rejected",
   "Your participation has been requested": "Your participation has been requested",
@@ -627,5 +624,22 @@
   "Participations": "Participations",
   "Nothing to see here": "Nothing to see here",
   "Not confirmed": "Not confirmed",
-  "{actor} suspended profile {profile}": "{actor} suspended profile {profile}"
+  "{actor} suspended profile {profile}": "{actor} suspended profile {profile}",
+  "Suspend": "Suspend",
+  "Unsuspend": "Unsuspend",
+  "None": "None",
+  "Disabled": "Disabled",
+  "Activated": "Activated",
+  "No profile matches the filters": "No profile matches the filters",
+  "Mobilizon": "Mobilizon",
+  "{instanceName} is an instance of the {mobilizon} software.": "{instanceName} is an instance of the {mobilizon} software.",
+  "Instance Rules": "Instance Rules",
+  "Rules": "Rules",
+  "No rules defined yet.": "No rules defined yet.",
+  "full rules": "full rules",
+  "instance rules": "instance rules",
+  "terms of service": "terms of service",
+  "Please read the instance's {fullRules}": "Please read the instance's {fullRules}",
+  "I agree to the {instanceRules} and {termsOfService}": "I agree to the {instanceRules} and {termsOfService}",
+  "This email is already used.": "This email is already used."
 }

js/src/i18n/fi.json

@@ -37,7 +37,7 @@
   "Are you sure you want to delete this event? This action cannot be reverted.": "Haluatko varmasti poistaa tämän tapahtuman? Toimintoa ei voi perua.",
   "Avatar": "Avatar",
   "Back to previous page": "Palaa edelliselle sivulle",
-  "Before you can login, you need to click on the link inside it to validate your account": "Sinun on ennen sisäänkirjautumista vahvistettava tilisi napsauttamalla siinä olevaa linkkiä",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Sinun on ennen sisäänkirjautumista vahvistettava tilisi napsauttamalla siinä olevaa linkkiä.",
   "By @{username}": "Tehnyt @{username}",
   "Cancel": "Peruuta",
   "Cancel anonymous participation": "Peruuta anonyymi osallistuminen",

js/src/i18n/fr_FR.json

@@ -47,7 +47,7 @@
   "Assigned to": "Assigné à",
   "Avatar": "Avatar",
   "Back to previous page": "Retour à la page précédente",
-  "Before you can login, you need to click on the link inside it to validate your account": "Avant que vous puissiez vous enregistrer, vous devez cliquer sur le lien à l'intérieur pour valider votre compte",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Avant que vous puissiez vous enregistrer, vous devez cliquer sur le lien à l'intérieur pour valider votre compte.",
   "Bold": "Gras",
   "By @{group}": "Par @{group}",
   "By @{username}": "Par @{username}",
@@ -647,5 +647,22 @@
   "Participations": "Participations",
   "Nothing to see here": "Il n'y a rien à voir ici",
   "Not confirmed": "Non confirmé·e",
-  "{actor} suspended profile {profile}": "{actor} a suspendu le profil {profile}"
+  "{actor} suspended profile {profile}": "{actor} a suspendu le profil {profile}",
+  "Suspend": "Suspendre",
+  "Unsuspend": "Annuler la suspension",
+  "None": "Aucun",
+  "Disabled": "Désactivé",
+  "Activated": "Activé",
+  "No profile matches the filters": "Aucun profil ne correspond aux filtres",
+  "Mobilizon": "Mobilizon",
+  "{instanceName} is an instance of the {mobilizon} software.": "{instanceName} est une instance du logiciel {mobilizon}.",
+  "Instance Rules": "Règles de l'instance",
+  "Rules": "Règles",
+  "No rules defined yet.": "Pas de règles définies pour le moment.",
+  "full rules": "règles complètes",
+  "instance rules": "règles de l'instance",
+  "terms of service": "conditions générales d'utilisation",
+  "Please read the instance's {fullRules}": "Merci de lire les {fullRules} de l'instance",
+  "I agree to the {instanceRules} and {termsOfService}": "J'accepte les {instanceRules} et les {termsOfService}",
+  "This email is already used.": "Cette adresse email est déjà utilisée."
 }

js/src/i18n/nl.json

@@ -21,7 +21,7 @@
   "Are you sure you want to cancel your participation at event \"{title}\"?": "Bent u zeker dat u uw deelname aan het evenement \"{title}\" wil annuleren?",
   "Are you sure you want to delete this event? This action cannot be reverted.": "Bent u zeker dat u dit evenement wil verwijderen? Dit kan niet ongedaan gemaakt worden.",
   "Avatar": "Profielfoto",
-  "Before you can login, you need to click on the link inside it to validate your account": "Voordat u zich kan aanmelden, moet u op de link erin klikken om uw account te valideren",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Voordat u zich kan aanmelden, moet u op de link erin klikken om uw account te valideren.",
   "By @{username}": "Door @{username}",
   "Cancel": "Annuleren",
   "Cancel creation": "Aanmaken annuleren",

js/src/i18n/pl.json

@@ -20,7 +20,7 @@
   "Are you sure you want to cancel your participation at event \"{title}\"?": "Czy na pewno chcesz wycofać swój udział w wydarzeniu „{title}”?",
   "Are you sure you want to delete this event? This action cannot be reverted.": "Czy na pewno chcesz usunąć to wydarzenie? To działanie nie może zostać odwrócone.",
   "Avatar": "Awatar",
-  "Before you can login, you need to click on the link inside it to validate your account": "Zanim się zalogujesz, musisz odwiedzić odnośnik znajdujący się w niej, aby potwierdzić swoje konto",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Zanim się zalogujesz, musisz odwiedzić odnośnik znajdujący się w niej, aby potwierdzić swoje konto.",
   "By @{username}": "Od @{username}",
   "Cancel": "Anuluj",
   "Cancel creation": "Anuluj tworzenie",

js/src/i18n/pt_BR.json

@@ -33,7 +33,7 @@
   "Are you sure you want to delete this event? This action cannot be reverted.": "Você está seguro que quer apagar este evento? Esta ação não pode ser desfeita.",
   "Avatar": "Avatar",
   "Back to previous page": "Voltar à página anterior",
-  "Before you can login, you need to click on the link inside it to validate your account": "Antes de você poder começar, você precisa clicar no link que está no interior para validar a sua conta",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Antes de você poder começar, você precisa clicar no link que está no interior para validar a sua conta.",
   "By @{username}": "Por @{username}",
   "Cancel": "Cancelar",
   "Cancel anonymous participation": "Cancelar participação anônima",

js/src/i18n/sv.json

@@ -28,7 +28,7 @@
   "Are you sure you want to cancel your participation at event \"{title}\"?": "Är du säker på att du vill avsluta ditt deltagande i evenemanget \"{title}\"?",
   "Are you sure you want to delete this event? This action cannot be reverted.": "Är du säker på att du vill radera det här evenemanget? Den här handlingen kan inte ångras.",
   "Avatar": "Avatar",
-  "Before you can login, you need to click on the link inside it to validate your account": "Innan du loggar in måste du klicka på länken inuti det för att validera ditt konto",
+  "Before you can login, you need to click on the link inside it to validate your account.": "Innan du loggar in måste du klicka på länken inuti det för att validera ditt konto.",
   "By @{username}": "Av @{username}",
   "Cancel": "Avbryt",
   "Cancel creation": "Avbryt skapandet",

js/src/router/index.ts

@@ -73,6 +73,12 @@ const router = new Router({
       component: () => import(/* webpackChunkName: "cookies" */ "@/views/Terms.vue"),
       meta: { requiredAuth: false },
     },
+    {
+      path: "/rules",
+      name: RouteName.RULES,
+      component: () => import(/* webpackChunkName: "cookies" */ "@/views/Rules.vue"),
+      meta: { requiredAuth: false },
+    },
     {
       path: "/interact",
       name: RouteName.INTERACT,

js/src/router/name.ts

@@ -13,6 +13,7 @@ enum GlobalRouteName {
   SEARCH = "Search",
   TERMS = "TERMS",
   INTERACT = "INTERACT",
+  RULES = "RULES",
 }
 
 // Hack to merge enums

js/src/types/admin.model.ts

@@ -20,5 +20,6 @@ export interface IAdminSettings {
   instanceTerms: string;
   instanceTermsType: InstanceTermsType;
   instanceTermsUrl: string | null;
+  instanceRules: string;
   registrationsOpen: boolean;
 }

js/src/types/config.model.ts

@@ -59,6 +59,7 @@ export interface IConfig {
     type: InstanceTermsType;
     url: string;
   };
+  rules: string;
   resourceProviders: IProvider[];
   timezones: string[];
   features: {

js/src/utils/errors.ts

@@ -82,7 +82,7 @@ export const errors: IError[] = [
   },
   {
     match: /^This email is already used.$/,
-    value: null,
+    value: i18n.t("This email is already used.") as string,
   },
   {
     match: /^User account not confirmed$/,

js/src/views/Account/Register.vue

@@ -39,9 +39,13 @@
           </b-field>
 
           <p class="control has-text-centered">
-            <b-button type="is-primary" size="is-large" native-type="submit">{{
+            <b-button
-              $t("Create my profile")
+              type="is-primary"
-            }}</b-button>
+              size="is-large"
+              native-type="submit"
+              :disabled="sendingValidation"
+              >{{ $t("Create my profile") }}</b-button
+            >
           </p>
         </form>
 
@@ -54,11 +58,13 @@
                 })
               }}
             </h2>
-            <p>{{ $t("A validation email was sent to {email}", { email }) }}</p>
+            <i18n path="A validation email was sent to {email}" tag="p">
+              <code slot="email">{{ email }}</code>
+            </i18n>
             <p>
               {{
                 $t(
-                  "Before you can login, you need to click on the link inside it to validate your account"
+                  "Before you can login, you need to click on the link inside it to validate your account."
                 )
               }}
             </p>
@@ -141,6 +147,7 @@ export default class Register extends mixins(identityEditionMixin) {
       );
       console.error("Error while registering person", errorCatched);
       console.error("Errors while registering person", this.errors);
+      this.sendingValidation = false;
     }
   }
 }

js/src/views/Admin/Settings.vue

@@ -15,6 +15,9 @@
           <p class="content" v-else>{{ $t("Registration is closed.") }}</p>
         </b-switch>
       </b-field>
+      <b-field :label="$t('Instance Rules')">
+        <b-input type="textarea" v-model="adminSettings.instanceRules" />
+      </b-field>
       <b-field :label="$t('Instance Terms Source')">
         <div class="columns">
           <div class="column is-one-third-desktop">

js/src/views/Rules.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="container section" v-if="config">
+    <h2 class="title">{{ $t("Rules") }}</h2>
+    <div class="content" v-html="config.rules" v-if="config.rules" />
+    <p v-else>{{ $t("No rules defined yet.") }}</p>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Watch } from "vue-property-decorator";
+import { RULES } from "@/graphql/config";
+import { IConfig } from "@/types/config.model";
+import { InstanceTermsType } from "@/types/admin.model";
+import RouteName from "../router/name";
+
+@Component({
+  apollo: {
+    config: {
+      query: RULES,
+    },
+  },
+})
+export default class Rules extends Vue {
+  config!: IConfig;
+
+  RouteName = RouteName;
+}
+</script>
+<style lang="scss" scoped>
+@import "@/variables.scss";
+
+main > .container {
+  background: $white;
+}
+</style>

js/src/views/User/Register.vue

@@ -3,6 +3,12 @@
     <section class="hero">
       <div class="hero-body">
         <h1 class="title">{{ $t("Register an account on Mobilizon!") }}</h1>
+        <i18n tag="p" path="{instanceName} is an instance of the {mobilizon} software.">
+          <b slot="instanceName">{{ config.name }}</b>
+          <a href="https://joinmobilizon.org" target="_blank" slot="mobilizon">{{
+            $t("Mobilizon")
+          }}</a>
+        </i18n>
       </div>
     </section>
     <section>
@@ -22,15 +28,12 @@
           <hr />
           <div class="content">
             <subtitle>{{ $t("About this instance") }}</subtitle>
-            <div class="content">
+            <div class="content" v-html="config.description"></div>
-              <p>{{ $t("Your local administrator resumed its policy:") }}</p>
+            <i18n path="Please read the instance's {fullRules}" tag="p">
-              <ul>
+              <router-link slot="fullRules" :to="{ name: RouteName.RULES }">{{
-                <li>{{ $t("Enjoy discovering Mobilizon!") }}</li>
+                $t("full rules")
-              </ul>
+              }}</router-link>
-            </div>
+            </i18n>
-            <!--            <p>-->
-            <!--              {{ $t('Please read the full rules') }}-->
-            <!--            </p>-->
           </div>
         </div>
         <div class="column">
@@ -72,8 +75,26 @@
               />
             </b-field>
 
+            <b-checkbox required>
+              <i18n tag="span" path="I agree to the {instanceRules} and {termsOfService}">
+                <router-link slot="instanceRules" :to="{ name: RouteName.RULES }">{{
+                  $t("instance rules")
+                }}</router-link>
+                <router-link slot="termsOfService" :to="{ name: RouteName.TERMS }">{{
+                  $t("terms of service")
+                }}</router-link>
+              </i18n>
+            </b-checkbox>
+
             <p class="control has-text-centered">
-              <button class="button is-primary is-large">{{ $t("Register") }}</button>
+              <b-button
+                type="is-primary"
+                size="is-large"
+                :disabled="sendingForm"
+                native-type="submit"
+              >
+                {{ $t("Register") }}
+              </b-button>
             </p>
             <p class="control">
               <router-link
@@ -89,7 +110,6 @@
                   name: RouteName.LOGIN,
                   params: { email: credentials.email, password: credentials.password },
                 }"
-                :disabled="sendingValidation"
                 >{{ $t("Login") }}</router-link
               >
             </p>
@@ -139,18 +159,16 @@ export default class Register extends Vue {
 
   errors: object = {};
 
-  sendingValidation = false;
+  sendingForm = false;
-
-  validationSent = false;
 
   RouteName = RouteName;
 
   config!: IConfig;
 
   async submit() {
+    this.sendingForm = true;
     this.credentials.locale = this.$i18n.locale;
     try {
-      this.sendingValidation = true;
       this.errors = {};
 
       await this.$apollo.mutate({
@@ -158,9 +176,7 @@ export default class Register extends Vue {
         variables: this.credentials,
       });
 
-      this.validationSent = true;
+      return this.$router.push({
-
-      await this.$router.push({
         name: RouteName.REGISTER_PROFILE,
         params: { email: this.credentials.email },
       });
@@ -170,6 +186,7 @@ export default class Register extends Vue {
         acc[localError.details] = localError.message;
         return acc;
       }, {});
+      this.sendingForm = false;
     }
   }
 }

lib/graphql/resolvers/admin.ex

@@ -158,7 +158,8 @@ defmodule Mobilizon.GraphQL.Resolvers.Admin do
        registrations_open: Config.instance_registrations_open?(),
        instance_terms: Config.instance_terms(),
        instance_terms_type: Config.instance_terms_type(),
-       instance_terms_url: Config.instance_terms_url()
+       instance_terms_url: Config.instance_terms_url(),
+       instance_rules: Config.instance_rules()
      }}
   end
 

lib/graphql/resolvers/config.ex

@@ -106,7 +106,8 @@ defmodule Mobilizon.GraphQL.Resolvers.Config do
       timezones: Tzdata.zone_list(),
       features: %{
         groups: Config.instance_group_feature_enabled?()
-      }
+      },
+      rules: Config.instance_rules()
     }
   end
 end

lib/graphql/schema/admin.ex

@@ -73,6 +73,7 @@ defmodule Mobilizon.GraphQL.Schema.AdminType do
     field(:instance_terms, :string)
     field(:instance_terms_type, :instance_terms_type)
     field(:instance_terms_url, :string)
+    field(:instance_rules, :string)
     field(:registrations_open, :boolean)
   end
 
@@ -148,6 +149,7 @@ defmodule Mobilizon.GraphQL.Schema.AdminType do
       arg(:instance_terms, :string)
       arg(:instance_terms_type, :instance_terms_type)
       arg(:instance_terms_url, :string)
+      arg(:instance_rules, :string)
       arg(:registrations_open, :boolean)
 
       resolve(&Admin.save_settings/3)

lib/graphql/schema/config.ex

@@ -28,6 +28,8 @@ defmodule Mobilizon.GraphQL.Schema.ConfigType do
       arg(:locale, :string, default_value: "en")
       resolve(&Config.terms/3)
     end
+
+    field(:rules, :string, description: "The instance's rules")
   end
 
   object :terms do

lib/mobilizon/config.ex

@@ -42,6 +42,11 @@ defmodule Mobilizon.Config do
     Mobilizon.Admin.get_admin_setting_value("instance", "instance_terms_url")
   end
 
+  @spec instance_rules :: String.t()
+  def instance_rules do
+    Mobilizon.Admin.get_admin_setting_value("instance", "instance_rules")
+  end
+
   @spec instance_version :: String.t()
   def instance_version, do: Mix.Project.config()[:version]