fix(desktop): round share invite email field and button

apps/desktop/src/session-sharing/invite-recipients.test.tsx

@@ -0,0 +1,46 @@
+import { cleanup, render, screen } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+
+import { ShareInviteForm } from "./invite-recipients";
+
+vi.mock("~/contacts/queries", () => ({
+  useHumans: () => [],
+}));
+
+afterEach(cleanup);
+
+describe("ShareInviteForm", () => {
+  it("rounds the email field and invite button to match other share actions", () => {
+    render(
+      <ShareInviteForm
+        invite={createInvite()}
+        disabled={false}
+        pending={false}
+        onSubmit={vi.fn()}
+      />,
+    );
+
+    const emailField = screen.getByRole("textbox", { name: "Invitee email" });
+    const inviteButton = screen.getByRole("button", { name: "Invite" });
+
+    expect(emailField.parentElement?.className).toContain("rounded-full");
+    expect(inviteButton.className).toContain("rounded-full");
+    expect(emailField.parentElement?.className).not.toContain("rounded-md");
+    expect(inviteButton.className).not.toContain("rounded-md");
+  });
+});
+
+function createInvite() {
+  return {
+    query: "",
+    setQuery: vi.fn(),
+    recipients: [],
+    emails: [],
+    canSubmit: false,
+    isSelectable: () => false,
+    add: vi.fn(),
+    commitQuery: vi.fn(),
+    remove: vi.fn(),
+    restore: vi.fn(),
+  };
+}

apps/desktop/src/session-sharing/invite-recipients.tsx

@@ -161,7 +161,7 @@ export function ShareInviteForm({
       >
         <div
           className={cn([
-            "border-input focus-within:ring-ring flex h-8 min-w-0 flex-1 items-center rounded-md border bg-transparent px-2 shadow-xs focus-within:ring-1",
+            "border-input focus-within:ring-ring flex h-8 min-w-0 flex-1 items-center rounded-full border bg-transparent px-3 shadow-xs focus-within:ring-1",
             disabled && "opacity-50",
           ])}
         >
@@ -186,7 +186,7 @@ export function ShareInviteForm({
           type="submit"
           size="sm"
           disabled={disabled || !invite.canSubmit}
-          className="h-8 shrink-0 rounded-md px-3"
+          className="h-8 shrink-0 rounded-full px-3"
         >
           {pending ? (
             <CircleNotch className="size-3.5 animate-spin" aria-hidden="true" />