From bff8357d6a44ac88c4a44ff39a28e3f41124f3f1 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Mon, 17 Feb 2025 21:15:17 +0000 Subject: [PATCH 01/18] chore: refactor more menu --- site/package.json | 1 + site/pnpm-lock.yaml | 195 ++++++++++++++++++ .../components/DropdownMenu/DropdownMenu.tsx | 2 +- .../components/Spinner/Spinner.stories.tsx | 2 +- site/src/components/Spinner/Spinner.tsx | 2 +- .../IdpOrgSyncPage/IdpOrgSyncPageView.tsx | 2 +- site/src/pages/GroupsPage/GroupPage.tsx | 38 ++-- .../CustomRolesPage/CustomRolesPageView.tsx | 51 ++--- .../IdpSyncPage/IdpGroupSyncForm.tsx | 2 +- .../IdpSyncPage/IdpRoleSyncForm.tsx | 2 +- .../OrganizationMembersPageView.tsx | 48 +++-- .../UserTable/EditRolesButton.tsx | 2 +- .../pages/TemplatePage/TemplatePageHeader.tsx | 71 ++++--- .../TemplatePermissionsPageView.tsx | 75 ++++--- .../UsersPage/UsersTable/UsersTableBody.tsx | 102 +++++---- .../WorkspaceActions/WorkspaceActions.tsx | 63 +++--- .../WorkspacesPage/WorkspacesPageView.tsx | 51 ++--- site/tailwind.config.js | 2 +- 18 files changed, 484 insertions(+), 227 deletions(-) diff --git a/site/package.json b/site/package.json index 23c1cf9d22428..f8349c86f4c61 100644 --- a/site/package.json +++ b/site/package.json @@ -57,6 +57,7 @@ "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.4", "@radix-ui/react-collapsible": "1.1.2", + "@radix-ui/react-context-menu": "2.2.6", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-label": "2.1.0", diff --git a/site/pnpm-lock.yaml b/site/pnpm-lock.yaml index e20e5b322b2c2..283102d72604d 100644 --- a/site/pnpm-lock.yaml +++ b/site/pnpm-lock.yaml @@ -82,6 +82,9 @@ importers: '@radix-ui/react-collapsible': specifier: 1.1.2 version: 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-context-menu': + specifier: 2.2.6 + version: 2.2.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@radix-ui/react-dialog': specifier: 1.1.4 version: 1.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -1478,6 +1481,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-arrow@1.1.2': + resolution: {integrity: sha512-G+KcpzXHq24iH0uGG/pF8LyzpFJYGD4RfLjCIBfGdSLXvjLHST31RUiRVrupIBMvIppMgSzQ6l66iAxl03tdlg==, tarball: https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.1.2.tgz} + 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-avatar@1.1.2': resolution: {integrity: sha512-GaC7bXQZ5VgZvVvsJ5mu/AEbjYLnhhkoidOboC50Z6FFlLA03wG2ianUoH+zgDQ31/9gCF59bE4+2bBgTyMiig==, tarball: https://registry.npmjs.org/@radix-ui/react-avatar/-/react-avatar-1.1.2.tgz} peerDependencies: @@ -1561,6 +1577,19 @@ packages: '@types/react': optional: true + '@radix-ui/react-context-menu@2.2.6': + resolution: {integrity: sha512-aUP99QZ3VU84NPsHeaFt4cQUNgJqFsLLOt/RbbWXszZ6MP0DpDyjkFZORr4RpAEx3sUBk+Kc8h13yGtC5Qw8dg==, tarball: https://registry.npmjs.org/@radix-ui/react-context-menu/-/react-context-menu-2.2.6.tgz} + 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-context@1.1.1': resolution: {integrity: sha512-UASk9zi+crv9WteK/NU4PLvOoL3OuE6BWVKNF6hPRBtYBDXQ2u5iu3O59zUlJiTVvkyuycnqrztsHVJwcK9K+Q==, tarball: https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.1.1.tgz} peerDependencies: @@ -1618,6 +1647,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-dismissable-layer@1.1.5': + resolution: {integrity: sha512-E4TywXY6UsXNRhFrECa5HAvE5/4BFcGyfTyK36gP+pAW1ed7UTK4vKwdr53gAJYwqbfCWC6ATvJa3J3R/9+Qrg==, tarball: https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.5.tgz} + 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-dropdown-menu@2.1.4': resolution: {integrity: sha512-iXU1Ab5ecM+yEepGAWK8ZhMyKX4ubFdCNtol4sT9D0OVErG9PNElfx3TQhjw7n7BC5nFVz68/5//clWy+8TXzA==, tarball: https://registry.npmjs.org/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.1.4.tgz} peerDependencies: @@ -1653,6 +1695,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-focus-scope@1.1.2': + resolution: {integrity: sha512-zxwE80FCU7lcXUGWkdt6XpTTCKPitG1XKOwViTxHVKIJhZl9MvIl2dVHeZENCWD9+EdWv05wlaEkRXUykU27RA==, tarball: https://registry.npmjs.org/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.2.tgz} + 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-id@1.1.0': resolution: {integrity: sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==, tarball: https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz} peerDependencies: @@ -1688,6 +1743,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-menu@2.1.6': + resolution: {integrity: sha512-tBBb5CXDJW3t2mo9WlO7r6GTmWV0F0uzHZVFmlRmYpiSK1CDU5IKojP1pm7oknpBOrFZx/YgBRW9oorPO2S/Lg==, tarball: https://registry.npmjs.org/@radix-ui/react-menu/-/react-menu-2.1.6.tgz} + 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-popover@1.1.5': resolution: {integrity: sha512-YXkTAftOIW2Bt3qKH8vYr6n9gCkVrvyvfiTObVjoHVTHnNj26rmvO87IKa3VgtgCjb8FAQ6qOjNViwl+9iIzlg==, tarball: https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.1.5.tgz} peerDependencies: @@ -1714,6 +1782,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-popper@1.2.2': + resolution: {integrity: sha512-Rvqc3nOpwseCyj/rgjlJDYAgyfw7OC1tTkKn2ivhaMGcYt8FSBlahHOZak2i3QwkRXUXgGgzeEe2RuqeEHuHgA==, tarball: https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.2.tgz} + 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-portal@1.1.3': resolution: {integrity: sha512-NciRqhXnGojhT93RPyDaMPfLH3ZSl4jjIFbZQ1b/vxvZEdHsBZ49wP9w8L3HzUQwep01LcWtkUvm0OVB5JAHTw==, tarball: https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.3.tgz} peerDependencies: @@ -1727,6 +1808,19 @@ packages: '@types/react-dom': optional: true + '@radix-ui/react-portal@1.1.4': + resolution: {integrity: sha512-sn2O9k1rPFYVyKd5LAJfo96JlSGVFpa1fS6UuBJfrZadudiw5tAmru+n1x7aMRQ84qDM71Zh1+SzK5QwU0tJfA==, tarball: https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.4.tgz} + 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-presence@1.1.2': resolution: {integrity: sha512-18TFr80t5EVgL9x1SwF/YGtfG+l0BS0PRAlCWBDoBEiDQjeKgnNZRVJp/oVBl24sr3Gbfwc/Qpj4OcWTQMsAEg==, tarball: https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.2.tgz} peerDependencies: @@ -7523,6 +7617,15 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 + '@radix-ui/react-arrow@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-avatar@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) @@ -7603,6 +7706,20 @@ snapshots: optionalDependencies: '@types/react': 18.3.12 + '@radix-ui/react-context-menu@2.2.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/primitive': 1.1.1 + '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-menu': 2.1.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-use-controllable-state': 1.1.0(@types/react@18.3.12)(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-context@1.1.1(@types/react@18.3.12)(react@18.3.1)': dependencies: react: 18.3.1 @@ -7663,6 +7780,19 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 + '@radix-ui/react-dismissable-layer@1.1.5(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/primitive': 1.1.1 + '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-use-escape-keydown': 1.1.0(@types/react@18.3.12)(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-dropdown-menu@2.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/primitive': 1.1.1 @@ -7695,6 +7825,17 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 + '@radix-ui/react-focus-scope@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-id@1.1.0(@types/react@18.3.12)(react@18.3.1)': dependencies: '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1) @@ -7737,6 +7878,32 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 + '@radix-ui/react-menu@2.1.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/primitive': 1.1.1 + '@radix-ui/react-collection': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-direction': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-dismissable-layer': 1.1.5(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-focus-guards': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-focus-scope': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-id': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-popper': 1.2.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-portal': 1.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-presence': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-roving-focus': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-slot': 1.1.2(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) + aria-hidden: 1.2.4 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + react-remove-scroll: 2.6.3(@types/react@18.3.12)(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-popover@1.1.5(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/primitive': 1.1.1 @@ -7778,6 +7945,24 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 + '@radix-ui/react-popper@1.2.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@floating-ui/react-dom': 2.1.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-arrow': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-use-rect': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/react-use-size': 1.1.0(@types/react@18.3.12)(react@18.3.1) + '@radix-ui/rect': 1.1.0 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-portal@1.1.3(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/react-primitive': 2.0.1(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -7788,6 +7973,16 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 + '@radix-ui/react-portal@1.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + optionalDependencies: + '@types/react': 18.3.12 + '@types/react-dom': 18.3.1 + '@radix-ui/react-presence@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) diff --git a/site/src/components/DropdownMenu/DropdownMenu.tsx b/site/src/components/DropdownMenu/DropdownMenu.tsx index c37f9f0146047..e56fd7cbe4343 100644 --- a/site/src/components/DropdownMenu/DropdownMenu.tsx +++ b/site/src/components/DropdownMenu/DropdownMenu.tsx @@ -196,7 +196,7 @@ export const DropdownMenuSeparator = forwardRef< >(({ className, ...props }, ref) => ( )); diff --git a/site/src/components/Spinner/Spinner.stories.tsx b/site/src/components/Spinner/Spinner.stories.tsx index f1cd9e1b24ff2..974a86afa30b2 100644 --- a/site/src/components/Spinner/Spinner.stories.tsx +++ b/site/src/components/Spinner/Spinner.stories.tsx @@ -6,7 +6,7 @@ const meta: Meta = { title: "components/Spinner", component: Spinner, args: { - children: , + children: , }, }; diff --git a/site/src/components/Spinner/Spinner.tsx b/site/src/components/Spinner/Spinner.tsx index 8e331a1a6dd20..a9266d734fbb0 100644 --- a/site/src/components/Spinner/Spinner.tsx +++ b/site/src/components/Spinner/Spinner.tsx @@ -14,7 +14,7 @@ const leaves = 8; const spinnerVariants = cva("", { variants: { size: { - lg: "size-icon-lg", + lg: "size-icon-md", sm: "size-icon-sm", }, }, diff --git a/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx b/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx index 3fb267fb9daac..8576b588ac249 100644 --- a/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx +++ b/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx @@ -448,7 +448,7 @@ const OrganizationRow: FC = ({ aria-label="delete" onClick={() => onDelete(idpOrg)} > - + Delete IdP mapping diff --git a/site/src/pages/GroupsPage/GroupPage.tsx b/site/src/pages/GroupsPage/GroupPage.tsx index db439550f2f81..9b8a693dc2cc3 100644 --- a/site/src/pages/GroupsPage/GroupPage.tsx +++ b/site/src/pages/GroupsPage/GroupPage.tsx @@ -20,18 +20,18 @@ import type { import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Avatar } from "components/Avatar/Avatar"; import { AvatarData } from "components/Avatar/AvatarData"; +import { Button as ShadcnButton } from "components/Button/Button"; import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; import { EmptyState } from "components/EmptyState/EmptyState"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { LastSeen } from "components/LastSeen/LastSeen"; import { Loader } from "components/Loader/Loader"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "components/MoreMenu/MoreMenu"; import { SettingsHeader, SettingsHeaderDescription, @@ -51,6 +51,7 @@ import { TableToolbar, } from "components/TableToolbar/TableToolbar"; import { MemberAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; +import { EllipsisVertical } from "lucide-react"; import { type FC, useState } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; @@ -330,20 +331,23 @@ const GroupMemberRow: FC = ({ {canUpdate && ( - - - - - - + + + + + + Remove - - - + + + )} diff --git a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx index 3fb04fe483271..d38fe82b1967b 100644 --- a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx @@ -4,15 +4,15 @@ import AddOutlined from "@mui/icons-material/AddOutlined"; import Button from "@mui/material/Button"; import Skeleton from "@mui/material/Skeleton"; import type { AssignableRoles, Role } from "api/typesGenerated"; +import { Button as ShadcnButton } from "components/Button/Button"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; -import { EmptyState } from "components/EmptyState/EmptyState"; import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "components/MoreMenu/MoreMenu"; + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; +import { EmptyState } from "components/EmptyState/EmptyState"; import { Paywall } from "components/Paywall/Paywall"; import { Stack } from "components/Stack/Stack"; import { @@ -27,6 +27,7 @@ import { TableLoaderSkeleton, TableRowSkeleton, } from "components/TableLoader/TableLoader"; +import { EllipsisVertical } from "lucide-react"; import type { FC } from "react"; import { Link as RouterLink, useNavigate } from "react-router-dom"; import { docs } from "utils/docs"; @@ -213,27 +214,27 @@ const RoleRow: FC = ({ {!role.built_in && (canUpdateOrgRole || canDeleteOrgRole) && ( - - - - - - {canUpdateOrgRole && ( - { - navigate(role.name); - }} - > - Edit - - )} + + + + + + + navigate(role.name)}> + Edit + {canDeleteOrgRole && ( - + Delete… - + )} - - + + )} diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx index 284267f4487e1..0bc711b158f0b 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx @@ -400,7 +400,7 @@ const GroupRow: FC = ({ aria-label="delete" onClick={() => onDelete(idpGroup)} > - + Delete IdP mapping diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx index 0825ab4217395..363a4e43f200d 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx @@ -318,7 +318,7 @@ const RoleRow: FC = ({ aria-label="delete" onClick={() => onDelete(idpRole)} > - + Delete IdP mapping diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx index 296ea9a8c658a..fe35bdcba1046 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx @@ -12,18 +12,18 @@ import { Avatar } from "components/Avatar/Avatar"; import { AvatarData } from "components/Avatar/AvatarData"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { Loader } from "components/Loader/Loader"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "components/MoreMenu/MoreMenu"; import { PaginationContainer } from "components/PaginationWidget/PaginationContainer"; import { SettingsHeader, SettingsHeaderTitle, } from "components/SettingsHeader/SettingsHeader"; +import { Button } from "components/Button/Button"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; import { Stack } from "components/Stack/Stack"; import { Table, @@ -35,7 +35,7 @@ import { } from "components/Table/Table"; import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; import type { PaginationResultInfo } from "hooks/usePaginatedQuery"; -import { TriangleAlert } from "lucide-react"; +import { TriangleAlert, EllipsisVertical } from "lucide-react"; import { UserGroupsCell } from "pages/UsersPage/UsersTable/UserGroupsCell"; import { type FC, useState } from "react"; import { TableColumnHelpTooltip } from "./UserTable/TableColumnHelpTooltip"; @@ -163,21 +163,31 @@ export const OrganizationMembersPageView: FC< {member.user_id !== me.id && canEditMembers && ( - - - - - - + + + + + removeMember(member)} > Remove - - - + + + )} - + )) ) : ( diff --git a/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx b/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx index 383f8dc80d099..567d1c5b9f9c8 100644 --- a/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx +++ b/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx @@ -135,7 +135,7 @@ export const EditRolesButton: FC = ({ size="icon" className="text-content-secondary hover:text-content-primary" > - + diff --git a/site/src/pages/TemplatePage/TemplatePageHeader.tsx b/site/src/pages/TemplatePage/TemplatePageHeader.tsx index e9970df30c174..7232be57dcea6 100644 --- a/site/src/pages/TemplatePage/TemplatePageHeader.tsx +++ b/site/src/pages/TemplatePage/TemplatePageHeader.tsx @@ -4,7 +4,6 @@ import EditIcon from "@mui/icons-material/EditOutlined"; import CopyIcon from "@mui/icons-material/FileCopyOutlined"; import SettingsIcon from "@mui/icons-material/SettingsOutlined"; import Button from "@mui/material/Button"; -import Divider from "@mui/material/Divider"; import { workspaces } from "api/queries/workspaces"; import type { AuthorizationResponse, @@ -12,17 +11,18 @@ import type { TemplateVersion, } from "api/typesGenerated"; import { Avatar } from "components/Avatar/Avatar"; +import { Button as ShadcnButton } from "components/Button/Button"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuSeparator, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; import { Margins } from "components/Margins/Margins"; import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "components/MoreMenu/MoreMenu"; import { PageHeader, PageHeaderSubtitle, @@ -30,6 +30,7 @@ import { } from "components/PageHeader/PageHeader"; import { Pill } from "components/Pill/Pill"; import { Stack } from "components/Stack/Stack"; +import { EllipsisVertical } from "lucide-react"; import { linkToTemplate, useLinks } from "modules/navigation"; import type { WorkspacePermissions } from "modules/permissions/workspaces"; import type { FC } from "react"; @@ -67,44 +68,48 @@ const TemplateMenu: FC = ({ return ( <> - - - - - - { - navigate(`${templateLink}/settings`); - }} + + + + + + + navigate(`${templateLink}/settings`)} > Settings - + - { - navigate(`${templateLink}/versions/${templateVersion}/edit`); - }} + + navigate(`${templateLink}/versions/${templateVersion}/edit`) + } > Edit files - + - { - navigate(`/templates/new?fromTemplate=${templateId}`); - }} + + navigate(`/templates/new?fromTemplate=${templateId}`) + } > Duplicate… - - - + + + Delete… - - - + + + {safeToDeleteTemplate ? ( {canUpdatePermissions && ( - - - - - - + + + + + onRemoveGroup(group)} > Remove - - - + + + )} @@ -338,19 +349,29 @@ export const TemplatePermissionsPageView: FC< {canUpdatePermissions && ( - - - - - - + + + + + onRemoveUser(user)} > Remove - - - + + + )} diff --git a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx index f746b35aba75f..30958d0adcbca 100644 --- a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx +++ b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx @@ -1,26 +1,26 @@ import type { Interpolation, Theme } from "@emotion/react"; +import DeleteIcon from "@mui/icons-material/Delete"; import GitHub from "@mui/icons-material/GitHub"; import HideSourceOutlined from "@mui/icons-material/HideSourceOutlined"; import KeyOutlined from "@mui/icons-material/KeyOutlined"; import PasswordOutlined from "@mui/icons-material/PasswordOutlined"; import ShieldOutlined from "@mui/icons-material/ShieldOutlined"; -import Divider from "@mui/material/Divider"; import Skeleton from "@mui/material/Skeleton"; import type { GroupsByUserId } from "api/queries/groups"; import type * as TypesGen from "api/typesGenerated"; import { AvatarData } from "components/Avatar/AvatarData"; import { AvatarDataSkeleton } from "components/Avatar/AvatarDataSkeleton"; -import { PremiumBadge } from "components/Badges/Badges"; +import { Button } from "components/Button/Button"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuSeparator, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; import { EmptyState } from "components/EmptyState/EmptyState"; import { LastSeen } from "components/LastSeen/LastSeen"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "components/MoreMenu/MoreMenu"; import { TableCell, TableRow } from "components/Table/Table"; import { TableLoaderSkeleton, @@ -28,6 +28,7 @@ import { } from "components/TableLoader/TableLoader"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; +import { EllipsisVertical } from "lucide-react"; import type { FC } from "react"; import { UserRoleCell } from "../../OrganizationSettingsPage/UserTable/UserRoleCell"; import { UserGroupsCell } from "./UserGroupsCell"; @@ -180,51 +181,64 @@ export const UsersTableBody: FC = ({ {canEditUsers && ( - - - - - + + + + + {user.status === "active" || user.status === "dormant" ? ( - { - onSuspendUser(user); - }} + onClick={() => onSuspendUser(user)} > + Suspend… - + ) : ( - onActivateUser(user)}> + onActivateUser(user)}> + Activate… - + )} - onListWorkspaces(user)}> - View workspaces - - onViewActivity(user)} - disabled={!canViewActivity} - > - View activity - {!canViewActivity && } - - onResetUserPassword(user)} - disabled={user.login_type !== "password"} - > - Reset password… - - - onListWorkspaces(user)}> + + List workspaces… + + + {canViewActivity && ( + onViewActivity(user)}> + + View activity… + + )} + + {user.login_type === "password" && ( + onResetUserPassword(user)} + > + + Reset password… + + )} + + + + onDeleteUser(user)} - disabled={user.id === actorID} - danger > + Delete… - - - + + + )} diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx index b187167bb4631..ddd834590c36e 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx @@ -2,17 +2,17 @@ import DeleteIcon from "@mui/icons-material/DeleteOutlined"; import DownloadOutlined from "@mui/icons-material/DownloadOutlined"; import DuplicateIcon from "@mui/icons-material/FileCopyOutlined"; import HistoryIcon from "@mui/icons-material/HistoryOutlined"; -import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined"; import SettingsIcon from "@mui/icons-material/SettingsOutlined"; -import Divider from "@mui/material/Divider"; import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; -import { TopbarIconButton } from "components/FullPageLayout/Topbar"; +import { Button } from "components/Button/Button"; import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, -} from "components/MoreMenu/MoreMenu"; + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuSeparator, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; +import { EllipsisVertical } from "lucide-react"; import { useWorkspaceDuplication } from "pages/CreateWorkspacePage/useWorkspaceDuplication"; import { type FC, Fragment, type ReactNode, useState } from "react"; import { mustUpdateWorkspace } from "utils/workspace"; @@ -177,56 +177,59 @@ export const WorkspaceActions: FC = ({ onToggle={handleToggleFavorite} /> - - - + + + - - + + Settings - + {canChangeVersions && ( - + Change version… - + )} - Duplicate… - + - setIsDownloadDialogOpen(true)}> + setIsDownloadDialogOpen(true)}> Download logs… - + - + - Delete… - - - + + + = ({ {workspaces?.length === 1 ? "workspace" : "workspaces"} - - + + = ({ > Actions - - - + + @@ -157,28 +156,32 @@ export const WorkspacesPageView: FC = ({ !mustUpdateWorkspace(w, canChangeVersions), ) } + onClick={onStartAll} > Start - - + w.latest_build.status === "running", ) } + onClick={onStopAll} > Stop - - - + + + Update… - - + + Delete… - - - + + + ) : ( !invalidPageNumber && ( diff --git a/site/tailwind.config.js b/site/tailwind.config.js index d2935698e5d9e..1edd202602b4b 100644 --- a/site/tailwind.config.js +++ b/site/tailwind.config.js @@ -12,7 +12,7 @@ module.exports = { sans: `"Inter Variable", system-ui, sans-serif`, }, size: { - "icon-lg": "1.5rem", + "icon-md": "1.5rem", "icon-sm": "1.125rem", "icon-xs": "0.875rem", }, From e825cf0f46a2a1271b913e34f5cd812d0e11c9ce Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 12:25:32 +0000 Subject: [PATCH 02/18] chore: update EllipsisVertical icon size --- site/src/pages/GroupsPage/GroupPage.tsx | 8 ++++-- .../CustomRolesPage/CustomRolesPageView.tsx | 8 ++++-- .../IdpSyncPage/IdpGroupSyncForm.tsx | 2 +- .../IdpSyncPage/IdpRoleSyncForm.tsx | 2 +- .../OrganizationMembersPageView.tsx | 25 ++++++++----------- .../pages/TemplatePage/TemplatePageHeader.tsx | 4 +-- .../TemplatePermissionsPageView.tsx | 14 +++-------- .../UsersPage/UsersTable/UsersTableBody.tsx | 11 ++++---- .../WorkspaceActions/WorkspaceActions.tsx | 4 +-- 9 files changed, 39 insertions(+), 39 deletions(-) diff --git a/site/src/pages/GroupsPage/GroupPage.tsx b/site/src/pages/GroupsPage/GroupPage.tsx index 9b8a693dc2cc3..2d1469ed696dd 100644 --- a/site/src/pages/GroupsPage/GroupPage.tsx +++ b/site/src/pages/GroupsPage/GroupPage.tsx @@ -333,8 +333,12 @@ const GroupMemberRow: FC = ({ {canUpdate && ( - - diff --git a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx index d38fe82b1967b..820b564c296e4 100644 --- a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx @@ -216,8 +216,12 @@ const RoleRow: FC = ({ {!role.built_in && (canUpdateOrgRole || canDeleteOrgRole) && ( - - diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx index 0bc711b158f0b..284267f4487e1 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx @@ -400,7 +400,7 @@ const GroupRow: FC = ({ aria-label="delete" onClick={() => onDelete(idpGroup)} > - + Delete IdP mapping diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx index 363a4e43f200d..0825ab4217395 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx @@ -318,7 +318,7 @@ const RoleRow: FC = ({ aria-label="delete" onClick={() => onDelete(idpRole)} > - + Delete IdP mapping diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx index fe35bdcba1046..686842b196b0b 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPageView.tsx @@ -10,13 +10,6 @@ import type { import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Avatar } from "components/Avatar/Avatar"; import { AvatarData } from "components/Avatar/AvatarData"; -import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { Loader } from "components/Loader/Loader"; -import { PaginationContainer } from "components/PaginationWidget/PaginationContainer"; -import { - SettingsHeader, - SettingsHeaderTitle, -} from "components/SettingsHeader/SettingsHeader"; import { Button } from "components/Button/Button"; import { DropdownMenu, @@ -24,6 +17,13 @@ import { DropdownMenuItem, DropdownMenuTrigger, } from "components/DropdownMenu/DropdownMenu"; +import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; +import { Loader } from "components/Loader/Loader"; +import { PaginationContainer } from "components/PaginationWidget/PaginationContainer"; +import { + SettingsHeader, + SettingsHeaderTitle, +} from "components/SettingsHeader/SettingsHeader"; import { Stack } from "components/Stack/Stack"; import { Table, @@ -35,7 +35,7 @@ import { } from "components/Table/Table"; import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; import type { PaginationResultInfo } from "hooks/usePaginatedQuery"; -import { TriangleAlert, EllipsisVertical } from "lucide-react"; +import { EllipsisVertical, TriangleAlert } from "lucide-react"; import { UserGroupsCell } from "pages/UsersPage/UsersTable/UserGroupsCell"; import { type FC, useState } from "react"; import { TableColumnHelpTooltip } from "./UserTable/TableColumnHelpTooltip"; @@ -166,14 +166,11 @@ export const OrganizationMembersPageView: FC< @@ -187,7 +184,7 @@ export const OrganizationMembersPageView: FC< )} - + )) ) : ( diff --git a/site/src/pages/TemplatePage/TemplatePageHeader.tsx b/site/src/pages/TemplatePage/TemplatePageHeader.tsx index 7232be57dcea6..83c5b55019715 100644 --- a/site/src/pages/TemplatePage/TemplatePageHeader.tsx +++ b/site/src/pages/TemplatePage/TemplatePageHeader.tsx @@ -70,8 +70,8 @@ const TemplateMenu: FC = ({ <> - - diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx index 409beba583fcf..ab4cd597b9c2b 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx @@ -293,14 +293,11 @@ export const TemplatePermissionsPageView: FC< @@ -352,14 +349,11 @@ export const TemplatePermissionsPageView: FC< diff --git a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx index 30958d0adcbca..be40d0b3c16b7 100644 --- a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx +++ b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx @@ -183,11 +183,12 @@ export const UsersTableBody: FC = ({ - diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx index ddd834590c36e..5ec179e158629 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx @@ -180,14 +180,14 @@ export const WorkspaceActions: FC = ({ From 732006a92f56acff4bb2cf534bb1b65eba53a0f3 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 12:35:07 +0000 Subject: [PATCH 03/18] chore: cleanup --- .../components/Spinner/Spinner.stories.tsx | 2 +- site/src/components/Spinner/Spinner.tsx | 2 +- .../CreateWorkspacePageViewExperimental.tsx | 48 ++++++++----------- .../IdpOrgSyncPage/IdpOrgSyncPageView.tsx | 2 +- .../UserTable/EditRolesButton.tsx | 2 +- site/tailwind.config.js | 2 +- 6 files changed, 25 insertions(+), 33 deletions(-) diff --git a/site/src/components/Spinner/Spinner.stories.tsx b/site/src/components/Spinner/Spinner.stories.tsx index 974a86afa30b2..f1cd9e1b24ff2 100644 --- a/site/src/components/Spinner/Spinner.stories.tsx +++ b/site/src/components/Spinner/Spinner.stories.tsx @@ -6,7 +6,7 @@ const meta: Meta = { title: "components/Spinner", component: Spinner, args: { - children: , + children: , }, }; diff --git a/site/src/components/Spinner/Spinner.tsx b/site/src/components/Spinner/Spinner.tsx index a9266d734fbb0..8e331a1a6dd20 100644 --- a/site/src/components/Spinner/Spinner.tsx +++ b/site/src/components/Spinner/Spinner.tsx @@ -14,7 +14,7 @@ const leaves = 8; const spinnerVariants = cva("", { variants: { size: { - lg: "size-icon-md", + lg: "size-icon-lg", sm: "size-icon-sm", }, }, diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx index c725a8cbb73f6..009dde55c59a1 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx @@ -340,35 +340,27 @@ export const CreateWorkspacePageViewExperimental: FC< -
- { - form.setFieldValue("name", e.target.value.trim()); - resetMutation(); + { + form.setFieldValue("name", e.target.value.trim()); + resetMutation(); + }} + disabled={creatingWorkspace} + /> +
+ Need a suggestion? + -
+ > + {suggestedName} +
{permissions.createWorkspaceForAny && ( diff --git a/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx b/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx index 8576b588ac249..3fb267fb9daac 100644 --- a/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx +++ b/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx @@ -448,7 +448,7 @@ const OrganizationRow: FC = ({ aria-label="delete" onClick={() => onDelete(idpOrg)} > - + Delete IdP mapping diff --git a/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx b/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx index 567d1c5b9f9c8..383f8dc80d099 100644 --- a/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx +++ b/site/src/pages/OrganizationSettingsPage/UserTable/EditRolesButton.tsx @@ -135,7 +135,7 @@ export const EditRolesButton: FC = ({ size="icon" className="text-content-secondary hover:text-content-primary" > - + diff --git a/site/tailwind.config.js b/site/tailwind.config.js index 1edd202602b4b..d2935698e5d9e 100644 --- a/site/tailwind.config.js +++ b/site/tailwind.config.js @@ -12,7 +12,7 @@ module.exports = { sans: `"Inter Variable", system-ui, sans-serif`, }, size: { - "icon-md": "1.5rem", + "icon-lg": "1.5rem", "icon-sm": "1.125rem", "icon-xs": "0.875rem", }, From 47f4839748a943faf9f45e7d46c4172879d953ff Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 15:34:46 +0000 Subject: [PATCH 04/18] chore: cleanup --- .../CreateWorkspacePageViewExperimental.tsx | 43 ++++++++++--------- 1 file changed, 23 insertions(+), 20 deletions(-) diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx index 009dde55c59a1..35a3766700a50 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx @@ -340,27 +340,29 @@ export const CreateWorkspacePageViewExperimental: FC< - { - form.setFieldValue("name", e.target.value.trim()); - resetMutation(); - }} - disabled={creatingWorkspace} - /> -
- Need a suggestion? - + disabled={creatingWorkspace} + /> +
+ Need a suggestion? + +
{permissions.createWorkspaceForAny && ( @@ -482,6 +484,7 @@ export const CreateWorkspacePageViewExperimental: FC< return ( From 826874b086153e7b84ea8bef59dddf1ff81be1a6 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 15:35:23 +0000 Subject: [PATCH 05/18] fix: cleanup --- .../CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx index 35a3766700a50..3685b4aadb7b9 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx @@ -484,7 +484,7 @@ export const CreateWorkspacePageViewExperimental: FC< return ( From 6d2dbe8d2374696ed3c8acbc58a75b6bd1a078f7 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 15:55:28 +0000 Subject: [PATCH 06/18] fix: cleanup --- .../CustomRolesPage/CustomRolesPageView.tsx | 8 +++++--- .../UsersPage/UsersTable/UsersTableBody.tsx | 17 +++++++++-------- 2 files changed, 14 insertions(+), 11 deletions(-) diff --git a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx index 820b564c296e4..2c360a8dd4e45 100644 --- a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/CustomRolesPageView.tsx @@ -226,9 +226,11 @@ const RoleRow: FC = ({ - navigate(role.name)}> - Edit - + {canUpdateOrgRole && ( + navigate(role.name)}> + Edit + + )} {canDeleteOrgRole && ( = ({ data-testid="suspend-button" onClick={() => onSuspendUser(user)} > - Suspend… ) : ( onActivateUser(user)}> - Activate… )} onListWorkspaces(user)}> - - List workspaces… + View workspaces {canViewActivity && ( - onViewActivity(user)}> - - View activity… + onViewActivity(user)} + disabled={!canViewActivity} + > + View activity {!canViewActivity && } )} {user.login_type === "password" && ( onResetUserPassword(user)} + disabled={user.login_type !== "password"} > - Reset password… )} @@ -234,6 +234,7 @@ export const UsersTableBody: FC = ({ onDeleteUser(user)} + disabled={user.id === actorID} > Delete… From d337372aa34bb4dcb8fa283f6f6a4de0e480e89f Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 16:21:07 +0000 Subject: [PATCH 07/18] fix: fix UsersPage storybook tests --- .../src/pages/UsersPage/UsersPage.stories.tsx | 50 ++++++------------- 1 file changed, 16 insertions(+), 34 deletions(-) diff --git a/site/src/pages/UsersPage/UsersPage.stories.tsx b/site/src/pages/UsersPage/UsersPage.stories.tsx index 8a3c9bea5d013..7e4e22aeedb68 100644 --- a/site/src/pages/UsersPage/UsersPage.stories.tsx +++ b/site/src/pages/UsersPage/UsersPage.stories.tsx @@ -99,10 +99,8 @@ export const SuspendUserSuccess: Story = { count: 60, }); - await user.click(within(userRow).getByLabelText("More options")); - const suspendButton = await within(userRow).findByText("Suspend", { - exact: false, - }); + await user.click(within(userRow).getByLabelText("Open menu")); + const suspendButton = await within(document.body).findByText("Suspend…"); await user.click(suspendButton); const dialog = await within(document.body).findByRole("dialog"); @@ -120,10 +118,8 @@ export const SuspendUserError: Story = { } spyOn(API, "suspendUser").mockRejectedValue(undefined); - await user.click(within(userRow).getByLabelText("More options")); - const suspendButton = await within(userRow).findByText("Suspend", { - exact: false, - }); + await user.click(within(userRow).getByLabelText("Open menu")); + const suspendButton = await within(document.body).findByText("Suspend…"); await user.click(suspendButton); const dialog = await within(document.body).findByRole("dialog"); @@ -149,10 +145,8 @@ export const DeleteUserSuccess: Story = { count: 59, }); - await user.click(within(userRow).getByLabelText("More options")); - const deleteButton = await within(userRow).findByText("Delete", { - exact: false, - }); + await user.click(within(userRow).getByLabelText("Open menu")); + const deleteButton = await within(document.body).findByText("Delete…"); await user.click(deleteButton); const dialog = await within(document.body).findByRole("dialog"); @@ -172,10 +166,8 @@ export const DeleteUserError: Story = { } spyOn(API, "deleteUser").mockRejectedValue({}); - await user.click(within(userRow).getByLabelText("More options")); - const deleteButton = await within(userRow).findByText("Delete", { - exact: false, - }); + await user.click(within(userRow).getByLabelText("Open menu")); + const deleteButton = await within(document.body).findByText("Delete…"); await user.click(deleteButton); const dialog = await within(document.body).findByRole("dialog"); @@ -220,10 +212,8 @@ export const ActivateUserSuccess: Story = { count: 60, }); - await user.click(within(userRow).getByLabelText("More options")); - const activateButton = await within(userRow).findByText("Activate", { - exact: false, - }); + await user.click(within(userRow).getByLabelText("Open menu")); + const activateButton = await within(document.body).findByText("Activate…"); await user.click(activateButton); const dialog = await within(document.body).findByRole("dialog"); @@ -242,10 +232,8 @@ export const ActivateUserError: Story = { } spyOn(API, "activateUser").mockRejectedValue({}); - await user.click(within(userRow).getByLabelText("More options")); - const activateButton = await within(userRow).findByText("Activate", { - exact: false, - }); + await user.click(within(userRow).getByLabelText("Open menu")); + const activateButton = await within(document.body).findByText("Activate…"); await user.click(activateButton); const dialog = await within(document.body).findByRole("dialog"); @@ -279,11 +267,8 @@ export const ResetUserPasswordSuccess: Story = { } spyOn(API, "updateUserPassword").mockResolvedValue(); - await user.click(within(userRow).getByLabelText("More options")); - const resetPasswordButton = await within(userRow).findByText( - "Reset password", - { exact: false }, - ); + await user.click(within(userRow).getByLabelText("Open menu")); + const resetPasswordButton = await within(document.body).findByText("Reset password…"); await user.click(resetPasswordButton); const dialog = await within(document.body).findByRole("dialog"); @@ -306,11 +291,8 @@ export const ResetUserPasswordError: Story = { } spyOn(API, "updateUserPassword").mockRejectedValue({}); - await user.click(within(userRow).getByLabelText("More options")); - const resetPasswordButton = await within(userRow).findByText( - "Reset password", - { exact: false }, - ); + await user.click(within(userRow).getByLabelText("Open menu")); + const resetPasswordButton = await within(document.body).findByText("Reset password…"); await user.click(resetPasswordButton); const dialog = await within(document.body).findByRole("dialog"); From e13f22469ebab66dce1fe04033d1bd5022928011 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 16:25:43 +0000 Subject: [PATCH 08/18] fix: fix test --- .../OrganizationMembersPage.test.tsx | 10 +++++----- site/src/pages/UsersPage/UsersPage.stories.tsx | 8 ++++++-- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx index f828969238cec..0d613f0eec662 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx @@ -46,14 +46,14 @@ const renderPage = async () => { const removeMember = async () => { const user = userEvent.setup(); - // Click on the "More options" button to display the "Remove" option - const moreButtons = await screen.findAllByLabelText("More options"); + // Click on the "Open menu" button to display the "Remove" option + const menuButtons = await screen.findAllByLabelText("Open menu"); // get MockUser2 - const selectedMoreButton = moreButtons[0]; + const selectedMenuButton = menuButtons[0]; - await user.click(selectedMoreButton); + await user.click(selectedMenuButton); - const removeButton = screen.getByText(/Remove/); + const removeButton = await within(document.body).findByText("Remove…"); await user.click(removeButton); const dialog = await within(document.body).findByRole("dialog"); diff --git a/site/src/pages/UsersPage/UsersPage.stories.tsx b/site/src/pages/UsersPage/UsersPage.stories.tsx index 7e4e22aeedb68..88059c35e3096 100644 --- a/site/src/pages/UsersPage/UsersPage.stories.tsx +++ b/site/src/pages/UsersPage/UsersPage.stories.tsx @@ -268,7 +268,9 @@ export const ResetUserPasswordSuccess: Story = { spyOn(API, "updateUserPassword").mockResolvedValue(); await user.click(within(userRow).getByLabelText("Open menu")); - const resetPasswordButton = await within(document.body).findByText("Reset password…"); + const resetPasswordButton = await within(document.body).findByText( + "Reset password…", + ); await user.click(resetPasswordButton); const dialog = await within(document.body).findByRole("dialog"); @@ -292,7 +294,9 @@ export const ResetUserPasswordError: Story = { spyOn(API, "updateUserPassword").mockRejectedValue({}); await user.click(within(userRow).getByLabelText("Open menu")); - const resetPasswordButton = await within(document.body).findByText("Reset password…"); + const resetPasswordButton = await within(document.body).findByText( + "Reset password…", + ); await user.click(resetPasswordButton); const dialog = await within(document.body).findByRole("dialog"); From bb25e431773db867fa6d16113a6c792cbc56d852 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 20:45:12 +0000 Subject: [PATCH 09/18] fix: update tests --- .../OrganizationMembersPage.test.tsx | 9 +++++++-- .../WorkspaceActions/WorkspaceActions.stories.tsx | 9 +++++---- .../WorkspacePage/WorkspaceActions/WorkspaceActions.tsx | 4 ++-- 3 files changed, 14 insertions(+), 8 deletions(-) diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx index 0d613f0eec662..497aeeef26ccb 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx @@ -47,13 +47,18 @@ const renderPage = async () => { const removeMember = async () => { const user = userEvent.setup(); // Click on the "Open menu" button to display the "Remove" option - const menuButtons = await screen.findAllByLabelText("Open menu"); + const menuButtons = await screen.findAllByRole("button", { name: "Open menu" }); // get MockUser2 const selectedMenuButton = menuButtons[0]; await user.click(selectedMenuButton); - const removeButton = await within(document.body).findByText("Remove…"); + // Wait for the dropdown menu to be visible and find the remove button + const menuItems = await screen.findAllByRole("menuitem"); + const removeButton = menuItems.find(item => item.textContent === "Remove"); + if (!removeButton) { + throw new Error("Remove button not found"); + } await user.click(removeButton); const dialog = await within(document.body).findByRole("dialog"); diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx index 700797c886030..b42b817186d23 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx @@ -202,9 +202,9 @@ export const OpenDownloadLogs: Story = { }, play: async ({ canvasElement }) => { const canvas = within(canvasElement); - await userEvent.click(canvas.getByRole("button", { name: "More options" })); - await userEvent.click(canvas.getByText("Download logs", { exact: false })); + await userEvent.click(canvas.getByRole("button", { name: "Workspace actions" })); const screen = within(document.body); + await userEvent.click(screen.getByText("Download logs…")); await expect(screen.getByTestId("dialog")).toBeInTheDocument(); }, }; @@ -215,8 +215,9 @@ export const CanDeleteDormantWorkspace: Story = { }, play: async ({ canvasElement }) => { const canvas = within(canvasElement); - await userEvent.click(canvas.getByRole("button", { name: "More options" })); - const deleteButton = canvas.getByText("Delete…"); + await userEvent.click(canvas.getByRole("button", { name: "Workspace actions" })); + const screen = within(document.body); + const deleteButton = screen.getByText("Delete…"); await expect(deleteButton).toBeEnabled(); }, }; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx index 5ec179e158629..71f890cff3a5b 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx @@ -182,13 +182,13 @@ export const WorkspaceActions: FC = ({ From d56d98812f96c84e41cecb2a029d2ee81cd54d3b Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 22:38:16 +0000 Subject: [PATCH 10/18] fix: fix tests --- .../OrganizationMembersPage.test.tsx | 27 ++++++++++--------- .../WorkspaceActions.stories.tsx | 8 ++++-- 2 files changed, 20 insertions(+), 15 deletions(-) diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx index 497aeeef26ccb..4231f7151222b 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx @@ -6,6 +6,8 @@ import { MockEntitlementsWithMultiOrg, MockOrganization, MockOrganizationAuditorRole, + MockOrganizationMember, + MockOrganizationMember2, MockOrganizationPermissions, MockUser, } from "testHelpers/entities"; @@ -46,20 +48,19 @@ const renderPage = async () => { const removeMember = async () => { const user = userEvent.setup(); - // Click on the "Open menu" button to display the "Remove" option - const menuButtons = await screen.findAllByRole("button", { name: "Open menu" }); - // get MockUser2 - const selectedMenuButton = menuButtons[0]; - - await user.click(selectedMenuButton); - - // Wait for the dropdown menu to be visible and find the remove button - const menuItems = await screen.findAllByRole("menuitem"); - const removeButton = menuItems.find(item => item.textContent === "Remove"); - if (!removeButton) { - throw new Error("Remove button not found"); + + const users = await screen.findAllByText(/.*@coder.com/); + const userRow = users[1].closest("tr"); + if (!userRow) { + throw new Error("Error on get the first user row"); } - await user.click(removeButton); + const menuButton = await within(userRow).findByRole("button", { + name: "Open menu", + }); + await user.click(menuButton); + + const removeOption = await screen.findByRole("menuitem", { name: "Remove" }); + await user.click(removeOption); const dialog = await within(document.body).findByRole("dialog"); await user.click(within(dialog).getByRole("button", { name: "Remove" })); diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx index b42b817186d23..d726a047b7c57 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx @@ -202,7 +202,9 @@ export const OpenDownloadLogs: Story = { }, play: async ({ canvasElement }) => { const canvas = within(canvasElement); - await userEvent.click(canvas.getByRole("button", { name: "Workspace actions" })); + await userEvent.click( + canvas.getByRole("button", { name: "Workspace actions" }), + ); const screen = within(document.body); await userEvent.click(screen.getByText("Download logs…")); await expect(screen.getByTestId("dialog")).toBeInTheDocument(); @@ -215,7 +217,9 @@ export const CanDeleteDormantWorkspace: Story = { }, play: async ({ canvasElement }) => { const canvas = within(canvasElement); - await userEvent.click(canvas.getByRole("button", { name: "Workspace actions" })); + await userEvent.click( + canvas.getByRole("button", { name: "Workspace actions" }), + ); const screen = within(document.body); const deleteButton = screen.getByText("Delete…"); await expect(deleteButton).toBeEnabled(); From d795480442cce3f75a89eab451f62876300c2093 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 22:45:12 +0000 Subject: [PATCH 11/18] fix: removed unused imports --- .../OrganizationSettingsPage/OrganizationMembersPage.test.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx index 4231f7151222b..660e66ca0ccb2 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationMembersPage.test.tsx @@ -6,8 +6,6 @@ import { MockEntitlementsWithMultiOrg, MockOrganization, MockOrganizationAuditorRole, - MockOrganizationMember, - MockOrganizationMember2, MockOrganizationPermissions, MockUser, } from "testHelpers/entities"; From 43afbe4faabee0e0a4b49d09dc80a2a6a178d9e7 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Wed, 30 Apr 2025 22:59:12 +0000 Subject: [PATCH 12/18] chore: remove unused dependency --- site/package.json | 1 - site/pnpm-lock.yaml | 195 -------------------------------------------- 2 files changed, 196 deletions(-) diff --git a/site/package.json b/site/package.json index f8349c86f4c61..23c1cf9d22428 100644 --- a/site/package.json +++ b/site/package.json @@ -57,7 +57,6 @@ "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.4", "@radix-ui/react-collapsible": "1.1.2", - "@radix-ui/react-context-menu": "2.2.6", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-label": "2.1.0", diff --git a/site/pnpm-lock.yaml b/site/pnpm-lock.yaml index 283102d72604d..e20e5b322b2c2 100644 --- a/site/pnpm-lock.yaml +++ b/site/pnpm-lock.yaml @@ -82,9 +82,6 @@ importers: '@radix-ui/react-collapsible': specifier: 1.1.2 version: 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-context-menu': - specifier: 2.2.6 - version: 2.2.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@radix-ui/react-dialog': specifier: 1.1.4 version: 1.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -1481,19 +1478,6 @@ packages: '@types/react-dom': optional: true - '@radix-ui/react-arrow@1.1.2': - resolution: {integrity: sha512-G+KcpzXHq24iH0uGG/pF8LyzpFJYGD4RfLjCIBfGdSLXvjLHST31RUiRVrupIBMvIppMgSzQ6l66iAxl03tdlg==, tarball: https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.1.2.tgz} - 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-avatar@1.1.2': resolution: {integrity: sha512-GaC7bXQZ5VgZvVvsJ5mu/AEbjYLnhhkoidOboC50Z6FFlLA03wG2ianUoH+zgDQ31/9gCF59bE4+2bBgTyMiig==, tarball: https://registry.npmjs.org/@radix-ui/react-avatar/-/react-avatar-1.1.2.tgz} peerDependencies: @@ -1577,19 +1561,6 @@ packages: '@types/react': optional: true - '@radix-ui/react-context-menu@2.2.6': - resolution: {integrity: sha512-aUP99QZ3VU84NPsHeaFt4cQUNgJqFsLLOt/RbbWXszZ6MP0DpDyjkFZORr4RpAEx3sUBk+Kc8h13yGtC5Qw8dg==, tarball: https://registry.npmjs.org/@radix-ui/react-context-menu/-/react-context-menu-2.2.6.tgz} - 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-context@1.1.1': resolution: {integrity: sha512-UASk9zi+crv9WteK/NU4PLvOoL3OuE6BWVKNF6hPRBtYBDXQ2u5iu3O59zUlJiTVvkyuycnqrztsHVJwcK9K+Q==, tarball: https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.1.1.tgz} peerDependencies: @@ -1647,19 +1618,6 @@ packages: '@types/react-dom': optional: true - '@radix-ui/react-dismissable-layer@1.1.5': - resolution: {integrity: sha512-E4TywXY6UsXNRhFrECa5HAvE5/4BFcGyfTyK36gP+pAW1ed7UTK4vKwdr53gAJYwqbfCWC6ATvJa3J3R/9+Qrg==, tarball: https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.5.tgz} - 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-dropdown-menu@2.1.4': resolution: {integrity: sha512-iXU1Ab5ecM+yEepGAWK8ZhMyKX4ubFdCNtol4sT9D0OVErG9PNElfx3TQhjw7n7BC5nFVz68/5//clWy+8TXzA==, tarball: https://registry.npmjs.org/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.1.4.tgz} peerDependencies: @@ -1695,19 +1653,6 @@ packages: '@types/react-dom': optional: true - '@radix-ui/react-focus-scope@1.1.2': - resolution: {integrity: sha512-zxwE80FCU7lcXUGWkdt6XpTTCKPitG1XKOwViTxHVKIJhZl9MvIl2dVHeZENCWD9+EdWv05wlaEkRXUykU27RA==, tarball: https://registry.npmjs.org/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.2.tgz} - 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-id@1.1.0': resolution: {integrity: sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==, tarball: https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz} peerDependencies: @@ -1743,19 +1688,6 @@ packages: '@types/react-dom': optional: true - '@radix-ui/react-menu@2.1.6': - resolution: {integrity: sha512-tBBb5CXDJW3t2mo9WlO7r6GTmWV0F0uzHZVFmlRmYpiSK1CDU5IKojP1pm7oknpBOrFZx/YgBRW9oorPO2S/Lg==, tarball: https://registry.npmjs.org/@radix-ui/react-menu/-/react-menu-2.1.6.tgz} - 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-popover@1.1.5': resolution: {integrity: sha512-YXkTAftOIW2Bt3qKH8vYr6n9gCkVrvyvfiTObVjoHVTHnNj26rmvO87IKa3VgtgCjb8FAQ6qOjNViwl+9iIzlg==, tarball: https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.1.5.tgz} peerDependencies: @@ -1782,19 +1714,6 @@ packages: '@types/react-dom': optional: true - '@radix-ui/react-popper@1.2.2': - resolution: {integrity: sha512-Rvqc3nOpwseCyj/rgjlJDYAgyfw7OC1tTkKn2ivhaMGcYt8FSBlahHOZak2i3QwkRXUXgGgzeEe2RuqeEHuHgA==, tarball: https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.2.tgz} - 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-portal@1.1.3': resolution: {integrity: sha512-NciRqhXnGojhT93RPyDaMPfLH3ZSl4jjIFbZQ1b/vxvZEdHsBZ49wP9w8L3HzUQwep01LcWtkUvm0OVB5JAHTw==, tarball: https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.3.tgz} peerDependencies: @@ -1808,19 +1727,6 @@ packages: '@types/react-dom': optional: true - '@radix-ui/react-portal@1.1.4': - resolution: {integrity: sha512-sn2O9k1rPFYVyKd5LAJfo96JlSGVFpa1fS6UuBJfrZadudiw5tAmru+n1x7aMRQ84qDM71Zh1+SzK5QwU0tJfA==, tarball: https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.4.tgz} - 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-presence@1.1.2': resolution: {integrity: sha512-18TFr80t5EVgL9x1SwF/YGtfG+l0BS0PRAlCWBDoBEiDQjeKgnNZRVJp/oVBl24sr3Gbfwc/Qpj4OcWTQMsAEg==, tarball: https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.2.tgz} peerDependencies: @@ -7617,15 +7523,6 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@radix-ui/react-arrow@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-avatar@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) @@ -7706,20 +7603,6 @@ snapshots: optionalDependencies: '@types/react': 18.3.12 - '@radix-ui/react-context-menu@2.2.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@radix-ui/primitive': 1.1.1 - '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-menu': 2.1.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-use-controllable-state': 1.1.0(@types/react@18.3.12)(react@18.3.1) - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-context@1.1.1(@types/react@18.3.12)(react@18.3.1)': dependencies: react: 18.3.1 @@ -7780,19 +7663,6 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@radix-ui/react-dismissable-layer@1.1.5(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@radix-ui/primitive': 1.1.1 - '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-use-escape-keydown': 1.1.0(@types/react@18.3.12)(react@18.3.1) - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-dropdown-menu@2.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/primitive': 1.1.1 @@ -7825,17 +7695,6 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@radix-ui/react-focus-scope@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-id@1.1.0(@types/react@18.3.12)(react@18.3.1)': dependencies: '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1) @@ -7878,32 +7737,6 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@radix-ui/react-menu@2.1.6(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@radix-ui/primitive': 1.1.1 - '@radix-ui/react-collection': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-direction': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-dismissable-layer': 1.1.5(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-focus-guards': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-focus-scope': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-id': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-popper': 1.2.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-portal': 1.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-presence': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-roving-focus': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-slot': 1.1.2(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) - aria-hidden: 1.2.4 - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - react-remove-scroll: 2.6.3(@types/react@18.3.12)(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-popover@1.1.5(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/primitive': 1.1.1 @@ -7945,24 +7778,6 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@radix-ui/react-popper@1.2.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@floating-ui/react-dom': 2.1.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-arrow': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-use-rect': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/react-use-size': 1.1.0(@types/react@18.3.12)(react@18.3.1) - '@radix-ui/rect': 1.1.0 - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-portal@1.1.3(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/react-primitive': 2.0.1(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -7973,16 +7788,6 @@ snapshots: '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@radix-ui/react-portal@1.1.4(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': - dependencies: - '@radix-ui/react-primitive': 2.0.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1) - react: 18.3.1 - react-dom: 18.3.1(react@18.3.1) - optionalDependencies: - '@types/react': 18.3.12 - '@types/react-dom': 18.3.1 - '@radix-ui/react-presence@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1) From 9b7a2e0cafd88fdb7912eb66ebb8bf4388580748 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Thu, 1 May 2025 14:29:10 +0000 Subject: [PATCH 13/18] fix: fix e2e tests --- site/e2e/tests/groups/removeMember.spec.ts | 5 ++--- site/e2e/tests/organizationGroups.spec.ts | 6 ++++-- site/e2e/tests/organizationMembers.spec.ts | 5 +++-- .../organizations/customRoles/customRoles.spec.ts | 10 +++++----- site/e2e/tests/updateTemplate.spec.ts | 6 ++++-- site/e2e/tests/users/removeUser.spec.ts | 6 +++--- 6 files changed, 21 insertions(+), 17 deletions(-) diff --git a/site/e2e/tests/groups/removeMember.spec.ts b/site/e2e/tests/groups/removeMember.spec.ts index 856ece95c0b02..c69925589221a 100644 --- a/site/e2e/tests/groups/removeMember.spec.ts +++ b/site/e2e/tests/groups/removeMember.spec.ts @@ -33,9 +33,8 @@ test("remove member", async ({ page, baseURL }) => { await expect(page).toHaveTitle(`${group.display_name} - Coder`); const userRow = page.getByRole("row", { name: member.username }); - await userRow.getByRole("button", { name: "More options" }).click(); - - const menu = page.locator("#more-options"); + await userRow.getByRole("button", { name: "Open menu" }).click(); + const menu = page.getByRole("menu"); await menu.getByText("Remove").click({ timeout: 1_000 }); await expect(page.getByText("Member removed successfully.")).toBeVisible(); diff --git a/site/e2e/tests/organizationGroups.spec.ts b/site/e2e/tests/organizationGroups.spec.ts index 08768d4bbae11..14741bdf38e00 100644 --- a/site/e2e/tests/organizationGroups.spec.ts +++ b/site/e2e/tests/organizationGroups.spec.ts @@ -79,8 +79,10 @@ test("create group", async ({ page }) => { await expect(page.getByText("No users found")).toBeVisible(); // Remove someone from the group - await addedRow.getByLabel("More options").click(); - await page.getByText("Remove").click(); + await addedRow.getByRole("button", { name: "Open menu" }).click(); + const menu = page.getByRole("menu"); + await menu.getByText("Remove").click(); + await expect(addedRow).not.toBeVisible(); // Delete the group diff --git a/site/e2e/tests/organizationMembers.spec.ts b/site/e2e/tests/organizationMembers.spec.ts index 51c3491ae3d62..639e6428edfb5 100644 --- a/site/e2e/tests/organizationMembers.spec.ts +++ b/site/e2e/tests/organizationMembers.spec.ts @@ -39,8 +39,9 @@ test("add and remove organization member", async ({ page }) => { await expect(addedRow.getByText("+1 more")).toBeVisible(); // Remove them from the org - await addedRow.getByLabel("More options").click(); - await page.getByText("Remove").click(); // Click the "Remove" option + await addedRow.getByRole("button", { name: "Open menu" }).click(); + const menu = page.getByRole("menu"); + await menu.getByText("Remove").click(); await page.getByRole("button", { name: "Remove" }).click(); // Click "Remove" in the confirmation dialog await expect(addedRow).not.toBeVisible(); }); diff --git a/site/e2e/tests/organizations/customRoles/customRoles.spec.ts b/site/e2e/tests/organizations/customRoles/customRoles.spec.ts index 1e1e518e96399..1f55e87de8bab 100644 --- a/site/e2e/tests/organizations/customRoles/customRoles.spec.ts +++ b/site/e2e/tests/organizations/customRoles/customRoles.spec.ts @@ -37,8 +37,8 @@ test.describe("CustomRolesPage", () => { await expect(roleRow.getByText(customRole.display_name)).toBeVisible(); await expect(roleRow.getByText("organization_member")).toBeVisible(); - await roleRow.getByRole("button", { name: "More options" }).click(); - const menu = page.locator("#more-options"); + await roleRow.getByRole("button", { name: "Open menu" }).click(); + const menu = page.getByRole("menu"); await menu.getByText("Edit").click(); await expect(page).toHaveURL( @@ -118,7 +118,7 @@ test.describe("CustomRolesPage", () => { // Verify that the more menu (three dots) is not present for built-in roles await expect( - roleRow.getByRole("button", { name: "More options" }), + roleRow.getByRole("button", { name: "Open menu" }), ).not.toBeVisible(); await deleteOrganization(org.name); @@ -175,9 +175,9 @@ test.describe("CustomRolesPage", () => { await page.goto(`/organizations/${org.name}/roles`); const roleRow = page.getByTestId(`role-${customRole.name}`); - await roleRow.getByRole("button", { name: "More options" }).click(); + await roleRow.getByRole("button", { name: "Open menu" }).click(); - const menu = page.locator("#more-options"); + const menu = page.getByRole("menu"); await menu.getByText("Delete…").click(); const input = page.getByRole("textbox"); diff --git a/site/e2e/tests/updateTemplate.spec.ts b/site/e2e/tests/updateTemplate.spec.ts index e0bfac03cf036..43dd392443ea2 100644 --- a/site/e2e/tests/updateTemplate.spec.ts +++ b/site/e2e/tests/updateTemplate.spec.ts @@ -53,8 +53,10 @@ test("add and remove a group", async ({ page }) => { await expect(row).toBeVisible(); // Now remove the group - await row.getByLabel("More options").click(); - await page.getByText("Remove").click(); + await row.getByRole("button", { name: "Open menu" }).click(); + const menu = page.getByRole("menu"); + await menu.getByText("Remove").click(); + await expect(page.getByText("Group removed successfully!")).toBeVisible(); await expect(row).not.toBeVisible(); }); diff --git a/site/e2e/tests/users/removeUser.spec.ts b/site/e2e/tests/users/removeUser.spec.ts index c44d64b39c13c..92aa3efaa803a 100644 --- a/site/e2e/tests/users/removeUser.spec.ts +++ b/site/e2e/tests/users/removeUser.spec.ts @@ -17,9 +17,9 @@ test("remove user", async ({ page, baseURL }) => { await expect(page).toHaveTitle("Users - Coder"); const userRow = page.getByRole("row", { name: user.email }); - await userRow.getByRole("button", { name: "More options" }).click(); - const menu = page.locator("#more-options"); - await menu.getByText("Delete").click(); + await userRow.getByRole("button", { name: "Open menu" }).click(); + const menu = page.getByRole("menu"); + await menu.getByText("Delete…").click(); const dialog = page.getByTestId("dialog"); await dialog.getByLabel("Name of the user to delete").fill(user.username); From 82b9b09dbf289363b7221536ea58675db9054d54 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Thu, 1 May 2025 14:58:32 +0000 Subject: [PATCH 14/18] chore: update to use DropdownMenu --- .../AnnouncementBannerItem.tsx | 44 ++++++++++++------- 1 file changed, 27 insertions(+), 17 deletions(-) diff --git a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx index 9df726681a555..35106f8d750bb 100644 --- a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx +++ b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx @@ -3,13 +3,9 @@ import Checkbox from "@mui/material/Checkbox"; import TableCell from "@mui/material/TableCell"; import TableRow from "@mui/material/TableRow"; import type { BannerConfig } from "api/typesGenerated"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "components/MoreMenu/MoreMenu"; +import { Button } from "components/Button/Button"; +import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "components/DropdownMenu/DropdownMenu"; +import { EllipsisVertical } from "lucide-react"; import type { FC } from "react"; interface AnnouncementBannerItemProps { @@ -48,17 +44,31 @@ export const AnnouncementBannerItem: FC = ({ - - - - - - onEdit()}>Edit… - onDelete()} danger> + + + + + + onEdit()} + > + Edit… + + onDelete()} + > Delete… - - - + + + ); From fe820b37f5a1392277d6fedf3627215a82812458 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Thu, 1 May 2025 15:10:21 +0000 Subject: [PATCH 15/18] chore: update MoreMenu to use DropdownMenu --- .../AnnouncementBannerItem.tsx | 17 ++++---- .../ExternalAuthPage/ExternalAuthPageView.tsx | 43 ++++++++++--------- 2 files changed, 31 insertions(+), 29 deletions(-) diff --git a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx index 35106f8d750bb..9f72601ea9607 100644 --- a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx +++ b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx @@ -4,7 +4,12 @@ import TableCell from "@mui/material/TableCell"; import TableRow from "@mui/material/TableRow"; import type { BannerConfig } from "api/typesGenerated"; import { Button } from "components/Button/Button"; -import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "components/DropdownMenu/DropdownMenu"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from "components/DropdownMenu/DropdownMenu"; import { EllipsisVertical } from "lucide-react"; import type { FC } from "react"; @@ -46,19 +51,13 @@ export const AnnouncementBannerItem: FC = ({ - - onEdit()} - > + onEdit()}> Edit… = ({ - - - - - - + + + + + { onValidateExternalAuth(); // This is kinda jank. It does a refetch of the thing @@ -194,19 +198,18 @@ const ExternalAuthRow: FC = ({ }} > Test Validate… - - - + { onUnlinkExternalAuth(); await refetch(); }} > Unlink… - - - + + + ); From fac467a80b7a361614abffd1d60ddb2754432172 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Thu, 1 May 2025 15:11:58 +0000 Subject: [PATCH 16/18] chore: delete MoreMenu --- .../components/MoreMenu/MoreMenu.stories.tsx | 59 -------- site/src/components/MoreMenu/MoreMenu.tsx | 135 ------------------ 2 files changed, 194 deletions(-) delete mode 100644 site/src/components/MoreMenu/MoreMenu.stories.tsx delete mode 100644 site/src/components/MoreMenu/MoreMenu.tsx diff --git a/site/src/components/MoreMenu/MoreMenu.stories.tsx b/site/src/components/MoreMenu/MoreMenu.stories.tsx deleted file mode 100644 index e7a9968b01414..0000000000000 --- a/site/src/components/MoreMenu/MoreMenu.stories.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import GrassIcon from "@mui/icons-material/Grass"; -import KitesurfingIcon from "@mui/icons-material/Kitesurfing"; -import { action } from "@storybook/addon-actions"; -import type { Meta, StoryObj } from "@storybook/react"; -import { expect, screen, userEvent, waitFor, within } from "@storybook/test"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, - ThreeDotsButton, -} from "./MoreMenu"; - -const meta: Meta = { - title: "components/MoreMenu", - component: MoreMenu, -}; - -export default meta; -type Story = StoryObj; - -const Example: Story = { - args: { - children: ( - <> - - - - - - - Touch grass - - - - Touch water - - - - ), - }, - play: async ({ canvasElement, step }) => { - const canvas = within(canvasElement); - - await step("Open menu", async () => { - await userEvent.click( - canvas.getByRole("button", { name: "More options" }), - ); - await waitFor(() => - Promise.all([ - expect(screen.getByText(/touch grass/i)).toBeInTheDocument(), - expect(screen.getByText(/touch water/i)).toBeInTheDocument(), - ]), - ); - }); - }, -}; - -export { Example as MoreMenu }; diff --git a/site/src/components/MoreMenu/MoreMenu.tsx b/site/src/components/MoreMenu/MoreMenu.tsx deleted file mode 100644 index 8ba7864fc5e5d..0000000000000 --- a/site/src/components/MoreMenu/MoreMenu.tsx +++ /dev/null @@ -1,135 +0,0 @@ -import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined"; -import IconButton, { type IconButtonProps } from "@mui/material/IconButton"; -import Menu, { type MenuProps } from "@mui/material/Menu"; -import MenuItem, { type MenuItemProps } from "@mui/material/MenuItem"; -import { - type FC, - type HTMLProps, - type PropsWithChildren, - type ReactElement, - cloneElement, - createContext, - forwardRef, - useContext, - useRef, - useState, -} from "react"; - -type MoreMenuContextValue = { - triggerRef: React.RefObject; - close: () => void; - open: () => void; - isOpen: boolean; -}; - -const MoreMenuContext = createContext( - undefined, -); - -export const MoreMenu: FC = ({ children }) => { - const triggerRef = useRef(null); - const [isOpen, setIsOpen] = useState(false); - - const close = () => { - setIsOpen(false); - }; - - const open = () => { - setIsOpen(true); - }; - - return ( - - {children} - - ); -}; - -const useMoreMenuContext = () => { - const ctx = useContext(MoreMenuContext); - - if (!ctx) { - throw new Error("useMoreMenuContext must be used inside of MoreMenu"); - } - - return ctx; -}; - -export const MoreMenuTrigger: FC> = ({ - children, - ...props -}) => { - const menu = useMoreMenuContext(); - - return cloneElement(children as ReactElement, { - "aria-haspopup": "true", - ...props, - ref: menu.triggerRef, - onClick: menu.open, - }); -}; - -export const ThreeDotsButton = forwardRef( - (props, ref) => { - return ( - - - - ); - }, -); - -export const MoreMenuContent: FC> = ( - props, -) => { - const menu = useMoreMenuContext(); - - return ( - - ); -}; - -interface MoreMenuItemProps extends MenuItemProps { - closeOnClick?: boolean; - danger?: boolean; -} - -export const MoreMenuItem: FC = ({ - closeOnClick = true, - danger = false, - ...menuItemProps -}) => { - const menu = useMoreMenuContext(); - - return ( - ({ - fontSize: 14, - color: danger ? theme.palette.warning.light : undefined, - "& .MuiSvgIcon-root": { - width: 16, - height: 16, - }, - })} - onClick={(e) => { - menuItemProps.onClick?.(e); - if (closeOnClick) { - menu.close(); - } - }} - /> - ); -}; From c57d54aa299e09d25b669c5a1f8ce6fa4fb7c4fa Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Thu, 1 May 2025 15:17:11 +0000 Subject: [PATCH 17/18] fix: fix merge --- .../UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx index 336793112bd39..e44e26fa5aeeb 100644 --- a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx +++ b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx @@ -1,7 +1,6 @@ import { useTheme } from "@emotion/react"; import AutorenewIcon from "@mui/icons-material/Autorenew"; import LoadingButton from "@mui/lab/LoadingButton"; -import Divider from "@mui/material/Divider"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; From 564fedbcbf20c86fe2019a83fc0ed086a50ead91 Mon Sep 17 00:00:00 2001 From: Jaayden Halko Date: Thu, 1 May 2025 15:19:54 +0000 Subject: [PATCH 18/18] fix: fix merge --- .../CreateWorkspacePageViewExperimental.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx index 3685b4aadb7b9..c725a8cbb73f6 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx @@ -340,9 +340,10 @@ export const CreateWorkspacePageViewExperimental: FC< -
+
{ form.setFieldValue("name", e.target.value.trim()); @@ -350,6 +351,11 @@ export const CreateWorkspacePageViewExperimental: FC< }} disabled={creatingWorkspace} /> + {form.touched.name && form.errors.name && ( +
+ {form.errors.name} +
+ )}
Need a suggestion?