@if (!NoInputs.includes(type())) {
  <div
    fNodeInput
    [fInputId]="node().key + '/edge'"
    fInputConnectableSide="left"
    [fInputMultiple]="true"
    class="left absolute"
  ></div>
}

@if (!fullCustomNodeTypes.includes(type())) {
  <div class="relative flex items-center px-3 pt-3 pb-2 rounded-t-2xl">
    @switch (type()) {
      @case (eWorkflowNodeTypeEnum.TRIGGER) {
        @if (provider()?.icon; as icon) {
          <xp-icon [icon]="icon" size="18" class="w-6 h-6 shrink-0 mr-2" [zTooltip]="key()" zPosition="top" />
        } @else {
          <div
            class="w-6 h-6 shrink-0 mr-2 flex items-center justify-center border-[0.5px] border-white/2 text-white bg-fuchsia-500 rounded-lg shadow-sm"
          >
            <i class="ri-message-3-fill"></i>
          </div>
        }
      }
      @default {
        <xpert-workflow-icon [type]="type()" class="w-6 h-6 shrink-0 mr-2" [zTooltip]="key()" zPosition="top" />
      }
    }
    <div
      [title]="title()"
      class="grow mr-1 font-semibold text-sm uppercase text-text-primary truncate flex items-center"
    >
      <div>{{ title() }}</div>
    </div>

    @if (isStart()) {
      <div
        class="absolute left-2 top-1 w-[1.1rem] h-[1.1rem] rounded-[5px] flex justify-center items-center bg-components-input-bg-normal shadow-md"
        [zTooltip]="'PAC.Xpert.StartNodeTip' | translate: { Default: 'Start node, agent pre-processing logic entry' }"
        zPosition="top"
      >
        <i class="ri-run-line text-primary-500"></i>
      </div>
    }
  </div>
}

@switch (type()) {
  @case (eWorkflowNodeTypeEnum.START) {
    <xp-xpert-workflow-node-start class="px-3" [node]="node()" [entity]="entity()" [menu]="menu()" />
  }
  @case (eWorkflowNodeTypeEnum.TRIGGER) {
    <xpert-workflow-node-trigger class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.IF_ELSE) {
    <xpert-studio-node-workflow-ifelse class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.LIST_OPERATOR) {
    <xpert-workflow-node-list-operator class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.VARIABLE_AGGREGATOR) {
    <xpert-workflow-node-variable-aggregator class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.ASSIGNER) {
    <xpert-workflow-node-assigner class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.ITERATING) {
    <xpert-studio-node-workflow-iterating class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.ANSWER) {
    <xpert-studio-node-workflow-answer class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.CLASSIFIER) {
    <xpert-workflow-node-classifier class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.KNOWLEDGE) {
    <xpert-studio-node-workflow-knowledge class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.CODE) {
    <xpert-studio-node-workflow-code class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.JSON_PARSE) {
    <xp-workflow-node-json-parse class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.JSON_STRINGIFY) {
    <xp-workflow-node-json-stringify class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.HTTP) {
    <xpert-studio-node-workflow-http class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.SUBFLOW) {
    <xpert-workflow-node-subflow class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.TEMPLATE) {
    <xpert-workflow-node-template class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.TOOL) {
    <xpert-workflow-node-tool class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.AGENT_WORKFLOW) {
    <xpert-workflow-node-agent-tool class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.AGENT_TOOL) {
    <xpert-workflow-node-agent-tool class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.TASK) {
    <xpert-workflow-node-task class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.MIDDLEWARE) {
    <xpert-workflow-node-middleware class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.SKILL) {
    <xpert-workflow-node-skill class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.NOTE) {
    <xpert-workflow-node-note class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.SOURCE) {
    <xpert-workflow-node-source class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.PROCESSOR) {
    <xpert-workflow-node-processor class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.CHUNKER) {
    <xpert-workflow-node-chunker class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.UNDERSTANDING) {
    <xpert-workflow-node-understanding class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.KNOWLEDGE_BASE) {
    <xp-workflow-node-knowledge-base class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.DB_INSERT) {
    <xp-workflow-node-db-insert class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.DB_UPDATE) {
    <xp-workflow-node-db-update class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.DB_QUERY) {
    <xp-workflow-node-db-query class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.DB_DELETE) {
    <xp-workflow-node-db-delete class="px-3" [node]="node()" [entity]="entity()" />
  }
  @case (eWorkflowNodeTypeEnum.DB_SQL) {
    <xp-workflow-node-db-sql class="px-3" [node]="node()" [entity]="entity()" />
  }
  @default {
    <div>Unimplement type ({{ type() }})</div>
  }
}

@if (!fullCustomNodeTypes.includes(type())) {
  @if (description()) {
    <div class="px-3 pt-1 text-left text-xs text-text-tertiary line-clamp-3" [title]="description()">
      {{ description() }}
    </div>
  }
}