react-chat-renderer
react-chat-renderer copied to clipboard
persisted interaction workflow state (redux sessions)
Summary
use a redux-like state-persistence and updating mechanism. hydrate and dehydrate state before and after each action runs.
so an HTTP request ~= a redux action.
Idea
Here's an interaction message sent from Slack and handled by a lambda:
{
"type": "block_actions",
"team": { ... },
"user": { ... },
"api_app_id": "API_APP_ID",
"token": "MESSAGE_TOKEN",
"container": {
"type": "message",
"message_ts": "1561776627.000500",
"channel_id": "CHANNEL_ID",
"is_ephemeral": false
},
"trigger_id": "679602909028.575391407056.10172fae809593326ff92c15c4db964d",
"channel": { ... },
"message": {
"type": "message",
"subtype": "bot_message",
"text": "This+content+can't+be+displayed.",
"ts": "1561776627.000500",
"bot_id": "BOT_ID",
"blocks": [
{
"type": "section",
"block_id": "P4NT",
"text": {
"type": "mrkdwn",
"text": "Progress:+\u2593\u2593\u2591\u2591\u2591",
"verbatim": false
},
"accessory": {
"type": "button",
"action_id": "doAThing",
"text": { "type": "plain_text", "text": "Go!", "emoji": true }
}
}
]
},
"response_url": "RESPONSE_URL",
"actions": [
{
"action_id": "doAThing",
"block_id": "P4NT",
"text": { "type": "plain_text", "text": "Go!", "emoji": true },
"type": "button",
"action_ts": "1561776635.121684"
}
]
}
- slack do interaction
- handle request
- hydrate state into store
- look up current state in distributed cache using previous message's identifiers.
block_id
- look up current state in distributed cache using previous message's identifiers.
- dispatch action
action_id+block_idor some combination of things fromactionspayload - run reducers to compute new state
- persist new state with
block_id- use
trigger_idas newblock_id
- use
- render message with new
block_id