@remit/web-client 0.0.88 → 0.0.90

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remit/web-client",
-  "version": "0.0.88",
+  "version": "0.0.90",
   "type": "module",
   "description": "Remit web client, published as composable primitives — the app shell, auth shells, and runtime config. A distributor imports what it composes and bundles it.",
   "exports": {

package/src/hooks/useKeyboardNavigation.ts

@@ -117,76 +117,3 @@ export const useKeyboardNavigation = ({
 		return () => window.removeEventListener("keydown", handleKeyDown, capture);
 	}, [enabled, handleKeyDown, capture]);
 };
-
-/**
- * Simple hook for list navigation with j/k keys.
- */
-export const useListNavigation = <T extends { id: string }>({
-	items,
-	selectedId,
-	onSelect,
-	enabled = true,
-}: {
-	items: T[];
-	selectedId: string | undefined;
-	onSelect: (id: string) => void;
-	enabled?: boolean;
-}) => {
-	const currentIndex = selectedId
-		? items.findIndex((item) => item.id === selectedId)
-		: -1;
-
-	const selectNext = useCallback(() => {
-		if (items.length === 0) return;
-		const nextIndex =
-			currentIndex < items.length - 1 ? currentIndex + 1 : currentIndex;
-		if (nextIndex >= 0 && nextIndex < items.length) {
-			onSelect(items[nextIndex].id);
-		}
-	}, [items, currentIndex, onSelect]);
-
-	const selectPrevious = useCallback(() => {
-		if (items.length === 0) return;
-		const prevIndex = currentIndex > 0 ? currentIndex - 1 : 0;
-		if (prevIndex >= 0 && prevIndex < items.length) {
-			onSelect(items[prevIndex].id);
-		}
-	}, [items, currentIndex, onSelect]);
-
-	const selectFirst = useCallback(() => {
-		if (items.length > 0) {
-			onSelect(items[0].id);
-		}
-	}, [items, onSelect]);
-
-	const selectLast = useCallback(() => {
-		if (items.length > 0) {
-			onSelect(items[items.length - 1].id);
-		}
-	}, [items, onSelect]);
-
-	useKeyboardNavigation({
-		enabled,
-		bindings: [
-			{ key: "j", handler: selectNext, preventDefault: true },
-			{ key: "ArrowDown", handler: selectNext, preventDefault: true },
-			{ key: "k", handler: selectPrevious, preventDefault: true },
-			{ key: "ArrowUp", handler: selectPrevious, preventDefault: true },
-			{ key: "g", handler: selectFirst, preventDefault: true },
-			{
-				key: "G",
-				handler: selectLast,
-				noModifiers: false,
-				preventDefault: true,
-			},
-		],
-	});
-
-	return {
-		currentIndex,
-		selectNext,
-		selectPrevious,
-		selectFirst,
-		selectLast,
-	};
-};

package/src/lib/delete-folder.ts

@@ -134,15 +134,6 @@ export function moveProgressLabel(progress: MoveProgress): string {
 	return `Moved ${progress.moved} of ${progress.total}`;
 }
 
-export type DeleteStage =
-	| "confirm-empty"
-	| "choose-fate"
-	| "confirm-delete-all"
-	| "pick-destination"
-	| "moving"
-	| "deleting"
-	| "error";
-
 /** Where the wizard opens: a straight confirm for an empty folder, otherwise the fate step. */
 export function initialStage(
 	messageCount: number,

package/src/lib/format.ts

@@ -19,13 +19,6 @@ export const formatNumber = (
 	return new Intl.NumberFormat(getLocale(), options).format(value);
 };
 
-/**
- * Format a number as compact (1.2K, 3.4M, etc.)
- */
-export const formatCompactNumber = (value: number): string => {
-	return formatNumber(value, { notation: "compact", compactDisplay: "short" });
-};
-
 const EPOCH_STRING = /^-?\d+$/;
 
 /**
@@ -156,40 +149,6 @@ export const formatEmailDate = (date: Date | string | number): string => {
 	return formatDate(d, { month: "short", day: "numeric", year: "numeric" });
 };
 
-/**
- * Format file size in human-readable format.
- */
-export const formatFileSize = (bytes: number): string => {
-	const units = ["byte", "kilobyte", "megabyte", "gigabyte"] as const;
-	let unitIndex = 0;
-	let size = bytes;
-
-	while (size >= 1024 && unitIndex < units.length - 1) {
-		size /= 1024;
-		unitIndex++;
-	}
-
-	return formatNumber(size, {
-		style: "unit",
-		unit: units[unitIndex],
-		unitDisplay: "short",
-		maximumFractionDigits: 1,
-	});
-};
-
-/**
- * Format a list of items (e.g., "Alice, Bob, and Carol").
- */
-export const formatList = (
-	items: string[],
-	type: "conjunction" | "disjunction" = "conjunction",
-): string => {
-	return new Intl.ListFormat(getLocale(), {
-		style: "long",
-		type,
-	}).format(items);
-};
-
 /**
  * Confirmation title for the move-to-Trash delete flow. Reflects that delete
  * moves messages to Trash (not a permanent delete) and pluralizes on count.

package/src/lib/plate-serializer.ts

@@ -50,115 +50,3 @@ const extractText = (node: PlateNode): string => {
 
 export const plateValueToText = (value: Value): string =>
 	value.map(extractText).join("\n");
-
-const parseTextWithMarks = (
-	textContent: string,
-	marks: Record<string, boolean>,
-): TText => ({
-	text: textContent,
-	...marks,
-});
-
-const getMarksFromElement = (el: Element): Record<string, boolean> => {
-	const marks: Record<string, boolean> = {};
-	const tag = el.tagName.toLowerCase();
-	if (tag === "strong" || tag === "b") marks.bold = true;
-	if (tag === "em" || tag === "i") marks.italic = true;
-	return marks;
-};
-
-const parseInlineChildren = (
-	node: Node,
-	inheritedMarks: Record<string, boolean> = {},
-): TText[] => {
-	const results: TText[] = [];
-
-	for (const child of Array.from(node.childNodes)) {
-		if (child.nodeType === Node.TEXT_NODE) {
-			results.push(parseTextWithMarks(child.textContent ?? "", inheritedMarks));
-			continue;
-		}
-
-		if (child.nodeType !== Node.ELEMENT_NODE) continue;
-
-		const el = child as Element;
-		const tag = el.tagName.toLowerCase();
-
-		if (tag === "a") {
-			const linkElement: TElement & { url: string } = {
-				type: "a",
-				url: el.getAttribute("href") ?? "",
-				children: parseInlineChildren(el, inheritedMarks),
-			};
-			results.push(linkElement as unknown as TText);
-			continue;
-		}
-
-		const marks = { ...inheritedMarks, ...getMarksFromElement(el) };
-		results.push(...parseInlineChildren(el, marks));
-	}
-
-	return results;
-};
-
-const parseBlockElement = (el: Element): TElement => {
-	const tag = el.tagName.toLowerCase();
-
-	if (tag === "blockquote") {
-		const children = Array.from(el.children);
-		if (children.length > 0) {
-			return {
-				type: "blockquote",
-				children: children.map(parseBlockElement),
-			};
-		}
-		const inlineChildren = parseInlineChildren(el);
-		return {
-			type: "blockquote",
-			children: inlineChildren.length > 0 ? inlineChildren : [{ text: "" }],
-		};
-	}
-
-	if (tag === "a") {
-		return {
-			type: "a",
-			url: el.getAttribute("href") ?? "",
-			children: parseInlineChildren(el),
-		} as TElement & { url: string };
-	}
-
-	const inlineChildren = parseInlineChildren(el);
-	return {
-		type: "p",
-		children: inlineChildren.length > 0 ? inlineChildren : [{ text: "" }],
-	};
-};
-
-export const htmlToPlateValue = (html: string): Value => {
-	const parser = new DOMParser();
-	const doc = parser.parseFromString(html, "text/html");
-	const body = doc.body;
-
-	const blockElements = Array.from(body.childNodes).reduce<TElement[]>(
-		(acc, node) => {
-			if (node.nodeType === Node.TEXT_NODE) {
-				const text = node.textContent ?? "";
-				if (text.trim()) {
-					acc.push({ type: "p", children: [{ text }] });
-				}
-				return acc;
-			}
-			if (node.nodeType === Node.ELEMENT_NODE) {
-				acc.push(parseBlockElement(node as Element));
-			}
-			return acc;
-		},
-		[],
-	);
-
-	if (blockElements.length === 0) {
-		return [{ type: "p", children: [{ text: "" }] }];
-	}
-
-	return blockElements;
-};

package/src/types/index.ts

@@ -65,9 +65,3 @@ export interface Account {
 	createdAt: string;
 	updatedAt: string;
 }
-
-export interface PaginatedResponse<T> {
-	data: T[];
-	nextCursor?: string;
-	hasMore: boolean;
-}

package/src/components/mail/MessageDetail.tsx

@@ -1,154 +0,0 @@
-import {
-	messageOperationsDescribeMessageOptions,
-	messageOperationsUpdateMessageFlagsMutation,
-} from "@remit/api-http-client/@tanstack/react-query.gen.ts";
-import { MessageHeader } from "@remit/ui";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { useEffect } from "react";
-import { EmptyState } from "@/components/ui/EmptyState";
-import { useErrorBanners } from "@/components/ui/ErrorBannerProvider";
-import { ErrorState } from "@/components/ui/ErrorState";
-import {
-	formatErrorDetail,
-	isMessageNotFoundError,
-} from "@/components/ui/error-banners";
-import { toDisplayCategory } from "@/lib/display-category";
-import { formatDatePreset } from "@/lib/format";
-import { MessageBody } from "./MessageBody";
-
-interface MessageDetailProps {
-	messageId?: string;
-}
-
-const LoadingSkeleton = () => (
-	<div className="animate-pulse">
-		<div className="border-b border-line p-4">
-			<div className="h-6 bg-surface-sunken rounded w-3/4 mb-3" />
-			<div className="space-y-2">
-				<div className="h-4 bg-surface-sunken rounded w-48" />
-				<div className="h-4 bg-surface-sunken rounded w-64" />
-				<div className="h-4 bg-surface-sunken rounded w-40" />
-			</div>
-		</div>
-		<div className="p-4 space-y-2">
-			<div className="h-4 bg-surface-sunken rounded w-full" />
-			<div className="h-4 bg-surface-sunken rounded w-full" />
-			<div className="h-4 bg-surface-sunken rounded w-3/4" />
-		</div>
-	</div>
-);
-
-export const MessageDetail = ({ messageId }: MessageDetailProps) => {
-	const queryClient = useQueryClient();
-	const { pushError } = useErrorBanners();
-
-	const {
-		data: messageData,
-		isLoading,
-		isError,
-		error,
-		refetch,
-	} = useQuery({
-		...messageOperationsDescribeMessageOptions({
-			path: { messageId: messageId ?? "" },
-		}),
-		enabled: !!messageId,
-		// A 404 (row deleted / mid-refresh) renders the inline "deleted" empty
-		// state below — opt it out of the global fatal overlay. A 5xx still
-		// escalates globally (meta.softError is ignored for 5xx — #1059).
-		meta: { softError: true },
-	});
-
-	const updateFlags = useMutation({
-		...messageOperationsUpdateMessageFlagsMutation(),
-		onSuccess: () => {
-			queryClient.invalidateQueries({
-				predicate: (query) =>
-					query.queryKey[0] !== null &&
-					typeof query.queryKey[0] === "object" &&
-					"_id" in query.queryKey[0] &&
-					query.queryKey[0]._id === "threadOperationsListThreads",
-			});
-		},
-		onError: (error) => {
-			pushError({
-				title: "Couldn't mark message as read",
-				detail: formatErrorDetail(error),
-				error,
-			});
-		},
-	});
-
-	useEffect(() => {
-		if (messageId && messageData && !messageData.flags.includes("\\Seen")) {
-			updateFlags.mutate({
-				path: { messageId },
-				body: { isRead: true },
-			});
-		}
-	}, [messageId, messageData, updateFlags.mutate]);
-
-	if (!messageId) {
-		return (
-			<div className="flex h-full items-center justify-center">
-				<EmptyState message="Select a message to read" />
-			</div>
-		);
-	}
-
-	if (isLoading) {
-		return <LoadingSkeleton />;
-	}
-
-	if (isError) {
-		if (isMessageNotFoundError(error)) {
-			return (
-				<div className="flex h-full items-center justify-center">
-					<EmptyState message="This message has been deleted" />
-				</div>
-			);
-		}
-		return (
-			<div className="flex h-full items-center justify-center">
-				<ErrorState
-					title="Couldn't load this message"
-					error={error}
-					onRetry={() => refetch()}
-				/>
-			</div>
-		);
-	}
-
-	if (!messageData) {
-		return (
-			<div className="flex h-full items-center justify-center">
-				<EmptyState message="Message not found" />
-			</div>
-		);
-	}
-
-	const fromAddress = messageData.envelope.from[0];
-	const isTrusted = fromAddress?.flags?.trusted?.value === true;
-
-	return (
-		<article>
-			<MessageHeader
-				subject={messageData.envelope.subject}
-				from={messageData.envelope.from}
-				to={messageData.envelope.to}
-				cc={messageData.envelope.cc}
-				date={formatDatePreset(messageData.envelope.date, "full")}
-				category={toDisplayCategory(messageData.envelope.category)}
-				senderTrust={messageData.envelope.senderTrust}
-			/>
-			<MessageBody
-				bodyParts={messageData.bodyParts}
-				messageId={messageId}
-				fromAddressId={fromAddress?.addressId}
-				isTrusted={isTrusted}
-				category={toDisplayCategory(messageData.envelope.category)}
-				className="p-4"
-			/>
-		</article>
-	);
-};

package/src/lib/search-schemas.ts

@@ -1,34 +0,0 @@
-import { z } from "zod";
-
-export const paginationSchema = z.object({
-	page: z.number().int().positive().default(1),
-	limit: z.number().int().min(10).max(100).default(50),
-	cursor: z.string().optional(),
-});
-
-export const mailListSearchSchema = z.object({
-	filter: z.enum(["all", "unread", "starred", "attachments"]).default("all"),
-	sort: z.enum(["date", "sender", "subject"]).default("date"),
-	order: z.enum(["asc", "desc"]).default("desc"),
-
-	...paginationSchema.shape,
-
-	dialog: z.enum(["compose", "move", "delete", "settings"]).optional(),
-
-	selectedThreadId: z.string().optional(),
-	selectedMessageId: z.string().optional(),
-
-	q: z.string().optional(),
-});
-
-export type MailListSearch = z.infer<typeof mailListSearchSchema>;
-
-export const threadViewSearchSchema = z.object({
-	expandedMessageId: z.string().optional(),
-	expandAll: z.boolean().default(false),
-
-	dialog: z.enum(["reply", "reply-all", "forward", "delete"]).optional(),
-	replyToMessageId: z.string().optional(),
-});
-
-export type ThreadViewSearch = z.infer<typeof threadViewSearchSchema>;