Multiple attachment with single callback_id: slack interactive component - api

Is it possible to have multiple menu attachment and allow users to select each menu before sending back the collated response?
return Promise.resolve({
text: `Rate each game`,
attachments: [
...games.map(game => ({
color: "#5A352D",
title: game,
callback_id: "game:done",
actions: [
{
name: "done",
text: "Select a score",
type: "select",
value: "game:done",
options: [
{ text: 1, value: 1 },
{ text: 2, value: 2 }
]
}
]
}))
]
});
This images shows how it renders
But, I need to call the callback only when the user has finished scoring each game.
Perhaps, I can provide an additional button for that, but how can I handle callback for these menu actions

Choosing a menu option will always fire a request to your app. But you could replace the former message and recreate the menu list each time and show the remaining menus to the user until all are chosen. Technically it will be a new message each time, but by replacing the old message the user will not notice.

Related

How to display pdf (documents) in react-native-gifted-chat

I'm sending images and pdf through gifted chat with twilio messaging. After sending I'm having trouble to show documents in gifted-chat ui.
Here is the message object which gifted chat will accept:
{
_id: 1,
text: 'My message',
createdAt: new Date(Date.UTC(2016, 5, 11, 17, 20, 0)),
user: {
_id: 2,
name: 'React Native',
avatar: 'https://facebook.github.io/react/img/logo_og.png',
},
image: 'https://facebook.github.io/react/img/logo_og.png',
// You can also add a video prop:
video: 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4',
// Mark the message as sent, using one tick
sent: true,
// Mark the message as received, using two tick
received: true,
// Mark the message as pending with a clock loader
pending: true,
// Any additional custom parameters are passed through
}
How can i attach pdf(document) link in here,
Currently am attaching pdf url with key of image and it is returning blank coz it is recognising that url as an image.
How can i show pdf instead of blank their?
Here is the current result
I think you can define "document" in your message object rather than using "image".
Then you can customize your document message in the props renderCustomView like this:
// Custom render message
const renderCustomView = (props) => {
// Custom document message
if (props.currentMessage.document) {
// Your custom pdf message
}
}

How do I use an asynchronous query to read in a list of to-dos?

I'm making a simple to-do list application but I need to use an asynch query to fill the tasks on the webpage with what is in the json (I am given a link where the list of todos are). How do I do this? I've been searching everywhere and am stuck. Right now, it is only showing tasks I add, or a task I have manually inputted under data.
This is what I have in the first part for data
el: '#app',
data: {
items: [{
text: "test1",
completed: false,
}],
text: '',
show: 'all',
},
I would check out the library axios for this task. Check out this example: https://v2.vuejs.org/v2/cookbook/using-axios-to-consume-apis.html

How to get device token on changed notification from settings panel

Using the PushNotificationIOS library, I am able to get the deviceToken on the register event:
const registerPN = PushNotificationIOS.addEventListener('register', deviceToken => {
console.log("Registering Push Notification Token", deviceToken);
store.dispatch(setPushNotificationToken(userPushNotificationToken));
});
However, if the user initially rejects the notification question, we push them to update the settings through:
Alert.alert(
'Action Required',
`To turn notifications on, you'll need to update your settings`,
[
{
text: 'Go to settings',
onPress: () => {
Linking.openURL('app-settings:');
}
},
{
text: 'Cancel',
style: 'cancel'
}
]
)
If the user then goes to the settings panel, and returns, the 'register' event does not seem to be called, so I'm not sure how to get the device token.
How can I add a listener for the 'settings' update so that I can store the token for pushes from the server?
Figured it out.
With a PushNotificationIOS.checkPermissions() call, you can check if they have changed. If so, fire off a PushNotificationIOS.requestPermissions() call that will automatically fire the listener with the correct token.

Change name and logo on Auth0 signup

Users get this on new signups on my app:
On auth0 dashboard I've named my app and uploaded a logo.
Where am I suppose to enter information to show this info on signup dialog?
Check the UI Customization docs
The value for logo is a URL for an image that will be placed in the Lock's header, and defaults to Auth0's logo. It has a recommended max height of 58px for a better user experience.
var options = {
theme: {
logo: 'https://example.com/logo.png'
}
};
Check also the section Customizing Text to change the name, for example:
var options = {
languageDictionary: {
emailInputPlaceholder: "something#youremail.com",
title: "Log me in"
},
};
For the sign-up:
var options = {
additionalSignUpFields: [{
name: "address",
placeholder: "enter your address",
// The following properties are optional
icon: "https://example.com/assests/address_icon.png",
prefill: "street 123",
validator: function(address) {
return {
valid: address.length >= 10,
hint: "Must have 10 or more chars" // optional
};
}
},
{
name: "full_name",
placeholder: "Enter your full name"
}]
}
additionalSignUpFields Intended for use with database signup only
additionalSignupFields are intended for use with database signups only. If you have social sign ups too, you can ask for the additional information after the users sign up (see this page about custom signup for more details). You can use the databaseAlternativeSignupInstructions i18n key to display these instructions.
For more details check Custom Signup
If using LinkedIn see this example, and also change the text as required:

events flow of Panel in sencha touch 2

This is my application architecture.
var loginView = Ext.create('Ext.Panel',{
id: 'LoginView',
.....
});
var homeView = Ext.create('Ext.TabPanel',{
id: 'HomeView',
items: [
{
xtype: 'list',
title: 'Home',
store: Ext.create('TweetStore'),
disableSelection: true,
....
},
{
title: 'Reply',
....
},
{
title: 'DM',
....
}
]
});
var mainView = Ext.create('Ext.Panel',{
id: 'MainView',
layout: 'card',
items: [ loginView, mainView ]
});
Ext.define('TweetStore', {
extend: 'Ext.data.Store',
config: {
fields: ...
pageSize: 25,
autoLoad: true,
proxy: {
type: 'ajax',
url: '/home',
pageParam: 'page',
limitParam: 'count',
reader: {
type: 'json'
}
}
}
});
There are two panels in MainView. LoginView is a login page where user input his username and password. When the authorization succeed, the second panel HomeView shows.
My questions:
I want the data in TweetStore to be loaded after the authorization, that is, when the HomeView shows, the data begins to load. But the show event is triggered even the
panel is still hidden. What event should I catch.
When the application starts, I want to send a ajax request to check whether the user is login, if true, the LoginView hide and the HomeView shows. In which event should I check this?
Q. 1) You should listen for painted() event.
Fires whenever this Component actually becomes visible (painted) on
the screen. This is useful when you need to perform 'read' operations
on the DOM element, i.e: calculating natural sizes and positioning.
Q. 2) Send the ajax request for user authentication on initialize() event.
Fires when the component has been initialized
- 1st question:
painted event seems good but in fact, it's terribly full of bugs in current release of Sencha Touch 2, as my experience. Do NOT rely on its existence and documentation.
According to what you've described, it's clear that you want to load your store after a specific event (authorization), so how about firing a custom event after that? For example:
loginForm.fireEvent('authenticated', this) (or any extra-params you need)
then in your controller, just listen to event authenticated on loginForm view.
- 2nd question:
As you said, you want to run some processes right after your application started. So the right place to put your code is in launch() function of your app.js. Just simple.