@quidgest/chatbot 0.4.0 → 0.5.0

package/dist/components/CBMessage.vue.d.ts

@@ -1,95 +0,0 @@
-import { ChatBotMessageSender } from '../types/message.type';
-import { ResourceStrings } from '../types/texts.type';
-
-export interface CBMessageProps {
-    sender?: ChatBotMessageSender;
-    message?: string;
-    date?: Date;
-    loading?: boolean;
-    /**
-     * Project locale
-     */
-    dateFormat?: string;
-    /**
-     * Image preview URL
-     */
-    imagePreviewUrl?: string;
-    /**
-     * Default chatBot texts
-     */
-    texts?: ResourceStrings;
-    /**
-     * Default api endpoint
-     */
-    apiEndpoint?: String;
-    /**
-     * Session ID
-     */
-    sessionID?: String;
-    /**
-     * User image
-     */
-    userImage: string;
-    /**
-     * Chatbot image
-     */
-    chatbotImage: string;
-    /**
-     * Flag to mark welcome messages
-     */
-    isWelcomeMessage?: boolean;
-}
-declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<CBMessageProps>, {
-    sender: string;
-    userImage: undefined;
-    date: () => Date;
-    texts: () => {
-        commentDialogTitle: string;
-        commentPlaceholder: string;
-        goodResponse: string;
-        badResponse: string;
-        copyResponse: string;
-        submitButton: string;
-        cancelButton: string;
-        senderImage: string;
-        imagePreview: string;
-    };
-}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<CBMessageProps>, {
-    sender: string;
-    userImage: undefined;
-    date: () => Date;
-    texts: () => {
-        commentDialogTitle: string;
-        commentPlaceholder: string;
-        goodResponse: string;
-        badResponse: string;
-        copyResponse: string;
-        submitButton: string;
-        cancelButton: string;
-        senderImage: string;
-        imagePreview: string;
-    };
-}>>> & Readonly<{}>, {
-    sender: ChatBotMessageSender;
-    date: Date;
-    texts: ResourceStrings;
-    userImage: string;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};

package/dist/components/ChatBot.vue.d.ts

@@ -1,65 +0,0 @@
-import { ChatBotProps } from '../types/chatbot.type';
-
-declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ChatBotProps>, {
-    apiEndpoint: string;
-    userImage: string;
-    chatbotImage: string;
-    mode: string;
-    texts: () => {
-        chatbotTitle: string;
-        sendMessage: string;
-        clearChat: string;
-        inputLabel: string;
-        imageUpload: string;
-        imageUploadQButton: string;
-        goodResponse: string;
-        badResponse: string;
-        initialMessage: string;
-        initialAgentMessage: string;
-        loginError: string;
-        botIsSick: string;
-    };
-}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ChatBotProps>, {
-    apiEndpoint: string;
-    userImage: string;
-    chatbotImage: string;
-    mode: string;
-    texts: () => {
-        chatbotTitle: string;
-        sendMessage: string;
-        clearChat: string;
-        inputLabel: string;
-        imageUpload: string;
-        imageUploadQButton: string;
-        goodResponse: string;
-        badResponse: string;
-        initialMessage: string;
-        initialAgentMessage: string;
-        loginError: string;
-        botIsSick: string;
-    };
-}>>> & Readonly<{}>, {
-    texts: import('../types/texts.type').ResourceStrings;
-    apiEndpoint: string;
-    userImage: string;
-    chatbotImage: string;
-    mode: import('../types/chatbot.type').ChatBotMode;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};

package/dist/components/index.d.ts

@@ -1,4 +0,0 @@
-import { default as CBMessage } from './CBMessage.vue';
-import { CBMessageProps } from '../types/message.type';
-
-export { CBMessage, CBMessageProps };

package/dist/types/chatbot.type.d.ts

@@ -1,14 +0,0 @@
-import { ResourceStrings } from './texts.type';
-
-export type ChatBotProps = {
-    apiEndpoint?: string;
-    controllerEndpoint?: string;
-    texts?: ResourceStrings;
-    username: string;
-    projectPath: string;
-    userImage?: string;
-    chatbotImage?: string;
-    dateFormat?: string;
-    mode?: ChatBotMode;
-};
-export type ChatBotMode = 'chat' | 'agent';

package/dist/types/message.type.d.ts

@@ -1,34 +0,0 @@
-export type ChatBotMessage = {
-    id: number;
-    message: string;
-    date: Date;
-    sender: ChatBotMessageSender;
-    sessionID: string;
-    imagePreviewUrl?: string;
-    isWelcomeMessage?: boolean;
-};
-export type ChatBotMessageContent = {
-    content: string;
-    type: string;
-    sessionID: string;
-    imageUrl?: string;
-};
-export type ChatBotMessageSender = 'bot' | 'user';
-export interface CBMessageProps {
-    sender?: ChatBotMessageSender;
-    message?: string;
-    date?: Date;
-    loading?: boolean;
-    /**
-     * Project locale
-     */
-    dateFormat?: string;
-    /**
-     * User image
-     */
-    userImage: string;
-    /**
-     * Chatbot image
-     */
-    chatbotImage: string;
-}

package/dist/types/texts.type.d.ts

@@ -1,3 +0,0 @@
-export type ResourceStrings = {
-    [key: string]: string;
-};

package/src/components/CBMessage.vue

@@ -1,276 +0,0 @@
-<template>
-    <div class="q-chatbot__message-container">
-        <q-icon
-            type="img"
-            :icon="messageImage"
-            :alt="props.texts.senderImage"
-            class="q-chatbot__profile" />
-
-        <div class="q-chatbot__message-wrapper">
-            <div
-                v-if="props.imagePreviewUrl && props.imagePreviewUrl.length > 0"
-                class="q-chatbot__image-preview">
-                <img
-                    :src="props.imagePreviewUrl"
-                    :alt="props.texts.imagePreview" />
-            </div>
-            <!-- Message body -->
-            <div class="q-chatbot__message">
-                <!-- When loading is true, show bouncing dots animation -->
-                <pulse-dots v-if="loading" />
-                <template v-else>
-                    <vue-markdown-render
-                        v-if="props.sender === 'bot'"
-                        class="q-chatbot__text"
-                        :source="props.message || ''" />
-
-                    <div
-                        v-else
-                        class="q-chatbot__text">
-                        {{ props.message }}
-                    </div>
-                </template>
-            </div>
-            <q-dialog
-                id="comment-dialog"
-                v-model="showDialog"
-                :buttons="commentButtons">
-                <template #body.content>
-                    <div class="q-chatbot__dialog-title">
-                        {{ props.texts.commentDialogTitle }}
-                    </div>
-                    <q-text-field
-                        v-model="feedbackComment"
-                        :maxLength="150"
-                        size="large"
-                        :placeholder="props.texts.commentPlaceholder" />
-                </template>
-            </q-dialog>
-
-            <!-- Thumbs up and down buttons, only for bot messages -->
-            <div
-                v-if="isBotMessageAndNotDefault"
-                class="q-chatbot__feedback-buttons">
-                <q-button-group>
-                    <q-button
-                        :title="props.texts.goodResponse"
-                        borderless
-                        :disabled="loading"
-                        @click="openFeedbackDialog(1)">
-                        <q-icon icon="thumb-up" />
-                    </q-button>
-                    <q-button
-                        :title="props.texts.badResponse"
-                        borderless
-                        :disabled="loading"
-                        @click="openFeedbackDialog(0)">
-                        <q-icon icon="thumb-down" />
-                    </q-button>
-                    <q-button
-                        :title="props.texts.copyResponse"
-                        borderless
-                        :disabled="loading"
-                        @click="copyResponse">
-                        <q-icon icon="copy-content" />
-                    </q-button>
-                </q-button-group>
-            </div>
-            <div class="q-chatbot__sender">
-                {{ messageDate }}
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup lang="ts">
-    import { computed, ref } from 'vue'
-    import {
-        QButton,
-        QIcon,
-        QDialog,
-        QTextField
-    } from '@quidgest/ui/components'
-    import PulseDots from '@/components/PulseDots.vue'
-    import type { ChatBotMessageSender } from '@/types/message.type'
-    import { ResourceStrings } from '@/types/texts.type'
-    import VueMarkdownRender from 'vue-markdown-render'
-    import Axios from 'axios'
-
-    export interface CBMessageProps {
-        /*
-         * Sender of the message
-         */
-        sender?: ChatBotMessageSender
-
-        /*
-         * Message to be displayed
-         */
-        message?: string
-
-        /*
-         * Date of when the message was sent
-         */
-        date?: Date
-
-        /*
-         * If the message is loading
-         */
-        loading?: boolean
-
-        /**
-         * Project locale
-         */
-        dateFormat?: string
-
-        /**
-         * Image preview URL
-         */
-        imagePreviewUrl?: string
-
-        /**
-         * Default chatBot texts
-         */
-        texts?: ResourceStrings
-
-        /**
-         * Default api endpoint
-         */
-        apiEndpoint?: String
-
-        /**
-         * Session ID
-         */
-        sessionID?: String
-
-        /**
-         * User image
-         */
-        userImage: string
-
-        /**
-         * Chatbot image
-         */
-        chatbotImage: string
-
-        /**
-         * Flag to mark welcome messages
-         */
-        isWelcomeMessage?: boolean
-    }
-
-    const props = withDefaults(defineProps<CBMessageProps>(), {
-        sender: 'user',
-        userImage: undefined,
-        date: () => new Date(),
-        texts: () => ({
-            commentDialogTitle: 'Would you like to add a comment?',
-            commentPlaceholder: 'Type your comment here (optional)...',
-            goodResponse: 'Good response',
-            badResponse: 'Bad response',
-            copyResponse: 'Copy response',
-            submitButton: 'Submit',
-            cancelButton: 'Cancel',
-            senderImage: 'Sender Image',
-            imagePreview: 'Image preview'
-        })
-    })
-
-    const showDialog = ref(false)
-    const feedbackComment = ref('')
-    const currentFeedback = ref<number | null>(null)
-    const commentButtons = [
-        {
-            id: 'confirm-btn',
-            action: submitFeedback,
-            props: {
-                label: props.texts.submitButton,
-                'variant': 'bold',
-            },
-            icon: {
-                icon: 'submit'
-            }
-        },
-        {
-            id: 'cancel-btn',
-            props: {
-                label: props.texts.cancelButton
-            },
-            icon: {
-                icon: 'cancel'
-            }
-        }
-    ]
-
-    const isBotMessageAndNotDefault = computed(() => {
-        return (
-            props.sender === 'bot' &&
-            !Object.values(props.texts || {}).includes(props.message || '') &&
-            !props.isWelcomeMessage
-        )
-    })
-
-    const getLocaleDate = computed(() => {
-        if (!props.dateFormat) return props.date.toLocaleString()
-
-        return formatDate(props.date, 'HH:mm')
-    })
-
-    const messageDate = computed(() => {
-        return `${getLocaleDate.value}`
-    })
-
-    const messageImage = computed(() =>
-        props.sender === 'bot' ? props.chatbotImage : props.userImage
-    )
-
-    function formatDate(date: Date, format: string) {
-        const day = date.getDate().toString().padStart(2, '0')
-        const month = (date.getMonth() + 1).toString().padStart(2, '0')
-        const year = date.getFullYear().toString().padStart(2, '0')
-        const hours = date.getHours().toString().padStart(2, '0')
-        const minutes = date.getMinutes().toString().padStart(2, '0')
-        const seconds = date.getSeconds().toString().padStart(2, '0')
-
-        return format
-            .replace('dd', day)
-            .replace('MM', month)
-            .replace('yyyy', year)
-            .replace('HH', hours)
-            .replace('mm', minutes)
-            .replace('ss', seconds)
-    }
-
-    function openFeedbackDialog(feedback: number) {
-        showDialog.value = true
-        feedbackComment.value = ''
-        currentFeedback.value = feedback
-    }
-
-    function submitFeedback() {
-        if (currentFeedback.value != null) {
-            handleFeedback(currentFeedback.value, feedbackComment.value)
-        }
-    }
-    function handleFeedback(feedback: number, comment: string) {
-        Axios.post(props.apiEndpoint + '/prompt/feedback', {
-            messageSessionID: props.sessionID,
-            feedbackValue: feedback,
-            feedbackComment: comment
-        }).catch((error) => {
-            console.error('Error sending message feedback: ', error)
-        })
-    }
-
-    function copyResponse() {
-        if (!props.message) return
-
-        navigator.clipboard
-            .writeText(props.message)
-            .then(() => {
-                console.log('Message copied to clipboard')
-            })
-            .catch((error) => {
-                console.error('Failed to copy message to clipboard: ', error)
-            })
-    }
-</script>