alinea/dist/dashboard/pages/ContentView.js

[](https://npmjs.org/package/alinea) [](https://packagephobia.com/result?p=alinea)

import "../../chunks/chunk-U5RRZUYZ.js";

// src/dashboard/pages/ContentView.tsx
import { HStack, Icon, Loader, fromModule } from "alinea/ui";
import IcRoundAddCircle from "alinea/ui/icons/IcRoundAddCircle";
import { useNav } from "../hook/UseNav.js";
import { useRoot } from "../hook/UseRoot.js";
import { useWorkspace } from "../hook/UseWorkspace.js";
import { useLocation, useNavigate } from "../util/HashRouter.js";
import { SuspenseBoundary } from "../util/SuspenseBoundary.js";
import { EntryEdit } from "../view/EntryEdit.js";
import { EntryTree } from "../view/EntryTree.js";
import { RootOverview } from "../view/RootOverview.js";
import { SearchBox } from "../view/SearchBox.js";
import { Sidebar } from "../view/Sidebar.js";
import { NewEntry } from "../view/entry/NewEntry.js";

// src/dashboard/pages/ContentView.module.scss
var ContentView_module_default = {
  "root-sidebar": "alinea-ContentView-sidebar",
  "rootSidebar": "alinea-ContentView-sidebar",
  "root-create": "alinea-ContentView-create",
  "rootCreate": "alinea-ContentView-create",
  "root-create-button": "alinea-ContentView-create-button",
  "rootCreateButton": "alinea-ContentView-create-button"
};

// src/dashboard/pages/ContentView.tsx
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
var styles = fromModule(ContentView_module_default);
function ContentView({ editor }) {
  const workspace = useWorkspace();
  const root = useRoot();
  const { search } = useLocation();
  const EntryView = editor?.view ?? EntryEdit;
  const RootView = root?.view ?? RootOverview;
  const nav = useNav();
  const navigate = useNavigate();
  return /* @__PURE__ */ jsxs(Fragment, { children: [
    /* @__PURE__ */ jsxs(Sidebar.Tree, { children: [
      /* @__PURE__ */ jsx(SearchBox, {}),
      /* @__PURE__ */ jsx(
        EntryTree,
        {
          i18nId: editor?.activeVersion.i18nId,
          selected: editor?.activeVersion.parents
        }
      ),
      /* @__PURE__ */ jsx("div", { className: styles.root.create(), children: /* @__PURE__ */ jsx(
        "button",
        {
          className: styles.root.create.button(),
          onClick: () => navigate(
            nav.create({
              entryId: editor?.activeVersion.i18nId,
              workspace: workspace.name,
              root: root.name
            })
          ),
          children: /* @__PURE__ */ jsxs(HStack, { center: true, gap: 8, align: "center", children: [
            /* @__PURE__ */ jsx(Icon, { icon: IcRoundAddCircle, size: 17 }),
            /* @__PURE__ */ jsx("span", { children: "Create new" })
          ] })
        }
      ) })
    ] }),
    search === "?new" && /* @__PURE__ */ jsx(NewEntry, { parentId: editor?.entryId }),
    /* @__PURE__ */ jsx(SuspenseBoundary, { name: "content view", fallback: /* @__PURE__ */ jsx(Loader, { absolute: true }), children: editor ? /* @__PURE__ */ jsx(EntryView, { editor }) : /* @__PURE__ */ jsx(RootView, { root }) })
  ] });
}
export {
  ContentView
};