Custom and dynamic columns in spreadsheet

[anistouri]

No description provided.

[github-actions]

license-eye has totally checked 631 files.

Valid	Invalid	Ignored	Fixed
586	2	43	0

Click to see the invalid file list

• src/components/spreadsheet/custom-columns/custom-column-table.tsx
• src/components/spreadsheet/custom-columns/use-custom-column.ts

[TheMaskedTurtle]

Suggested change

	const numberColumns = useStateNumber(0);
	const dialogOpen = useStateBoolean(false);
	const allDefinitions = useSelector((state: AppState) => state.allCustomColumnsDefinitions[TABLES_NAMES[indexTab]]);
	const dialogOpen = useStateBoolean(false);
	const customColumnsNumber = useSelector(
	(state: AppState) => state.allCustomColumnsDefinitions[TABLES_NAMES[indexTab]].columns.length
	);

We can do this directly, no ?

[anistouri]

I'm passing this value in the props and removed the useSelector in the child component

[TheMaskedTurtle]

Suggested change

	const columnsDefinitions = useSelector((state: AppState) => state.allCustomColumnsDefinitions);
	const columnsDefinitions = useSelector(
	(state: AppState) => state.allCustomColumnsDefinitions[TABLES_NAMES[indexTab]]?.columns
	);

Also directly this ?

[anistouri]

Now it's retrieved from the props

[TheMaskedTurtle]

Suggested change

	const numberColumns = useStateNumber(0);
	const dialogOpen = useStateBoolean(false);
	const customColumnsDefinitions = useSelector(
	(state: AppState) => state.allCustomColumnsDefinitions[TABLES_NAMES[indexTab]]
	);
	useEffect(() => {
	numberColumns.setValue(customColumnsDefinitions.columns.length);
	}, [customColumnsDefinitions.columns.length, numberColumns]);
	return (
	<>
	<Button color="inherit" onClick={dialogOpen.setTrue}>
	<FormattedMessage id="spreadsheet/custom_column/main_button" />
	<Badge
	color="secondary"
	anchorOrigin={{
	vertical: 'top',
	horizontal: 'left',
	}}
	badgeContent={numberColumns.value}
	>
	<CalculateIcon />
	</Badge>
	</Button>
	<CustomColumnDialog
	indexTab={indexTab}
	open={dialogOpen}
	customColumnsDefinitions={customColumnsDefinitions.columns}
	/>
	</>
	const dialogOpen = useStateBoolean(false);
	const customColumnsDefinitions = useSelector(
	(state: AppState) => state.allCustomColumnsDefinitions[TABLES_NAMES[indexTab]].columns
	);
	return (
	<>
	<Button color="inherit" onClick={dialogOpen.setTrue}>
	<FormattedMessage id="spreadsheet/custom_column/main_button" />
	<Badge
	color="secondary"
	anchorOrigin={{
	vertical: 'top',
	horizontal: 'left',
	}}
	badgeContent={customColumnsDefinitions.length}
	>
	<CalculateIcon />
	</Badge>
	</Button>
	<CustomColumnDialog
	indexTab={indexTab}
	open={dialogOpen}
	customColumnsDefinitions={customColumnsDefinitions}
	/>
	</>

This can still be simplified

[anistouri]

done

[TheMaskedTurtle]

Don't put any specific cellRenderer

[anistouri]

it won't have the same style as the others, and it won't be rounded like all the values in the spreadsheet

[TheMaskedTurtle]

I think you can remove numeric, filterParams, cellDataType, cellRenderer for now because it can be several data types. We will improve that later on :)

[anistouri]

For cellRender, the same remark as above

[sonarcloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
3.3% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud