Slack Block Kit ordered and unordered lists? - slack

I'm experimenting with the Slack Block Kit, that supports markdown syntax. I'm trying to insert a numbered or bulleted list into the editor and can't seem to figure out how that works. Is there any way to achieve this?
Here is an example payload:
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "1 asjdfljasd 1 asdfkjasdf " <- should be a numbered list
}
},
]

Slack's templates for Block Kit had an unordered list. They used the unicode character • (hex 0x2022) instead of markdown. Markdown does not appear to work in blocks for lists.
"text": {
"type": "mrkdwn",
"text": "• Item 1\n• Item 2\n• Item 3"
}
Ordered lists would need you to type in the numbers unfortunately:
"text": {
"type": "mrkdwn",
"text": "1. Item 1\n2. Item 2\n3. Item 3"
}

The answer can be found here: https://api.slack.com/reference/surfaces/formatting

Related

I would like to use Blocks instead of Attachments in my Slack App but the app fails to return the message

I recently made my first Slack app - a sort of Tech Support FAQs tool for my workplace workspace.
I originally wanted the responses to be much more complex using the Slack Block Kit, and having trawled the documentation on the Slack API site it looked like I could simply exchange Attachments for Blocks:
function respondWithFaq(text, callbackId, respond, choice) {
frequentlyAskedQuestions.callback_id = callbackId
frequentlyAskedQuestions.text = 'What are you trying to do?'
respond({
text: text,
attachments: [frequentlyAskedQuestions[choice]], //All different choices are saved in a .json array and then saved at the top in a variable called frequentlyAskedQuestions
replace_original: true
})
}
However, when I swap that tag out the messages never print. I have used the Block Kit builder to try and construct more complex and useful responses using multiple sections but it doesn't seem to like more than 1 section in it's responses.
My .json files are structured in arrays depending on which choice was made in the previous select menu like so:
[
{
"fallback": "Upgrade your Slack client to use messages like these.",
"color": "#3AA3E3",
"attachment_type": "default",
"callback_id" : "slack_help",
"actions": [
{
"name": "subject_list",
"text": "Select one",
"type": "select",
"options": [
{
"text": "Add somebody to a channel",
"value": "addToChannel"
},
{
"text": "Find an old message",
"value": "oldMessageThread"
},
{
"text": "Fix my camera",
"value": "cameraBroken"
},
{
"text": "Fix my audio",
"value": "audioBroken"
},
{
"text": "Add a new workspace",
"value": "addWorkspace"
},
{
"text": "Submit a support ticket",
"value": "submitTicket"
}
]
}
]
},
{
"fallback": "Upgrade your Slack client to use messages like these.",
"color": "#3AA3E3",
"attachment_type": "default",
"callback_id" : "box_help",
"actions": [
{
"name": "subject_list",
"text": "Select one",
"type": "select",
"options": [
{
"text": "Fix Box Tools",
"value": "boxTools"
},
{
"text": "Unable to open a file from Box",
"value": "microsoftOnline"
},
{
"text": "Find a file or folder",
"value": "findFile"
},
{
"text": "Edit a file that has been shared with me",
"value": "editFile"
},
{
"text": "Merge my Box accounts",
"value": "accountMerge"
},
{
"text": "Submit a support ticket",
"value": "submitTicket"
}
]
}
]
},
and so on...
I wondered if this was something to do with the Response URL formatting but having read that documentation it appears that Blocks can be used within that.
Any advice or documentation that could help me with this?
I recognise that I am quite new to coding and perhaps I've done something really obvious - please point it out so I can learn!
I followed this tutorial online to create the app, and as they used attachments so did I. Then I tried to adapt from there.

How do we mention or tag someone in using Slack's Block Kit Builder?

I tried creating slack's block kit builder, the desired design were actually fine. But I don't know where to find a button so we can tag a someone on it.
I have here an attempt to tag a person named john but unfortunately it only generated a plain text, it did not notify the person nor became the same the design as expected (see image result below)
view playground
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "#juan \n\nis a mrkdwn section block"
}
},
.....
]
}
Here is the result
I found the solution from the following link.
https://api.slack.com/reference/surfaces/formatting#mentioning-users
get the user's id
wrap it with a left and right arrow with an "#" symbol beside it. syntax <#userId>
usage:
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "Hey <#802AWTP13BZ>, thanks for submitting your report!"
}
}
]
}

"Invalid blocks" when updating ephemeral message via response_url webhook

According to Slack's documentation, you can use blocks to update an entire ephemeral message by simply replacing the entire message by setting replace_original as true when posting to the response_url provided in the interaction payload when using buttons.
However, when I'm sending the POST request to the provided response_url after a button has been pressed and I attempt to use blocks, I get the following error: 404 : [{"ok":false,"error":"invalid_blocks"}]
Strangely enough, the payload I'm including for blocks is generated by the same method that creates the original ephemeral message which works fine without any issues.
I was able to replace the entire message with just a plain text message by using the text field indicated in the documentation and it works fine if I don't include the blocks array. I did find some documentation here for posting messages via incoming webhooks here but it looks the same as what I'm sending now.
Here's the body of the request I'm sending:
{
"blocks":
[
{
"type": "image",
"imageUrl": "https://example.com/image.jpeg",
"altText": "alt-text",
"title":
{
"type": "plain_text",
"text": "some text"
}
},
{
"type": "actions",
"elements":
[
{
"type": "button",
"text":
{
"type": "plain_text",
"text": "Send",
"emoji": false
},
"value": "send",
"style": "primary"
},
{
"type": "button",
"text":
{
"type": "plain_text",
"text": "Find new",
"emoji": false
},
"value": "some text"
},
{
"type": "button",
"text":
{
"type": "plain_text",
"text": "Cancel",
"emoji": false
},
"value": "cancel"
}
]
}
],
"replace_original": "true",
"text": "some fallback text"
}
You have two typos in your blocks: imageUrl and altText. Slack expects these to be snake case, i.e. image_url and alt_text.
You can use Slack's Block Kit Builder to debug the blocks payload.

Extend slack bot menu color bar across full message (node, slack block kit, slack api)

I have a slack bot that uses a menu drop down, and it has a color bar on the side.
See the screenshot of what I have
here in the green circle
I want the bar to extend the whole message like this image
Note: This image is edited to show the example of the red bar (and because the actual slack bot message isn't important)
My code has something like
let slackPost = {
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": myText
}
} // ... some other blocks
],
"attachments": [
{
"text": menuTitle,
"color": menuBarColor,
"attachment_type": "default",
"actions": [
{
"name": menuName,
"text": menuPlaceHolder,
"type": "select",
"options": menuOptions
}
]
}
]
}
The new slack blocks layout doesn't allow the old color attachments property. You can find official documentation here.
There is one exception, and that's the color parameter, which currently does not have a block alternative. If you are strongly attached (🎺) to the color bar, use the blocks parameter within an attachment.
You can nest blocks inside the attachment property, like this:
let slackPost = {
"attachments": [{
"color": message.color,
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": myText
}
} // ... some other blocks
]
}]

slack block users-select dropdown limited options by group users or static id's

I'm using slack users-select in the block-kit and would like to restrict my users-list in the dropdown options (currently shows all users in workspace) with given id's OR to specific users in current-group:
"restricted_users": ["Id1", "Id2"..."IdN]
OR
"restricted_users_in_group": true
(restrict to only users in existing group)
then show the selected-menu only with those users, currently my code looks like this:
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "Test block with users select"
},
"accessory": {
"type": "users_select",
"placeholder": {
"type": "plain_text",
"text": "Select a user",
"emoji": true
},
"action_id": "users_select-action"
}
}
I can use static-user-select and add names myself, but this won't let me have "user-status" ("online"/"offline") and sometimes users might increase/decrease dynamically, couldn't find any k/v or more info on doc's, what should be my approach here? thanks!

Resources