kamaln7 / karmabot

upvotes and downvotes for slack
MIT License
21 stars 6 forks source link

Use Slack Block Kits for a nicer UI #49

Open kamaln7 opened 5 years ago

kamaln7 commented 5 years ago

screenshot

The button will require the web server to be running and karma ops to be logged in the database with uuids.

"When you're using blocks in a message, however, you specify fallback text by using the top-level text field within the payload your app is sending to publish the message. The text field won't render in messages in Slack clients as long as blocks is also provided, but it will show up as the fallback text in notifications."

https://api.slack.com/tools/block-kit-builder

[
    {
        "type": "section",
        "text": {
            "type": "mrkdwn",
            "text": "<@U2G01FRQE> now has *53* points"
        }
    },
    {
        "type": "divider"
    },
    {
        "type": "section",
        "text": {
            "type": "mrkdwn",
            "text": ":arrow_up: *+9* points from 3 people\n\n:speech_balloon: for helping with code review"
        }
    },
    {
        "type": "divider"
    },
    {
        "type": "context",
        "elements": [
            {
                "type": "image",
                "image_url": "https://api.slack.com/img/blocks/bkb_template_images/profile_1.png",
                "alt_text": "Michael Scott"
            },
            {
                "type": "image",
                "image_url": "https://api.slack.com/img/blocks/bkb_template_images/profile_2.png",
                "alt_text": "Dwight Schrute"
            },
            {
                "type": "image",
                "image_url": "https://api.slack.com/img/blocks/bkb_template_images/profile_3.png",
                "alt_text": "Pam Beasely"
            },
            {
                "type": "plain_text",
                "emoji": true,
                "text": "3 votes"
            }
        ]
    },
    {
        "type": "actions",
        "elements": [
            {
                "type": "button",
                "text": {
                    "type": "plain_text",
                    "text": "Give +3"
                },
                "value": "karma_op_uuid",
                "action_id": "karma_op"
            }
        ]
    }
]