import { reactive as m, onMounted as f, watchEffect as g, openBlock as _, createElementBlock as k, renderSlot as x, createElementVNode as b } from "vue";
import { useColor as v, useGun as C, currentRoom as w } from "./composables-5f691338.js";
import { forceGraph as y } from "./force-graph-3f38c686.js";
const D = { class: "flex" }, E = /* @__PURE__ */ b("div", {
  class: "bg-light-100 bg-opacity-70 dark-bg-dark-200 backdrop-blur-md backdrop-filter overflow-hidden max-h-60vh min-h-400",
  id: "graph"
}, null, -1), R = {
  __name: "PostGraph",
  emits: ["post"],
  setup(N, { emit: u }) {
    const n = v("deep"), s = C(), l = m({}), c = m([]);
    s.user(w.pub).get("posts").map().once(async (t, e) => {
      let h = e.slice(-87), d = e.slice(0, 44), p = e.slice(45, 89);
      for (let r of [d, p]) {
        let a = await s.get("#posts").get(r).then();
        try {
          a = JSON.parse(a);
        } catch {
        }
        let o = a;
        l[r] = {
          hash: r,
          color: n.hex(r),
          name: (o == null ? void 0 : o.title) || (o == null ? void 0 : o.statement) || r
        };
      }
      c.push({
        source: d,
        target: p,
        emoji: t,
        author: h
      });
    });
    const i = {};
    return f(() => {
      const t = y()(document.getElementById("graph")).nodeId("hash").nodeColor("color").nodeRelSize(4).linkDirectionalArrowLength(6).linkDirectionalArrowRelPos(1).linkLabel("emoji").linkCurvature((e) => i[e.index] = i[e.index] || Math.random() * 1 - 0.5).linkColor((e) => n.hex((e == null ? void 0 : e.author) || 0)).linkWidth((e) => 2).onNodeDragEnd((e) => {
        e.fx = e.x, e.fy = e.y;
      }).onNodeClick((e) => {
        t.centerAt(e.x, e.y, 1e3), t.zoom(4, 2e3);
      }).onNodeClick((e, h) => {
        u("post", e.hash);
      });
      g(() => t.graphData({ nodes: Object.values(l), links: c }));
    }), (t, e) => (_(), k("div", D, [
      E,
      x(t.$slots, "default")
    ]));
  }
};
export {
  R as default
};
//# sourceMappingURL=PostGraph-4d16b052.js.map
