feat(sprint-5): Phase 6 — Staff management UI (list, invite, permissions, revoke)

- /settings/staff: staff account table with role badges + permission chips
- Invite sheet: email + role template + 8 granular permission checkboxes
- Edit permissions dialog with optimistic update
- Revoke access with AlertDialog confirmation
- React Query hooks wired (useStaffListQuery, mutations)
- Full i18n (de/en), mock fallback, loading skeletons
- Sidebar nav updated: Personal → /settings/staff with UserCog icon
- Added @radix-ui/react-checkbox + Checkbox UI component
This commit is contained in:
Patrick Plate
2026-06-12 20:32:54 +02:00
parent ed1efccc90
commit 2cc8c89944
9 changed files with 941 additions and 3 deletions
+206
View File
@@ -20,6 +20,9 @@ importers:
'@radix-ui/react-avatar':
specifier: 1.1.0
version: 1.1.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)
'@radix-ui/react-checkbox':
specifier: ^1.3.4
version: 1.3.4(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)
'@radix-ui/react-collapsible':
specifier: 1.1.0
version: 1.1.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)
@@ -708,6 +711,9 @@ packages:
'@radix-ui/primitive@1.1.3':
resolution: {integrity: sha512-JTF99U/6XIjCBo0wqkU5sK10glYe27MRRsfwoiq5zzOEZLHU3A3KCMa5X/azekYRCJ0HlwI0crAXS/5dEHTzDg==}
'@radix-ui/primitive@1.1.4':
resolution: {integrity: sha512-7AdCK9PQyiljKoBDbN8OuctCbd/esdwZPQ8RtOE3SsyQtUpiPb+ND75q0jEhC1m1ecBI0MFNeLJvwIh9iKHRcQ==}
'@radix-ui/react-alert-dialog@1.1.1':
resolution: {integrity: sha512-wmCoJwj7byuVuiLKqDLlX7ClSUU0vd9sdCeM+2Ls+uf13+cpSJoMgwysHq1SGVVkJj5Xn0XWi1NoRCdkMpr6Mw==}
peerDependencies:
@@ -760,6 +766,19 @@ packages:
'@types/react-dom':
optional: true
'@radix-ui/react-checkbox@1.3.4':
resolution: {integrity: sha512-m3JmIOAX5ZzZ6VPjxEU2dbTOhoHi0nT5riwcDwe8idocsWf4a5DXJLDtZ6LfJwMBx7W+A2b7kp2TgPEKtaiF6A==}
peerDependencies:
'@types/react': '*'
'@types/react-dom': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@types/react-dom':
optional: true
'@radix-ui/react-collapsible@1.1.0':
resolution: {integrity: sha512-zQY7Epa8sTL0mq4ajSJpjgn2YmCgyrG7RsQgLp3C0LQVkG7+Tf6Pv1CeNWZLyqMjhdPkBa5Lx7wYBeSu7uCSTA==}
peerDependencies:
@@ -813,6 +832,15 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-compose-refs@1.1.3':
resolution: {integrity: sha512-rYOP8OMnuuPMQF1uhPVlGNcCDlkokKqGFE3JcxFViIkAXP7EvFWUliJAstrapypaBLJNHbZL6jGhbVDGTwmVhA==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-context@1.1.0':
resolution: {integrity: sha512-OKrckBy+sMEgYM/sMmqmErVn0kZqrHPJze+Ql3DzYsDDp0hl0L62nx/2122/Bvps1qz645jlcu2tD9lrRSdf8A==}
peerDependencies:
@@ -840,6 +868,15 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-context@1.1.4':
resolution: {integrity: sha512-QwH4PO5urrbO+FaGd5Aglg+YJgWTyyuZ3g/6mKvsqraLkglDdckw9JafgL5McL5VEJ6EPNduPaT3ZE9BttDAqg==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-dialog@1.1.1':
resolution: {integrity: sha512-zysS+iU4YP3STKNS6USvFVqI4qqx8EpiwmT5TuCApVEBca+eRCbONi4EgzfNSuVnOXvC5UPHHMjs8RXO6DH9Bg==}
peerDependencies:
@@ -1167,6 +1204,19 @@ packages:
'@types/react-dom':
optional: true
'@radix-ui/react-presence@1.1.6':
resolution: {integrity: sha512-zdTk4PlUO0E18HnZ3wYbW0KkJJxWCdiNYp6g6X1PtONFhxVkg01vliTJAmwIszU6mHiyBOoW9P0rAugl5/hULQ==}
peerDependencies:
'@types/react': '*'
'@types/react-dom': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@types/react-dom':
optional: true
'@radix-ui/react-primitive@2.0.0':
resolution: {integrity: sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==}
peerDependencies:
@@ -1219,6 +1269,19 @@ packages:
'@types/react-dom':
optional: true
'@radix-ui/react-primitive@2.1.5':
resolution: {integrity: sha512-zifXeB8Y88qCYx8PLZ5oQb32KwZub+s925mMoZsBBq9KUQqWKkREubTfs6ASjRPPBe7Jt9O8OHH89+95VG+grA==}
peerDependencies:
'@types/react': '*'
'@types/react-dom': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@types/react-dom':
optional: true
'@radix-ui/react-roving-focus@1.1.0':
resolution: {integrity: sha512-EA6AMGeq9AEeQDeSH0aZgG198qkfHSbvWTf1HvoDmOB5bBG/qTxjYMWUKMnYiV6J/iP/J8MEFSuB2zRU2n7ODA==}
peerDependencies:
@@ -1294,6 +1357,15 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-slot@1.2.5':
resolution: {integrity: sha512-rCMO3QsIVKv5JTY5CVbo2MvO77SpEqqYc8AvRE7OWqRDOIqAKjsp+DrmnY9uc8NPdxB5E2z47HTYGeE2+NTptg==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-toast@1.2.1':
resolution: {integrity: sha512-5trl7piMXcZiCq7MW6r8YYmu0bK5qDpTWz+FdEPdKyft2UixkspheYbjbrLXVN5NGKHFbOP7lm8eD0biiSqZqg==}
peerDependencies:
@@ -1356,6 +1428,15 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-use-controllable-state@1.2.3':
resolution: {integrity: sha512-PLzC90MS+ReootmjC597dvopoelpZ8Q61HJkDXZSExitIq7PL55vHNnesAHwguHK0aPfBnpdNzQtv1uliaqQrA==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-use-effect-event@0.0.2':
resolution: {integrity: sha512-Qp8WbZOBe+blgpuUT+lw2xheLP8q0oatc9UpmiemEICxGvFLYmHm9QowVZGHtJlGbS6A6yJ3iViad/2cVjnOiA==}
peerDependencies:
@@ -1365,6 +1446,15 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-use-effect-event@0.0.3':
resolution: {integrity: sha512-6c8ZqvPTWILEKnyVkP53EGRCcpnJiKTC21sS/6R1GF5xKyHJJWQEPfkqlcgUkdRQivd6tb23abUwe4ngWmY0JA==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-use-escape-keydown@1.1.0':
resolution: {integrity: sha512-L7vwWlR1kTTQ3oh7g1O0CBF3YCyyTj8NmhLR+phShpyA50HCfBFKVJTpshm9PzLiKmehsrQzTYTpX9HvmC9rhw==}
peerDependencies:
@@ -1401,6 +1491,24 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-use-layout-effect@1.1.2':
resolution: {integrity: sha512-jrBWOxZITuGcnjRCM2t2U5ZPkCLxD+Ym6DjfssS5haTj2iiak/DOb64JeN6OdLfLgptb6/e2kKR+ZuTrGoZTPA==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-use-previous@1.1.2':
resolution: {integrity: sha512-IGBQPtRFdhN6MQ8dbegVmBq1LVZluya3F1jWY+puIcQC3MHctRwTDSBWCkL/3ZcnMJLTMJ++Z+ktmvg0F89iCw==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-use-rect@1.1.0':
resolution: {integrity: sha512-0Fmkebhr6PiseyZlYAOtLS+nb7jLmpqTrJyv61Pe68MKYW6OWdRE2kI70TaYY27u7H0lajqM3hSMMLFq18Z7nQ==}
peerDependencies:
@@ -1419,6 +1527,15 @@ packages:
'@types/react':
optional: true
'@radix-ui/react-use-size@1.1.2':
resolution: {integrity: sha512-giWQp+4mxjBPt4KZ0MmyuykFNWfbDxKt4x+fPkRYmgRFJSbCZFzUglvMb/Kjn38tm10YP4ufiQZDx3zna4LU6w==}
peerDependencies:
'@types/react': '*'
react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
peerDependenciesMeta:
'@types/react':
optional: true
'@radix-ui/react-visually-hidden@1.1.0':
resolution: {integrity: sha512-N8MDZqtgCgG5S3aV60INAB475osJousYpZ4cTJ2cFbMpdHS5Y6loLTH8LPtkj2QN0x93J30HT/M3qJXM0+lyeQ==}
peerDependencies:
@@ -4084,6 +4201,8 @@ snapshots:
'@radix-ui/primitive@1.1.3': {}
'@radix-ui/primitive@1.1.4': {}
'@radix-ui/react-alert-dialog@1.1.1(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/primitive': 1.1.0
@@ -4128,6 +4247,22 @@ snapshots:
'@types/react': 19.0.12
'@types/react-dom': 19.0.4(@types/react@19.0.12)
'@radix-ui/react-checkbox@1.3.4(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/primitive': 1.1.4
'@radix-ui/react-compose-refs': 1.1.3(@types/react@19.0.12)(react@19.1.3)
'@radix-ui/react-context': 1.1.4(@types/react@19.0.12)(react@19.1.3)
'@radix-ui/react-presence': 1.1.6(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)
'@radix-ui/react-primitive': 2.1.5(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)
'@radix-ui/react-use-controllable-state': 1.2.3(@types/react@19.0.12)(react@19.1.3)
'@radix-ui/react-use-previous': 1.1.2(@types/react@19.0.12)(react@19.1.3)
'@radix-ui/react-use-size': 1.1.2(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
react-dom: 19.1.3(react@19.1.3)
optionalDependencies:
'@types/react': 19.0.12
'@types/react-dom': 19.0.4(@types/react@19.0.12)
'@radix-ui/react-collapsible@1.1.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/primitive': 1.1.0
@@ -4174,6 +4309,12 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-compose-refs@1.1.3(@types/react@19.0.12)(react@19.1.3)':
dependencies:
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-context@1.1.0(@types/react@19.0.12)(react@19.1.3)':
dependencies:
react: 19.1.3
@@ -4192,6 +4333,12 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-context@1.1.4(@types/react@19.0.12)(react@19.1.3)':
dependencies:
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-dialog@1.1.1(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/primitive': 1.1.0
@@ -4532,6 +4679,15 @@ snapshots:
'@types/react': 19.0.12
'@types/react-dom': 19.0.4(@types/react@19.0.12)
'@radix-ui/react-presence@1.1.6(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/react-use-layout-effect': 1.1.2(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
react-dom: 19.1.3(react@19.1.3)
optionalDependencies:
'@types/react': 19.0.12
'@types/react-dom': 19.0.4(@types/react@19.0.12)
'@radix-ui/react-primitive@2.0.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/react-slot': 1.1.0(@types/react@19.0.12)(react@19.1.3)
@@ -4568,6 +4724,15 @@ snapshots:
'@types/react': 19.0.12
'@types/react-dom': 19.0.4(@types/react@19.0.12)
'@radix-ui/react-primitive@2.1.5(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/react-slot': 1.2.5(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
react-dom: 19.1.3(react@19.1.3)
optionalDependencies:
'@types/react': 19.0.12
'@types/react-dom': 19.0.4(@types/react@19.0.12)
'@radix-ui/react-roving-focus@1.1.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/primitive': 1.1.0
@@ -4639,6 +4804,13 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-slot@1.2.5(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/react-compose-refs': 1.1.3(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-toast@1.2.1(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/primitive': 1.1.0
@@ -4706,6 +4878,14 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-controllable-state@1.2.3(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/react-use-effect-event': 0.0.3(@types/react@19.0.12)(react@19.1.3)
'@radix-ui/react-use-layout-effect': 1.1.2(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-effect-event@0.0.2(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/react-use-layout-effect': 1.1.1(@types/react@19.0.12)(react@19.1.3)
@@ -4713,6 +4893,13 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-effect-event@0.0.3(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/react-use-layout-effect': 1.1.2(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-escape-keydown@1.1.0(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/react-use-callback-ref': 1.1.0(@types/react@19.0.12)(react@19.1.3)
@@ -4739,6 +4926,18 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-layout-effect@1.1.2(@types/react@19.0.12)(react@19.1.3)':
dependencies:
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-previous@1.1.2(@types/react@19.0.12)(react@19.1.3)':
dependencies:
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-rect@1.1.0(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/rect': 1.1.0
@@ -4753,6 +4952,13 @@ snapshots:
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-use-size@1.1.2(@types/react@19.0.12)(react@19.1.3)':
dependencies:
'@radix-ui/react-use-layout-effect': 1.1.2(@types/react@19.0.12)(react@19.1.3)
react: 19.1.3
optionalDependencies:
'@types/react': 19.0.12
'@radix-ui/react-visually-hidden@1.1.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)':
dependencies:
'@radix-ui/react-primitive': 2.0.0(@types/react-dom@19.0.4(@types/react@19.0.12))(@types/react@19.0.12)(react-dom@19.1.3(react@19.1.3))(react@19.1.3)