From b76febec4109886bcd7cc5dd0e326d202bbdcf29 Mon Sep 17 00:00:00 2001 From: Chen Gong Date: Thu, 7 Nov 2024 09:16:27 -0600 Subject: [PATCH] Add dashboard conversation frontend service --- src/lib/helpers/types/userTypes.js | 11 ++ src/lib/services/api-endpoints.js | 5 + src/lib/services/conversation-service.js | 41 +++++ src/lib/services/dashboard-service.js | 19 +++ .../[conversationId]/chat-box.svelte | 12 +- src/routes/page/dashboard/+page.svelte | 34 +++- src/routes/page/dashboard/Conversation.svelte | 155 ++++++++++++++++++ 7 files changed, 274 insertions(+), 3 deletions(-) create mode 100644 src/lib/services/dashboard-service.js create mode 100644 src/routes/page/dashboard/Conversation.svelte diff --git a/src/lib/helpers/types/userTypes.js b/src/lib/helpers/types/userTypes.js index 3f50a321..afc56f39 100644 --- a/src/lib/helpers/types/userTypes.js +++ b/src/lib/helpers/types/userTypes.js @@ -16,4 +16,15 @@ * @property {string} [token] */ +/** + * @typedef {Object} DashboardModel + * @property {DashboardConversation[]} [conversation_list] - conversation components + */ + +/** + * @typedef {Object} DashboardConversation + * @property {string} [name] - The conversation name. + * @property {string} [conversation_id] - The conversation id. + * @property {string} [instruction] - The user input instruction. + */ export default {}; \ No newline at end of file diff --git a/src/lib/services/api-endpoints.js b/src/lib/services/api-endpoints.js index 2d099617..0731d3aa 100644 --- a/src/lib/services/api-endpoints.js +++ b/src/lib/services/api-endpoints.js @@ -51,6 +51,7 @@ export const endpoints = { conversationMessageUpdateUrl: `${host}/conversation/{conversationId}/update-message`, conversationTagsUpdateUrl: `${host}/conversation/{conversationId}/update-tags`, fileUploadUrl: `${host}/agent/{agentId}/conversation/{conversationId}/upload`, + pinConversationUrl: `${host}/agent/{agentId}/conversation/{conversationId}/dashboard`, // LLM provider llmProvidersUrl: `${host}/llm-providers`, @@ -84,6 +85,10 @@ export const endpoints = { // chathub chatHubUrl: `${host}/chatHub`, + // dashboard + dashboardSettingUrl: `${host}/dashboard/components`, + dashConversationInstructionUrl: `${host}/dashboard/component/conversation?userId={userId}`, + // Google geocode api addressUrl: `${host}/address/options` } diff --git a/src/lib/services/conversation-service.js b/src/lib/services/conversation-service.js index f0b41143..5374fe64 100644 --- a/src/lib/services/conversation-service.js +++ b/src/lib/services/conversation-service.js @@ -105,6 +105,47 @@ export async function sendMessageToHub(agentId, conversationId, text, data = nul return response.data; } +/** + * pin a conversation to dashboard + * @param {string} agentId - The agent id + * @param {string} conversationId - The conversation id + */ +export async function pinConversationToDashboard(agentId, conversationId) { + let url = replaceUrl(endpoints.pinConversationUrl, { + agentId: agentId, + conversationId: conversationId + }); + const response = await axios.put(url); + return response.data; +} + +/** + * unpin a conversation from dashboard + * @param {string} agentId - The agent id + * @param {string} conversationId - The conversation id + */ +export async function unpinConversationFromDashboard(agentId, conversationId) { + let url = replaceUrl(endpoints.pinConversationUrl, { + agentId: agentId, + conversationId: conversationId + }); + const response = await axios.delete(url); + return response.data; +} + +/** + * update a dashboard conversation instuction + * @param {string} userId - The conversation id + * @param {import('$userTypes').DashboardConversation} dashConv - The instruction + */ +export async function updateDashboardConversation(userId, dashConv) { + let url = replaceUrl(endpoints.dashConversationInstructionUrl, { + userId: userId + }); + const response = await axios.post(url, dashConv); + return response.data; +} + /** * send a notification to conversation diff --git a/src/lib/services/dashboard-service.js b/src/lib/services/dashboard-service.js new file mode 100644 index 00000000..76563acd --- /dev/null +++ b/src/lib/services/dashboard-service.js @@ -0,0 +1,19 @@ +import { endpoints } from '$lib/services/api-endpoints.js'; +import axios from 'axios'; + +/** + * Get dashboard settings + * @param {string} userId - The user id + * @returns {Promise} + */ +export async function getDashboardSettings(userId) { + let userIdParam = userId; + let url = endpoints.dashboardSettingUrl; + console.log(url); + const response = await axios.get(url, { + params: { + "userId" : userId + } + }); + return response.data; +} \ No newline at end of file diff --git a/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte b/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte index fec3ff64..078a562e 100644 --- a/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte +++ b/src/routes/chat/[agentId]/[conversationId]/chat-box.svelte @@ -34,6 +34,7 @@ getConversationUser, uploadConversationFiles, getAddressOptions, + pinConversationToDashboard, } from '$lib/services/conversation-service.js'; import { PUBLIC_LIVECHAT_ENTRY_ICON, @@ -560,6 +561,12 @@ window.location.href = url.toString(); } + function pinDashboard() { + const agentId = params.agentId; + const convId = params.conversationId; + pinConversationToDashboard(agentId, convId).then().finally(); + } + function handleSaveKnowledge() { sendChatMessage("Save knowledge"); } @@ -1511,7 +1518,10 @@ {/if} {#if agent?.id === LERNER_ID && mode === TRAINING_MODE} handleSaveKnowledge()}>Save Knowledge - {/if} + {/if} + pinDashboard()}> + Pin to Dashboard + {:else} diff --git a/src/routes/page/dashboard/+page.svelte b/src/routes/page/dashboard/+page.svelte index a218d7eb..5cbe22fb 100644 --- a/src/routes/page/dashboard/+page.svelte +++ b/src/routes/page/dashboard/+page.svelte @@ -28,22 +28,44 @@ } from '$env/static/public'; import { onMount } from 'svelte'; import { getUserStore, userStore } from '$lib/helpers/store'; + import Conversation from './Conversation.svelte'; + import { getDashboardSettings } from '$lib/services/dashboard-service'; let subscribemodal = false; - let user = {full_name: ""}; + let user = {full_name: "", id: ""}; + + /** + * @type {import("../../../lib/helpers/types/userTypes").DashboardModel} + */ + let dashboard_model ; const togglesubscribemodal = (() => { subscribemodal = !subscribemodal; }) onMount(() => { - const userModelSubscribe = userStore.subscribe((/** @type {{ full_name: string; }} */ value) => { + const userModelSubscribe = userStore.subscribe((/** @type {{ full_name: string; id: string }} */ value) => { user = value; }) user = getUserStore(); + loadDashboardComponents(user.id); setTimeout(() => { subscribemodal = true; }, 1000); }) + + /** + * delete a message in conversation + * @param {string} userId The user input + */ + async function loadDashboardComponents(userId) { + getDashboardSettings(userId) + .then( + response => { + dashboard_model = response + } + ) + .catch(); + } @@ -207,6 +229,14 @@ + + {#each dashboard_model?.conversation_list || [] as conv, index (conv.conversation_id)} + {#if conv?.conversation_id} + + {/if} + {/each} + + diff --git a/src/routes/page/dashboard/Conversation.svelte b/src/routes/page/dashboard/Conversation.svelte new file mode 100644 index 00000000..d3ebf836 --- /dev/null +++ b/src/routes/page/dashboard/Conversation.svelte @@ -0,0 +1,155 @@ + + + + + + {#if isLoading} + {"Loading..."} +

Loading ...

+ {:else} +
+
+ {conversationModel.title} +
+
+ +
+
+
+
+
+
+
+ {#if agent?.icon_url} +
+ +
+ {/if} +
{conversationModel.agent_id}
+
+
+
+
+ +
+
+
+
+ chatUtilOptions = []} + > + +
+
+
+ +
+
+
+
+ {/if} + +
+
+