Sultan
/
Flowise
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update api code dialog for embed chat

This commit is contained in:
Henry 2023-06-05 12:47:55 +01:00
parent 25387aa2fd
commit ab00214ec2
1 changed files with 34 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
packages/ui/src/ui-component/dialog/APICodeDialog.js
View File

@ -121,7 +121,7 @@ const getConfigExamplesForCurl = (configData, bodyType) => {
const embedCode = (chatflowid) => { const embedCode = (chatflowid) => {
return `<script type="module"> return `<script type="module">
import Chatbot from "https://cdn.jsdelivr.net/npm/flowise-embed@latest/dist/web.js" import Chatbot from "https://cdn.jsdelivr.net/npm/flowise-embed/dist/web.js"
Chatbot.init({ Chatbot.init({
chatflowid: "${chatflowid}", chatflowid: "${chatflowid}",
apiHost: "${baseURL}", apiHost: "${baseURL}",
@ -131,7 +131,7 @@ const embedCode = (chatflowid) => {
const embedCodeCustomization = (chatflowid) => { const embedCodeCustomization = (chatflowid) => {
return `<script type="module"> return `<script type="module">
import Chatbot from "https://cdn.jsdelivr.net/npm/flowise-embed@latest/dist/web.js" import Chatbot from "https://cdn.jsdelivr.net/npm/flowise-embed/dist/web.js"
Chatbot.init({ Chatbot.init({
chatflowid: "${chatflowid}", chatflowid: "${chatflowid}",
apiHost: "${baseURL}", apiHost: "${baseURL}",
@ -151,25 +151,25 @@ const embedCodeCustomization = (chatflowid) => {
width: 400, width: 400,
poweredByTextColor: "#303235", poweredByTextColor: "#303235",
botMessage: { botMessage: {
backgroundColor: "#f7f8ff", backgroundColor: "#f7f8ff",
textColor: "#303235", textColor: "#303235",
showAvatar: true, showAvatar: true,
avatarSrc: "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/parroticon.png", avatarSrc: "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/parroticon.png",
}, },
userMessage: { userMessage: {
backgroundColor: "#3B81F6", backgroundColor: "#3B81F6",
textColor: "#ffffff", textColor: "#ffffff",
showAvatar: true, showAvatar: true,
avatarSrc: avatarSrc: "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/usericon.png",
"https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/usericon.png", },
}, textInput: {
textInput: { placeholder: "Type your question",
placeholder: "Type your question", backgroundColor: "#ffffff",
backgroundColor: "#ffffff", textColor: "#303235",
textColor: "#303235", sendButtonColor: "#3B81F6",
sendButtonColor: "#3B81F6", }
}, }
}, }
}) })
</script>` </script>`
} }
@ -605,7 +605,18 @@ query({
{value === 0 && ( {value === 0 && (
<> <>
<span> <span>
Paste this anywhere in the <code>{`<body>`}</code> tag of your html file Paste this anywhere in the <code>{`<body>`}</code> tag of your html file.
<p>
You can also specify a&nbsp;
<a
rel='noreferrer'
target='_blank'
href='https://www.npmjs.com/package/flowise-embed?activeTab=versions'
>
version
</a>
:&nbsp;<code>{`https://cdn.jsdelivr.net/npm/flowise-embed@<version>/dist/web.js`}</code>
</p>
</span> </span>
<div style={{ height: 10 }}></div> <div style={{ height: 10 }}></div>
</> </>
@ -648,7 +659,7 @@ query({
{value === 0 && embedChatCheckboxVal && ( {value === 0 && embedChatCheckboxVal && (
<CopyBlock <CopyBlock
theme={atomOneDark} theme={atomOneDark}
text={embedCodeCustomization(chatflowApiKeyId)} text={embedCodeCustomization(dialogProps.chatflowid)}
language={getLang('Embed')} language={getLang('Embed')}
showLineNumbers={false} showLineNumbers={false}
wrapLines wrapLines