Skip to content

Commit

Permalink
fixed projectsDemo warnings
Browse files Browse the repository at this point in the history
  • Loading branch information
@AlekseyManetov
AlekseyManetov committed Feb 13, 2025
1 parent 1b84afa commit bfb2e76
Show file tree
Hide file tree
Showing 2 changed files with 39 additions and 18 deletions.
53 changes: 37 additions & 16 deletions app/src/demo/tables/editableTable/columns.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
{ ...props.rowLens.prop('name').toProps() }
renderEditor={ (props) => <TextInput { ...props } /> }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -44,19 +45,21 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
{ ...props.rowLens.prop('estimate').toProps() }
renderEditor={ (props) => (
<IEditableDebouncer
{ ...props }
value={ props.value }
onValueChange={ props.onValueChange }
render={ (editableProps) => {
return (
<NumericInput
{ ...props }
formatOptions={ { maximumFractionDigits: 1 } }
{ ...editableProps }
formatOptions={ { maximumFractionDigits: 1 } }
/>
);
} }
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -68,17 +71,21 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
renderCell: (props) => (
<DataTableCell
{ ...props.rowLens.prop('status').toProps() }
isReadonly={ true }
size="24"
renderEditor={ (editorProps) => (
<PickerInput
{ ...editorProps }
valueType="id"
placeholder="Add Status"
dataSource={ statusDataSource }
selectionMode="single"
minBodyWidth={ 150 }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
renderRow={ (props) => (
<DataPickerRow
{ ...props }
key={ props.key }
padding="12"
renderItem={ (item) => (
<PickerItem
Expand All @@ -91,6 +98,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
/>
) }
{ ...props }
key={ props.key }
/>
) }
/>
Expand All @@ -99,9 +107,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
const row = togglerProps.selection?.[0];
return (
<PickerToggler
{ ...props }
{ ...togglerProps }
isDisabled={ props.rowLens.prop('type').get() === 'story' }
icon={ () => (
<IconContainer
icon={ statusIcon }
Expand All @@ -113,10 +119,10 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
/>
);
} }
{ ...editorProps }
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -137,6 +143,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
/>
) }
{ ...props }
key={ props.key }

/>
),
Expand Down Expand Up @@ -164,6 +171,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -184,11 +192,13 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
renderRow={ (props) => (
<DataPickerRow
{ ...props }
key={ props.key }
renderItem={ (item) => (
<PickerItem
title={ item.name }
subtitle={ item.fullName }
{ ...props }
key={ props.key }
/>
) }
/>
Expand All @@ -198,6 +208,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -208,7 +219,7 @@ export function getColumnsTableMode(columnsProps: ColumnsProps) {
grow: 1,
allowResizing: false,
renderCell: (props) => (
<DataTableCell { ...props.rowLens.prop('description').toProps() } renderEditor={ (props) => <TextArea { ...props } autoSize={ true } /> } { ...props } />
<DataTableCell { ...props.rowLens.prop('description').toProps() } renderEditor={ (props) => <TextArea { ...props } autoSize={ true } /> } { ...props } key={ props.key } />
),
},
{
Expand Down Expand Up @@ -237,6 +248,7 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
{ ...props.rowLens.prop('name').toProps() }
renderEditor={ (props) => <TextInput { ...props } /> }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -249,22 +261,25 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
renderCell: (props) => (
<DataTableCell
{ ...props.rowLens.prop('estimate').toProps() }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
renderEditor={ (editorProps) => (
<IEditableDebouncer
{ ...editorProps }
value={ editorProps.value }
onValueChange={ editorProps.onValueChange }
render={ (editableProps) => {
return (
<NumericInput
{ ...editorProps }
formatOptions={ { maximumFractionDigits: 1 } }
{ ...editableProps }
isDisabled={ props.rowLens.prop('type').get() === 'story' }
formatOptions={ { maximumFractionDigits: 1 } }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
/>
);
} }
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -277,20 +292,24 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
<DataTableCell
{ ...props.rowLens.prop('status').toProps() }
size="24"
isReadonly={ props.rowLens.prop('type').get() === 'story' }
renderEditor={ (editorProps) => (
<PickerInput
valueType="id"
placeholder="Add Status"
dataSource={ statusDataSource }
selectionMode="single"
minBodyWidth={ 150 }
isDisabled={ props.rowLens.prop('type').get() === 'story' }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
renderRow={ (props) => (
<DataPickerRow
{ ...props }
key={ props.key }
padding="12"
renderItem={ (item) => (
<PickerItem
{ ...props }
key={ props.key }
title={ item.name }
icon={ () => (
<IconContainer
Expand All @@ -299,7 +318,6 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
cx={ cx(css.statusIcon, css[`statusIcon${item.id ? statusTags[item.id] : 'None'}`]) }
/>
) }
{ ...props }
/>
) }
/>
Expand All @@ -308,9 +326,7 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
const row = togglerProps.selection?.[0];
return (
<PickerToggler
{ ...props }
{ ...togglerProps }
isDisabled={ props.rowLens.prop('type').get() === 'story' }
icon={ () => (
<IconContainer
icon={ statusIcon }
Expand All @@ -326,6 +342,7 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -337,16 +354,18 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
renderCell: (props) => (
<DataTableCell
{ ...props.rowLens.prop('startDate').toProps() }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
renderEditor={ (editorProps) => (
<DatePicker
format="MMM D, YYYY"
placeholder=""
{ ...editorProps }
isDisabled={ props.rowLens.prop('type').get() === 'story' }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
value={ editorProps.value ? editorProps.value.split('T')[0] : editorProps.value }
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -357,12 +376,13 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
renderCell: (props) => (
<DataTableCell
{ ...props.rowLens.prop('dueDate').toProps() }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
renderEditor={ (editorProps) => (
<DatePicker
format="MMM D, YYYY"
placeholder=""
{ ...editorProps }
isDisabled={ props.rowLens.prop('type').get() === 'story' }
isReadonly={ props.rowLens.prop('type').get() === 'story' }
value={ editorProps.value ? editorProps.value.split('T')[0] : editorProps.value }
onValueChange={ (newDueDate) => {
editorProps
Expand All @@ -373,6 +393,7 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
/>
) }
{ ...props }
key={ props.key }
/>
),
},
Expand All @@ -390,7 +411,7 @@ export function getColumnsTimelineMode(columnsProps: ColumnsProps & { timelineCo
},
renderCell(props) {
return (
<TaskRow task={ props.rowLens.toProps().value } timelineController={ timelineController } />
<TaskRow key={ props.key } task={ props.rowLens.toProps().value } timelineController={ timelineController } />
);
},
},
Expand Down
4 changes: 2 additions & 2 deletions uui/components/tables/DataTableRow.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import * as React from 'react';
import { DataTableRow as uuiDataTableRow } from '@epam/uui-components';
import {
withMods, DataTableCellProps, DndActorRenderParams, DataTableRowProps as CoreDataTableRowProps,
withMods, DataTableCellProps, DataTableRowProps as CoreDataTableRowProps,
} from '@epam/uui-core';
import { DataTableCell } from './DataTableCell';
import { DataTableRowMods } from './types';
Expand All @@ -18,7 +18,7 @@ export const renderCell = (props: DataTableCellProps) => {
return <DataTableCell { ...props } key={ props.key } size={ mods.size } columnsGap={ mods.columnsGap } />;
};

export const renderDropMarkers = (props: DndActorRenderParams) => <DropMarker { ...props } enableBlocker={ true } />;
export const renderDropMarkers: DataTableRowProps['renderDropMarkers'] = ({ ref, ...props }) => <DropMarker { ...props } enableBlocker={ true } />;

export const propsMods = { renderCell, renderDropMarkers };

Expand Down

0 comments on commit bfb2e76

Please sign in to comment.