feat(Table): add renderRowActions property #1353
Conversation
|
Preview is ready. |
|
Playwright Test Component is ready. |
GermanVor
force-pushed
the
renderRowActions
branch
from
faece26
to
21df027
Compare
| export interface WithTableActionsProps<I> { | ||
| getRowActions: (item: I, index: number) => TableActionConfig<I>[]; | ||
| getRowActions?: (item: I, index: number) => TableActionConfig<I>[]; | ||
| renderRowActions?: (props: RenderRowActionsProps<I>) => React.ReactNode; |
There was a problem hiding this comment.
May be same interface as a getRowActions?
getRowActions?: (item: I, index: number) => React.ReactNode;
There was a problem hiding this comment.
it is for passing React components instead simple functions
korvin89
changed the title
| @@ -3,6 +3,7 @@ import React from 'react'; | |||
| import {Ellipsis} from '@gravity-ui/icons'; | |||
| import _memoize from 'lodash/memoize'; | |||
|
|
|||
| import type {PopperPlacement} from '../../../../hooks/private'; | |||
There was a problem hiding this comment.
We should consume this type from Popup index
There was a problem hiding this comment.
That's right, it takes from ../hooks/private/index/usePopper/index/usePopper
and PopperPlacement is used in PopperProps and PopupProps extends from PopperProps
| const b = block('table'); | ||
| const actionsCn = b('actions'); | ||
| const BUTTON_CLASS_NAME = b('actions-button'); |
There was a problem hiding this comment.
Why this variable named in different case?
| @@ -131,6 +132,27 @@ const WithTableActionsTemplate: StoryFn<TableProps<DataItem>> = (args) => { | |||
| }; | |||
| export const HOCWithTableActions = WithTableActionsTemplate.bind({}); | |||
|
|
|||
| // --------------------------------- | |||
| const WithTableActionsRenderRowActionsTemplate: StoryFn<TableProps<DataItem>> = (args) => { | |||
There was a problem hiding this comment.
Let's add this story to HOC with table actions section.
There was a problem hiding this comment.
but it is impossible to combine getRowActions and renderRowActions at the same time.
renderRowActions will override getRowActions
There was a problem hiding this comment.
No need to! It will be two stories with different props, just like in https://github.com/gravity-ui/uikit/blob/main/src/components/Table/__stories__/Adaptive.tsx .
It will be nice if you render labels for each (in the example above there are no labels and it looks a little messy).
| index: number; | ||
| }; | ||
|
|
||
| const DefaultRenderRowActions = <I extends TableDataItem>({ |
There was a problem hiding this comment.
It's a component, so it's name seems to look better like DefaultRowActions.
#311