From 315923c7d994dfa240c9468c1ec9b42a07e79c7b Mon Sep 17 00:00:00 2001
From: "Ayobami O. Idowu" <ayobami.o.idowu@gmail.com>
Date: Mon, 10 Jul 2023 00:16:00 -0700
Subject: [PATCH 1/5] Fix issues with select columns in TeamManagement.vue,
 MySubmissioTable.vue, SubmissionTablr.vue

---
 .../src/components/base/BaseFilter.vue        |  54 +++++++-
 .../src/components/forms/SubmissionsTable.vue | 128 +++++++++---------
 .../forms/manage/TeamManagement.vue           |  18 +--
 .../forms/submission/MySubmissionsTable.vue   |  18 +--
 4 files changed, 134 insertions(+), 84 deletions(-)

diff --git a/app/frontend/src/components/base/BaseFilter.vue b/app/frontend/src/components/base/BaseFilter.vue
index 0a03b6a2f..6f05afedf 100644
--- a/app/frontend/src/components/base/BaseFilter.vue
+++ b/app/frontend/src/components/base/BaseFilter.vue
@@ -7,7 +7,7 @@
     <v-card-text class="mt-0 pt-0">
       <hr class="hr" />
 
-      <div class="d-flex flex-row align-center" style="gap: 30px">
+      <div class="d-flex flex-row" style="gap: 10px">
         <v-text-field
           v-model="inputFilter"
           :label="inputFilterLabel"
@@ -20,6 +20,28 @@
           class="mt-3"
         >
         </v-text-field>
+        <v-tooltip bottom>
+          <template #activator="{ on, attrs }">
+            <v-btn
+              color="primary"
+              class="mx-1 align-self-center mb-3"
+              icon
+              @click="onResetColumns"
+              v-bind="attrs"
+              v-on="on"
+            >
+              <font-awesome-icon
+                icon="fa-solid fa-repeat"
+                color="primary"
+                v-bind="attrs"
+                style="pointer-events: none"
+                v-on="on"
+                size="xl"
+              />
+            </v-btn>
+          </template>
+          <span>Reset Columns</span>
+        </v-tooltip>
       </div>
       <v-data-table
         fixed-header
@@ -28,10 +50,11 @@
         height="300px"
         v-model="selectedData"
         :headers="inputHeaders"
-        :items="inputData"
+        :items="tableData"
         :item-key="inputItemKey"
         :search="inputFilter"
         class="grey lighten-5"
+        disable-pagination
       >
       </v-data-table>
       <v-btn @click="savingFilterData" class="primary mt-3">{{
@@ -49,6 +72,10 @@
 
 <script>
 import i18n from '@/internationalization';
+import { library } from '@fortawesome/fontawesome-svg-core';
+import { faRepeat } from '@fortawesome/free-solid-svg-icons';
+library.add(faRepeat);
+
 export default {
   name: 'BaseFilter',
   props: {
@@ -77,6 +104,10 @@ export default {
         },
       ],
     },
+    resetData: {
+      type: Array,
+      default: () => [],
+    },
     // The default selected data
     preselectedData: {
       type: Array,
@@ -103,15 +134,32 @@ export default {
     return {
       selectedData: this.preselectedData,
       inputFilter: '',
+      tableData: this.inputData,
     };
   },
+  watch: {
+    selectedData() {
+      let filteredData = this.inputData.filter(
+        (item) =>
+          !this.selectedData.find(
+            (selectedItem) => selectedItem.text === item.text
+          )
+      );
+      this.tableData = this.selectedData.concat(filteredData);
+    },
+  },
   methods: {
     savingFilterData() {
       this.inputFilter = '';
       this.$emit('saving-filter-data', this.selectedData);
     },
+    onResetColumns() {
+      this.selectedData = this.resetData;
+      this.inputFilter = '';
+    },
     cancelFilterData() {
-      this.$emit('cancel-filter-data');
+      (this.selectedData = this.preselectedData),
+        this.$emit('cancel-filter-data');
     },
   },
 };
diff --git a/app/frontend/src/components/forms/SubmissionsTable.vue b/app/frontend/src/components/forms/SubmissionsTable.vue
index d88ceef81..c7da0b4dd 100644
--- a/app/frontend/src/components/forms/SubmissionsTable.vue
+++ b/app/frontend/src/components/forms/SubmissionsTable.vue
@@ -267,7 +267,8 @@
         "
         inputItemKey="value"
         :inputSaveButtonText="$t('trans.submissionsTable.save')"
-        :inputData="FILTER_HEADERS"
+        :inputData="SELECT_COLUMNS_HEADERS"
+        :resetData="FILTER_HEADERS"
         :preselectedData="PRESELECTED_DATA"
         @saving-filter-data="updateFilter"
         @cancel-filter-data="showColumnsDialog = false"
@@ -359,8 +360,7 @@ export default {
     checkFormManage() {
       return this.permissions.some((p) => FormManagePermissions.includes(p));
     },
-
-    DEFAULT_HEADERS() {
+    DEFAULT_HEADER() {
       let headers = [
         {
           text: this.$t('trans.submissionsTable.confirmationID'),
@@ -368,7 +368,6 @@ export default {
           value: 'confirmationId',
         },
       ];
-
       if (this.userFormPreferences?.preferences?.columns) {
         if (this.userFormPreferences.preferences.columns.includes('date')) {
           headers = [
@@ -437,19 +436,6 @@ export default {
         ];
       }
 
-      // Add any custom columns if the user has them
-      const maxHeaderLength = 25;
-      this.userColumns.forEach((col) => {
-        headers.push({
-          text:
-            col.length > maxHeaderLength
-              ? `${col.substring(0, maxHeaderLength)}...`
-              : col,
-          align: 'end',
-          value: col,
-        });
-      });
-
       // Actions column at the end
       headers.push({
         text: this.$t('trans.submissionsTable.view'),
@@ -469,71 +455,83 @@ export default {
         sortable: false,
         width: '40px',
       });
+      return headers;
+    },
 
-      return headers.filter((x) => x.value !== 'updatedAt' || this.deletedOnly);
+    SELECT_COLUMNS_HEADERS() {
+      return [...this.FILTER_HEADERS].concat(
+        this.formFields.map((ff) => {
+          return { text: ff, value: ff, align: 'end' };
+        })
+      );
     },
 
     HEADERS() {
-      let headers = this.DEFAULT_HEADERS;
-      if (this.filterData.length > 0)
-        headers = headers.filter(
-          (h) =>
-            this.filterData.some((fd) => fd.value === h.value) ||
-            this.filterIgnore.some((ign) => ign.value === h.value)
-        );
-      return headers;
+      let headers = [...this.DEFAULT_HEADER];
+      //let stat = headers.length - 4;
+      if (headers.length > 3) {
+        headers.splice(1, 0, ...this.USER_PREFERENCES);
+      } else {
+        headers = headers.concat(this.USER_PREFERENCES);
+      }
+      return headers.filter(
+        (item, idx, inputArray) =>
+          inputArray.findIndex((arrayItem) => arrayItem.value === item.value) ==
+          idx
+      );
     },
+
     FILTER_HEADERS() {
-      let filteredHeader = this.DEFAULT_HEADERS.filter(
+      return [...this.DEFAULT_HEADER].filter(
         (h) => !this.filterIgnore.some((fd) => fd.value === h.value)
-      ).concat(
-        this.formFields.map((ff) => {
-          return { text: ff, value: ff, align: 'end' };
-        })
       );
+    },
+    PRESELECTED_DATA() {
+      let headers = [...this.FILTER_HEADERS];
 
-      filteredHeader = [
-        {
-          text: this.$t('trans.submissionsTable.submissionDate'),
-          align: 'start',
-          value: 'date',
-        },
-        {
-          text: this.$t('trans.submissionsTable.submitter'),
-          align: 'start',
-          value: 'submitter',
-        },
-        {
-          text: this.$t('trans.submissionsTable.status'),
-          align: 'start',
-          value: 'status',
-        },
-        ...filteredHeader,
-      ];
-
-      return filteredHeader.filter(function (item, index, inputArray) {
-        return (
+      if (headers.length > 3) {
+        headers.splice(1, 0, ...this.USER_PREFERENCES);
+      } else {
+        headers = headers.concat(this.USER_PREFERENCES);
+      }
+      return headers.filter(
+        (item, idx, inputArray) =>
           inputArray.findIndex((arrayItem) => arrayItem.value === item.value) ==
-          index
-        );
-      });
+          idx
+      );
     },
-    PRESELECTED_DATA() {
+    USER_PREFERENCES() {
       let preselectedData = [];
       if (this.userFormPreferences?.preferences?.columns) {
         preselectedData = this.userFormPreferences.preferences.columns.map(
           (column) => {
-            return {
-              align: 'end',
-              text: column,
-              value: column,
-            };
+            if (column === 'date') {
+              return {
+                text: this.$t('trans.submissionsTable.submissionDate'),
+                align: 'start',
+                value: 'date',
+              };
+            } else if (column === 'submitter') {
+              return {
+                text: this.$t('trans.submissionsTable.submitter'),
+                align: 'start',
+                value: 'submitter',
+              };
+            } else if (column === 'status') {
+              return {
+                text: this.$t('trans.submissionsTable.status'),
+                align: 'start',
+                value: 'status',
+              };
+            } else {
+              return {
+                align: 'start',
+                text: column,
+                value: column,
+              };
+            }
           }
         );
-      } else {
-        preselectedData = this.DEFAULT_HEADERS.filter(
-          (h) => !this.filterIgnore.some((fd) => fd.value === h.value)
-        );
       }
       return preselectedData;
     },
diff --git a/app/frontend/src/components/forms/manage/TeamManagement.vue b/app/frontend/src/components/forms/manage/TeamManagement.vue
index 62ea5615a..11f006409 100644
--- a/app/frontend/src/components/forms/manage/TeamManagement.vue
+++ b/app/frontend/src/components/forms/manage/TeamManagement.vue
@@ -160,11 +160,8 @@
         "
         inputItemKey="value"
         :inputSaveButtonText="$t('trans.teamManagement.save')"
-        :inputData="
-          DEFAULT_HEADERS.filter(
-            (h) => !filterIgnore.some((fd) => fd.value === h.value)
-          )
-        "
+        :inputData="FILTER_HEADERS"
+        :resetData="FILTER_HEADERS"
         :preselectedData="PRESELECTED_DATA"
         @saving-filter-data="updateFilter"
         @cancel-filter-data="showColumnsDialog = false"
@@ -245,6 +242,11 @@ export default {
         )
         .concat({ text: '', value: 'actions', width: '1rem', sortable: false });
     },
+    FILTER_HEADERS() {
+      return this.DEFAULT_HEADERS.filter(
+        (h) => !this.filterIgnore.some((fd) => fd.value === h.value)
+      );
+    },
     HEADERS() {
       let headers = this.DEFAULT_HEADERS;
       if (this.filterData.length > 0)
@@ -256,9 +258,9 @@ export default {
       return headers;
     },
     PRESELECTED_DATA() {
-      return this.DEFAULT_HEADERS.filter(
-        (h) => !this.filterIgnore.some((fd) => fd.value === h.value)
-      );
+      return this.filterData.length === 0
+        ? this.FILTER_HEADERS
+        : this.filterData;
     },
   },
   data() {
diff --git a/app/frontend/src/components/forms/submission/MySubmissionsTable.vue b/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
index 3763c6dd3..2ed16eec8 100644
--- a/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
+++ b/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
@@ -11,7 +11,7 @@
           <v-tooltip bottom>
             <template #activator="{ on, attrs }">
               <v-btn
-                @click="showColumnsDialog = true"
+                @click="onShowColumnDialog"
                 class="mx-1"
                 color="primary"
                 icon
@@ -110,7 +110,8 @@
         inputItemKey="value"
         :inputSaveButtonText="$t('trans.mySubmissionsTable.save')"
         :inputData="FILTER_HEADERS"
-        :preselectedData="PRESELECTEDDATA"
+        :preselectedData="preSelectedData"
+        :resetData="FILTER_HEADERS"
         @saving-filter-data="updateFilter"
         @cancel-filter-data="showColumnsDialog = false"
       >
@@ -142,6 +143,7 @@ export default {
     return {
       headers: [],
       filterData: [],
+      preSelectedData: [],
       filterIgnore: [
         {
           value: 'confirmationId',
@@ -220,12 +222,7 @@ export default {
     },
     HEADERS() {
       return this.filterData.length === 0
-        ? this.DEFAULT_HEADERS
-        : this.filterData;
-    },
-    PRESELECTEDDATA() {
-      return this.filterData.length === 0
-        ? this.DEFAULT_HEADERS
+        ? this.FILTER_HEADERS
         : this.filterData;
     },
 
@@ -241,6 +238,11 @@ export default {
   },
   methods: {
     ...mapActions('form', ['fetchForm', 'fetchSubmissions']),
+    onShowColumnDialog() {
+      this.preSelectedData =
+        this.filterData.length === 0 ? this.FILTER_HEADERS : this.filterData;
+      this.showColumnsDialog = true;
+    },
 
     // Status columns in the table
     getCurrentStatus(record) {

From 284f3f01bf2352f646c89d14d7e042728c949862 Mon Sep 17 00:00:00 2001
From: "Ayobami O. Idowu" <ayobami.o.idowu@gmail.com>
Date: Mon, 10 Jul 2023 09:19:33 -0700
Subject: [PATCH 2/5] Update SubmissionsTable.vue

---
 app/frontend/src/components/forms/SubmissionsTable.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/app/frontend/src/components/forms/SubmissionsTable.vue b/app/frontend/src/components/forms/SubmissionsTable.vue
index c7da0b4dd..b65c81248 100644
--- a/app/frontend/src/components/forms/SubmissionsTable.vue
+++ b/app/frontend/src/components/forms/SubmissionsTable.vue
@@ -468,8 +468,8 @@ export default {
 
     HEADERS() {
       let headers = [...this.DEFAULT_HEADER];
-      //let stat = headers.length - 4;
-      if (headers.length > 3) {
+
+      if (headers.length > 1) {
         headers.splice(1, 0, ...this.USER_PREFERENCES);
       } else {
         headers = headers.concat(this.USER_PREFERENCES);
@@ -488,8 +488,7 @@ export default {
     },
     PRESELECTED_DATA() {
       let headers = [...this.FILTER_HEADERS];
-
-      if (headers.length > 3) {
+      if (headers.length > 1) {
         headers.splice(1, 0, ...this.USER_PREFERENCES);
       } else {
         headers = headers.concat(this.USER_PREFERENCES);

From ad68f51219f2b1034baed4b9d9e4513603bccc41 Mon Sep 17 00:00:00 2001
From: "Ayobami O. Idowu" <ayobami.o.idowu@gmail.com>
Date: Mon, 10 Jul 2023 17:31:39 -0700
Subject: [PATCH 3/5] add custom fields to select columns in my submissions
 page

---
 .../forms/submission/MySubmissionsTable.vue   | 35 ++++++++++++++++---
 1 file changed, 30 insertions(+), 5 deletions(-)

diff --git a/app/frontend/src/components/forms/submission/MySubmissionsTable.vue b/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
index 2ed16eec8..7582eeb26 100644
--- a/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
+++ b/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
@@ -109,7 +109,7 @@
         "
         inputItemKey="value"
         :inputSaveButtonText="$t('trans.mySubmissionsTable.save')"
-        :inputData="FILTER_HEADERS"
+        :inputData="SELECT_COLUMNS_HEADERS"
         :preselectedData="preSelectedData"
         :resetData="FILTER_HEADERS"
         @saving-filter-data="updateFilter"
@@ -159,7 +159,12 @@ export default {
     };
   },
   computed: {
-    ...mapGetters('form', ['form', 'submissionList', 'permissions']),
+    ...mapGetters('form', [
+      'form',
+      'submissionList',
+      'permissions',
+      'formFields',
+    ]),
     ...mapGetters('auth', ['user']),
     DEFAULT_HEADERS() {
       let headers = [
@@ -214,6 +219,13 @@ export default {
       }
       return headers;
     },
+    SELECT_COLUMNS_HEADERS() {
+      return [...this.FILTER_HEADERS].concat(
+        this.formFields?.map((ff) => {
+          return { text: ff, value: ff, align: 'end' };
+        })
+      );
+    },
 
     FILTER_HEADERS() {
       return this.DEFAULT_HEADERS.filter(
@@ -237,7 +249,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions('form', ['fetchForm', 'fetchSubmissions']),
+    ...mapActions('form', ['fetchForm', 'fetchSubmissions', 'fetchFormFields']),
     onShowColumnDialog() {
       this.preSelectedData =
         this.filterData.length === 0 ? this.FILTER_HEADERS : this.filterData;
@@ -276,7 +288,7 @@ export default {
       // Build up the list of forms for the table
       if (this.submissionList) {
         const tableRows = this.submissionList.map((s) => {
-          return {
+          const fields = {
             confirmationId: s.confirmationId,
             name: s.name,
             permissions: s.permissions,
@@ -291,6 +303,13 @@ export default {
                 ? s.submissionStatus[0].createdBy
                 : '',
           };
+          s.submission &&
+            s.submission.submission &&
+            s.submission.submission.data &&
+            Object.keys(s.submission.submission.data).forEach((col) => {
+              fields[col] = s.submission.submission.data[col];
+            });
+          return fields;
         });
         this.submissionTable = tableRows;
       }
@@ -303,7 +322,13 @@ export default {
   },
 
   async mounted() {
-    await this.fetchForm(this.formId);
+    await this.fetchForm(this.formId).then(async () => {
+      await this.fetchFormFields({
+        formId: this.formId,
+        formVersionId: this.form.versions[0].id,
+      });
+    });
+
     await this.populateSubmissionsTable();
   },
 };

From ceffae7afef863b58a94796c1f751bed5e1c9c63 Mon Sep 17 00:00:00 2001
From: "Ayobami O. Idowu" <ayobami.o.idowu@gmail.com>
Date: Mon, 10 Jul 2023 18:12:59 -0700
Subject: [PATCH 4/5] Revert "Merge branch 'master' of
 https://github.com/timisenco2015/common-hosted-form-service into
 FORMS-754_Select_columns_in_my_submission_table"

This reverts commit 7dc1ca9fc1b2c4a2c0b436ffc1c74698a5edb635, reversing
changes made to ad68f51219f2b1034baed4b9d9e4513603bccc41.
---
 .../src/components/designer/FormViewer.vue    | 36 +++----------------
 ...05190020_change_file_storage_constrains.js | 19 ----------
 app/src/forms/common/constants.js             |  2 +-
 3 files changed, 6 insertions(+), 51 deletions(-)
 delete mode 100644 app/src/db/migrations/20230705190020_change_file_storage_constrains.js

diff --git a/app/frontend/src/components/designer/FormViewer.vue b/app/frontend/src/components/designer/FormViewer.vue
index 641512243..319b1bf7f 100644
--- a/app/frontend/src/components/designer/FormViewer.vue
+++ b/app/frontend/src/components/designer/FormViewer.vue
@@ -310,38 +310,16 @@ export default {
       function iterate(obj, stack, fields, propNeeded) {
         //Get property path from nested object
         for (let property in obj) {
-          const innerObject = obj[property];
-
-          // When the form contains a Data Grid there will be an array that
-          // needs to be checked, and an array of properties to be unset.
-          if (Array.isArray(innerObject)) {
-            const fieldsArray = [];
-            for (let i = 0; i < innerObject.length; i++) {
-              const next = iterate(
-                innerObject[i],
-                stack + '.' + property + '[' + i + ']',
-                fields,
-                propNeeded
-              );
-
-              if (next) {
-                fieldsArray.push(next);
-              }
-            }
-
-            if (fieldsArray.length > 0) {
-              return fieldsArray;
-            }
-          } else if (typeof innerObject === 'object') {
+          if (typeof obj[property] == 'object') {
             return iterate(
-              innerObject,
+              obj[property],
               stack + '.' + property,
               fields,
               propNeeded
             );
           } else if (propNeeded === property) {
             fields = fields + stack + '.' + property;
-            return fields.replace(/^\./, '');
+            return fields;
           }
         }
       }
@@ -361,12 +339,8 @@ export default {
           });
         } else if (fieldcomponent?.validate?.isUseForCopy === false) {
           const fieldPath = iterate(submission, '', '', fieldcomponent.key);
-          if (Array.isArray(fieldPath)) {
-            for (let path of fieldPath) {
-              _.unset(submission, path);
-            }
-          } else if (fieldPath) {
-            _.unset(submission, fieldPath);
+          if (fieldPath) {
+            _.unset(submission, fieldPath.replace(/^\./, ''));
           }
         }
       }
diff --git a/app/src/db/migrations/20230705190020_change_file_storage_constrains.js b/app/src/db/migrations/20230705190020_change_file_storage_constrains.js
deleted file mode 100644
index 0082b20be..000000000
--- a/app/src/db/migrations/20230705190020_change_file_storage_constrains.js
+++ /dev/null
@@ -1,19 +0,0 @@
-exports.up = function (knex) {
-  return Promise.resolve()
-    .then(() => knex.schema.raw(`ALTER TABLE file_storage DROP CONSTRAINT file_storage_storage_check`))
-    .then(() =>
-      knex.schema.raw(`ALTER TABLE file_storage ADD CONSTRAINT
-          file_storage_storage_check CHECK
-            ((storage = ANY (ARRAY['uploads'::text, 'localStorage'::text, 'objectStorage'::text, 'exports'::text])))`)
-    );
-};
-
-exports.down = function (knex) {
-  return Promise.resolve()
-    .then(() => knex.schema.raw(`ALTER TABLE file_storage DROP CONSTRAINT file_storage_storage_check`))
-    .then(() =>
-      knex.schema.raw(`ALTER TABLE file_storage ADD CONSTRAINT
-          file_storage_storage_check CHECK
-            ((storage = ANY (ARRAY['uploads'::text, 'localStorage'::text, 'objectStorage'::text, 'exports'::text])))`)
-    );
-};
diff --git a/app/src/forms/common/constants.js b/app/src/forms/common/constants.js
index 43b09a360..16639ed22 100644
--- a/app/src/forms/common/constants.js
+++ b/app/src/forms/common/constants.js
@@ -56,7 +56,7 @@ module.exports = Object.freeze({
     UPLOADS: 'uploads',
     LOCAL_STORAGE: 'localStorage',
     OBJECT_STORAGE: 'objectStorage',
-    LOCAL_STORES: ['uploads', 'localStorage', 'exports'],
+    LOCAL_STORES: ['uploads', 'localStorage'],
   },
   Restricted: {
     IDP: {

From 5d6c36ee10325ba7417c517d00888815ad5f58d4 Mon Sep 17 00:00:00 2001
From: "Ayobami O. Idowu" <ayobami.o.idowu@gmail.com>
Date: Mon, 10 Jul 2023 19:15:26 -0700
Subject: [PATCH 5/5] update undefined check in MySubmissionsTable

---
 .../src/components/forms/submission/MySubmissionsTable.vue    | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/app/frontend/src/components/forms/submission/MySubmissionsTable.vue b/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
index 7582eeb26..2919f0a02 100644
--- a/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
+++ b/app/frontend/src/components/forms/submission/MySubmissionsTable.vue
@@ -303,9 +303,7 @@ export default {
                 ? s.submissionStatus[0].createdBy
                 : '',
           };
-          s.submission &&
-            s.submission.submission &&
-            s.submission.submission.data &&
+          s?.submission?.submission?.data &&
             Object.keys(s.submission.submission.data).forEach((col) => {
               fields[col] = s.submission.submission.data[col];
             });