const { OrderTracker, Badge } = window.BecoDesignSystem_7188f3; const PAST = [ { id: "4788", when: "24/07", where: "Pastel do Zé", total: "R$ 31,50" }, { id: "4712", when: "19/07", where: "Forno da Vila", total: "R$ 78,00" }, { id: "4680", when: "12/07", where: "Beco Bar", total: "R$ 46,90" } ]; /** Drops down from your name, like a notification shade. Orders live inside it. */ function AccountPanel({ open, name, onClose, activeOrder, subs = [], onPauseSub, onSkipSub, onCancelSub }) { const [tab, setTab] = React.useState("pedidos"); // ação de assinatura no vocabulário mono do sistema const subAction = (label, onClick, dashed) => ( ); return (
{name}
{[["pedidos", "Pedidos"], ["dados", "Dados"]].map(([v, l]) => ( ))}
{tab === "pedidos" ? (
{activeOrder && (
#{activeOrder.id} · {activeOrder.where} a caminho
)} {/* ASSINATURAS — as fornadas que chegam sozinhas (Feira do Beco) */} {subs.length > 0 && (
Assinaturas
{subs.map(s => { const paused = s.status === "pausada"; return (
{s.name} {s.cadence}
{paused ? "pausada" : s.status === "próxima pulada" ? "próxima pulada · depois " + s.next : "próxima · " + s.next} {subAction(paused ? "retomar" : "pausar", () => onPauseSub && onPauseSub(s.name))} {!paused && subAction(s.status === "próxima pulada" ? "despular" : "pular", () => onSkipSub && onSkipSub(s.name))} {subAction("cancelar", () => onCancelSub && onCancelSub(s.name), true)}
); })}
)}
Antes
{PAST.map(o => (
{o.when} {o.where} {o.total}
))}
) : (
{[["Telefone", "(11) 90000-0000"], ["E-mail", "rafa@beco.com.br"], ["Pagamento", "Pix · chave salva"], ["Endereços", "3 salvos"]].map(([k, v]) => (
{k} {v}
))}
)}
); } Object.assign(window, { AccountPanel });