Add watsonx Orchestrate Embed Chat Examples with Node.js Implementations#27
Add watsonx Orchestrate Embed Chat Examples with Node.js Implementations#27rohitmulay-ibm wants to merge 4 commits into
Conversation
rohitmulay-ibm
changed the title
| @@ -0,0 +1,1372 @@ | |||
| <!DOCTYPE html> | |||
There was a problem hiding this comment.
You're being inconsistent in your file name schema. The folder is snake case and the files names are kabob case. Pick up and stick with it. And I would just rename the folder to anonymous-users since really what this example is showing is the most basic use case. Everything in here is going to be for embed so repeating that in all the folders names will be redundant. And "node" doesn't mean anything here.
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | ||
|
|
||
| <script> | ||
| /** |
There was a problem hiding this comment.
Let's follow our own chat coding standard. That means don't use jsdoc here. Use // line comments.
| <div id="root"></div> | ||
|
|
||
| <!-- Animated Background --> | ||
| <div class="animated-bg"> |
There was a problem hiding this comment.
This is all totally unnecessary for the purpose of this tutorial. Examples really should be pretty narrowly scoped to the functionality required to educate the customer about the feature. The purpose here is education, not a demo. Having all of this html is pretty but it just more code the developer has to wade through to figure out what specifically they need to understand in order to make use of this feature. There's over 1000 lines of html code here and a less observant developer may think this is all necessary in order to use the chat. I think just a simple "Example web page" or somewhat would be fine with just a couple lines of html.
Focus on the main purpose of these examples. They're meant to be functional, not pretty.
| @@ -0,0 +1,1372 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
There was a problem hiding this comment.
You should probably move this down a couple of layers to start a pattern. Some of these tutorials will probably eventually involve multiple types of code. This one is plain javascript for the client but we might have one that's in react at same point.
You should leave the README.me here.
And then I would move this file to anonymous-users/client/javascript/static/index.html. Then we can have client/server folders and javascripr/react/angular/web-components folders.
|
|
||
| <body> | ||
| <!-- Mount node for the chat (fullscreen-overlay/direct render). --> | ||
| <div id="root"></div> |
There was a problem hiding this comment.
I'm pretty sure this root element is unnecessary so we can leave it out of our examples.
| hostURL: "https://your-instance.watson-orchestrate.ibm.com", | ||
|
|
||
| // ID of the HTML element where the chat will be mounted | ||
| rootElementID: "root", |
There was a problem hiding this comment.
And same above, I would remove all the "root" stuff.
| } | ||
| }; | ||
|
|
||
| getIdentityToken().then(() => { |
There was a problem hiding this comment.
You won't need this if you rely on the token event instead.
| - You're building a proof-of-concept | ||
| - No sensitive data or systems are accessed | ||
|
|
||
| **Quick start:** |
There was a problem hiding this comment.
Don't repeat this info here. If you want a table of contents, fine but leave the instructions in each file.
| @@ -0,0 +1,73 @@ | |||
| # IBM watsonx Orchestrate Embed Chat Examples | |||
There was a problem hiding this comment.
I think you should probably split this folder. I would make this embed_chat/examples. Then you could potentially have embed_chat/utilities or embed_chat/common where you can put stuff to share across examples to avoid repeating things.
| - [Configuring security for embedded chat](https://www.ibm.com/docs/en/watsonx/watson-orchestrate/base?topic=chat-configuring-security-embedded) | ||
| - [Configuring security with scripting](https://www.ibm.com/docs/en/watsonx/watson-orchestrate/base?topic=chat-configuring-security-scripting) | ||
|
|
||
| ## Quick Comparison |
There was a problem hiding this comment.
Definitely don't repeat this here.
2 participants
PR Description
Overview
This PR introduces comprehensive embed chat integration examples for IBM watsonx Orchestrate, providing developers with ready-to-use implementations for both anonymous and secure chat scenarios.
What's Added
📁 New Directory Structure
embed_chat_examples/- Root directory for all embed chat examples🔓 Anonymous Embed Chat (Node.js)
🔐 Secure Embed Chat (Node.js)
📚 Documentation
🛠️ Infrastructure
.gitignorefile for Python, Node.js, and IDE-specific filespackage.json,package-lock.json)Key Features
Technical Details
Testing
Both examples include: