@eventcatalogtest/studio/stores/editor-store.ts

A drag and drop UI for distributed systems that keeps your diagrams where they belong – in your repo

import { create } from "zustand";

import useFlowStore from "@/stores/flow-store";

interface EditorStore { 
  selectedNode: any;
  setSelectedNode: (node: any) => void;
}

export const useEditorStore = create<EditorStore>((set) => ({
  selectedNode: null,
  setSelectedNode: (id: string) => {
    const { nodes } = useFlowStore.getState();
    const reactFlowInstance = useFlowStore.getState().reactFlowInstance;
    const node = nodes.find((node: any) => node.id === id);
    set({ selectedNode: node });
    if (node) {
      reactFlowInstance?.setCenter(node.position.x + 200, node.position.y, { duration: 1000 });
    }
  },
}));