feat: introduce pinia for admin settings

[elzody]

• Related to: Office settings [design review call] #4351
• Target version: main

Summary

Introduces Pinia in an effort to organize the admin settings a bit instead of having everything in one massive component.

Screen Recording

Custom Fonts

admin-settongs-redesign-custom-fonts.mp4

TODO

• Tests

Checklist

• Code is properly formatted
• Sign-off message is added to all commits
• Documentation (manuals or wiki) has been updated or is not required

[elzody]

@juliusknorr Do you think we should ignore the remote font config warning for now? Didn't we discuss that, because we can have these configuration files of our own now, we can always ensure there is one?

[juliusknorr]

Curently we cannot verify this anyways as it is a setting in coolwsd.xml and we cannot check that.

Mid-term collabora planned to remove this configuration option as far as I understood and pass over the fonts without any configuration required, so I'd say it is fine to ignore that, yes.

[elzody]

@nextcloud/designers I have uploaded a screen recording, can I get a design review on this please? :)

[jancborchardt]

I'd say generally it's fine, but instead of the red trash button, a tertiary one (icon only) is enough?

Also @marcoambrosini @susnux what would be cool is a nice component for lists so this is consistent across Nextcloud. If we want to get fancy, this could be a grid/tiled view with font and font name below each other, sort of laid out like the tiles we use for the settings of Dashboard.

[jancborchardt]

Suggested change

	<NcSettingsSection :name="t('richdocuments', 'Custom Fonts')"
	<NcSettingsSection :name="t('richdocuments', 'Custom fonts')"

Detail: Should be sentence case, like below for "Available fonts"

[susnux]

I would not use a table for this, generally tables are bad for a11y and especially in this case where you do not have a table header.

Instead it probably makes more sense to use a list for this, semantically, and style it like you want.

[elzody]

Thanks for the feedback, I really appreciate any a11y tips I can get!

[susnux]

what would be cool is a nice component for lists so this is consistent across Nextcloud. If we want to get fancy, this could be a grid/tiled view with font and font name below each other, sort of laid out like the tiles we use for the settings of Dashboard.

We already have NcListItem as a consistent component for list items. Probably can do a lot like this.
Also this is very specific not sure how often it would be reused, but of course possible to do.