std-confirmation

Level: Atom | Entity: ConfirmAction | Persistence: runtime

2 states, 5 events, 5 transitions

Live Preview

orbital ConfirmActionOrbital {
  entity ConfirmAction [runtime] {
    id : string
    name : string
    description : string
    status : string
    createdAt : string
    pendingId : string
  }
  trait ConfirmActionConfirmation -> ConfirmAction [interaction] {
    initial: idle
    state idle {
      INIT -> idle
        (fetch ConfirmAction)
        (render-ui main { type: "stack", direction: "vertical", gap: "lg", children: [{ type: "stack", direction: "horizontal", gap: "md", align: "center", children: [{ type: "icon", name: "shield-check", size: "lg" }, { type: "typography", content: "ConfirmActions", variant: "h2" }] }, { type: "divider" }, { type: "data-grid", entity: "ConfirmAction", emptyIcon: "inbox", emptyTitle: "No confirmactions yet", emptyDescription: "Items will appear here.", itemActions: [{ label: "Confirm Action", event: "REQUEST", variant: "danger" }], renderItem: ["fn", "item", { type: "stack", direction: "vertical", gap: "sm", children: [{ type: "typography", variant: "h4", content: "@item.name" }] }] }] })
      REQUEST -> confirming
        (set @entity.pendingId @payload.id)
        (fetch ConfirmAction { id: "@payload.id" })
        (render-ui modal { type: "stack", direction: "vertical", gap: "md", children: [{ type: "stack", direction: "horizontal", gap: "sm", align: "center", children: [{ type: "icon", name: "alert-triangle", size: "md" }, { type: "typography", content: "Confirm Action", variant: "h3" }] }, { type: "divider" }, { type: "alert", variant: "danger", message: "Are you sure?" }, { type: "stack", direction: "horizontal", gap: "sm", justify: "end", children: [{ type: "button", label: "Cancel", event: "CANCEL", variant: "ghost" }, { type: "button", label: "Confirm", event: "CONFIRM", variant: "danger", icon: "check" }] }] })
    }
    state confirming {
      CONFIRM -> idle
        (render-ui modal null)
        (fetch ConfirmAction)
        (render-ui main { type: "stack", direction: "vertical", gap: "lg", children: [{ type: "stack", direction: "horizontal", gap: "md", align: "center", children: [{ type: "icon", name: "shield-check", size: "lg" }, { type: "typography", content: "ConfirmActions", variant: "h2" }] }, { type: "divider" }, { type: "data-grid", entity: "ConfirmAction", emptyIcon: "inbox", emptyTitle: "No confirmactions yet", emptyDescription: "Items will appear here.", itemActions: [{ label: "Confirm Action", event: "REQUEST", variant: "danger" }], renderItem: ["fn", "item", { type: "stack", direction: "vertical", gap: "sm", children: [{ type: "typography", variant: "h4", content: "@item.name" }] }] }] })
      CANCEL -> idle
        (render-ui modal null)
        (fetch ConfirmAction)
        (render-ui main { type: "stack", direction: "vertical", gap: "lg", children: [{ type: "stack", direction: "horizontal", gap: "md", align: "center", children: [{ type: "icon", name: "shield-check", size: "lg" }, { type: "typography", content: "ConfirmActions", variant: "h2" }] }, { type: "divider" }, { type: "data-grid", entity: "ConfirmAction", emptyIcon: "inbox", emptyTitle: "No confirmactions yet", emptyDescription: "Items will appear here.", itemActions: [{ label: "Confirm Action", event: "REQUEST", variant: "danger" }], renderItem: ["fn", "item", { type: "stack", direction: "vertical", gap: "sm", children: [{ type: "typography", variant: "h4", content: "@item.name" }] }] }] })
      CLOSE -> idle
        (render-ui modal null)
        (fetch ConfirmAction)
        (render-ui main { type: "stack", direction: "vertical", gap: "lg", children: [{ type: "stack", direction: "horizontal", gap: "md", align: "center", children: [{ type: "icon", name: "shield-check", size: "lg" }, { type: "typography", content: "ConfirmActions", variant: "h2" }] }, { type: "divider" }, { type: "data-grid", entity: "ConfirmAction", emptyIcon: "inbox", emptyTitle: "No confirmactions yet", emptyDescription: "Items will appear here.", itemActions: [{ label: "Confirm Action", event: "REQUEST", variant: "danger" }], renderItem: ["fn", "item", { type: "stack", direction: "vertical", gap: "sm", children: [{ type: "typography", variant: "h4", content: "@item.name" }] }] }] })
    }
  }
  page "/confirmactions/confirm" -> ConfirmActionConfirmation
}

Loading preview...

Orbital Visualization

Loading visualization...

Entity Fields

Field	Type	Default
id	string	-
name	string	-
description	string	-
status	string	"active"
createdAt	string	-
pendingId	string	""

States

State	Type
idle	Initial
confirming	-

Events

Event	Payload
INIT	-
REQUEST	id: string
CONFIRM	-
CANCEL	-
CLOSE	-

Transitions

From	Event	To	Effects
idle	INIT	idle	2 effects
idle	REQUEST	confirming	3 effects
confirming	CONFIRM	idle	3 effects
confirming	CANCEL	idle	3 effects
confirming	CLOSE	idle	3 effects