docs: create-and-check-documentation

src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx

@@ -13,13 +13,14 @@ import { NodeDefaults, NodeConnects, NodeDeletes } from './NodeRegistry';
 
 
 /**
- * Create a node given the correct data
- * @param type the type of the node to create
- * @param id the id of the node to create
- * @param position the position of the node to create
- * @param data the data in the node to create
- * @param deletable if this node should be able to be deleted IN ANY WAY POSSIBLE
- * @constructor
+ * A Function to create a new node with the correct default data and properties.
+ *
+ * @param id - The unique ID of the node.
+ * @param type - The type of node to create (must exist in NodeDefaults).
+ * @param position - The XY position of the node in the flow canvas.
+ * @param data - The data object to initialize the node with.
+ * @param deletable - Optional flag to indicate if the node can be deleted (can be deleted by default).
+ * @returns A fully initialized Node object ready to be added to the flow.
  */
 function createNode(id: string, type: string, position: XYPosition, data: Record<string, unknown>, deletable? : boolean) {
   const defaultData = NodeDefaults[type as keyof typeof NodeDefaults]
@@ -33,7 +34,7 @@ function createNode(id: string, type: string, position: XYPosition, data: Record
   return {...defaultData, ...newData}
 }
 
-//* Initial nodes, created by using createNode. */
+//* Initial nodes to populate the flow at startup.
 const initialNodes : Node[] = [
     createNode('start', 'start', {x: 100, y: 100}, {label: "Start"}, false),
     createNode('end', 'end', {x: 500, y: 100}, {label: "End"}, false),
@@ -41,7 +42,7 @@ const initialNodes : Node[] = [
     createNode('norms-1', 'norm',  {x:-200, y:100}, {label: "Initial Norms", normList: ["Be a robot", "get good"]}),     
 ];
 
-// * Initial edges * /
+//* Initial edges to connect the startup nodes.
 const initialEdges: Edge[] = [
   { id: 'start-phase-1', source: 'start', target: 'phase-1' },
   { id: 'phase-1-end', source: 'phase-1', target: 'end' },
@@ -52,16 +53,33 @@ const initialEdges: Edge[] = [
  * How we have defined the functions for our FlowState. 
  * We have the normal functionality of a default FlowState with some exceptions to account for extra functionality.
  * The biggest changes are in onConnect and onDelete, which we have given extra functionality based on the nodes defined functions.
+ * 
+ *  * Provides:
+ * - Node and edge state management
+ * - Node creation, deletion, and updates
+ * - Custom connection handling via NodeConnects
+ * - Edge reconnection handling
  */
 const useFlowStore = create<FlowState>((set, get) => ({
   nodes: initialNodes,
   edges: initialEdges,
   edgeReconnectSuccessful: true,
 
+   /**
+   * Handles changes to nodes triggered by ReactFlow.
+   */
   onNodesChange: (changes) =>
   set({nodes: applyNodeChanges(changes, get().nodes)}),
+
+  /**
+   * Handles changes to edges triggered by ReactFlow.
+   */
   onEdgesChange: (changes) => set({ edges: applyEdgeChanges(changes, get().edges) }),
 
+  /**
+   * Handles creating a new connection between nodes.
+   * Updates edges and calls the node-specific connection functions.
+   */
   onConnect: (connection) => {
   const edges = addEdge(connection, get().edges);
   const nodes = get().nodes;
@@ -86,6 +104,9 @@ const useFlowStore = create<FlowState>((set, get) => ({
   set({ nodes, edges });
 },
 
+  /**
+   * Handles reconnecting an edge between nodes.
+   */
   onReconnect: (oldEdge, newConnection) => {
     get().edgeReconnectSuccessful = true;
     set({ edges: reconnectEdge(oldEdge, newConnection, get().edges) });
@@ -98,7 +119,11 @@ const useFlowStore = create<FlowState>((set, get) => ({
     }
     set({ edgeReconnectSuccessful: true });
   },
-
+  
+  /**
+   * Deletes a node by ID, respecting NodeDeletes rules.
+   * Also removes all edges connected to that node.
+   */
   deleteNode: (nodeId) => {
     // Let's find our node to check if they have a special deletion function
     const ourNode = get().nodes.find((n)=>n.id==nodeId);
@@ -112,10 +137,19 @@ const useFlowStore = create<FlowState>((set, get) => ({
       })}
     },
 
-  
+  /**
+   * Replaces the entire nodes array in the store.
+   */
   setNodes: (nodes) => set({ nodes }),
+
+  /**
+   * Replaces the entire edges array in the store.
+   */
   setEdges: (edges) => set({ edges }),
 
+  /**
+   * Updates the data of a node by merging new data with existing data.
+   */
   updateNodeData: (nodeId, data) => {
     set({
       nodes: get().nodes.map((node) => {
@@ -127,6 +161,9 @@ const useFlowStore = create<FlowState>((set, get) => ({
     });
   },
 
+  /**
+   * Adds a new node to the flow store.
+   */
   addNode: (node: Node) => {
     set({ nodes: [...get().nodes, node] });
   },