feat: add empty state and loading state to Users & User Groups

[radekkaluzik]

Description

Implemented empty state and loading state to Users & User Groups

Links to mocks for empty state provided by UX:

• Users: https://www.figma.com/design/ay6AYgKYoF0yh1evYctbyP/Workspaces-MVP?node-id=6175-42124&node-type=frame&t=HZwnj8UW66nPFcAN-0
• User groups: https://www.figma.com/design/ay6AYgKYoF0yh1evYctbyP/Workspaces-MVP?node-id=6175-41073&node-type=frame&t=eg0StzgCcU3t44L8-0

RHCLOUD-34816

---

Screenshots

Loading state:

loading.state.mov

Empty state:

---

Checklist ☑️

• PR only fixes one issue or story
• Change reviewed for extraneous code
• UI best practices adhered to
• Commits squashed and meaningfully named
• All PR checks pass locally (build, lint, test, E2E)

• (Optional) QE: Needs QE attention (OUIA changed, perceived impact to tests, no test coverage)
• (Optional) QE: Has been mentioned
• (Optional) UX: Needs UX attention (end user UX modified, missing designs)
• (Optional) UX: Has been mentioned

[fhlavac]

@radekkaluzik I think we should use Skeleton table for the loading state https://www.patternfly.org/component-groups/status-and-state-indicators/skeleton-table, or did you agree on something different with UX?

[radekkaluzik]

@radekkaluzik I think we should use Skeleton table for the loading state https://www.patternfly.org/component-groups/status-and-state-indicators/skeleton-table, or did you agree on something different with UX?

I didn't have any mocks for loading state so I have implemented some general loading state. I was told by UX this is ok, however I agree that Skeleton table would we more appropriate in this case.

[radekkaluzik]

Updated Loading State here:
@fhlavac @karelhala

Updated.Loading.State.mov