Update dialog profile variables or post directly to chat interface? - ibm-watson

I'm build an JS app that posts restaurant suggestions to users via a simple chat interface. I'm trying to reverse-engineer the movie assistant app, but I’m not sure how to write the part where the JS app posts data from DB to the UI. Unlike the movie assistant I would be using a simple text interface similar to the one the dialog-tool example features.
I see two solutions:
The JS app updates the dialog profile variables and the dialog then posts those to the UI. This means than I can also store additional variables, such as opening hours, etc and show those on user request. On the other hand I would have to blank out the profile variables every time the user searches for a place.
This screenshot, shows a different approach where the JS app posts results directly in the UI. The app would only posts when the variable search_now = yes. I think this is similar to the movie app.
Which of the two solutions is ideal? Thanks!

The recommended method is for you application to post the variables to Dialog.
Indeed those variables might change on subsequent searches from the user.
However this allows you to have in your dialog conditions based on the values.
See here an example to a code to post variables Dialog application starter kit - app.js
log('6. updating the dialog profile with the result from themoviedb.com');
var profile = {
client_id: req.body.client_id,
name_values: [
{ name:'Current_Index', value: searchResult.curent_index },
{ name:'Total_Pages', value: searchResult.total_pages },
{ name:'Num_Movies', value: searchResult.total_movies }
]
};
return updateProfile(profile)

Related

Client side or Server Side - React (App for a customer)

i have a quick question, so i just built 3 websites for customers using React and they're all deployed and working but now one of these customers is asking me how they can update its content, all the website are stored either on one or many JS files after building them with npm run build and configured with webpack, how should i build a website where customers plan to change either texts or add new images? the websites have a couple of map functions to display many pictures or card based on products, so everytime theres a change i have to go through the react files and change them build it again and deploy them which seems pretty static to me even though React is supposed to work with components and make it dynamic, what would be the best approach and/or tools to build a website where a customer can change a .JS file with text in Cpanel file manager, or just add pictures to a directory in Cpanel file manager and have it render automatically, i was thinking that i should make it server side so i can avoid having to re build and re upload everytime that there are changes, bu what would be the best options besides React to make it dynamic, Should i use node, express??
Thank you so much for your time !
One of the options could be Contentful API, you can store all of your data there and add permission to your customer to edit the repo. This will make it easier to change the content that you mentioned: "the websites have a couple of map functions to display many pictures or card based on products". So what you will do is simply fetch data from the API and render it on your website, this will allow your Customers to CRUD the content of your website, without your intervention. It is pretty easy to use, you can find out more about it here: https://www.contentful.com/developers/docs/.
Regarding the content of the website itself, e.g pages, texts on pages, and other static stuff that does not depend on actual data, but it's only a part of your code, I think it could be hard to manage without you coding it manually. If there is an exact part of content data that is going to be changed, you could make a new Admin page, where the user will be able to change the content and data on your website, and in this could you will have to add some back-end (node, express, etc). But what you're describing is actually CMS which is really popular nowadays you might want to take a look at some of them:
https://www.wix.com/
https://wordpress.com/
But if the Texts that you've mentioned are just a part of models e.g You have a product with something like this:
const product = {
productName: 'name',
price: '100',
image: 'img',
avialable: false,
}
and clients want to change productName, price, image, avialability then Contentful is pretty sufficient for you. If you will need some help with this Platform you can DM me I will try to help you.

Flutter + Global var or SQL?

So I need to have a few things store in either a var that is accessable by all widgets. or store things in a SQL and then get the widgets to check for the latest update.
Task I am trying to do.
I have 3 images at the bottom of my main_widget.dart each one when clicked on does the following:
Stop the current radio station music.
Start the radio station that the user click on.
Changes the now playing url to match the station. - this is a separate widget all together.
So can flutter do global var that store or should I use SQL and store the values in a table called
active:
Station URL
Station Now Playing URL
And then call this when the user opens and closes the app as well as when the user clicks on another station logo just update the active database to have the correct data?
Having SQL or any database kind method is not good for just make it available from all widgets. There is no need basically. You need some kind of global variable but of course there are better ways than global variables.
The concept is called state management. Start reading from official flutter website.
I recommend BLOC for most cases. Here is the main website of a good BLOC package for flutter apps. Created by Felix Angelov. https://bloclibrary.dev/#/
For saving the simple user data for closing/opening the app you can use shared preferences. But be aware it is not for storing sensitive data like tokens, credentials etc. Just use it for "simple" and "non-sensitive" data.

How to Append word suggestions to the chat input area of bot using react js?

I'm building a chatbot application using botframework. I'm using react js as my front end and .net core as back end to generate token. As the chat input area is builtin on the webchat, i'm unable to take the id or class of webchat's input area. I want to add autosuggestion to the bot whenever a keypress is done on the chat input area. How to solve this?
You said:
As the chat input area is builtin on the webchat, i'm unable to take the id or class of webchat's input area.
This indicates that your question is about how to read user input from Web Chat's input area and/or how to programmatically write text to Web Chat's input area. I explained how to do both of those things in my answer to your other question:
Web Chat uses Redux which has a Redux store that can use
Redux middleware. Web chat has an action called
WEB_CHAT/SET_SEND_BOX that can be used to respond to what the
user types in the text input box like this:
const store = window.WebChat.createStore(
{},
store => next => action => {
if (action.type === 'WEB_CHAT/SET_SEND_BOX') {
const user_entered_text = action.payload.text;
// Use the text to query the Azure database and display suggestions
}
return next(action);
}
);
When the user clicks on a suggestion or presses the right key, you can
use that same action to change what's in the text input box like this:
store.dispatch({
type: 'WEB_CHAT/SET_SEND_BOX',
payload: {
text: user_selected_suggestion,
}
});
There are samples in the Web Chat repo that may help with using
Redux actions in Web Chat
EDIT: I've since realized that you may be wanting a way to access the send box element for the purpose of positioning your new popup element. You've mentioned wanting an alternative to jQuery, and I think no jQuery will be needed if you use the document object model normally. This Stack Overflow post might help you there: Get element inside element by class and ID - JavaScript
As seen in this thread that I linked previously, auto-suggestions are not a feature of Web Chat and it is inappropriate to turn to Stack Overflow to request that people build new features for you for free. If you want to build this feature yourself then I recommend continuing to learn more about UI elements, Web Chat, HTML, JavaScript, and React. As you try to complete your project, if you ever need help with one specific problem you're facing then that's when you should be posting a question on Stack Overflow. In order to get a good answer you will need to be a good asker by explaining the work you've done and what you've already tried and by providing links to documents you've referred to, etc. The question of how to build this entire new Web Chat feature is too broad for Stack Overflow, so here are some examples of good questions you might end up asking after you've put a reasonable amount of effort into figuring out the answer on your own:
How do I find the ID of a preexisting element on a web page that I want to modify?
What kind of UI element is appropriate for auto-complete suggestions in a web browser?
How do I query an Azure database to find auto-complete suggestions based on user-entered text?
Notice that these examples are specific pieces of the question of how to implement your word suggestion project. Being specific like this about what you need will help you find the right experts to help you solve your problems. While I can answer your Web Chat-related questions, when you increase the scope of your question to include things that aren't Web Chat-related then you're making it harder to find one person who can give you one answer because they'd need to be an expert in many different things.

Rendering Just one module/state of Angular app

I've angular app with lots of states and modules etc. Now, I want to send a link to the user. When user'll hit this url, I want to redirect him to a new tab rendering only that particular state (specified in URL) i-e I don't want anything else to be visible to the user. Or you can say, I want to open a popup window rendering that particular state's html in popup window . This is the approach that comes to my mind to sort it out.
Ps. There are Rest APIs at the backend which I am calling through angular resource service to bind data with the model of the views
Option
I've rest APIs on backend, So, I was thinking to developing s separate Nodejs application, And I will send nodejs application url to the user and in the default/home route I'll call backend API and, the returned resultset will be rendered in html file within nodeJs application and this way, I'll render the corresponding data to user's browser window.
This is the flow for that
I don't know if that is right or clever approach. Please suggest me what will be the best approach to sort it out.
Thanks in advance.
This is what my app looks like
Everything in the left side-nav is a module and clicking on this I am routing to a different state. I am using angular-material and lots of other dependencies in this project.
And this is what I want.
I'll refer a link to the user for example www.myapp.com/specificpage.html. And hitting this url, a new tab/popup will be opened rendering state defined in the same app but with some non-editable url. And it should like.
There are multiple ways to achieve this and each approach has advantage and disadvantage. You have to choose depending on requirement and architecture. Details are below-
Create a separate app - You can do it through separate code base or use the module based build process and include this module only for new app.
Divide application is two part, public pages and private pages - Include this page and required APIs for this page in the public modules for your app.
Send token in the link - If you want to make secure page, send short lived token in the eMail and validate token on the server before displaying page to the user.

Role based views in extjs4 mvc

My application has different views for different roles like (admin or standard user).I don't know how can i implement it with extjs4 MVC. Examples of extjs4 documentation consider that application has only one role like standard user so they create one app.js file that manage application but if application has many roles i don't know how can i implement different views for different users.
One matter is i have two app.js files in the application and after i get user role in the server i load appropriate app.js file to use appropriate views,controllers,models,stores and so on.
Is this matter true?
This is a rather standard question that comes up so many times and the answer is always the same:
Access Control belongs to the Server where no user can manipulate it
Simply don't provide a View / a model / a controller to a user where he has no access to
With that in mind it doesn't matter if you have one app or ten.
And because Access Control is nothing that belongs to the frontend there is no implementation within ExtJS.
Update -> Hide UI elements
A ready to go approach would be the use of Ext.direct. This provide the application with a API that can be modified based on custom access of the current user and can then be checked by the frontend.
HowTo:
Create the API based on the user session and check on the Clientside like
if(Booking) {
if (Booking.Create) {
// has access
}
}
or as one line
{
xtype: 'button',
hidden: !(Booking && Booking.Create)
}
This is just a simple example how easy this could be done!
update
This Link helped the op

Resources