jcoffey-dev
645b8b510f
Replace the FastAPI/HTMX prototype with a Node/Hono session proxy and a React 19/Vite SPA. Mail (conversation view, search operators, labels, sanitised HTML, privacy image proxy, invites, undo send, templates), calendar (month/week/day/agenda, invites, free/busy, categories, context menus), contacts (JSContact, groups, vCard), files, Sieve filter builder (incl. filter-from-message with retroactive apply), vacation, identities with default + Reply-To, PWA/mobile layout, push via SSE, in-memory mock Stalwart for dev, Docker + CI.
39 lines
1.5 KiB
TypeScript
39 lines
1.5 KiB
TypeScript
import { useState } from "react";
|
|
import { UserPlus } from "lucide-react";
|
|
import type { EmailBodyPart, Id } from "@/jmap/types";
|
|
import { useContacts } from "@/store/contacts";
|
|
import { client } from "@/jmap/client";
|
|
import { toast } from "@/ui/toast";
|
|
|
|
export function VCardCard({ part, accountId }: { part: EmailBodyPart; accountId: Id }) {
|
|
const contacts = useContacts();
|
|
const [busy, setBusy] = useState(false);
|
|
const [done, setDone] = useState(false);
|
|
if (!contacts.available || !part.blobId) return null;
|
|
const add = async () => {
|
|
setBusy(true);
|
|
try {
|
|
const text = await client.fetchBlobText(accountId, part.blobId!, "text/vcard");
|
|
const book = Object.values(contacts.books).find((b) => b.isDefault) ?? Object.values(contacts.books)[0];
|
|
if (!book) throw new Error("No address book available");
|
|
const n = await contacts.importVCard(text, book.id);
|
|
setDone(true);
|
|
toast.success(`Added ${n} contact${n === 1 ? "" : "s"}`);
|
|
} catch (err) {
|
|
toast.error((err as Error).message);
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
};
|
|
return (
|
|
<div className="vcard-card">
|
|
<UserPlus size={20} style={{ color: "var(--accent)" }} />
|
|
<div className="grow">
|
|
<div style={{ fontWeight: 600 }}>{part.name ?? "Contact card"}</div>
|
|
<div className="hint">vCard attachment</div>
|
|
</div>
|
|
<button className="btn btn-sm" disabled={busy || done} onClick={() => void add()}>{done ? "Added" : "Add to contacts"}</button>
|
|
</div>
|
|
);
|
|
}
|