import React, { useState } from "react";
import Layout from "./components/Layout";
import Settings from "./pages/Settings";
import Products from "./pages/Products";
import Orders from "./pages/Orders";

import { NoticeProvider } from "./context/NoticeContext";
import NoticePopup from "./components/NoticePopup";

import "./styles.css";

export default function App() {
  const [page, setPage] = useState("settings");

  return (
    <NoticeProvider>
      <Layout page={page} setPage={setPage}>
        <NoticePopup /> {/* 👈 global popup */}
        {page === "settings" && <Settings />}
        {page === "products" && <Products />}
        {page === "orders" && <Orders />}
      </Layout>
    </NoticeProvider>
  );
}