coco-app-platform/app/run-agent-flow/store.tsx

'use client';
import { atom } from "jotai";
import { atomFamily, atomWithReducer } from 'jotai/utils'
import * as R from 'ramda'

export const flowModelRecordAtom = atom()
flowModelRecordAtom.debugLabel = 'flowModelRecordAtom'

// LF nodes model
export const flowModelAtom = atom(get => {
  const record = get(flowModelRecordAtom)
  const { nodes, edges } = record?.content ?? {}
  const chainNodes = []
  let curNode = R.find(R.propEq('node_id_1', 'id'), nodes ?? [])
  if (curNode) {
    chainNodes.push(curNode)
    const cached = new Set()
    while (true) {
      const nextNode = R.find(
        R.propEq(
          R.prop(
            'targetNodeId',
            R.find(R.propEq(curNode.id, 'sourceNodeId'), edges)
          ),
          'id'
        ),
        nodes
      )
      if (!nextNode || nextNode.id === 'node_id_2') {
        break;
      }
      if (cached.has(nextNode.id)) {
        break;
      }
      cached.add(nextNode.id)
      curNode = nextNode
      chainNodes.push(nextNode)
    }
  }
  return chainNodes
})
flowModelAtom.debugLabel = 'flowModelAtom'

// react flow nodes model
export const flowModelTranslatedAtom = atom(get => {
  // TODO translated to react flow model
  return get(flowModelAtom)
})
flowModelTranslatedAtom.debugLabel = 'flowModelTranslatedAtom'

// filtered for steps nodes model
export const stepsNodesAtom = atom(get => {
  const nodes = get(flowModelTranslatedAtom)
  return R.filter(
    R.propSatisfies(
      R.includes(
        R.__,
        ['form_card', 'UserTask']
      ),
      'type'
    ),
    nodes
  )
})
stepsNodesAtom.debugLabel = 'stepsNodesAtom'

export const curStepAtom = atom(0)
curStepAtom.debugLabel = 'curStepAtom'

export const viewedStepAtom = atom(0)
viewedStepAtom.debugLabel = 'viewedStepAtom'

export const curNodeAtom = atom(get => {
  const stepsNodes = get(stepsNodesAtom)
  const curStep = get(curStepAtom)
  return R.prop(curStep, stepsNodes)
})
curNodeAtom.debugLabel = 'curNodeAtom'

export const viewedNodeAtom = atom(get => {
  const stepsNodes = get(stepsNodesAtom)
  const viewedStep = get(viewedStepAtom)
  return R.prop(viewedStep, stepsNodes)
})
viewedNodeAtom.debugLabel = 'viewedNodeAtom'

export const arrowStateAtom = atom(get => {
  const stepsNodes = get(stepsNodesAtom)
  const curStep = get(curStepAtom)
  return {
    prev: stepsNodes && curStep > 0,
    next: stepsNodes && curStep < stepsNodes?.length - 1
  }
})
arrowStateAtom.debugLabel = 'arrowStateAtom'


// node render下相关的状态
export const cardInstantAtomFamily = atomFamily((id) => atom({ id }))

export const cardInstantAtomsAtom = atomWithReducer({}, (prev, payload: { id: string; } & { [K in any]?: any }) => {
  return { ...prev, ...payload }
})
cardInstantAtomsAtom.debugLabel = 'cardInstantAtomsAtom'

// Readonly
export const instantDataAtom = atom(get => {
  const cardInstantAtoms = get(cardInstantAtomsAtom)
  const cardInstant = R.map((at) => get(at), cardInstantAtoms)
  return cardInstant
})
instantDataAtom.debugLabel = 'instantDataAtom'


// aside下相关的状态
export const asideInstantAtomFamily = atomFamily((id) => atom({ id }))

export const asideInstantAtomsAtom = atomWithReducer({}, (prev, payload: { id: string; } & { [K in any]?: any }) => {
  return { ...prev, ...payload }
})
asideInstantAtomsAtom.debugLabel = 'asideInstantAtomsAtom'