Add names characters limit and truncate

[nhanaa]

Describe your changes

• Added truncate string util function to truncate string if over certain length
• Added limits to names and placeholders to indicate the limits (300 for team and loadout, 100 for build)
• Truncate the names displayed (300 for team and loadout, 50 for build)

Issue or discord link

• From suggestions in Add character limit to Team/Loadout/Build names #1648

Testing/validation

Checklist before requesting a review (leave this PR as draft if any part of this list is not done.)

• I have commented my code in hard-to understand areas.
• I have made corresponding changes to README or wiki.
• For front-end changes, I have updated the corresponding English translations.
• I have run yarn run mini-ci locally to validate format and lint.
• If I have added a new library or app, I have updated the deployment scripts to ignore changes as needed

[github-actions]

[sr-frontend] [Sat Mar 16 06:43:18 UTC 2024] - Deployed 81e72ee to https://genshin-optimizer-prs.github.io/pr/1754/sr-frontend (Takes 3-5 minutes after this completes to be available)

[frontend] [Sat Mar 16 06:44:17 UTC 2024] - Deployed 81e72ee to https://genshin-optimizer-prs.github.io/pr/1754/frontend (Takes 3-5 minutes after this completes to be available)

[sr-frontend] [Sat Mar 16 11:23:03 UTC 2024] - Deployed c2df5de to https://genshin-optimizer-prs.github.io/pr/1754/sr-frontend (Takes 3-5 minutes after this completes to be available)

[frontend] [Sat Mar 16 11:24:07 UTC 2024] - Deployed c2df5de to https://genshin-optimizer-prs.github.io/pr/1754/frontend (Takes 3-5 minutes after this completes to be available)

[frzyc]

I think more truncation may be needed for team and loadout names:

In format of ( display / max string length in db)

• team ( 100 / 200)
• loadout ( 100 / 200)
• Build (50 /100)

For truncating the string(enforce final length), I'd recommend doing it in the database.
Since all data is validated in the database, ensuring string length should be as well:
code that validates loadout(TeamChar) name string

[frzyc]

Suggested change

	return str.length > length ? str.slice(0, length) + '...' : str
	return str.length > length ? str.slice(0, length - 3) + '...' : str

[nhanaa]

I think more truncation may be needed for team and loadout names:

In format of ( display / truncate)

• team ( 100 / 200)
• loadout ( 100 / 200)
• Build (50 /100)

For truncating the string(enforce final length), I'd recommend doing it in the database. Since all data is validated in the database, ensuring string length should be as well: code that validates loadout(TeamChar) name string

By doing it in the database, do you mean truncating the string before saving the names in the database?

[frzyc]

I think more truncation may be needed for team and loadout names:
In format of ( display / max string length)

• team ( 100 / 200)
• loadout ( 100 / 200)
• Build (50 /100)

For truncating the string(enforce final length), I'd recommend doing it in the database. Since all data is validated in the database, ensuring string length should be as well: code that validates loadout(TeamChar) name string

By doing it in the database, do you mean truncating the string before saving the names in the database?

I guess I should be more specific since your function is called truncateString. Slicing the string down to max size, should happen on the database size, before the name is saved. Applying the ellipsis, should be done on the UI(and does not change the database string size).