Prevent reporter datasource renaming

client/web/reporter/src/components/Report/Datasources/Aggregate/index.vue

@@ -3,11 +3,13 @@
     v-if="step.aggregate"
   >
     <b-form-group
-      :label="$t('datasources:name')"
+      :label="$t('datasources:name-required')"
       label-class="text-primary"
     >
       <b-form-input
         v-model="step.aggregate.name"
+        :state="nameState"
+        :disabled="!creating"
         :placeholder="$t('datasources:datasource-name')"
       />
     </b-form-group>

client/web/reporter/src/components/Report/Datasources/Join.vue

@@ -5,11 +5,13 @@
     <b-row>
       <b-col>
         <b-form-group
-          :label="$t('datasources:name')"
+          :label="$t('datasources:name-required')"
           label-class="text-primary"
         >
           <b-form-input
             v-model="step.join.name"
+            :disabled="!creating"
+            :state="nameState"
             :placeholder="$t('datasources:datasource-name')"
           />
         </b-form-group>
@@ -103,14 +105,6 @@ export default {
 
   extends: base,
 
-  props: {
-    datasources: {
-      type: Array,
-      required: false,
-      default: () => [],
-    },
-  },
-
   data () {
     return {
       localColumns: [],

client/web/reporter/src/components/Report/Datasources/Link.vue

@@ -5,11 +5,13 @@
     <b-row>
       <b-col>
         <b-form-group
-          :label="$t('datasources:name')"
+          :label="$t('datasources:name-required')"
           label-class="text-primary"
         >
           <b-form-input
             v-model="step.link.name"
+            :disabled="!creating"
+            :state="nameState"
             :placeholder="$t('datasources:datasource-name')"
           />
         </b-form-group>
@@ -103,14 +105,6 @@ export default {
 
   extends: base,
 
-  props: {
-    datasources: {
-      type: Array,
-      required: false,
-      default: () => [],
-    },
-  },
-
   data () {
     return {
       localColumns: [],

client/web/reporter/src/components/Report/Datasources/Load/index.vue

@@ -3,11 +3,13 @@
     v-if="step.load"
   >
     <b-form-group
-      :label="$t('datasources:name')"
+      :label="$t('datasources:name-required')"
       label-class="text-primary"
     >
       <b-form-input
         v-model="step.load.name"
+        :state="nameState"
+        :disabled="!creating"
         :placeholder="$t('datasources:datasource-name')"
       />
     </b-form-group>

client/web/reporter/src/components/Report/Datasources/base.vue

@@ -11,12 +11,32 @@ export default {
       required: true,
       default: () => ({}),
     },
+
+    datasources: {
+      type: Array,
+      required: false,
+      default: () => [],
+    },
+
+    creating: {
+      type: Boolean,
+      default: true,
+    },
   },
 
   computed: {
     kind () {
       return Object.keys(this.step)
     },
+
+    nameState () {
+      const name = this.step[this.kind].name
+      const isDuplicate = this.datasources.some(({ step }, index) => {
+        return index !== this.index && step[Object.keys(step)].name === name && name
+      })
+
+      return name.length > 0 && !isDuplicate ? null : false
+    },
   },
 }
 </script>

client/web/reporter/src/views/Report/Builder.vue

@@ -226,9 +226,10 @@
     <b-modal
       v-model="datasources.showConfigurator"
       :title="$t('builder:datasources.label')"
-      :ok-title="$t('builder:datasources.save')"
+      :ok-title="$t('general:label.saveAndClose')"
       ok-variant="primary"
-      :ok-disabled="datasources.processing"
+      :ok-disabled="datasourceSaveDisabled"
+      cancel-variant="link"
       :cancel-disabled="datasources.processing"
       scrollable
       size="xl"
@@ -259,6 +260,7 @@
             :index="datasources.currentIndex"
             :datasources="datasources.tempItems"
             :step.sync="currentDatasourceStep"
+            :creating="datasources.tempItems[datasources.currentIndex].meta.creating"
           />
         </template>
       </configurator>
@@ -605,6 +607,16 @@ export default {
         { text: this.$t('builder:layout-options.vertical'), value: 'vertical' },
       ]
     },
+
+    datasourceSaveDisabled () {
+      const uniqueDatasources = new Set()
+      const hasDuplicates = this.datasources.tempItems.some(({ step }) => {
+        const name = step[Object.keys(step)].name
+        return !name || uniqueDatasources.size === uniqueDatasources.add(name).size
+      })
+
+      return this.datasources.processing || hasDuplicates
+    },
   },
 
   watch: {
@@ -660,7 +672,7 @@ export default {
         }
       }
 
-      return `${currentIndex}`
+      return `${this.$t('datasources:source')} ${currentIndex}`
     },
 
     openDatasourceSelector () {
@@ -670,7 +682,10 @@ export default {
 
     openDatasourceConfigurator () {
       this.datasources.showConfigurator = true
-      this.datasources.tempItems = cloneDeep(this.reportDatasources)
+      this.datasources.tempItems = cloneDeep(this.reportDatasources).map(ds => {
+        ds.meta.creating = false
+        return ds
+      })
       this.datasources.currentIndex = this.datasources.tempItems.length ? 0 : undefined
     },
 

locale/en/corteza-webapp-reporter/datasources.yaml

@@ -7,6 +7,7 @@ expression: Expression
 group-by: Group by
 label: Label
 module: Module
+name-required: Name *
 name: Name
 namespace: Namespace
 new:

locale/en/corteza-webapp-reporter/general.yaml

@@ -14,6 +14,7 @@ label:
   or: Or
   openLinkInNewTab: Open link in a new tab
   save: Save
+  saveAndClose: Save and close
   today: Today
   urlPlaceholder: https://example.tld
   default: Default