// WealthIntelligence — main App
const { useState: uS, useEffect: uE, useMemo: uM } = React;

const LS_KEY = 'wi_v2';

function loadState(){
  try {
    const raw = localStorage.getItem(LS_KEY);
    if (raw) return JSON.parse(raw);
  } catch(e){}
  return JSON.parse(JSON.stringify(window.WI.SEED));
}

function App(){
  const [state, setState] = uS(loadState);
  const [route, setRoute] = uS(() => localStorage.getItem('wi_route') || 'home');
  const [lang, setLang] = uS(() => localStorage.getItem('wi_lang') || 'it');
  const [serif, setSerif] = uS(() => localStorage.getItem('wi_serif') !== 'off');
  const [tweaksOpen, setTweaksOpen] = uS(false);

  // Cassetta editor state: { cassetta?, isNew? } | null
  const [editingCassetta, setEditingCassetta] = uS(null);
  // Item / Person detail drawers
  const [detailItem, setDetailItem] = uS(null);
  const [detailPerson, setDetailPerson] = uS(null);
  // Item / Person editor drawers
  const [editingItem, setEditingItem] = uS(null);
  const [editingPerson, setEditingPerson] = uS(null);
  // User editor
  const [editingUser, setEditingUser] = uS(false);

  uE(()=>{ localStorage.setItem(LS_KEY, JSON.stringify(state)); }, [state]);
  uE(()=>{ localStorage.setItem('wi_route', route); }, [route]);
  uE(()=>{ localStorage.setItem('wi_lang', lang); }, [lang]);
  uE(()=>{ localStorage.setItem('wi_serif', serif?'on':'off'); document.body.dataset.serif = serif?'on':'off'; }, [serif]);

  const t = window.WI.I18N[lang];

  const updateState = (fn) => setState(s => typeof fn==='function' ? fn(s) : {...s, ...fn});

  // Cassetta CRUD
  const openCassettaEditor = (cassetta=null) => setEditingCassetta({ cassetta, isNew: !cassetta });
  const saveCassetta = (data) => {
    setState(s => {
      if (editingCassetta?.isNew) {
        const id = 'c' + (Math.max(0, ...s.cassette.map(c=>parseInt(c.id.slice(1))||0)) + 1);
        return { ...s, cassette: [...s.cassette, { ...data, id }] };
      }
      return { ...s, cassette: s.cassette.map(c => c.id===data.id ? {...c, ...data} : c) };
    });
    setEditingCassetta(null);
  };
  const deleteCassetta = (id) => {
    setState(s => ({ ...s, cassette: s.cassette.filter(c => c.id!==id) }));
    setEditingCassetta(null);
  };

  // Toggle a person's access on a cassetta (matrix cell click)
  const togglePersonOnCassetta = (cassettaId, personId) => {
    setState(s => ({
      ...s,
      cassette: s.cassette.map(c => {
        if (c.id !== cassettaId) return c;
        const has = c.assignees.includes(personId);
        return { ...c, assignees: has ? c.assignees.filter(id => id!==personId) : [...c.assignees, personId] };
      }),
    }));
  };

  // Activate / deactivate a single cassetta
  const setCassettaActivated = (cassettaId, activated) => {
    setState(s => ({
      ...s,
      cassette: s.cassette.map(c => c.id===cassettaId ? {...c, activated, activatedAt: activated ? new Date().toISOString() : null} : c),
    }));
  };

  // Temporary illness toggle (activates all 'temporary' cassette)
  const setTemporaryIllness = (active, note='') => {
    setState(s => ({
      ...s,
      temporaryIllness: { active, since: active ? new Date().toISOString() : null, note: active ? note : '' },
      cassette: s.cassette.map(c => c.trigger==='temporary' ? { ...c, activated: active, activatedAt: active ? new Date().toISOString() : null } : c),
    }));
  };

  const openItemDetail = (item) => setDetailItem(item);
  const openPersonDetail = (person) => setDetailPerson(person);

  // Item editor + CRUD
  const openItemEditor = (item=null) => setEditingItem({ item, isNew: !item });
  const saveItem = (data) => {
    setState(s => {
      if (editingItem?.isNew) {
        const id = 'i' + (Math.max(0, ...s.inventory.map(it=>parseInt(it.id.slice(1))||0)) + 1);
        return { ...s, inventory: [...s.inventory, { ...data, id }] };
      }
      return { ...s, inventory: s.inventory.map(it => it.id===data.id ? {...it, ...data} : it) };
    });
    setEditingItem(null);
  };
  const deleteItem = (id) => {
    setState(s => ({
      ...s,
      inventory: s.inventory.filter(it => it.id !== id),
      // also remove the item id from any cassetta
      cassette: s.cassette.map(c => ({ ...c, itemIds: c.itemIds.filter(i => i !== id) })),
    }));
    setEditingItem(null);
  };

  // Person editor + CRUD
  const openPersonEditor = (person=null) => setEditingPerson({ person, isNew: !person });
  const savePerson = (data) => {
    setState(s => {
      if (editingPerson?.isNew) {
        const id = 'p' + (Math.max(0, ...s.people.map(p=>parseInt(p.id.slice(1))||0)) + 1);
        return { ...s, people: [...s.people, { ...data, id }] };
      }
      return { ...s, people: s.people.map(p => p.id===data.id ? {...p, ...data} : p) };
    });
    setEditingPerson(null);
  };
  const deletePerson = (id) => {
    setState(s => ({
      ...s,
      people: s.people.filter(p => p.id !== id),
      // remove from any cassetta assignees
      cassette: s.cassette.map(c => ({ ...c, assignees: c.assignees.filter(pid => pid !== id) })),
      // remove from inactivity trusted contacts
      inactivity: { ...s.inactivity, trustedContacts: (s.inactivity.trustedContacts||[]).filter(pid => pid !== id) },
    }));
    setEditingPerson(null);
  };

  // User editor + save
  const openUserEditor = () => setEditingUser(true);
  const saveUser = (data) => {
    setState(s => ({ ...s, user: {...s.user, ...data} }));
    setEditingUser(false);
  };

  const pageProps = {
    state, t, setRoute, updateState,
    openCassettaEditor, togglePersonOnCassetta, setCassettaActivated, setTemporaryIllness,
    openItemDetail, openPersonDetail,
    openItemEditor, openPersonEditor,
    openUserEditor,
  };

  return <div className="app">
    <Sidebar route={route} setRoute={setRoute} t={t} state={state}/>
    <main className="main">
      {route==='home'        && <HomePage {...pageProps}/>}
      {route==='inventory'   && <InventoryPage {...pageProps}/>}
      {route==='trustworthy' && <TrustworthyPage {...pageProps}/>}
      {route==='vault'       && <VaultPage {...pageProps}/>}
      {route==='informed'    && <InformedPage {...pageProps}/>}
      {route==='profile'     && <ProfilePage {...pageProps}/>}
    </main>

    {editingCassetta && (
      <CassettaEditor
        cassetta={editingCassetta.cassetta}
        isNew={editingCassetta.isNew}
        state={state} t={t}
        onClose={()=>setEditingCassetta(null)}
        onSave={saveCassetta}
        onDelete={deleteCassetta}
      />
    )}

    {detailItem && (
      <ItemDetailDrawer
        item={detailItem}
        state={state} t={t}
        onClose={()=>setDetailItem(null)}
        onOpenCassetta={(c)=>{ setDetailItem(null); openCassettaEditor(c); }}
        onEdit={()=>{ const it = detailItem; setDetailItem(null); openItemEditor(it); }}
      />
    )}

    {detailPerson && (
      <PersonDetailDrawer
        person={detailPerson}
        state={state} t={t}
        onClose={()=>setDetailPerson(null)}
        onOpenCassetta={(c)=>{ setDetailPerson(null); openCassettaEditor(c); }}
        onEdit={()=>{ const p = detailPerson; setDetailPerson(null); openPersonEditor(p); }}
      />
    )}

    {editingItem && (
      <ItemEditor
        item={editingItem.item}
        isNew={editingItem.isNew}
        t={t}
        onClose={()=>setEditingItem(null)}
        onSave={saveItem}
        onDelete={deleteItem}
      />
    )}

    {editingPerson && (
      <PersonEditor
        person={editingPerson.person}
        isNew={editingPerson.isNew}
        t={t}
        onClose={()=>setEditingPerson(null)}
        onSave={savePerson}
        onDelete={deletePerson}
      />
    )}

    {editingUser && (
      <UserEditor
        user={state.user}
        t={t}
        onClose={()=>setEditingUser(false)}
        onSave={saveUser}
      />
    )}

    {/* Tweaks: title style + lang + reset seed */}
    <button
      onClick={()=>setTweaksOpen(v=>!v)}
      className="btn btn-ghost btn-icon"
      title="Tweaks"
      style={{position:'fixed', bottom:24, right:24, background:'#fff', border:'1px solid var(--line)', boxShadow:'var(--s-shadow)', zIndex:79}}>
      <Icon name="settings" size={16}/>
    </button>
    {tweaksOpen && (
      <div className="tweaks fade-in">
        <div className="row" style={{justifyContent:'space-between', marginBottom:10}}>
          <h4 style={{margin:0}}>Tweaks</h4>
          <button className="btn btn-ghost btn-icon" onClick={()=>setTweaksOpen(false)} style={{padding:2}}><Icon name="close" size={14}/></button>
        </div>
        <div className="tweak-row">
          <span>Titoli</span>
          <div className="toggle">
            <button className={serif?'on':''} onClick={()=>setSerif(true)}>Serif</button>
            <button className={!serif?'on':''} onClick={()=>setSerif(false)}>Sans</button>
          </div>
        </div>
        <div className="tweak-row">
          <span>Lingua</span>
          <div className="toggle">
            <button className={lang==='it'?'on':''} onClick={()=>setLang('it')}>IT</button>
            <button className={lang==='en'?'on':''} onClick={()=>setLang('en')}>EN</button>
          </div>
        </div>
        <hr className="divider" style={{margin:'12px 0 8px'}}/>
        <button className="btn btn-ghost btn-sm" style={{padding:'4px 8px', fontSize:12}} onClick={()=>{ localStorage.removeItem(LS_KEY); setState(JSON.parse(JSON.stringify(window.WI.SEED))); }}>
          Ripristina dati seed
        </button>
      </div>
    )}
  </div>;
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App/>);