Skip to content

Commit 10e7b56

Browse files
aslilacpull[bot]
authored andcommitted
feat: add … to actions that require confirmation (#9862)
1 parent 53a8e91 commit 10e7b56

File tree

8 files changed

+78
-86
lines changed

8 files changed

+78
-86
lines changed

site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export const LicenseCard = ({
3636
return (
3737
<Paper key={license.id} elevation={2} className={styles.licenseCard}>
3838
<ConfirmDialog
39-
type="info"
39+
type="delete"
4040
hideCancel={false}
4141
open={licenseIDMarkedForRemoval !== undefined}
4242
onConfirm={() => {
@@ -105,11 +105,11 @@ export const LicenseCard = ({
105105
<Stack spacing={2}>
106106
<Button
107107
className={styles.removeButton}
108-
variant="text"
108+
variant="contained"
109109
size="small"
110110
onClick={() => setLicenseIDMarkedForRemoval(license.id)}
111111
>
112-
Remove
112+
Remove&hellip;
113113
</Button>
114114
</Stack>
115115
</Stack>
@@ -148,10 +148,6 @@ const useStyles = makeStyles((theme) => ({
148148
color: theme.palette.text.secondary,
149149
},
150150
removeButton: {
151-
height: "17px",
152-
minHeight: "17px",
153-
padding: 0,
154-
border: "none",
155151
color: theme.palette.error.main,
156152
"&:hover": {
157153
backgroundColor: "transparent",

site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -110,10 +110,10 @@ const LicensesSettingsPageView: FC<Props> = ({
110110
<Stack alignItems="center" spacing={1}>
111111
<Stack alignItems="center" spacing={0.5}>
112112
<span className={styles.title}>
113-
You don{"'"}t have any licenses!
113+
You don&apos;t have any licenses!
114114
</span>
115115
<span className={styles.description}>
116-
You{"'"}re missing out on high availability, RBAC, quotas, and
116+
You&apos;re missing out on high availability, RBAC, quotas, and
117117
much more. Contact{" "}
118118
<MuiLink href="mailto:sales@coder.com">sales</MuiLink> or{" "}
119119
<MuiLink href="https://coder.com/trial">

site/src/pages/GroupsPage/GroupPage.tsx

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import Button from "@mui/material/Button";
2-
import Link from "@mui/material/Link";
32
import Table from "@mui/material/Table";
43
import TableBody from "@mui/material/TableBody";
54
import TableCell from "@mui/material/TableCell";
@@ -60,6 +59,7 @@ export const GroupPage: React.FC = () => {
6059
const [isDeletingGroup, setIsDeletingGroup] = useState(false);
6160
const isLoading = !groupData || !permissions;
6261
const canUpdateGroup = permissions ? permissions.canUpdateGroup : false;
62+
const styles = useStyles();
6363

6464
return (
6565
<>
@@ -80,17 +80,22 @@ export const GroupPage: React.FC = () => {
8080
<PageHeader
8181
actions={
8282
<Maybe condition={canUpdateGroup}>
83-
<Link to="settings" component={RouterLink}>
84-
<Button startIcon={<SettingsOutlined />}>Settings</Button>
85-
</Link>
83+
<Button
84+
startIcon={<SettingsOutlined />}
85+
to="settings"
86+
component={RouterLink}
87+
>
88+
Settings
89+
</Button>
8690
<Button
8791
disabled={groupData?.id === groupData?.organization_id}
8892
onClick={() => {
8993
setIsDeletingGroup(true);
9094
}}
9195
startIcon={<DeleteOutline />}
96+
className={styles.removeButton}
9297
>
93-
Delete
98+
Delete&hellip;
9499
</Button>
95100
</Maybe>
96101
}
@@ -184,11 +189,11 @@ export const GroupPage: React.FC = () => {
184189
</Cond>
185190
</ChooseOne>
186191

187-
{group && (
192+
{groupQuery.data && (
188193
<DeleteDialog
189194
isOpen={isDeletingGroup}
190195
confirmLoading={deleteGroupMutation.isLoading}
191-
name={group.name}
196+
name={groupQuery.data.name}
192197
entity="group"
193198
onConfirm={async () => {
194199
try {
@@ -303,10 +308,16 @@ const GroupMemberRow = (props: {
303308
);
304309
};
305310

306-
const useStyles = makeStyles(() => ({
311+
const useStyles = makeStyles((theme) => ({
307312
autoComplete: {
308313
width: 300,
309314
},
315+
removeButton: {
316+
color: theme.palette.error.main,
317+
"&:hover": {
318+
backgroundColor: "transparent",
319+
},
320+
},
310321
}));
311322

312323
export default GroupPage;

site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.test.tsx

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { fireEvent, screen, within } from "@testing-library/react";
22
import * as API from "../../../api/api";
33
import { renderWithAuth } from "../../../testHelpers/renderHelpers";
44
import { Language as SSHKeysPageLanguage, SSHKeysPage } from "./SSHKeysPage";
5-
import { Language as SSHKeysPageViewLanguage } from "./SSHKeysPageView";
65
import { MockGitSSHKey, mockApiError } from "testHelpers/entities";
76

87
describe("SSH keys Page", () => {
@@ -20,9 +19,7 @@ describe("SSH keys Page", () => {
2019
await screen.findByText(MockGitSSHKey.public_key);
2120

2221
// Click on the "Regenerate" button to display the confirm dialog
23-
const regenerateButton = screen.getByRole("button", {
24-
name: SSHKeysPageViewLanguage.regenerateLabel,
25-
});
22+
const regenerateButton = screen.getByTestId("regenerate");
2623
fireEvent.click(regenerateButton);
2724
const confirmDialog = screen.getByRole("dialog");
2825
expect(confirmDialog).toHaveTextContent(
@@ -67,9 +64,7 @@ describe("SSH keys Page", () => {
6764
);
6865

6966
// Click on the "Regenerate" button to display the confirm dialog
70-
const regenerateButton = screen.getByRole("button", {
71-
name: SSHKeysPageViewLanguage.regenerateLabel,
72-
});
67+
const regenerateButton = screen.getByTestId("regenerate");
7368
fireEvent.click(regenerateButton);
7469
const confirmDialog = screen.getByRole("dialog");
7570
expect(confirmDialog).toHaveTextContent(

site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import { PropsWithChildren, FC, useState } from "react";
2-
import { ConfirmDialog } from "../../../components/Dialogs/ConfirmDialog/ConfirmDialog";
3-
import { Section } from "../../../components/SettingsLayout/Section";
2+
import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog";
3+
import { displayError, displaySuccess } from "components/GlobalSnackbar/utils";
4+
import { Section } from "components/SettingsLayout/Section";
45
import { SSHKeysPageView } from "./SSHKeysPageView";
56
import { regenerateUserSSHKey, userSSHKey } from "api/queries/sshKeys";
6-
import { displayError, displaySuccess } from "components/GlobalSnackbar/utils";
77
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
88
import { getErrorMessage } from "api/errors";
99

site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,6 @@ import { Stack } from "components/Stack/Stack";
88
import { FC } from "react";
99
import { ErrorAlert } from "components/Alert/ErrorAlert";
1010

11-
export const Language = {
12-
regenerateLabel: "Regenerate",
13-
};
14-
1511
export interface SSHKeysPageViewProps {
1612
isLoading: boolean;
1713
getSSHKeyError?: unknown;
@@ -57,8 +53,8 @@ export const SSHKeysPageView: FC<
5753
</p>
5854
<CodeExample code={sshKey.public_key.trim()} />
5955
<div>
60-
<Button onClick={onRegenerateClick}>
61-
{Language.regenerateLabel}
56+
<Button onClick={onRegenerateClick} data-testid="regenerate">
57+
Regenerate&hellip;
6258
</Button>
6359
</div>
6460
</>

site/src/pages/UsersPage/UsersPage.test.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,11 @@ import {
99
MockOwnerRole,
1010
} from "testHelpers/entities";
1111
import { Language as usersXServiceLanguage } from "xServices/users/usersXService";
12-
import * as API from "../../api/api";
13-
import { Role } from "../../api/typesGenerated";
12+
import * as API from "api/api";
13+
import { Role } from "api/typesGenerated";
1414
import { Language as ResetPasswordDialogLanguage } from "./ResetPasswordDialog";
15-
import { renderWithAuth } from "../../testHelpers/renderHelpers";
16-
import { server } from "../../testHelpers/server";
15+
import { renderWithAuth } from "testHelpers/renderHelpers";
16+
import { server } from "testHelpers/server";
1717
import { Language as UsersPageLanguage, UsersPage } from "./UsersPage";
1818

1919
const renderPage = () => {
@@ -29,7 +29,7 @@ const suspendUser = async (setupActionSpies: () => void) => {
2929
await user.click(firstMoreButton);
3030

3131
const menu = await screen.findByRole("menu");
32-
const suspendButton = within(menu).getByText("Suspend");
32+
const suspendButton = within(menu).getByText(/Suspend/);
3333

3434
await user.click(suspendButton);
3535

@@ -60,7 +60,7 @@ const deleteUser = async (setupActionSpies: () => void) => {
6060
await user.click(selectedMoreButton);
6161

6262
const menu = await screen.findByRole("menu");
63-
const deleteButton = within(menu).getByText("Delete");
63+
const deleteButton = within(menu).getByText(/Delete/);
6464

6565
await user.click(deleteButton);
6666

@@ -89,7 +89,7 @@ const activateUser = async (setupActionSpies: () => void) => {
8989
fireEvent.click(suspendedMoreButton);
9090

9191
const menu = screen.getByRole("menu");
92-
const activateButton = within(menu).getByText("Activate");
92+
const activateButton = within(menu).getByText(/Activate/);
9393
fireEvent.click(activateButton);
9494

9595
// Check if the confirm message is displayed
@@ -115,7 +115,7 @@ const resetUserPassword = async (setupActionSpies: () => void) => {
115115
fireEvent.click(firstMoreButton);
116116

117117
const menu = screen.getByRole("menu");
118-
const resetPasswordButton = within(menu).getByText("Reset password");
118+
const resetPasswordButton = within(menu).getByText(/Reset password/);
119119

120120
fireEvent.click(resetPasswordButton);
121121

site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx

Lines changed: 39 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import TableCell from "@mui/material/TableCell";
44
import TableRow from "@mui/material/TableRow";
55
import { ChooseOne, Cond } from "components/Conditionals/ChooseOne";
66
import { Pill } from "components/Pill/Pill";
7-
import { FC, ReactNode } from "react";
7+
import { type FC } from "react";
88
import * as TypesGen from "../../../api/typesGenerated";
99
import { combineClasses } from "../../../utils/combineClasses";
1010
import { AvatarData } from "../../../components/AvatarData/AvatarData";
@@ -215,51 +215,45 @@ export const UsersTableBody: FC<
215215
<TableCell>
216216
<TableRowMenu
217217
data={user}
218-
menuItems={
218+
menuItems={[
219219
// Return either suspend or activate depending on status
220-
(user.status === "active" || user.status === "dormant"
221-
? [
222-
{
223-
label: "Suspend" as ReactNode,
224-
onClick: onSuspendUser,
225-
disabled: false,
226-
},
227-
]
228-
: [
229-
{
230-
label: "Activate" as ReactNode,
231-
onClick: onActivateUser,
232-
disabled: false,
233-
},
234-
]
235-
).concat(
236-
{
237-
label: "Delete",
238-
onClick: onDeleteUser,
239-
disabled: user.id === actorID,
240-
},
241-
{
242-
label: "Reset password",
243-
onClick: onResetUserPassword,
244-
disabled: user.login_type !== "password",
245-
},
246-
{
247-
label: "View workspaces",
248-
onClick: onListWorkspaces,
249-
disabled: false,
250-
},
251-
{
252-
label: (
253-
<>
254-
View activity
255-
{!canViewActivity && <EnterpriseBadge />}
256-
</>
257-
),
258-
onClick: onViewActivity,
259-
disabled: !canViewActivity,
260-
},
261-
)
262-
}
220+
user.status === "active" || user.status === "dormant"
221+
? {
222+
label: <>Suspend&hellip;</>,
223+
onClick: onSuspendUser,
224+
disabled: false,
225+
}
226+
: {
227+
label: <>Activate&hellip;</>,
228+
onClick: onActivateUser,
229+
disabled: false,
230+
},
231+
{
232+
label: <>Delete&hellip;</>,
233+
onClick: onDeleteUser,
234+
disabled: user.id === actorID,
235+
},
236+
{
237+
label: <>Reset password&hellip;</>,
238+
onClick: onResetUserPassword,
239+
disabled: user.login_type !== "password",
240+
},
241+
{
242+
label: "View workspaces",
243+
onClick: onListWorkspaces,
244+
disabled: false,
245+
},
246+
{
247+
label: (
248+
<>
249+
View activity
250+
{!canViewActivity && <EnterpriseBadge />}
251+
</>
252+
),
253+
onClick: onViewActivity,
254+
disabled: !canViewActivity,
255+
},
256+
]}
263257
/>
264258
</TableCell>
265259
)}

0 commit comments

Comments
 (0)