import {
  type NodeProps,
  Position,
  type Node, useNodeConnections
} from '@xyflow/react';
import {useEffect} from "react";
import { Toolbar } from '../components/NodeComponents';
import styles from '../../VisProg.module.css';
import {SingleConnectionHandle} from "../components/RuleBasedHandle.tsx";
import {type EditorWarning} from "../components/EditorWarnings.tsx";
import {allowOnlyConnectionsFromHandle} from "../HandleRules.ts";
import useFlowStore from "../VisProgStores.tsx";


export type StartNodeData = {
  label: string;
  droppable: boolean;
  hasReduce: boolean;
};


export type StartNode = Node<StartNodeData>


/**
 * Defines how a Norm node should be rendered
 * @param props NodeProps, like id, label, children
 * @returns React.JSX.Element
 */
export default function StartNode(props: NodeProps<StartNode>) {
  const {registerWarning, unregisterWarning} = useFlowStore.getState();
  const connections = useNodeConnections({
    id: props.id,
    handleId: 'source'
  })

  useEffect(() => {
    const noConnectionWarning : EditorWarning = {
      scope: {
        id: props.id,
        handleId: 'source'
      },
      type: 'MISSING_OUTPUT',
      severity: "ERROR",
      description: "the startNode does not have an outgoing connection to a phaseNode"
    }

    if (connections.length === 0) { registerWarning(noConnectionWarning); }
    else { unregisterWarning(props.id, `${noConnectionWarning.type}:source`); }
  }, [connections.length, props.id, registerWarning, unregisterWarning]);

  return (
    <>
      <Toolbar nodeId={props.id} allowDelete={false}/>
      <div className={`${styles.defaultNode} ${styles.nodeStart}`}>
        <div className={"flex-row gap-sm"}>
          Start
        </div>
        <SingleConnectionHandle type="source" position={Position.Right} id="source" rules={[
          allowOnlyConnectionsFromHandle([{nodeType:"phase",handleId:"target"}])
        ]} title="Connect to a phaseNode"/>
      </div>
    </>
  );
}

/**
 * The reduce function for this node type.
 * @param node this node
 * @param _nodes all the nodes in the graph
 * @returns a reduced structure of this node
 */
export function StartReduce(node: Node, _nodes: Node[]) {
  // Replace this for nodes functionality
  return {
    id: node.id
  }
}

export const StartTooltip = `
  The start node acts as the starting point for a program, 
  it should be connected to the left handle of the first phase of your program`;

/**
 * This function is called whenever a connection is made with this node type as the target
 * @param _thisNode the node of this node type which function is called
 * @param _sourceNodeId the source of the received connection
 */
export function StartConnectionTarget(_thisNode: Node, _sourceNodeId: string) {
  // no additional connection logic exists yet
}

/**
 * This function is called whenever a connection is made with this node type as the source
 * @param _thisNode the node of this node type which function is called
 * @param _targetNodeId the target of the created connection
 */
export function StartConnectionSource(_thisNode: Node, _targetNodeId: string) {
  // no additional connection logic exists yet
}

/**
 * This function is called whenever a connection is disconnected with this node type as the target
 * @param _thisNode the node of this node type which function is called
 * @param _sourceNodeId the source of the disconnected connection
 */
export function StartDisconnectionTarget(_thisNode: Node, _sourceNodeId: string) {
  // no additional connection logic exists yet
}

/**
 * This function is called whenever a connection is disconnected with this node type as the source
 * @param _thisNode the node of this node type which function is called
 * @param _targetNodeId the target of the diconnected connection
 */
export function StartDisconnectionSource(_thisNode: Node, _targetNodeId: string) {
  // no additional connection logic exists yet
}