Client - add registration status and info box on users limitation

fittrackee_client/src/components/Administration/AdminApplication.vue

@@ -15,6 +15,12 @@
               :disabled="!edition"
             />
           </label>
+          <div class="user-limit-help">
+            <span class="info-box">
+              <i class="fa fa-info-circle" aria-hidden="true" />
+              {{ $t('admin.APP_CONFIG.MAX_USERS_HELP') }}
+            </span>
+          </div>
           <label for="max_single_file_size">
             {{ $t('admin.APP_CONFIG.SINGLE_UPLOAD_MAX_SIZE_LABEL') }}:
             <input
@@ -151,3 +157,17 @@
     },
   })
 </script>
+
+<style lang="scss" scoped>
+  @import '~@/scss/base.scss';
+
+  .user-limit-help {
+    display: flex;
+    span {
+      font-style: italic;
+    }
+    .fa-info-circle {
+      margin-right: $default-margin;
+    }
+  }
+</style>

fittrackee_client/src/components/Administration/AdminMenu.vue

@@ -12,7 +12,16 @@
               </router-link>
             </dt>
             <dd>
-              {{ $t('admin.UPDATE_APPLICATION_DESCRIPTION') }}
+              {{ $t('admin.UPDATE_APPLICATION_DESCRIPTION') }}<br />
+              <span class="registration-status">
+                {{
+                  $t(
+                    `admin.REGISTRATION_${
+                      appConfig.is_registration_enabled ? 'ENABLED' : 'DISABLED'
+                    }`
+                  )
+                }}
+              </span>
             </dd>
             <dt>{{ capitalize($t('workouts.SPORT', 0)) }}</dt>
             <dd>
@@ -34,7 +43,7 @@
 
   import AppStatsCards from '@/components/Administration/AppStatsCards.vue'
   import Card from '@/components/Common/Card.vue'
-  import { IAppStatistics } from '@/types/application'
+  import { IAppStatistics, TAppConfig } from '@/types/application'
 
   export default defineComponent({
     name: 'AdminMenu',
@@ -43,6 +52,10 @@
       Card,
     },
     props: {
+      appConfig: {
+        type: Object as PropType<TAppConfig>,
+        required: true,
+      },
       appStatistics: {
         type: Object as PropType<IAppStatistics>,
       },
@@ -71,6 +84,9 @@
         dd {
           margin-bottom: $default-margin * 3;
         }
+        .registration-status {
+          font-weight: bold;
+        }
       }
     }
   }

fittrackee_client/src/components/Workout/WorkoutEdition.vue

@@ -66,7 +66,7 @@
                   :disabled="loading"
                   @input="updateFile"
                 />
-                <div class="files-help">
+                <div class="files-help info-box">
                   <div>
                     <strong>{{ $t('workouts.GPX_FILE') }}:</strong>
                     <ul>
@@ -75,7 +75,6 @@
                       </li>
                     </ul>
                   </div>
-
                   <div>
                     <strong>{{ $t('workouts.ZIP_ARCHIVE') }}:</strong>
                     <ul>
@@ -497,14 +496,7 @@
           .files-help {
             display: flex;
             justify-content: space-around;
-
-            background-color: var(--info-background-color);
-            border-radius: $border-radius;
-            color: var(--info-color);
-            font-size: 0.8em;
-
             margin-top: $default-margin;
-            padding: $default-padding;
             div {
               display: flex;
               @media screen and (max-width: $medium-limit) {

fittrackee_client/src/locales/en/administration.json

@@ -5,6 +5,7 @@
   "APPLICATION": "Application",
   "APP_CONFIG": {
     "MAX_USERS_LABEL": "Max. number of active users",
+    "MAX_USERS_HELP": "If 0, no limitation on registration.",
     "MAX_FILES_IN_ZIP_LABEL": "Max. files of zip archive",
     "SINGLE_UPLOAD_MAX_SIZE_LABEL": "Max. size of uploaded files (in Mb)",
     "TITLE": "Application configuration",

fittrackee_client/src/locales/fr/administration.json

@@ -5,6 +5,7 @@
   "APPLICATION": "Application",
   "APP_CONFIG": {
     "MAX_USERS_LABEL": "Nombre maximum d'utilisateurs actifs ",
+    "MAX_USERS_HELP": "Si égal à 0, pas limite d'inscription",
     "MAX_FILES_IN_ZIP_LABEL": "Taille max. des archives zip (en Mo) ",
     "SINGLE_UPLOAD_MAX_SIZE_LABEL": "Taille max. des fichiers (en Mo) ",
     "TITLE": "Configuration de l'application",

fittrackee_client/src/scss/base.scss

@@ -101,6 +101,14 @@ button {
   margin: $default-margin;
 }
 
+.info-box {
+  background-color: var(--info-background-color);
+  border-radius: $border-radius;
+  color: var(--info-color);
+  font-size: 0.8em;
+  padding: $default-padding;
+}
+
 .container {
   display: flex;
   margin-left: auto;