AIRAVATA-3662 Adding checkbox label text input to user agreement field editor
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/users/field-editors/ExtendedUserProfileFieldEditor.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/users/field-editors/ExtendedUserProfileFieldEditor.vue
index 95dd6dc..965fdd0 100644
--- a/django_airavata/apps/admin/static/django_airavata_admin/src/components/users/field-editors/ExtendedUserProfileFieldEditor.vue
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/users/field-editors/ExtendedUserProfileFieldEditor.vue
@@ -6,6 +6,19 @@
         >This field is required.</b-form-invalid-feedback
       >
     </b-form-group>
+    <b-form-group
+      label="Checkbox Label"
+      label-cols="3"
+      v-if="extendedUserProfileField.field_type === 'user_agreement'"
+    >
+      <b-form-input
+        v-model="checkbox_label"
+        :state="validateState($v.checkbox_label)"
+      />
+      <b-form-invalid-feedback :state="validateState($v.checkbox_label)"
+        >This field is required.</b-form-invalid-feedback
+      >
+    </b-form-group>
     <b-form-group label="Help text" label-cols="3">
       <b-form-input v-model="help_text" />
     </b-form-group>
@@ -190,7 +203,7 @@
 <script>
 import { mapGetters, mapMutations } from "vuex";
 import { validationMixin } from "vuelidate";
-import { required } from "vuelidate/lib/validators";
+import { required, requiredIf } from "vuelidate/lib/validators";
 import { errors } from "django-airavata-common-ui";
 export default {
   mixins: [validationMixin],
@@ -206,6 +219,15 @@
         this.$v.name.$touch();
       },
     },
+    checkbox_label: {
+      get() {
+        return this.extendedUserProfileField.checkbox_label;
+      },
+      set(value) {
+        this.setCheckboxLabel({ value, field: this.extendedUserProfileField });
+        this.$v.checkbox_label.$touch();
+      },
+    },
     help_text: {
       get() {
         return this.extendedUserProfileField.help_text;
@@ -250,12 +272,18 @@
     valid() {
       return !this.$v.$invalid;
     },
+    checkboxLabelIsRequired() {
+      return this.extendedUserProfileField.field_type === "user_agreement";
+    },
   },
   validations() {
     return {
       name: {
         required,
       },
+      checkbox_label: {
+        required: requiredIf("checkboxLabelIsRequired"),
+      },
       choices: {
         $each: {
           display_text: {
@@ -278,6 +306,7 @@
   methods: {
     ...mapMutations("extendedUserProfile", [
       "setName",
+      "setCheckboxLabel",
       "setHelpText",
       "setRequired",
       "setOther",
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/store/modules/extendedUserProfile.js b/django_airavata/apps/admin/static/django_airavata_admin/src/store/modules/extendedUserProfile.js
index a058bee..1c0d456 100644
--- a/django_airavata/apps/admin/static/django_airavata_admin/src/store/modules/extendedUserProfile.js
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/store/modules/extendedUserProfile.js
@@ -94,6 +94,9 @@
   setName(state, { value, field }) {
     setFieldProp(state, field, "name", value);
   },
+  setCheckboxLabel(state, { value, field }) {
+    setFieldProp(state, field, "checkbox_label", value);
+  },
   setHelpText(state, { value, field }) {
     setFieldProp(state, field, "help_text", value);
   },