Skip to content

Commit 4799bfb

Browse files
committed
added status column
1 parent 1c6122b commit 4799bfb

File tree

4 files changed

+67
-40
lines changed

4 files changed

+67
-40
lines changed

enterprise/coderd/groups_test.go

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -695,7 +695,7 @@ func TestGroup(t *testing.T) {
695695
// Ensure that new user has dormant account
696696
require.Equal(t, codersdk.UserStatusDormant, anotherUser.Status)
697697

698-
group, err = client.PatchGroup(ctx, group.ID, codersdk.PatchGroupRequest{
698+
group, _ = client.PatchGroup(ctx, group.ID, codersdk.PatchGroupRequest{
699699
AddUsers: []string{anotherUser.ID.String()},
700700
})
701701

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import Box, { type BoxProps } from "@mui/material/Box";
2+
import { useTheme } from "@emotion/react";
3+
import dayjs from "dayjs";
4+
5+
export const LastSeen = ({
6+
value,
7+
...boxProps
8+
}: { value: string } & BoxProps) => {
9+
const theme = useTheme();
10+
const t = dayjs(value);
11+
const now = dayjs();
12+
13+
let message = t.fromNow();
14+
let color = theme.palette.text.secondary;
15+
16+
if (t.isAfter(now.subtract(1, "hour"))) {
17+
color = theme.palette.success.light;
18+
// Since the agent reports on a 10m interval,
19+
// the last_used_at can be inaccurate when recent.
20+
message = "Now";
21+
} else if (t.isAfter(now.subtract(3, "day"))) {
22+
color = theme.palette.text.secondary;
23+
} else if (t.isAfter(now.subtract(1, "month"))) {
24+
color = theme.palette.warning.light;
25+
} else if (t.isAfter(now.subtract(100, "year"))) {
26+
color = theme.palette.error.light;
27+
} else {
28+
message = "Never";
29+
}
30+
31+
return (
32+
<Box
33+
component="span"
34+
data-chromatic="ignore"
35+
{...boxProps}
36+
sx={{ color, ...boxProps.sx }}
37+
>
38+
{message}
39+
</Box>
40+
);
41+
};

site/src/pages/GroupsPage/GroupPage.tsx

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,9 @@ import {
4444
} from "api/queries/groups";
4545
import { displayError, displaySuccess } from "components/GlobalSnackbar/utils";
4646
import { getErrorMessage } from "api/errors";
47+
import Box from "@mui/material/Box";
48+
import { LastSeen } from "components/LastSeen/LastSeen";
49+
import { type Interpolation, type Theme } from "@emotion/react";
4750

4851
export const GroupPage: FC = () => {
4952
const { groupId } = useParams() as { groupId: string };
@@ -150,7 +153,8 @@ export const GroupPage: FC = () => {
150153
<Table>
151154
<TableHead>
152155
<TableRow>
153-
<TableCell width="99%">User</TableCell>
156+
<TableCell width="59%">User</TableCell>
157+
<TableCell width="40">Status</TableCell>
154158
<TableCell width="1%"></TableCell>
155159
</TableRow>
156160
</TableHead>
@@ -258,7 +262,7 @@ const GroupMemberRow = (props: {
258262

259263
return (
260264
<TableRow key={member.id}>
261-
<TableCell width="99%">
265+
<TableCell width="59%">
262266
<AvatarData
263267
avatar={
264268
<UserAvatar
@@ -270,6 +274,13 @@ const GroupMemberRow = (props: {
270274
subtitle={member.email}
271275
/>
272276
</TableCell>
277+
<TableCell
278+
width="40%"
279+
css={[styles.status, member.status === "suspended" && styles.suspended]}
280+
>
281+
<Box>{member.status}</Box>
282+
<LastSeen value={member.last_seen_at} sx={{ fontSize: 12 }} />
283+
</TableCell>
273284
<TableCell width="1%">
274285
{canUpdate && (
275286
<TableRowMenu
@@ -312,4 +323,13 @@ const useStyles = makeStyles((theme) => ({
312323
},
313324
}));
314325

326+
const styles = {
327+
status: {
328+
textTransform: "capitalize",
329+
},
330+
suspended: (theme) => ({
331+
color: theme.palette.text.secondary,
332+
}),
333+
} satisfies Record<string, Interpolation<Theme>>;
334+
315335
export default GroupPage;

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

Lines changed: 3 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import Box, { type BoxProps } from "@mui/material/Box";
1+
import Box from "@mui/material/Box";
22
import TableCell from "@mui/material/TableCell";
33
import TableRow from "@mui/material/TableRow";
44
import Skeleton from "@mui/material/Skeleton";
5-
import { type Interpolation, type Theme, useTheme } from "@emotion/react";
5+
import { type Interpolation, type Theme } from "@emotion/react";
66
import { type FC } from "react";
77
import dayjs from "dayjs";
88
import relativeTime from "dayjs/plugin/relativeTime";
@@ -25,6 +25,7 @@ import KeyOutlined from "@mui/icons-material/KeyOutlined";
2525
import GitHub from "@mui/icons-material/GitHub";
2626
import PasswordOutlined from "@mui/icons-material/PasswordOutlined";
2727
import ShieldOutlined from "@mui/icons-material/ShieldOutlined";
28+
import { LastSeen } from "components/LastSeen/LastSeen";
2829

2930
dayjs.extend(relativeTime);
3031

@@ -307,41 +308,6 @@ const LoginType = ({
307308
);
308309
};
309310

310-
const LastSeen = ({ value, ...boxProps }: { value: string } & BoxProps) => {
311-
const theme = useTheme();
312-
const t = dayjs(value);
313-
const now = dayjs();
314-
315-
let message = t.fromNow();
316-
let color = theme.palette.text.secondary;
317-
318-
if (t.isAfter(now.subtract(1, "hour"))) {
319-
color = theme.palette.success.light;
320-
// Since the agent reports on a 10m interval,
321-
// the last_used_at can be inaccurate when recent.
322-
message = "Now";
323-
} else if (t.isAfter(now.subtract(3, "day"))) {
324-
color = theme.palette.text.secondary;
325-
} else if (t.isAfter(now.subtract(1, "month"))) {
326-
color = theme.palette.warning.light;
327-
} else if (t.isAfter(now.subtract(100, "year"))) {
328-
color = theme.palette.error.light;
329-
} else {
330-
message = "Never";
331-
}
332-
333-
return (
334-
<Box
335-
component="span"
336-
data-chromatic="ignore"
337-
{...boxProps}
338-
sx={{ color, ...boxProps.sx }}
339-
>
340-
{message}
341-
</Box>
342-
);
343-
};
344-
345311
const styles = {
346312
status: {
347313
textTransform: "capitalize",

0 commit comments

Comments
 (0)