No `Validation` for sketch file `rename`

[PiyushChandra17]

Increasing Access

Currently we don't have any limit set for sketch file rename, plus it will also make the sketch table look messed up when user renames the file with lots of characters

Feature enhancement details

We should provide max char limit to sketch file rename

[lindapaiste]

We should make sure that we are using the same validation on any place where the user renames the sketch, whether it’s here or in the Header of the sketch. We need to check:

• Are there any hard limits set by the backend database or API?
• Do we have any validation when renaming from the Header?
• Do we check for empty texts?
• Are there any other places where the user can rename a sketch? I think it’s just these two? Is the sketches table on the Collection page the same component?

I just looked at what we are doing in the Header and there is a maxLength of 128 with a check for empty strings.

p5.js-web-editor/client/modules/IDE/components/Header/ProjectName.jsx

Lines 16 to 26 in f725abd

	<EditableInput
	value={projectName}
	disabled={!canEditProjectName}
	aria-label={t('Toolbar.EditSketchARIA')}
	inputProps={{
	maxLength: 128,
	'aria-label': t('Toolbar.NewSketchNameARIA')
	}}
	validate={(text) => text.trim().length > 0}
	onChange={changeSketchName}
	/>

128 characters is quite a lot, tbh. Meaning that the table might still look messed up even with this validation. So we probably want something in the CSS for the table that sets a max width for the column (either this specific column or all individual columns). We would want it to wrap the text on multiple lines when overflowing. For your example to work nicely we would also need to allow break-word in the CSS.

[raclim]

Just also want to add this issue here, #568, which might also give some more historical context around this!

[ShashwatPS]

Can I work on this issue ?