/* veil-app.jsx — Per-frame container that switches between screens. */
/* eslint-disable no-undef */

function VeilApp({ initial = "home", initialThread = null, lockChat = false }) {
  const [tab, setTab] = React.useState(initial);
  const [thread, setThread] = React.useState(initialThread);

  // when on chat screen
  const inChat = tab === "chat";

  const goTab = (t) => {
    setTab(t);
    if (t !== "messages" && t !== "chat") setThread(null);
  };

  let screen;
  if (inChat) {
    screen = (
      <VeilChat thread={thread || { id: "t1", nick: "The Philosopher", hue: 295 }}
                onBack={() => goTab("messages")}
                active="messages"
                onTabChange={goTab}/>
    );
  } else if (tab === "home") {
    screen = <VeilHome active="home" onTabChange={goTab}/>;
  } else if (tab === "messages") {
    screen = (
      <VeilMessages active="messages"
                    onTabChange={goTab}
                    onOpenThread={(t) => { setThread(t); setTab("chat"); }}/>
    );
  } else if (tab === "profile") {
    screen = <VeilProfile active="profile" onTabChange={goTab}/>;
  }

  return screen;
}

window.VeilApp = VeilApp;