@@ -151,6 +150,15 @@ export default {
},
},
emits: ['dragging', 'field-created', 'refresh'],
+ computed: {
+ activeGroupBysWithFields() {
+ if (!this.includeGroupBy) return []
+ return this.activeGroupBys.map((groupBy) => ({
+ groupBy,
+ field: this.getGroupByField(groupBy),
+ }))
+ },
+ },
methods: {
/**
* After newField is created pressing "insert left" or "insert right" button,
@@ -192,10 +200,6 @@ export default {
onShownCreateFieldContext() {
this.$refs.createFieldContext.showFieldTypesDropdown(this.$el)
},
- getField(allFieldsInTable, groupBy) {
- const field = allFieldsInTable.find((f) => f.id === groupBy.field)
- return field
- },
},
}
diff --git a/web-frontend/modules/database/components/view/grid/GridViewSection.vue b/web-frontend/modules/database/components/view/grid/GridViewSection.vue
index b40079713a..f06145e7fe 100644
--- a/web-frontend/modules/database/components/view/grid/GridViewSection.vue
+++ b/web-frontend/modules/database/components/view/grid/GridViewSection.vue
@@ -75,7 +75,6 @@
>
@@ -423,9 +422,7 @@ export default {
return false
}
return groupBys.slice(0, groupByIndex + 1).every((groupBy) => {
- const groupByField = this.allFieldsInTable.find(
- (f) => f.id === groupBy.field
- )
+ const groupByField = this.getGroupByField(groupBy)
const groupByFieldType = this.$registry.get(
'field',
groupByField.type
@@ -448,9 +445,7 @@ export default {
const groupByFields = groupBys
.slice(0, groupByIndex + 1)
.map((groupBy) => {
- return this.allFieldsInTable.find(
- (f) => f.id === groupBy.field
- )
+ return this.getGroupByField(groupBy)
})
return fieldValuesAreEqualInObjects(
groupByFields,
diff --git a/web-frontend/modules/database/components/view/grid/GroupByFieldLinkRow.vue b/web-frontend/modules/database/components/view/grid/GroupByFieldLinkRow.vue
new file mode 100644
index 0000000000..79615e5f1f
--- /dev/null
+++ b/web-frontend/modules/database/components/view/grid/GroupByFieldLinkRow.vue
@@ -0,0 +1,40 @@
+
+
+
+
+
+ {{ item.value || 'unnamed row ' + item.id }}
+
+
+
+ ...
+
+
+
+
+
+
diff --git a/web-frontend/modules/database/fieldTypes.js b/web-frontend/modules/database/fieldTypes.js
index ce40dfa8b9..1a8c079c09 100644
--- a/web-frontend/modules/database/fieldTypes.js
+++ b/web-frontend/modules/database/fieldTypes.js
@@ -114,6 +114,7 @@ import RowCardFieldEmail from '@baserow/modules/database/components/card/RowCard
import RowCardFieldFile from '@baserow/modules/database/components/card/RowCardFieldFile'
import RowCardFieldFormula from '@baserow/modules/database/components/card/RowCardFieldFormula'
import RowCardFieldLinkRow from '@baserow/modules/database/components/card/RowCardFieldLinkRow'
+import GroupByFieldLinkRow from '@baserow/modules/database/components/view/grid/GroupByFieldLinkRow'
import RowCardFieldMultipleSelect from '@baserow/modules/database/components/card/RowCardFieldMultipleSelect'
import RowCardFieldNumber from '@baserow/modules/database/components/card/RowCardFieldNumber'
import RowCardFieldRating from '@baserow/modules/database/components/card/RowCardFieldRating'
@@ -1360,6 +1361,10 @@ export class LinkRowFieldType extends FieldType {
return RowCardFieldLinkRow
}
+ getGroupByComponent() {
+ return GroupByFieldLinkRow
+ }
+
getRowHistoryEntryComponent() {
return RowHistoryFieldLinkRow
}
@@ -4262,6 +4267,14 @@ export class FormulaFieldType extends mix(
return RowCardFieldFormula
}
+ getGroupByComponent(field) {
+ const formulaType = this.getFormulaType(field)
+ if (formulaType) {
+ return formulaType.getCardComponent(field)
+ }
+ return this.getCardComponent(field)
+ }
+
getFilterInputComponent(field, filterType) {
return this.getFormulaType(field)?.getFilterInputComponent(
field,
diff --git a/web-frontend/modules/database/mixins/gridViewHelpers.js b/web-frontend/modules/database/mixins/gridViewHelpers.js
index 0498ef7435..171d9f84b7 100644
--- a/web-frontend/modules/database/mixins/gridViewHelpers.js
+++ b/web-frontend/modules/database/mixins/gridViewHelpers.js
@@ -51,6 +51,11 @@ export default {
},
},
methods: {
+ getGroupByField(groupBy) {
+ return this.$store.getters['field/getAll'].find(
+ (f) => f.id === groupBy.field
+ )
+ },
getFieldWidth(field) {
const fieldId = field?.id
const hasFieldOptions =
diff --git a/web-frontend/modules/database/store/view/grid.js b/web-frontend/modules/database/store/view/grid.js
index 82f3ff24e7..bb73155a6e 100644
--- a/web-frontend/modules/database/store/view/grid.js
+++ b/web-frontend/modules/database/store/view/grid.js
@@ -3830,8 +3830,11 @@ export const getters = {
return row._.selected && row._.selectedFieldId !== -1
})
},
- getActiveGroupBys(state) {
- return state.activeGroupBys
+ getActiveGroupBys(state, getters, rootState, rootGetters) {
+ const fields = rootGetters['field/getAll']
+ return state.activeGroupBys.filter((groupBy) =>
+ fields.some((f) => f.id === groupBy.field)
+ )
},
getGroupByMetadata(state) {
return state.groupByMetadata
diff --git a/web-frontend/modules/database/viewTypes.js b/web-frontend/modules/database/viewTypes.js
index 1a3f3fe418..fc86543eeb 100644
--- a/web-frontend/modules/database/viewTypes.js
+++ b/web-frontend/modules/database/viewTypes.js
@@ -603,6 +603,7 @@ export class GridViewType extends ViewType {
includeFieldOptions = false,
sourceEvent = null
) {
+ await store.dispatch(storePrefix + 'view/grid/updateActiveGroupBys', [])
const isPublic = store.getters[storePrefix + 'view/public/getIsPublic']
const adhocFiltering = isAdhocFiltering(
this.app,