// ─────────────────────────────────────────────────────────────────────
// CONTRIBUTOR — COLLECTION LANDING + OPERATIONS MENU.
//
// Mirrors the Collection Manager experience: the Collection is the landing
// page, and the hamburger opens Operations — a full-screen menu of the
// actions a contributor is allowed to perform. There is no separate
// "Operations screen"; Operations IS the menu.
//
// Only Upload Expense is wired this iteration. The rest are placeholders.
// Notes are never a standalone action — they belong to the record being
// created (e.g. Upload Expense → optional note), so there is no Notes item.
// ─────────────────────────────────────────────────────────────────────
const { useState: useCO } = React;
// A single navigation row — mirrors the manager's OpRow rhythm.
function ContribOpRow({ icon, title, onClick, placeholder }) {
return (
{title}
{placeholder
? Planned
: }
);
}
// Section divider that matches the operations menu (RowRule + grid of rows).
function ContribOpsSection({ label, children }) {
return (
{label}
{children}
);
}
// ── OPERATIONS MENU ────────────────────────────────────────────────────
// The contributor's command center. Same structure as the manager menu,
// pared down to the actions a contributor is allowed to take.
function ContribOpsMenu({ onClose, onAction }) {
return (
{/* Sticky header — monogram + wordmark + close */}
);
}
// ── PLACEHOLDER SCREEN ──────────────────────────────────────────────────
// A consistent "coming soon" surface for the actions not yet built. Same
// top-bar chrome as every other operations screen, so the structure is
// already in place for the real flow to drop in.
function ContribPlaceholder({ eyebrow, title, note, onBack }) {
return (
{title}
{eyebrow}
Coming Soon
{note}
);
}
// ── OPERATIONS FLOW SHELL ───────────────────────────────────────────────
// Full-screen overlay portalled onto the contributor phone stage. Mirrors
// the manager's OperationsFlow, routing each menu action to its screen.
function ContribOperations({ vehicles = [], onClose, initialView = 'menu' }) {
const [view, setView] = useCO(initialView); // menu | expense | tasks | account | document | photos | videos
const [closing, setClosing] = useCO(false);
const requestClose = () => {
if (closing) return;
setClosing(true);
setTimeout(() => { onClose && onClose(); }, 240);
};
const handleAction = (id) => setView(id);
const backToMenu = () => setView('menu');
const PLACEHOLDERS = {
tasks: { eyebrow: 'General', title: 'Complete Tasks', note: 'Tasks assigned to you by the collection manager will appear here — things to capture, confirm, or follow up on.' },
account: { eyebrow: 'General', title: 'Manage Account', note: 'Your profile, the collection you contribute to, and notification settings will live here.' },
};
const SIMPLE_FLOWS = ['document', 'photos', 'videos'];
const node = (