feat: revamp contact detail, filters, and add photo/print/duplicate

app/[locale]/contacts/page.tsx

@@ -98,10 +98,10 @@ export default function ContactsPage() {
 
   // Panel resize state - contact list
   const [listWidth, setListWidth] = useState(() => {
-    try { const v = localStorage.getItem("contacts-list-width"); return v ? Number(v) : 320; } catch { return 320; }
+    try { const v = localStorage.getItem("contacts-list-width"); return v ? Number(v) : 384; } catch { return 384; }
   });
   const [isListResizing, setIsListResizing] = useState(false);
-  const listDragStartWidth = useRef(320);
+  const listDragStartWidth = useRef(384);
 
   // Check auth on mount
   useEffect(() => {
@@ -172,21 +172,6 @@ export default function ContactsPage() {
     return getGroupMembers(activeCategory.groupId);
   }, [activeCategory, individuals, getGroupMembers]);
 
-  // Label for the current category
-  const categoryLabel = useMemo(() => {
-    if (activeCategory === "all") return t("tabs.all");
-    if (activeCategory === "uncategorized") return t("no_category");
-    if ("addressBookId" in activeCategory) {
-      const book = addressBooks.find(b => b.id === activeCategory.addressBookId);
-      return book?.name || t("tabs.all");
-    }
-    if ("keyword" in activeCategory) {
-      return activeCategory.keyword;
-    }
-    const group = contacts.find(c => c.id === activeCategory.groupId);
-    return group ? getContactDisplayName(group) : t("tabs.all");
-  }, [activeCategory, contacts, addressBooks, t]);
-
   const handleSelectCategory = useCallback((category: ContactCategory) => {
     setActiveCategory(category);
     clearSelection();
@@ -306,6 +291,24 @@ export default function ContactsPage() {
     setView("bulk-add-to-group");
   }, [clearSelection, toggleContactSelection, groups.length]);
 
+  const handleDuplicateContact = useCallback(async (source: ContactCard) => {
+    const { id: _id, created: _created, updated: _updated, ...rest } = source;
+    void _id; void _created; void _updated;
+    const data: Partial<ContactCard> = JSON.parse(JSON.stringify(rest));
+    if (supportsSync && client) {
+      await createContact(client, data);
+      toast.success(t("toast.created"));
+    } else {
+      const localContact: ContactCard = {
+        id: `local-${generateUUID()}`,
+        addressBookIds: data.addressBookIds || {},
+        ...data,
+      };
+      addLocalContact(localContact);
+      toast.success(t("toast.created"));
+    }
+  }, [supportsSync, client, createContact, addLocalContact, t]);
+
   const handleSaveNew = useCallback(async (data: Partial<ContactCard>) => {
     if (supportsSync && client) {
       await createContact(client, data);
@@ -607,6 +610,16 @@ export default function ContactsPage() {
             contact={selectedContact}
             onEdit={handleEdit}
             onDelete={handleDelete}
+            onAddToGroup={
+              selectedContact
+                ? () => handleAddContactToGroup(selectedContact.id)
+                : undefined
+            }
+            onDuplicate={
+              selectedContact
+                ? () => void handleDuplicateContact(selectedContact)
+                : undefined
+            }
             isMobile={isMobile}
           />
         );
@@ -702,7 +715,6 @@ export default function ContactsPage() {
                   onSearchChange={setSearchQuery}
                   onSelectContact={handleSelectContact}
                   onCreateNew={handleCreateNew}
-                  categoryLabel={categoryLabel}
                   className="flex-1"
                   selectedContactIds={selectedContactIds}
                   onToggleSelection={toggleContactSelection}
@@ -726,7 +738,7 @@ export default function ContactsPage() {
                     setIsListResizing(false);
                     localStorage.setItem("contacts-list-width", String(listWidth));
                   }}
-                  onDoubleClick={() => { setListWidth(320); localStorage.setItem("contacts-list-width", "320"); }}
+                  onDoubleClick={() => { setListWidth(384); localStorage.setItem("contacts-list-width", "384"); }}
                 />
               )}
             </>