Skip to content

Commit 287cb6e

Browse files
dannykoppingdannykopping
committed
Merge branch 'main' of github.com:/coder/coder into dk/prebuilds
2 parents d1708cb + 4994ba1 commit 287cb6e

File tree

21 files changed

+950
-3
lines changed

21 files changed

+950
-3
lines changed

‎docs/user-guides/desktop/index.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,10 @@ You can install Coder Desktop on macOS or Windows.
3434

3535
1. Continue to the [configuration section](#configure).
3636

37+
> Do not install more than one copy of Coder Desktop.
38+
>
39+
> To avoid system VPN configuration conflicts, only one copy of `Coder Desktop.app` should exist on your Mac, and it must remain in `/Applications`.
40+
3741
### Windows
3842

3943
1. Download the latest `CoderDesktop` installer executable (`.exe`) from the [coder-desktop-windows release page](https://github.com/coder/coder-desktop-windows/releases).

‎examples/templates/docker/main.tf

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ module "jetbrains_gateway" {
139139
source = "registry.coder.com/modules/jetbrains-gateway/coder"
140140

141141
# JetBrains IDEs to make available for the user to select
142-
jetbrains_ides = ["IU", "PY", "WS", "PS", "RD", "CL", "GO", "RM"]
142+
jetbrains_ides = ["IU", "PS", "WS", "PY", "CL", "GO", "RM", "RD", "RR"]
143143
default = "IU"
144144

145145
# Default folder to open when starting a JetBrains IDE

‎site/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@
5656
"@radix-ui/react-dropdown-menu": "2.1.4",
5757
"@radix-ui/react-label": "2.1.0",
5858
"@radix-ui/react-popover": "1.1.5",
59+
"@radix-ui/react-scroll-area": "1.2.3",
5960
"@radix-ui/react-select": "2.1.4",
6061
"@radix-ui/react-slider": "1.2.2",
6162
"@radix-ui/react-slot": "1.1.1",

‎site/pnpm-lock.yaml

Lines changed: 71 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎site/src/components/Button/Button.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ export const buttonVariants = cva(
3131
lg: "min-w-20 h-10 px-3 py-2 [&_svg]:size-icon-lg",
3232
sm: "min-w-20 h-8 px-2 py-1.5 text-xs [&_svg]:size-icon-sm",
3333
icon: "size-8 px-1.5 [&_svg]:size-icon-sm",
34+
"icon-lg": "size-10 px-2 [&_svg]:size-icon-lg",
3435
},
3536
},
3637
defaultVariants: {

‎site/src/components/ScrollArea/ScrollArea.tsx

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
/**
2+
* Copied from shadc/ui on 03/05/2025
3+
* @see {@link https://ui.shadcn.com/docs/components/scroll-area}
4+
*/
5+
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
6+
import * as React from "react";
7+
import { cn } from "utils/cn";
8+
9+
export const ScrollArea = React.forwardRef<
10+
React.ElementRef<typeof ScrollAreaPrimitive.Root>,
11+
React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>
12+
>(({ className, children, ...props }, ref) => (
13+
<ScrollAreaPrimitive.Root
14+
ref={ref}
15+
className={cn("relative overflow-hidden", className)}
16+
{...props}
17+
>
18+
<ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
19+
{children}
20+
</ScrollAreaPrimitive.Viewport>
21+
<ScrollBar />
22+
<ScrollAreaPrimitive.Corner />
23+
</ScrollAreaPrimitive.Root>
24+
));
25+
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
26+
27+
export const ScrollBar = React.forwardRef<
28+
React.ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,
29+
React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>
30+
>(({ className, orientation = "vertical", ...props }, ref) => (
31+
<ScrollAreaPrimitive.ScrollAreaScrollbar
32+
ref={ref}
33+
orientation={orientation}
34+
className={cn(
35+
"border-0 border-solid border-border flex touch-none select-none transition-colors",
36+
orientation === "vertical" &&
37+
"h-full w-2.5 border-l border-l-transparent p-[1px]",
38+
orientation === "horizontal" &&
39+
"h-2.5 flex-col border-t border-t-transparent p-[1px]",
40+
className,
41+
)}
42+
{...props}
43+
>
44+
<ScrollAreaPrimitive.ScrollAreaThumb className="relative flex-1 rounded-full bg-border" />
45+
</ScrollAreaPrimitive.ScrollAreaScrollbar>
46+
));

‎site/src/modules/notifications/NotificationsInbox/InboxButton.stories.tsx

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import { InboxButton } from "./InboxButton";
3+
4+
const meta: Meta<typeof InboxButton> = {
5+
title: "modules/notifications/NotificationsInbox/InboxButton",
6+
component: InboxButton,
7+
};
8+
9+
export default meta;
10+
type Story = StoryObj<typeof InboxButton>;
11+
12+
export const AllRead: Story = {};
13+
14+
export const Unread: Story = {
15+
args: {
16+
unreadCount: 3,
17+
},
18+
};

‎site/src/modules/notifications/NotificationsInbox/InboxButton.tsx

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import { Button, type ButtonProps } from "components/Button/Button";
2+
import { BellIcon } from "lucide-react";
3+
import { type FC, forwardRef } from "react";
4+
import { UnreadBadge } from "./UnreadBadge";
5+
6+
type InboxButtonProps = {
7+
unreadCount: number;
8+
} & ButtonProps;
9+
10+
export const InboxButton = forwardRef<HTMLButtonElement, InboxButtonProps>(
11+
({ unreadCount, ...props }, ref) => {
12+
return (
13+
<Button
14+
size="icon-lg"
15+
variant="outline"
16+
className="relative"
17+
ref={ref}
18+
{...props}
19+
>
20+
<BellIcon />
21+
{unreadCount > 0 && (
22+
<UnreadBadge
23+
count={unreadCount}
24+
className="absolute top-0 right-0 -translate-y-1/2 translate-x-1/2"
25+
/>
26+
)}
27+
</Button>
28+
);
29+
},
30+
);

‎site/src/modules/notifications/NotificationsInbox/InboxItem.stories.tsx

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import { expect, fn, userEvent, within } from "@storybook/test";
3+
import { MockNotification } from "testHelpers/entities";
4+
import { InboxItem } from "./InboxItem";
5+
6+
const meta: Meta<typeof InboxItem> = {
7+
title: "modules/notifications/NotificationsInbox/InboxItem",
8+
component: InboxItem,
9+
render: (args) => {
10+
return (
11+
<div className="max-w-[460px] border-solid border-border rounded">
12+
<InboxItem {...args} />
13+
</div>
14+
);
15+
},
16+
};
17+
18+
export default meta;
19+
type Story = StoryObj<typeof InboxItem>;
20+
21+
export const Read: Story = {
22+
args: {
23+
notification: {
24+
...MockNotification,
25+
read_status: "read",
26+
},
27+
},
28+
};
29+
30+
export const Unread: Story = {
31+
args: {
32+
notification: {
33+
...MockNotification,
34+
read_status: "unread",
35+
},
36+
},
37+
};
38+
39+
export const UnreadFocus: Story = {
40+
args: {
41+
notification: {
42+
...MockNotification,
43+
read_status: "unread",
44+
},
45+
},
46+
play: async ({ canvasElement }) => {
47+
const canvas = within(canvasElement);
48+
const notification = canvas.getByRole("menuitem");
49+
await userEvent.click(notification);
50+
},
51+
};
52+
53+
export const OnMarkNotificationAsRead: Story = {
54+
args: {
55+
notification: {
56+
...MockNotification,
57+
read_status: "unread",
58+
},
59+
onMarkNotificationAsRead: fn(),
60+
},
61+
play: async ({ canvasElement, args }) => {
62+
const canvas = within(canvasElement);
63+
const notification = canvas.getByRole("menuitem");
64+
await userEvent.click(notification);
65+
const markButton = canvas.getByRole("button", { name: /mark as read/i });
66+
await userEvent.click(markButton);
67+
await expect(args.onMarkNotificationAsRead).toHaveBeenCalledTimes(1);
68+
await expect(args.onMarkNotificationAsRead).toHaveBeenCalledWith(
69+
args.notification.id,
70+
);
71+
},
72+
parameters: {
73+
chromatic: {
74+
disableSnapshot: true,
75+
},
76+
},
77+
};

‎site/src/modules/notifications/NotificationsInbox/InboxItem.tsx

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import { Avatar } from "components/Avatar/Avatar";
2+
import { Button } from "components/Button/Button";
3+
import { SquareCheckBig } from "lucide-react";
4+
import type { FC } from "react";
5+
import { Link as RouterLink } from "react-router-dom";
6+
import { relativeTime } from "utils/time";
7+
import type { Notification } from "./types";
8+
9+
type InboxItemProps = {
10+
notification: Notification;
11+
onMarkNotificationAsRead: (notificationId: string) => void;
12+
};
13+
14+
export const InboxItem: FC<InboxItemProps> = ({
15+
notification,
16+
onMarkNotificationAsRead,
17+
}) => {
18+
return (
19+
<div
20+
className="flex items-stretch gap-3 p-3 group"
21+
role="menuitem"
22+
tabIndex={-1}
23+
>
24+
<div className="flex-shrink-0">
25+
<Avatar fallback="AR" />
26+
</div>
27+
28+
<div className="flex flex-col gap-3">
29+
<span className="text-content-secondary text-sm font-medium">
30+
{notification.content}
31+
</span>
32+
<div className="flex items-center gap-1">
33+
{notification.actions.map((action) => {
34+
return (
35+
<Button variant="outline" size="sm" key={action.label} asChild>
36+
<RouterLink to={action.url}>{action.label}</RouterLink>
37+
</Button>
38+
);
39+
})}
40+
</div>
41+
</div>
42+
43+
<div className="w-12 flex flex-col items-end flex-shrink-0">
44+
{notification.read_status === "unread" && (
45+
<>
46+
<div className="group-focus:hidden group-hover:hidden size-2.5 rounded-full bg-highlight-sky">
47+
<span className="sr-only">Unread</span>
48+
</div>
49+
50+
<Button
51+
onClick={() => onMarkNotificationAsRead(notification.id)}
52+
className="hidden group-focus:flex group-hover:flex bg-surface-primary"
53+
variant="outline"
54+
size="sm"
55+
>
56+
<SquareCheckBig />
57+
mark as read
58+
</Button>
59+
</>
60+
)}
61+
62+
<span className="mt-auto text-content-secondary text-xs font-medium whitespace-nowrap">
63+
{relativeTime(new Date(notification.created_at))}
64+
</span>
65+
</div>
66+
</div>
67+
);
68+
};

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy