feat: Implement teams dashboard widget

[juliushaertl]

Resolves #1506

@marcoambrosini @jancborchardt I used the generated avatars as they are also used in contacts right now

Needs upstream adjustments in the dashboard API:

• [x] Center text if no subline is provided https://github.com/nextcloud-libraries/nextcloud-vue/pull/5271
• [x] Also (apart from the vertical alignment you noted), the icons should be horizontally aligned below the heading icon of the widget, just like the text should be left-aligned with the heading text. Currently everything is a bit shifted to the right. https://github.com/nextcloud/server/pull/43702

Follow up requiring server / API adjustments

• [ ] Add icon to add button
• [ ] Add empty content placeholder text through API
• [ ] Show action button if not all list item slots are filled

[juliushaertl]

The avatar placeholders only fit for individual people, in this case it's better to just use the teams icon for each team.

We currently don't have one. Once the stretch goal https://github.com/nextcloud/circles/issues/1508 is there we can do that, but for now this is based on what we have there in the existing circles UI already:

Also (apart from the vertical alignment you noted), the icons should be horizontally aligned below the heading icon of the widget, just like the text should be left-aligned with the heading text. Currently everything is a bit shifted to the right.

Noted, will check how we can address that generally (as the other widgets show the same issue)

[juliushaertl]

Quick note on the button, currently we only have options to specify a more text and a button when the list is empty (please ignore the missing icon):

empty	more

@jancborchardt Is that enough? Otherwise we need a generic design spec on how list widgets should handle this as I'd like to keep the implementation without custom frontend implementation to account for the dashboard load performance improvements that this brings and also make sure it works on client integrations.

[marcoambrosini]

@juliushaertl could we use the empty content component with an add icon and an explanation of what a team is?

[juliushaertl]

Yes, though we need to extend the server API for that, would follow up in separate PRs then to keep things moving

Took notes in the description to collect that

[ArtificialOwl]

Do we need to display all circles or only the one current user is member of ? It might be heavy on resources to use getCircles() from the dashboard. This method should only be used from the contact app to display all available/visible circles.

probeCircles() is lighter and will returns all circles current user is a member of.

Now, if we display circles based on membership, we can also imagine:

• create a newfield in circles table to store a 'last_event' value in database,
• update last_event when a new share to circle is created/updated (or any other event),
• add a way to order by 'last_event' when calling probeCircles() (DataProbe)

The result would be that top of the list are showing circles with more recent activity

[juliushaertl]

Do we need to display all circles or only the one current user is member of ? It might be heavy on resources to use getCircles() from the dashboard. This method should only be used from the contact app to display all available/visible circles.

probeCircles() is lighter and will returns all circles current user is a member of.

Ah thanks, I switched that as we're only interested in the ones where a user is member

Now, if we display circles based on membership, we can also imagine:

* create a newfield in circles table to store a `'last_event'` value in database,

* update `last_event` when a new share to circle is created/updated (or any other event),

* add a way to order by `'last_event'` when calling `probeCircles()` _(DataProbe)_

The result would be that top of the list are showing circles with more recent activity

Won't get to that in this iteration, we can track this as a follow up of course as it generally makes sense I think.

[juliushaertl]

@ArtificialOwl Mind to double check the fixup commit for the prope adjustment? I'm also not sure what effect the details have but not requesting any also gives us enough information i think.