jerry/buzz
1
0
Fork 0
mirror of https://github.com/block/buzz.git synced 2026-11-04 00:12:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(desktop): polish Home inbox presentation

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Thomas Petersen
2026-05-14 12:47:17 -04:00
parent c4d4c8fc46
commit 2b53fb30f5
10 changed files with 33 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
desktop/src/features/chat/ui/ChatHeader.tsx
View File

@@ -5,7 +5,7 @@ import {
FileText,
FolderGit2,
Hash,
Inbox,
House,
Lock,
Zap,
} from "lucide-react";
@@ -39,7 +39,7 @@ function ChannelIcon({
mode?: "home" | "channel" | "agents" | "workflows" | "pulse" | "projects";
}) {
if (mode === "home") {
return <Inbox className={HEADER_ICON_CLASS} />;
return <House className={HEADER_ICON_CLASS} />;
}
if (mode === "agents") {

2
desktop/src/features/home/ui/HomeScreen.tsx
View File

@@ -19,7 +19,7 @@ export function HomeScreen({
description="Personalized activity feed for mentions, reminders, channel activity, and agent work."
mode="home"
overlaysContent
title="Inbox"
title="Home"
/>
<div className="flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden">

12
desktop/src/features/home/ui/HomeView.tsx
View File

@@ -41,10 +41,10 @@ function matchesInboxFilter(
function HomeLoadingState() {
return (
<div className="flex-1 overflow-hidden pt-11">
<div className="flex-1 overflow-hidden">
<div className="grid h-full min-h-0 w-full lg:grid-cols-[320px_minmax(0,1fr)]">
<div className="overflow-hidden border-r border-border/70 bg-background">
<div className="border-b border-border/70 px-4 py-4">
<div className="overflow-hidden border-r border-border/70 bg-background/60">
<div className="border-b border-border/70 px-4 pb-4 pt-14">
<Skeleton className="h-4 w-20" />
<Skeleton className="mt-2 h-4 w-28" />
<Skeleton className="mt-4 h-10 rounded-md" />
@@ -56,8 +56,8 @@ function HomeLoadingState() {
</div>
</div>
<div className="overflow-hidden bg-background">
<div className="border-b border-border/70 px-5 py-4">
<div className="overflow-hidden bg-background/60">
<div className="border-b border-border/70 px-5 pb-4 pt-14">
<Skeleton className="h-5 w-48" />
<Skeleton className="mt-3 h-8 w-72" />
</div>
@@ -323,7 +323,7 @@ export function HomeView({
selectedItem.item.pubkey.trim().toLowerCase();
return (
<div className="flex-1 overflow-hidden pt-11">
<div className="flex-1 overflow-hidden">
<div
className="grid h-full min-h-0 w-full lg:grid-cols-[320px_minmax(0,1fr)]"
data-testid="home-inbox"

15
desktop/src/features/home/ui/InboxDetailPane.tsx
View File

@@ -129,7 +129,7 @@ export function InboxDetailPane({
if (!item) {
return (
<section
className="flex min-h-0 min-w-0 items-center justify-center bg-background px-6 py-10 text-center"
className="flex min-h-0 min-w-0 items-center justify-center bg-background/60 px-6 py-10 pt-20 text-center"
data-testid="home-inbox-detail-empty"
>
<div className="max-w-sm">
@@ -189,12 +189,12 @@ export function InboxDetailPane({
return (
<section
className="flex min-h-0 min-w-0 flex-col overflow-hidden bg-background"
className="flex min-h-0 min-w-0 flex-col overflow-hidden bg-background/60"
data-testid="home-inbox-detail"
ref={detailPaneRef}
>
{!canOpenChannel ? (
<div className="px-6 py-4">
<div className="px-6 pb-4 pt-14">
<div className="flex flex-wrap items-center justify-between gap-3">
<div className="flex min-w-0 items-center gap-3">
<UserAvatar
@@ -262,7 +262,7 @@ export function InboxDetailPane({
) : null}
<div className="relative min-h-0 flex-1 overflow-hidden">
<div className="absolute inset-0 overflow-y-auto overscroll-contain pb-32 pt-6">
<div className="absolute inset-0 overflow-y-auto overscroll-contain pb-32 pt-14">
<div>
{isThreadContextLoading ? (
<div className="px-6 pb-3 text-[11px] text-muted-foreground">
@@ -277,15 +277,14 @@ export function InboxDetailPane({
<div className="px-6 py-2">
<article
className={cn(
"group/message flex items-start gap-2.5 border-l-2 px-2 py-1 transition-colors duration-1000",
"group/message flex items-start gap-2.5 px-2 py-1 transition-colors duration-1000",
message.isSelected
? cn(
"border-primary/35",
isFocusHighlightVisible
? "bg-primary/[0.07]"
: "bg-transparent",
)
: "border-transparent hover:bg-muted/20",
: "hover:bg-muted/20",
)}
data-testid={
message.isSelected
@@ -348,7 +347,7 @@ export function InboxDetailPane({
</div>
) : null}
</div>
<div className="-mt-0.5">
<div className="mt-1">
<Markdown
className="max-w-full text-left text-sm text-foreground"
content={message.content}

6
desktop/src/features/home/ui/InboxListPane.tsx
View File

@@ -29,8 +29,8 @@ export function InboxListPane({
selectedId,
}: InboxListPaneProps) {
return (
<section className="flex min-h-0 min-w-0 flex-col overflow-hidden border-r border-border/70 bg-background">
<div className="px-4 pb-3 pt-3">
<section className="flex min-h-0 min-w-0 flex-col overflow-hidden border-r border-border/70 bg-background/60">
<div className="px-4 pb-3 pt-14">
<div className="flex flex-wrap gap-1.5">
{FILTER_OPTIONS.map((option) => (
<Button
@@ -85,7 +85,7 @@ export function InboxListPane({
<div className="relative">
<UserAvatar
avatarUrl={item.avatarUrl}
className="h-8 w-8 rounded-md"
className="h-8 w-8 rounded-xl"
displayName={item.senderLabel}
size="md"
/>

2
desktop/tests/e2e/channels.spec.ts
View File

@@ -1239,7 +1239,7 @@ test("manage channel can delete an owned stream", async ({ page }) => {
).toBeVisible();
await page.getByTestId("channel-delete-confirm").click();
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await expect(page.getByTestId("stream-list")).not.toContainText(channelName);
});

8
desktop/tests/e2e/integration.spec.ts
View File

@@ -294,8 +294,8 @@ test("live mentions refetch the home feed without waiting for polling", async ({
},
]);
await targetPage.getByRole("button", { name: "Inbox" }).click();
await expect(targetPage.getByTestId("chat-title")).toHaveText("Inbox");
await targetPage.getByRole("button", { name: "Home" }).click();
await expect(targetPage.getByTestId("chat-title")).toHaveText("Home");
await expect(targetPage.getByTestId("sidebar-home-count")).toHaveCount(0);
await expect
.poll(() => getLoggedNotificationCount(targetPage), {
@@ -358,8 +358,8 @@ test("live forum mentions refetch the home feed without waiting for polling", as
},
]);
await targetPage.getByRole("button", { name: "Inbox" }).click();
await expect(targetPage.getByTestId("chat-title")).toHaveText("Inbox");
await targetPage.getByRole("button", { name: "Home" }).click();
await expect(targetPage.getByTestId("chat-title")).toHaveText("Home");
await expect(targetPage.getByTestId("home-inbox-list")).toBeVisible();
await expect(targetPage.getByTestId("home-inbox-list")).toContainText(
message,

14
desktop/tests/e2e/profile.spec.ts
View File

@@ -33,7 +33,7 @@ test("updates the relay-backed profile from settings", async ({ page }) => {
await expect(page.getByTestId("profile-about")).toHaveValue(about);
await page.getByTestId("settings-close").click();
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await expect(page.getByTestId("open-settings")).toBeVisible();
await openSettings(page, "profile");
@@ -191,8 +191,8 @@ test("notification settings drive the Home badge and desktop alerts", async ({
await expect(page.getByTestId("sidebar-home-count")).toHaveText("1");
await expect.poll(getAppBadgeCount).toBe(1);
await page.getByRole("button", { name: "Inbox" }).click();
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await page.getByRole("button", { name: "Home" }).click();
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await expect(page.getByTestId("sidebar-home-count")).toHaveCount(0);
await expect.poll(getAppBadgeCount).toBe(0);
});
@@ -207,7 +207,7 @@ test("desktop notification clicks open the matching forum thread", async ({
"On",
);
await page.getByTestId("settings-close").click();
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await page.evaluate(() => {
const win = window as Window & {
@@ -275,7 +275,7 @@ test("opens settings with the keyboard shortcut and updates theme", async ({
page,
}) => {
await page.goto("/");
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await page.keyboard.press(
process.platform === "darwin" ? "Meta+," : "Control+,",
@@ -339,12 +339,12 @@ test("opens settings with the keyboard shortcut and updates theme", async ({
process.platform === "darwin" ? "Meta+," : "Control+,",
);
await expect(page.getByTestId("settings-view")).toHaveCount(0);
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
});
test("supports webview zoom keyboard shortcuts", async ({ page }) => {
await page.goto("/");
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await page.keyboard.press(
process.platform === "darwin" ? "Meta+Shift+Equal" : "Control+Shift+Equal",

2
desktop/tests/e2e/smoke.spec.ts
View File

@@ -138,7 +138,7 @@ test("opens a mocked channel from the home feed", async ({ page }) => {
await page.goto("/");
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await expect(inboxList).toContainText("Please review the release checklist.");
await inboxList

2
desktop/tests/e2e/stream.spec.ts
View File

@@ -110,7 +110,7 @@ test("loads the home feed from the relay", async ({ page }) => {
await installRelayBridge(page, "tyler");
await page.goto("/");
await expect(page.getByTestId("chat-title")).toHaveText("Inbox");
await expect(page.getByTestId("chat-title")).toHaveText("Home");
await expect(page.getByTestId("home-inbox")).toBeVisible();
await expect(page.getByTestId("home-inbox-list")).toContainText(
"Please review the release checklist.",