Add frontend string length validations (Issue 2924)

frontend/src/components/activity/ScheduleEntry.vue

@@ -83,6 +83,7 @@ Displays a single scheduleEntry
           :disabled="layoutMode"
           dense
           autofocus
+          maxlength="32"
           :auto-save="false"
           @finished="editActivityTitle = false"
         />
@@ -257,6 +258,7 @@ Displays a single scheduleEntry
                     path="location"
                     :disabled="layoutMode || !isContributor"
                     dense
+                    maxlength="64"
                   />
                 </v-col>
                 <v-col class="col col-sm-4 col-12">

frontend/src/components/activity/content/layout/ContentNodeCard.vue

@@ -21,6 +21,7 @@
             autofocus
             :auto-save="false"
             path="instanceName"
+            maxlength="32"
             @finished="editInstanceName = false"
           />
         </api-form>
@@ -146,16 +147,16 @@
 }
 
 :deep(.v-toolbar__content:not(:hover) button.visible-on-hover:not(:focus)),
 .v-card:not(:hover):deep(button.tooltip-activator) {
   opacity: 0;
 }
 :deep(.v-toolbar__content button.visible-on-hover),
 .v-card:hover:deep(button.tooltip-activator) {
   opacity: 1;
   transition: opacity 0.2s linear;
 }
 
 ::v-deep {
   .e-form-container,
   .v-input,
   .v-input__control {

frontend/src/components/activity/dialog/DialogActivityForm.vue

@@ -7,6 +7,7 @@
         vee-rules="required"
         class="flex-grow-1"
         autofocus
+        maxlength="32"
         @focus="autoselectTitle ? $event.target.select() : null"
       />
       <slot name="textFieldTitleAppend" />
@@ -36,7 +37,12 @@
       </template>
     </e-select>
 
-    <e-text-field v-if="!hideLocation" v-model="localActivity.location" path="location" />
+    <e-text-field
+      v-if="!hideLocation"
+      v-model="localActivity.location"
+      path="location"
+      maxlength="64"
+    />
 
     <FormScheduleEntryList
       v-if="activity.scheduleEntries"

frontend/src/components/campAdmin/CampAddress.vue

@@ -10,16 +10,16 @@ Displays address and allows to edit
     <v-skeleton-loader v-if="camp._meta.loading" type="article" />
     <div v-else class="mt-3">
       <api-form :entity="camp" name="camp">
-        <api-text-field path="addressName" :disabled="disabled" />
+        <api-text-field path="addressName" :disabled="disabled" maxlength="128" />
 
-        <api-text-field path="addressStreet" :disabled="disabled" />
+        <api-text-field path="addressStreet" :disabled="disabled" maxlength="128" />
 
         <v-row class="mt-3">
           <v-col cols="12" md="4" class="pt-0">
-            <api-text-field path="addressZipcode" :disabled="disabled" />
+            <api-text-field path="addressZipcode" :disabled="disabled" maxlength="128" />
           </v-col>
           <v-col cols="12" md="8" class="pt-0 pl-md-0">
-            <api-text-field path="addressCity" :disabled="disabled" />
+            <api-text-field path="addressCity" :disabled="disabled" maxlength="128" />
           </v-col>
         </v-row>
       </api-form>

frontend/src/components/campAdmin/CampSettings.vue

@@ -15,6 +15,7 @@ Displays details on a single camp and allows to edit them.
           vee-rules="required|max:32"
           :disabled="disabled"
           data-testid="title"
+          maxlength="32"
         />
 
         <api-text-field
@@ -23,9 +24,10 @@ Displays details on a single camp and allows to edit them.
           :disabled="disabled"
           persistent-placeholder
           vee-rules="max:16"
+          maxlength="16"
         />
 
-        <api-text-field path="motto" :disabled="disabled" />
+        <api-text-field path="motto" :disabled="disabled" maxlength="128" />
       </api-form>
     </div>
   </content-group>

frontend/src/components/campAdmin/CreateCampPeriods.vue

@@ -38,6 +38,7 @@
               :my="false"
               input-class="mb-2 pt-0"
               required
+              maxlength="32"
             />
           </v-col>
         </v-row>

frontend/src/components/campAdmin/DialogActivityProgressLabelForm.vue

@@ -5,6 +5,7 @@
       path="title"
       autofocus
       vee-rules="required"
+      maxlength="32"
     />
   </e-form>
 </template>

frontend/src/components/campAdmin/DialogCategoryForm.vue

@@ -6,11 +6,17 @@
         path="short"
         vee-rules="required"
         class="flex-grow-1"
+        maxlength="16"
       />
       <slot name="textFieldTitleAppend" />
     </div>
 
-    <e-text-field v-model="localCategory.name" path="name" vee-rules="required" />
+    <e-text-field
+      v-model="localCategory.name"
+      path="name"
+      vee-rules="required"
+      maxlength="32"
+    />
 
     <e-color-picker v-model="localCategory.color" path="color" vee-rules="required" />
 

frontend/src/components/campAdmin/DialogMaterialListForm.vue

@@ -5,6 +5,7 @@
       path="name"
       autofocus
       vee-rules="required"
+      maxlength="32"
     />
   </e-form>
 </template>

frontend/src/components/campAdmin/DialogPeriodDescriptionEdit.vue

@@ -18,6 +18,7 @@
         path="description"
         autofocus
         vee-rules="required"
+        maxlength="32"
       />
     </e-form>
   </dialog-form>

frontend/src/components/campAdmin/DialogPeriodForm.vue

@@ -4,6 +4,7 @@
       v-model="localPeriod.description"
       path="description"
       vee-rules="required"
+      maxlength="32"
     />
 
     <e-date-picker

frontend/src/components/campCreate/CampCreateStep1.vue

@@ -11,6 +11,7 @@
               vee-rules="required|max:32"
               data-testid="create-camp-title-input"
               required
+              maxlength="32"
             />
             <e-text-field
               v-model="localCamp.organizer"
@@ -21,6 +22,7 @@
               v-model="localCamp.motto"
               path="motto"
               data-testid="create-camp-motto"
+              maxlength="128"
             />
             <CreateCampPeriods
               :add-period="addPeriod"

frontend/src/components/category/CategoryProperties.vue

@@ -1,8 +1,18 @@
 <template>
   <api-form :entity="category" name="category">
-    <api-text-field path="short" :disabled="disabled" vee-rules="required" />
+    <api-text-field
+      path="short"
+      :disabled="disabled"
+      vee-rules="required"
+      maxlength="16"
+    />
 
-    <api-text-field path="name" :disabled="disabled" vee-rules="required" />
+    <api-text-field
+      path="name"
+      :disabled="disabled"
+      vee-rules="required"
+      maxlength="32"
+    />
 
     <api-color-picker path="color" :disabled="disabled" vee-rules="required" />
 

frontend/src/components/collaborator/CollaboratorCreate.vue

@@ -23,6 +23,7 @@
       path="inviteEmail"
       vee-rules="required|email"
       class="mb-2"
+      maxlength="128"
     />
 
     <CollaboratorForm :collaboration="entityData" />

frontend/src/components/material/DialogMaterialItemForm.vue

@@ -12,7 +12,7 @@
       v-model="localMaterialItem.article"
       path="article"
       vee-rules="required"
-      maxlength="64"
+      maxlength="32"
     />
     <e-select
       v-model="localMaterialItem.materialList"

frontend/src/components/material/MaterialCreateItem.vue

@@ -25,7 +25,7 @@
         dense
         vee-rules="required"
         path="article"
-        maxlength="64"
+        maxlength="32"
       />
     </td>
     <td class="pt-1" :colspan="columns - 4">

frontend/src/components/material/MaterialTable.vue

@@ -60,7 +60,7 @@
           dense
           :uri="item.uri"
           path="article"
-          maxlength="64"
+          maxlength="32"
         />
         <span v-if="item.readonly">{{ item.article }}</span>
       </template>

frontend/src/views/Profile.vue

@@ -34,11 +34,11 @@
               </template>
             </e-text-field>
 
-            <api-text-field path="firstname" @finished="reloadUser()" />
+            <api-text-field path="firstname" maxlength="64" @finished="reloadUser()" />
 
-            <api-text-field path="surname" @finished="reloadUser()" />
+            <api-text-field path="surname" maxlength="64" @finished="reloadUser()" />
 
-            <api-text-field path="nickname" @finished="reloadUser()" />
+            <api-text-field path="nickname" maxlength="32" @finished="reloadUser()" />
 
             <api-text-field
               path="abbreviation"

frontend/src/views/auth/Register.vue

@@ -12,6 +12,7 @@
             dense
             type="text"
             autocomplete="given-name"
+            maxlength="64"
           />
 
           <e-text-field
@@ -22,6 +23,7 @@
             dense
             type="text"
             autocomplete="family-name"
+            maxlength="64"
           />
 
           <e-text-field
@@ -31,6 +33,7 @@
             dense
             type="text"
             autocomplete="nickname"
+            maxlength="32"
           />
 
           <e-text-field