Use table id for events

Signed-off-by: Cleopatra Enjeck M <patrathewhiz@gmail.com>

src/modules/main/partials/TableView.vue

@@ -2,6 +2,7 @@
 	<NcTable v-if="columns.length > 0"
 		:rows="rows"
 		:columns="columns"
+		:table-id="element.id"
 		:download-title="element.title"
 		:view-setting.sync="localViewSetting"
 		:can-read-rows="canReadRows"
@@ -109,29 +110,44 @@ export default {
 	},
 
 	methods: {
+		setActiveElement() {
+			if (this.isView) {
+				this.$store.commit('setActiveViewId', parseInt(this.element.id))
+			} else {
+				this.$store.commit('setActiveTableId', parseInt(this.element.id))
+			}
+		},
 		createColumn() {
+			this.setActiveElement()
 			emit('tables:column:create')
 		},
 		editColumn(column) {
+			this.setActiveElement()
 			emit('tables:column:edit', column)
 		},
 		deleteColumn(column) {
+			this.setActiveElement()
 			emit('tables:column:delete', column)
 		},
 		createRow() {
+			this.setActiveElement()
 			emit('tables:row:create', this.columns)
 		},
 		editRow(rowId) {
+			this.setActiveElement()
 			emit('tables:row:edit', { row: this.rows.find(r => r.id === rowId), columns: this.columns })
 		},
 		deleteSelectedRows(rows) {
+			this.setActiveElement()
 			emit('tables:row:delete', rows)
 		},
 
 		toggleShare() {
+			this.setActiveElement()
 			emit('tables:sidebar:sharing', { open: true, tab: 'sharing' })
 		},
 		actionShowIntegration() {
+			this.setActiveElement()
 			emit('tables:sidebar:integration', { open: true, tab: 'integration' })
 		},
 		openImportModal(element) {

src/modules/main/sections/MainWrapper.vue

@@ -14,6 +14,7 @@
 				@toggle-share="toggleShare"
 				@show-integration="showIntegration" />
 			<CustomTable v-else
+				:table-id="element.id"
 				:table="element"
 				:columns="columns"
 				:rows="rows"
@@ -84,16 +85,26 @@ export default {
 	},
 
 	methods: {
+		setActiveElement() {
+			if (this.isView) {
+				this.$store.commit('setActiveViewId', parseInt(this.element.id))
+			} else {
+				this.$store.commit('setActiveTableId', parseInt(this.element.id))
+			}
+		},
 		createColumn() {
+			this.setActiveElement()
 			emit('tables:column:create')
 		},
 		downloadCSV() {
 			this.downloadCsv(this.rows, this.columns, this.element.title)
 		},
 		toggleShare() {
+			this.setActiveElement()
 			emit('tables:sidebar:sharing', { open: true, tab: 'sharing' })
 		},
 		showIntegration() {
+			this.setActiveElement()
 			emit('tables:sidebar:integration', { open: true, tab: 'integration' })
 		},
 		openImportModal() {
@@ -129,6 +140,7 @@ export default {
 					isView: this.isView,
 				}
 				if (this.activeRowId) {
+					this.setActiveElement()
 					emit('tables:row:edit', { row: this.rows.find(r => r.id === this.activeRowId), columns: this.columns })
 				}
 				this.localLoading = false

src/modules/modals/DeleteRows.vue

@@ -46,7 +46,7 @@ export default {
 			if (error) {
 				showError(t('tables', 'Error occurred while deleting rows.'))
 			}
-			emit('tables:selected-rows:deselect', {})
+			emit('tables:selected-rows:deselect', this.activeElement.id)
 			this.$emit('cancel')
 		},
 	},

src/shared/components/ncTable/NcTable.vue

@@ -41,26 +41,28 @@ deselect-all-rows        -> unselect all rows, e.g. after deleting selected rows
 		<div class="options row" style="padding-right: calc(var(--default-grid-baseline) * 2);">
 			<Options :rows="rows"
 				:columns="parsedColumns"
+				:table-id="tableId"
 				:selected-rows="localSelectedRows"
 				:show-options="parsedColumns.length !== 0"
 				:view-setting.sync="localViewSetting"
 				:config="config"
-				@create-row="$emit('create-row')"
+				@create-row="$emit('create-row', tableId)"
 				@download-csv="data => downloadCsv(data, parsedColumns, downloadTitle)"
 				@set-search-string="str => setSearchString(str)"
-				@delete-selected-rows="rowIds => $emit('delete-selected-rows', rowIds)" />
+				@delete-selected-rows="rowIds => $emit('delete-selected-rows', rowIds, tableId)" />
 		</div>
 		<div class="custom-table row">
 			<CustomTable v-if="config.canReadRows || (config.canCreateRows && rows.length > 0)"
 				:columns="parsedColumns"
 				:rows="rows"
+				:table-id="tableId"
 				:view-setting.sync="localViewSetting"
 				:config="config"
-				@create-row="$emit('create-row')"
-				@edit-row="rowId => $emit('edit-row', rowId)"
-				@create-column="$emit('create-column')"
-				@edit-column="col => $emit('edit-column', col)"
-				@delete-column="col => $emit('delete-column', col)"
+				@create-row="$emit('create-row', tableId)"
+				@edit-row="rowId => $emit('edit-row', rowId, tableId)"
+				@create-column="$emit('create-column', tableId)"
+				@edit-column="col => $emit('edit-column', col, tableId)"
+				@delete-column="col => $emit('delete-column', col, tableId)"
 				@update-selected-rows="rowIds => localSelectedRows = rowIds"
 				@download-csv="data => downloadCsv(data, parsedColumns, table)">
 				<template #actions>
@@ -74,7 +76,7 @@ deselect-all-rows        -> unselect all rows, e.g. after deleting selected rows
 					<Plus :size="25" />
 				</template>
 				<template #action>
-					<NcButton :aria-label="t('tables', 'Create row')" type="primary" @click="$emit('create-row')">
+					<NcButton :aria-label="t('tables', 'Create row')" type="primary" @click="$emit('create-row', tableId)">
 						<template #icon>
 							<Plus :size="25" />
 						</template>
@@ -122,6 +124,10 @@ export default {
 			type: Array,
 			default: () => [],
 		},
+		tableId: {
+			type: Number,
+			default: null,
+		},
 		downloadTitle: {
 			type: String,
 			default: t('tables', 'Download'),
@@ -225,15 +231,17 @@ export default {
 		},
 	},
 	mounted() {
-		subscribe('tables:selected-rows:deselect', this.deselectRows)
+		subscribe('tables:selected-rows:deselect', tableId => { this.deselectRows(tableId) })
 	},
 	beforeDestroy() {
-		unsubscribe('tables:selected-rows:deselect', this.deselectRows)
+		unsubscribe('tables:selected-rows:deselect', tableId => { this.deselectRows(tableId) })
 	},
 	methods: {
 		t,
-		deselectRows() {
-			this.localSelectedRows = []
+		deselectRows(tableId) {
+			if (parseInt(tableId) === parseInt(this.tableId)) {
+				this.localSelectedRows = []
+			}
 		},
 		setSearchString(str) {
 			this.localViewSetting.searchString = str !== '' ? str : null

src/shared/components/ncTable/sections/CustomTable.vue

@@ -57,6 +57,10 @@ export default {
 			type: Array,
 			default: () => [],
 		},
+		tableId: {
+			type: Number,
+			default: null,
+		},
 		viewSetting: {
 			type: Object,
 			default: null,
@@ -215,10 +219,10 @@ export default {
 	},
 
 	mounted() {
-		subscribe('tables:selected-rows:deselect', this.deselectAllRows)
+		subscribe('tables:selected-rows:deselect', tableId => { this.deselectAllRows(tableId) })
 	},
 	beforeDestroy() {
-		unsubscribe('tables:selected-rows:deselect', this.deselectAllRows)
+		unsubscribe('tables:selected-rows:deselect', tableId => { this.deselectAllRows(tableId) })
 	},
 
 	methods: {
@@ -239,8 +243,10 @@ export default {
 			}
 			return null
 		},
-		deselectAllRows() {
-			this.selectedRows = []
+		deselectAllRows(tableId) {
+			if (parseInt(tableId) === parseInt(this.tableId)) {
+				this.selectedRows = []
+			}
 		},
 		selectAllRows(value) {
 			this.selectedRows = []

src/shared/components/ncTable/sections/Options.vue

@@ -97,6 +97,10 @@ export default {
 			type: Array,
 			default: () => [],
 		},
+		tableId: {
+			type: Number,
+			default: null,
+		},
 		showOptions: {
 			type: Boolean,
 			default: true,
@@ -158,7 +162,7 @@ export default {
 			this.$emit('delete-selected-rows', this.selectedRows)
 		},
 		deselectAllRows() {
-			emit('tables:selected-rows:deselect', {})
+			emit('tables:selected-rows:deselect', this.tableId)
 		},
 	},
 }