Skip to content

Commit

Permalink
Revert changes unrelated to cellContext
Browse files Browse the repository at this point in the history
  • Loading branch information
@cee-chen
cee-chen committed Mar 7, 2024
1 parent e8ce9c2 commit e74d022
Show file tree
Hide file tree
Showing 37 changed files with 1,095 additions and 1,469 deletions.
61 changes: 29 additions & 32 deletions src-docs/src/views/datagrid/advanced/custom_renderer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ import {
EuiDataGridPaginationProps,
EuiDataGridSorting,
EuiDataGridColumnSortingConfig,
RenderCellValue,
} from '../../../../../src';

const raw_data: Array<{ [key: string]: string }> = [];
Expand Down Expand Up @@ -68,14 +67,6 @@ const columns = [
},
];

const checkboxRowCellRender: RenderCellValue = ({ rowIndex }) => (
<EuiCheckbox
id={`select-row-${rowIndex}`}
aria-label="Select row"
onChange={() => {}}
/>
);

const leadingControlColumns: EuiDataGridProps['leadingControlColumns'] = [
{
id: 'selection',
Expand All @@ -87,7 +78,13 @@ const leadingControlColumns: EuiDataGridProps['leadingControlColumns'] = [
onChange={() => {}}
/>
),
rowCellRender: checkboxRowCellRender,
rowCellRender: ({ rowIndex }) => (
<EuiCheckbox
id={`select-row-${rowIndex}`}
aria-label="Select row"
onChange={() => {}}
/>
),
},
];

Expand All @@ -106,22 +103,6 @@ const trailingControlColumns: EuiDataGridProps['trailingControlColumns'] = [
},
];

const RowCellRender: RenderCellValue = ({ setCellProps, rowIndex }) => {
setCellProps({ style: { width: '100%', height: 'auto' } });

const firstName = raw_data[rowIndex].name.split(', ')[1];
const isGood = faker.datatype.boolean();
return (
<>
{firstName}&apos;s account has {isGood ? 'no' : ''} outstanding fees.{' '}
<EuiIcon
type={isGood ? 'checkInCircleFilled' : 'error'}
color={isGood ? 'success' : 'danger'}
/>
</>
);
};

// The custom row details is actually a trailing control column cell with
// a hidden header. This is important for accessibility and markup reasons
// @see https://fuschia-stretch.glitch.me/ for more
Expand All @@ -139,7 +120,21 @@ const rowDetails: EuiDataGridProps['trailingControlColumns'] = [

// When rendering this custom cell, we'll want to override
// the automatic width/heights calculated by EuiDataGrid
rowCellRender: RowCellRender,
rowCellRender: ({ setCellProps, rowIndex }) => {
setCellProps({ style: { width: '100%', height: 'auto' } });

const firstName = raw_data[rowIndex].name.split(', ')[1];
const isGood = faker.datatype.boolean();
return (
<>
{firstName}&apos;s account has {isGood ? 'no' : ''} outstanding fees.{' '}
<EuiIcon
type={isGood ? 'checkInCircleFilled' : 'error'}
color={isGood ? 'success' : 'danger'}
/>
</>
);
},
},
];

Expand All @@ -149,10 +144,10 @@ const footerCellValues: { [key: string]: string } = {
.toLocaleString('en-US', { style: 'currency', currency: 'USD' })}`,
};

const renderCellValue: RenderCellValue = ({ rowIndex, columnId }) =>
raw_data[rowIndex][columnId];

const RenderFooterCellValue: RenderCellValue = ({ columnId, setCellProps }) => {
const RenderFooterCellValue: EuiDataGridProps['renderFooterCellValue'] = ({
columnId,
setCellProps,
}) => {
const value = footerCellValues[columnId];

useEffect(() => {
Expand Down Expand Up @@ -303,7 +298,9 @@ export default () => {
onChangeItemsPerPage: onChangePageSize,
}}
rowCount={raw_data.length}
renderCellValue={renderCellValue}
renderCellValue={({ rowIndex, columnId }) =>
raw_data[rowIndex][columnId]
}
renderFooterCellValue={RenderFooterCellValue}
renderCustomGridBody={RenderCustomGridBody}
height={autoHeight ? undefined : 400}
Expand Down
8 changes: 3 additions & 5 deletions src-docs/src/views/datagrid/advanced/ref.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import {
EuiDataGridColumnSortingConfig,
EuiDataGridPaginationProps,
EuiDataGridSorting,
RenderCellValue,
} from '../../../../../src';

const raw_data: Array<{ [key: string]: string }> = [];
Expand All @@ -34,9 +33,6 @@ for (let i = 1; i < 100; i++) {
});
}

const renderCellValue: RenderCellValue = ({ rowIndex, columnId }) =>
raw_data[rowIndex][columnId];

export default () => {
const dataGridRef = useRef<EuiDataGridRefProps | null>(null);

Expand Down Expand Up @@ -223,7 +219,9 @@ export default () => {
sorting={{ columns: sortingColumns, onSort }}
inMemory={{ level: 'sorting' }}
rowCount={raw_data.length}
renderCellValue={renderCellValue}
renderCellValue={({ rowIndex, columnId }) =>
raw_data[rowIndex][columnId]
}
pagination={{
...pagination,
onChangePage: onChangePage,
Expand Down
29 changes: 11 additions & 18 deletions src-docs/src/views/datagrid/cells_popovers/cell_popover_is_expandable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import {
EuiDataGrid,
EuiDataGridColumnCellAction,
EuiDataGridColumn,
RenderCellValue as RenderCellValueType,
} from '../../../../../src';

const cellActions: EuiDataGridColumnCellAction[] = [
Expand Down Expand Up @@ -51,22 +50,6 @@ for (let i = 1; i < 5; i++) {
});
}

const RenderCellValue: RenderCellValueType = ({
rowIndex,
columnId,
setCellProps,
}) => {
const value = data[rowIndex][columnId];

useEffect(() => {
if (columnId === 'boolean' && value === 'false') {
setCellProps({ isExpandable: false });
}
}, [columnId, value, setCellProps]);

return value;
};

export default () => {
const [visibleColumns, setVisibleColumns] = useState(
columns.map(({ id }) => id)
Expand All @@ -78,7 +61,17 @@ export default () => {
columns={columns}
columnVisibility={{ visibleColumns, setVisibleColumns }}
rowCount={data.length}
renderCellValue={RenderCellValue}
renderCellValue={({ rowIndex, columnId, setCellProps }) => {
const value = data[rowIndex][columnId];

useEffect(() => {
if (columnId === 'boolean' && value === 'false') {
setCellProps({ isExpandable: false });
}
}, [columnId, value, setCellProps]);

return value;
}}
/>
);
};
6 changes: 1 addition & 5 deletions src-docs/src/views/datagrid/cells_popovers/cell_popover_rendercellpopover.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import {
EuiCopy,
EuiText,
EuiImage,
RenderCellValue as RenderCellValueType,
} from '../../../../../src';

const cellActions: EuiDataGridColumnCellAction[] = [
Expand Down Expand Up @@ -164,9 +163,6 @@ const RenderCellPopover = (props: EuiDataGridCellPopoverElementProps) => {
);
};

const renderCellValue: RenderCellValueType = ({ rowIndex, columnId }) =>
data[rowIndex][columnId];

export default () => {
const [visibleColumns, setVisibleColumns] = useState(
columns.map(({ id }) => id)
Expand All @@ -178,7 +174,7 @@ export default () => {
columns={columns}
columnVisibility={{ visibleColumns, setVisibleColumns }}
rowCount={data.length}
renderCellValue={renderCellValue}
renderCellValue={({ rowIndex, columnId }) => data[rowIndex][columnId]}
renderCellPopover={RenderCellPopover}
/>
);
Expand Down
6 changes: 1 addition & 5 deletions src-docs/src/views/datagrid/cells_popovers/visible_cell_actions.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import {
EuiDataGrid,
EuiDataGridColumnCellAction,
EuiDataGridColumn,
RenderCellValue as RenderCellValueType,
} from '../../../../../src/components';

const cellActions1: EuiDataGridColumnCellAction[] = [
Expand Down Expand Up @@ -80,9 +79,6 @@ for (let i = 1; i < 5; i++) {
});
}

const renderCellValue: RenderCellValueType = ({ rowIndex, columnId }) =>
data[rowIndex][columnId];

export default () => {
const [visibleColumns, setVisibleColumns] = useState(
columns.map(({ id }) => id)
Expand All @@ -94,7 +90,7 @@ export default () => {
columns={columns}
columnVisibility={{ visibleColumns, setVisibleColumns }}
rowCount={data.length}
renderCellValue={renderCellValue}
renderCellValue={({ rowIndex, columnId }) => data[rowIndex][columnId]}
/>
);
};
4 changes: 2 additions & 2 deletions src-docs/src/views/datagrid/styling/row_height_auto.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import githubData from '../_row_auto_height_data.json';

import {
EuiDataGrid,
RenderCellValue as RenderCellValueType,
EuiDataGridProps,
EuiLink,
EuiAvatar,
EuiBadge,
Expand Down Expand Up @@ -68,7 +68,7 @@ const columns = [
// instead of loading up front, generate entries on the fly
const raw_data: DataShape[] = githubData;

const RenderCellValue: RenderCellValueType = ({
const RenderCellValue: EuiDataGridProps['renderCellValue'] = ({
rowIndex,
columnId,
isDetails,
Expand Down
4 changes: 2 additions & 2 deletions src-docs/src/views/datagrid/styling/row_height_fixed.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import githubData from '../_row_auto_height_data.json';

import {
EuiDataGrid,
RenderCellValue as RenderCellValueType,
EuiDataGridProps,
EuiLink,
EuiAvatar,
EuiBadge,
Expand Down Expand Up @@ -68,7 +68,7 @@ const columns = [
// instead of loading up front, generate entries on the fly
const raw_data: DataShape[] = githubData;

const RenderCellValue: RenderCellValueType = ({
const RenderCellValue: EuiDataGridProps['renderCellValue'] = ({
rowIndex,
columnId,
isDetails,
Expand Down
4 changes: 2 additions & 2 deletions src-docs/src/views/datagrid/styling/row_line_height.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
EuiDataGrid,
EuiDataGridColumnSortingConfig,
EuiDataGridPaginationProps,
RenderCellValue as RenderCellValueType,
EuiDataGridProps,
EuiDataGridSorting,
formatDate,
} from '../../../../../src';
Expand Down Expand Up @@ -62,7 +62,7 @@ const columns = [
// instead of loading up front, generate entries on the fly
const raw_data: DataShape[] = githubData;

const RenderCellValue: RenderCellValueType = ({
const RenderCellValue: EuiDataGridProps['renderCellValue'] = ({
rowIndex,
columnId,
isDetails,
Expand Down
6 changes: 1 addition & 5 deletions src-docs/src/views/datagrid/toolbar/additional_controls.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ import {
EuiContextMenuPanel,
EuiPopover,
EuiDataGridPaginationProps,
RenderCellValue,
} from '../../../../../src';

const columns = [
Expand Down Expand Up @@ -51,9 +50,6 @@ for (let i = 1; i < 20; i++) {
});
}

const renderCellValue: RenderCellValue = ({ rowIndex, columnId }) =>
data[rowIndex][columnId];

export default () => {
const [pagination, setPagination] = useState({ pageIndex: 0 });
const [isFlyoutVisible, setIsFlyoutVisible] = useState(false);
Expand Down Expand Up @@ -131,7 +127,7 @@ export default () => {
border: 'horizontal',
header: 'underline',
}}
renderCellValue={renderCellValue}
renderCellValue={({ rowIndex, columnId }) => data[rowIndex][columnId]}
pagination={{
...pagination,
onChangeItemsPerPage: setPageSize,
Expand Down
6 changes: 1 addition & 5 deletions src-docs/src/views/datagrid/toolbar/render_custom_toolbar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@ import {
EuiFlexGroup,
EuiFlexItem,
euiScreenReaderOnly,
RenderCellValue,
} from '../../../../../src';

const raw_data: Array<{ [key: string]: string }> = [];
Expand Down Expand Up @@ -83,9 +82,6 @@ const renderCustomToolbar: EuiDataGridToolbarProps['renderCustomToolbar'] = ({
);
};

const renderCellValue: RenderCellValue = ({ rowIndex, columnId }) =>
raw_data[rowIndex][columnId];

// Some additional custom settings to show in the Display popover
const AdditionalDisplaySettings = () => {
const [exampleSettingValue, setExampleSettingValue] = useState<number>(10);
Expand Down Expand Up @@ -130,7 +126,7 @@ export default () => {
columnVisibility={{ visibleColumns, setVisibleColumns }}
sorting={{ columns: sortingColumns, onSort }}
rowCount={raw_data.length}
renderCellValue={renderCellValue}
renderCellValue={({ rowIndex, columnId }) => raw_data[rowIndex][columnId]}
gridStyle={{ border: 'none', header: 'underline' }}
renderCustomToolbar={renderCustomToolbar}
toolbarVisibility={{
Expand Down
8 changes: 4 additions & 4 deletions src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -587,7 +587,7 @@ exports[`EuiDataGrid rendering renders additional toolbar controls 1`] = `
style="position: relative; height: 9007199254740991px; width: 9007199254740991px; overflow: auto; will-change: transform; direction: ltr;"
>
<div
style="width: 200px; height: 202px;"
style="height: 202px; width: 200px;"
>
<div
class="euiDataGridHeader"
Expand Down Expand Up @@ -1014,7 +1014,7 @@ exports[`EuiDataGrid rendering renders control columns 1`] = `
style="position: relative; height: 9007199254740991px; width: 9007199254740991px; overflow: auto; will-change: transform; direction: ltr;"
>
<div
style="width: 300px; height: 202px;"
style="height: 202px; width: 300px;"
>
<div
class="euiDataGridHeader"
Expand Down Expand Up @@ -1632,7 +1632,7 @@ exports[`EuiDataGrid rendering renders custom column headers 1`] = `
style="position: relative; height: 9007199254740991px; width: 9007199254740991px; overflow: auto; will-change: transform; direction: ltr;"
>
<div
style="width: 200px; height: 202px;"
style="height: 202px; width: 200px;"
>
<div
class="euiDataGridHeader"
Expand Down Expand Up @@ -2058,7 +2058,7 @@ exports[`EuiDataGrid rendering renders with common and div attributes 1`] = `
style="position: relative; height: 9007199254740991px; width: 9007199254740991px; overflow: auto; will-change: transform; direction: ltr;"
>
<div
style="width: 200px; height: 202px;"
style="height: 202px; width: 200px;"
>
<div
class="euiDataGridHeader"
Expand Down
2 changes: 1 addition & 1 deletion src/components/datagrid/body/__snapshots__/data_grid_body_virtualized.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ exports[`EuiDataGridBodyVirtualized renders 1`] = `
style="position: relative; height: 9007199254740991px; width: 9007199254740991px; overflow: auto; will-change: transform; direction: ltr;"
>
<div
style="width: 200px; height: 34px;"
style="height: 34px; width: 200px;"
>
<div
class="euiDataGridHeader"
Expand Down
Loading

0 comments on commit e74d022

Please sign in to comment.