-
Notifications
You must be signed in to change notification settings - Fork 2.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: table record group #8781
feat: table record group #8781
Conversation
b4acc66
to
b9200de
Compare
...ty-front/src/modules/object-record/record-index/states/recordIndexAllRowIdsComponentState.ts
Show resolved
Hide resolved
...ules/object-record/record-index/states/selectors/recordIndexAllRecordIdsComponentSelector.ts
Outdated
Show resolved
Hide resolved
...wenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx
Outdated
Show resolved
Hide resolved
...cord/record-table/record-table-body/components/RecordTableBodyRecordGroupDragDropContext.tsx
Outdated
Show resolved
Hide resolved
...cord/record-table/record-table-body/components/RecordTableBodyRecordGroupDragDropContext.tsx
Outdated
Show resolved
Hide resolved
...ules/object-record/record-table/record-table-body/components/RecordTableRecordGroupsBody.tsx
Outdated
Show resolved
Hide resolved
...src/modules/object-record/record-table/record-table-row/components/RecordTableRowWrapper.tsx
Outdated
Show resolved
Hide resolved
...object-record/record-table/record-table-section/components/RecordTableRecordGroupSection.tsx
Outdated
Show resolved
Hide resolved
|
||
const StyledRecordGroupSection = styled.td` | ||
border-bottom: 1px solid ${({ theme }) => theme.border.color.light}; | ||
padding-bottom: 6px; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
use theme here (I'm a bit surprised by the 6px value, is this in Figma?
We usually have a 4px scale for paddings
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes it's what I have on Figma, strange
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@Bonapara FYI
...ct-record/record-table/states/selectors/numberOfTableRowIdsByGroupComponentFamilySelector.ts
Outdated
Show resolved
Hide resolved
...s/object-record/record-table/states/selectors/numberOfVisibleTableColumnComponentSelector.ts
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
PR Summary
This PR implements record grouping functionality for tables, allowing rows to be grouped, collapsed/expanded, and reordered similar to the board view functionality.
- Added
RecordTableRecordGroupSection
component with collapsible sections and group headers in/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSection.tsx
- Replaced
recordIndexAllRowIdsComponentState
withrecordIndexAllRecordIdsComponentSelector
across components for consistent record ID management - Added drag-and-drop support for record reordering within groups via
RecordTableBodyRecordGroupDragDropContext
- Implemented group visibility toggle state with
isRecordGroupTableSectionToggledComponentState
- Added animation support via Framer Motion (noted as not working yet) in
RecordTableRecordGroupRows
💡 (4/5) You can add custom instructions or style guidelines for the bot here!
38 file(s) reviewed, 32 comment(s)
Edit PR Review Bot Settings | Greptile
.../src/modules/object-record/record-board/record-board-column/components/RecordBoardColumn.tsx
Show resolved
Hide resolved
...object-record/record-board/states/selectors/recordBoardSelectedRecordIdsComponentSelector.ts
Show resolved
Hide resolved
...ty-front/src/modules/object-record/record-index/states/recordIndexAllRowIdsComponentState.ts
Show resolved
Hide resolved
...ules/object-record/record-index/states/selectors/recordIndexAllRecordIdsComponentSelector.ts
Outdated
Show resolved
Hide resolved
...ules/object-record/record-index/states/selectors/recordIndexAllRecordIdsComponentSelector.ts
Show resolved
Hide resolved
...odules/object-record/record-table/states/selectors/allRowsSelectedStatusComponentSelector.ts
Show resolved
Hide resolved
...s/object-record/record-table/states/selectors/numberOfVisibleTableColumnComponentSelector.ts
Outdated
Show resolved
Hide resolved
...s/object-record/record-table/states/selectors/numberOfVisibleTableColumnComponentSelector.ts
Outdated
Show resolved
Hide resolved
...t/src/modules/object-record/record-table/states/selectors/selectedRowIdsComponentSelector.ts
Show resolved
Hide resolved
...src/modules/object-record/record-table/states/selectors/unselectedRowIdsComponentSelector.ts
Show resolved
Hide resolved
packages/twenty-front/src/modules/object-record/hooks/useCreateOneRecord.ts
Outdated
Show resolved
Hide resolved
packages/twenty-front/src/modules/object-record/hooks/useCreateOneRecord.ts
Outdated
Show resolved
Hide resolved
...-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupFieldsContent.tsx
Outdated
Show resolved
Hide resolved
...-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupFieldsContent.tsx
Outdated
Show resolved
Hide resolved
packages/twenty-front/src/modules/object-record/utils/addDefaultValueRecordInput.ts
Outdated
Show resolved
Hide resolved
be8df9e
to
9d2254d
Compare
Fix #8401 #8402
This PR is only taking care or displaying properly the record group on the table.
Record-reorder within group has also been prepared.
Start of collapsible animation has been done, but not working for now.