@meistrari/chat-nuxt 4.5.0-rc.4 → 4.5.0-rc.6

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@meistrari/chat-nuxt",
   "configKey": "chatNuxt",
-  "version": "4.5.0-rc.4",
+  "version": "4.5.0-rc.6",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -186,7 +186,7 @@ const _chatNuxtRequire = createRequire(import.meta.url);
 const _chatNuxtPackageVersion = _chatNuxtRequire("../package.json").version;
 const VUE_COMPONENT_EXTENSIONS = [".vue"];
 const FEATURE_DIRS = ["citations", "conversations", "embed", "files", "messages", "rendering", "shared", "usage", "workspace"];
-const FULL_NAME_COMPONENT_DIRS = ["citations", "conversations", "embed", "files", "messages", "usage"];
+const FULL_NAME_COMPONENT_DIRS = ["citations", "conversations", "embed", "files", "messages"];
 const PATH_PREFIX_COMPONENT_DIRS = ["rendering", "shared"];
 const DYNAMIC_ICON_SAFELIST = [
   "i-ph-folder-minus",
@@ -197,7 +197,14 @@ const DYNAMIC_ICON_SAFELIST = [
   "i-ph-folder-notch",
   "i-ph-folder-notch-open",
   // Neutral pill icon for host-defined user mentions (user-mentions.ts).
-  "i-ph-paperclip"
+  "i-ph-paperclip",
+  // Sidebar conversation actions menu (conversation-item.ts).
+  "i-ph-pencil-simple-bold",
+  "i-ph-copy-bold",
+  "i-ph-download-simple-bold",
+  "i-ph-link-bold",
+  "i-ph-bug",
+  "i-ph-trash-bold"
 ];
 function resolveChatAuthMode(runtimeConfig) {
   const publicConfig = runtimeConfig.public;

package/dist/runtime/conversations/components/chat-conversation-debug-modal.d.vue.ts

@@ -0,0 +1,17 @@
+type DebugConversation = {
+    id: string;
+    threadSessionId: string | null;
+    telaAgentId: string | null;
+    createdAt: string | Date;
+};
+type __VLS_Props = {
+    open: boolean;
+    conversation: DebugConversation | null;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/conversations/components/chat-conversation-debug-modal.vue

@@ -0,0 +1,109 @@
+<script setup>
+import { useStatusToast } from "../../shared/composables/status-toast";
+const props = defineProps({
+  open: { type: Boolean, required: true },
+  conversation: { type: [Object, null], required: true }
+});
+const emit = defineEmits(["close"]);
+const statusToast = useStatusToast();
+const sessionId = computed(() => props.conversation?.threadSessionId ?? "Sess\xE3o ainda n\xE3o criada");
+async function copyDebugInfo() {
+  const conversation = props.conversation;
+  const conversationId = conversation?.id ?? null;
+  const sessionId2 = conversation?.threadSessionId ?? null;
+  const telaAgentId = conversation?.telaAgentId ?? null;
+  const createdAt = conversation?.createdAt ? new Date(conversation.createdAt) : null;
+  const datadogTimeRange = createdAt ? `&from_ts=${createdAt.getTime()}&to_ts=${Date.now()}&live=false` : "";
+  const datadogLogsUrl = (facet, value) => `https://us5.datadoghq.com/logs?query=${encodeURIComponent(`@${facet}:${value}`)}${datadogTimeRange}`;
+  const environment = useRuntimeConfig().public.environment;
+  const telaAppUrl = environment === "production" ? "https://app.tela.com" : "https://app.telastaging.com";
+  const debugInfo = {
+    conversationId,
+    sessionId: sessionId2,
+    telaAgentId,
+    createdAt: createdAt?.toISOString() ?? null,
+    seeConversationInDatadog: conversationId ? datadogLogsUrl("conversationId", conversationId) : null,
+    seeSessionInDatadog: sessionId2 ? datadogLogsUrl("sessionId", sessionId2) : null,
+    linkToTelaAgent: telaAgentId ? `${telaAppUrl}/agent/${telaAgentId}` : null
+  };
+  try {
+    await navigator.clipboard.writeText(JSON.stringify(debugInfo, null, 2));
+    statusToast.update({ text: "Dados de debug copiados", icon: "i-ph-check" });
+  } catch {
+    statusToast.update({
+      text: "Erro ao copiar dados de debug",
+      icon: "i-ph-warning"
+    });
+  }
+}
+</script>
+
+<template>
+    <TelaModal
+        :model-value="open"
+        title="Debug"
+        hide-dividers
+        compact
+        class="w-520px!"
+        @close="emit('close')"
+    >
+        <div flex="~ col" w-full my-24px gap-24px>
+            <div flex="~ col" gap-4px w-full>
+                <p text-14px font-580 text-gray-700 leading-18px>
+                    Conversation Id
+                </p>
+                <div
+                    px-12px
+                    py-10px
+                    rounded-8px
+                    bg-gray-50
+                    justify-between
+                    flex
+                    items-center
+                    border="0.5px gray-200"
+                >
+                    <p text-13px text-gray-700 break-all leading-18px>
+                        {{ conversation?.id ?? "Conversa ainda n\xE3o criada" }}
+                    </p>
+                    <TelaCopyButton :content="conversation?.id ?? ''" />
+                </div>
+            </div>
+            <div flex="~ col" gap-4px w-full>
+                <p text-14px font-580 text-gray-700 leading-18px>
+                    Session Id
+                </p>
+                <div
+                    px-12px
+                    py-10px
+                    rounded-8px
+                    bg-gray-50
+                    justify-between
+                    flex
+                    items-center
+                    border="0.5px gray-200"
+                >
+                    <p text-13px text-gray-700 break-all leading-18px>
+                        {{ sessionId }}
+                    </p>
+                    <TelaCopyButton :content="sessionId" />
+                </div>
+            </div>
+        </div>
+        <template #footer>
+            <div flex justify-between items-center gap-12px w-full>
+                <p text-12px font-400 leading-16px text-tertiary>
+                    Inclui os ids da conversa e os links de debug no Datadog e no Tela
+                </p>
+                <TelaButton
+                    variant="primary"
+                    icon="i-ph-copy"
+                    leading
+                    flex-shrink-0
+                    @click="copyDebugInfo"
+                >
+                    Copiar dados completos
+                </TelaButton>
+            </div>
+        </template>
+    </TelaModal>
+</template>

package/dist/runtime/conversations/components/chat-conversation-debug-modal.vue.d.ts

@@ -0,0 +1,17 @@
+type DebugConversation = {
+    id: string;
+    threadSessionId: string | null;
+    telaAgentId: string | null;
+    createdAt: string | Date;
+};
+type __VLS_Props = {
+    open: boolean;
+    conversation: DebugConversation | null;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    close: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/conversations/components/chat-conversation-item.d.vue.ts

@@ -7,6 +7,8 @@ type __VLS_Props = {
     itemClass?: HTMLAttributes['class'];
     userImage?: string;
     selectConversation?: (id: string) => void | Promise<void>;
+    copyLink?: (id: string) => void | Promise<void>;
+    debug?: (id: string) => void;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     delete: (id: string) => any;

package/dist/runtime/conversations/components/chat-conversation-item.vue

@@ -6,7 +6,9 @@ const props = defineProps({
   draggable: { type: Boolean, required: false },
   itemClass: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
   userImage: { type: String, required: false },
-  selectConversation: { type: Function, required: false }
+  selectConversation: { type: Function, required: false },
+  copyLink: { type: Function, required: false },
+  debug: { type: Function, required: false }
 });
 const emit = defineEmits(["delete", "rename", "duplicate", "export", "dragStart", "dragEnd"]);
 const {
@@ -36,8 +38,8 @@ function setRenameInputRef(element) {
     <a
         :href="conversationPath"
         :draggable="draggable && !isRenamingInline"
-        block
-        pl-12px pr-4px
+        block relative
+        pl-12px pr-16px
         h-30px
         rounded-8px
         class="group data-[active=true]:bg-muted data-[active=false]:hover:bg-subtle"
@@ -82,7 +84,10 @@ function setRenameInputRef(element) {
             </div>
 
             <template v-else>
-                <div flex-1 min-w-0 flex items-center>
+                <div
+                    flex-1 min-w-0 flex items-center
+                    class="group-hover:pr-14px group-focus-within:pr-14px group-has-[[data-state=open]]:pr-14px"
+                >
                     <span
                         body-14-medium
                         text-taupe-700
@@ -93,8 +98,7 @@ function setRenameInputRef(element) {
                 </div>
 
                 <div
-                    flex
-                    items-center
+                    flex items-center absolute right-3px top-3px
                     class="opacity-0 group-hover:opacity-100 focus-within:opacity-100 [&:has([data-state=open])]:opacity-100"
                 >
                     <TelaDropdownMenu :items="menuItems" content-class="chat-sidebar-floating">

package/dist/runtime/conversations/components/chat-conversation-item.vue.d.ts

@@ -7,6 +7,8 @@ type __VLS_Props = {
     itemClass?: HTMLAttributes['class'];
     userImage?: string;
     selectConversation?: (id: string) => void | Promise<void>;
+    copyLink?: (id: string) => void | Promise<void>;
+    debug?: (id: string) => void;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     delete: (id: string) => any;

package/dist/runtime/conversations/components/chat-conversation-list.d.vue.ts

@@ -7,6 +7,7 @@ type __VLS_Props = {
     selectConversation?: (id: string) => void | Promise<void>;
     resetConversation?: () => void | Promise<void>;
     startConversation?: (groupId?: string | null) => void | Promise<void>;
+    showDebugOption?: boolean;
     loading?: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/conversations/components/chat-conversation-list.vue

@@ -8,6 +8,7 @@ const props = defineProps({
   selectConversation: { type: Function, required: false },
   resetConversation: { type: Function, required: false },
   startConversation: { type: Function, required: false },
+  showDebugOption: { type: Boolean, required: false },
   loading: { type: Boolean, required: false }
 });
 const {
@@ -46,6 +47,8 @@ const {
   handleDragOver,
   handleDragLeave,
   getConversationItemProps,
+  debugConversationId,
+  debugConversation,
   handleConversationDrop,
   startConversationInGroup,
   startUngroupedConversation,
@@ -493,4 +496,11 @@ function dropTargetClass(row) {
     >
         {{ deleteGroupConversationsConfirmationMessage }}
     </TelaConfirmationModal>
+
+    <ChatConversationDebugModal
+        :open="!!debugConversation"
+        :conversation="debugConversation"
+        class="chat-sidebar-floating"
+        @close="debugConversationId = null"
+    />
 </template>

package/dist/runtime/conversations/components/chat-conversation-list.vue.d.ts

@@ -7,6 +7,7 @@ type __VLS_Props = {
     selectConversation?: (id: string) => void | Promise<void>;
     resetConversation?: () => void | Promise<void>;
     startConversation?: (groupId?: string | null) => void | Promise<void>;
+    showDebugOption?: boolean;
     loading?: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/conversations/composables/conversation-actions.d.ts

@@ -0,0 +1,3 @@
+export declare function useConversationActions(): {
+    copyConversationLink: (conversationId: string) => Promise<void>;
+};

package/dist/runtime/conversations/composables/conversation-actions.js

@@ -0,0 +1,16 @@
+import { buildConversationShareUrl } from "../../embed/conversation-share-url.js";
+import { useStatusToast } from "../../shared/composables/status-toast.js";
+export function useConversationActions() {
+  const statusToast = useStatusToast();
+  async function copyConversationLink(conversationId) {
+    try {
+      await navigator.clipboard.writeText(buildConversationShareUrl(window.location.href, conversationId));
+      statusToast.update({ text: "Link copiado", icon: "i-ph-check" });
+    } catch {
+      statusToast.update({ text: "Erro ao copiar link", icon: "i-ph-warning" });
+    }
+  }
+  return {
+    copyConversationLink
+  };
+}

package/dist/runtime/conversations/composables/conversation-item.d.ts

@@ -6,6 +6,8 @@ export type ConversationItemOptions = {
     draggable?: boolean;
     userImage?: string;
     selectConversation?: (id: string) => void | Promise<void>;
+    copyLink?: (id: string) => void | Promise<void>;
+    debug?: (id: string) => void;
 };
 export type ConversationItemEmit = {
     (e: 'delete', id: string): void;
@@ -22,17 +24,7 @@ export declare function useConversationItem(options: ConversationItemOptions, em
     showDeleteModal: any;
     conversationPath: any;
     displayTitle: any;
-    menuItems: ({
-        label: string;
-        icon: string;
-        click: () => void;
-        color?: undefined;
-    } | {
-        label: string;
-        icon: string;
-        color: "negative";
-        click: () => boolean;
-    })[];
+    menuItems: any;
     confirmDelete: () => void;
     cancelDelete: () => void;
     handleConversationClick: (event: MouseEvent) => void;

package/dist/runtime/conversations/composables/conversation-item.js

@@ -117,29 +117,47 @@ export function useConversationItem(options, emit) {
       return;
     submitRename();
   }
-  const menuItems = [
-    {
-      label: "Renomear",
-      icon: "i-ph-pencil-simple-bold",
-      click: () => startRename()
-    },
-    {
-      label: "Duplicar",
-      icon: "i-ph-copy-bold",
-      click: () => emit("duplicate", options.conversation.id)
-    },
-    {
-      label: "Exportar",
-      icon: "i-ph-download-simple-bold",
-      click: () => emit("export", options.conversation.id)
-    },
-    {
+  const menuItems = computed(() => {
+    const items = [
+      {
+        label: "Renomear",
+        icon: "i-ph-pencil-simple-bold",
+        click: () => startRename()
+      },
+      {
+        label: "Duplicar",
+        icon: "i-ph-copy-bold",
+        click: () => emit("duplicate", options.conversation.id)
+      },
+      {
+        label: "Exportar",
+        icon: "i-ph-download-simple-bold",
+        click: () => emit("export", options.conversation.id)
+      }
+    ];
+    const { copyLink, debug } = options;
+    if (copyLink) {
+      items.push({
+        label: "Copiar link",
+        icon: "i-ph-link-bold",
+        click: () => void copyLink(options.conversation.id)
+      });
+    }
+    if (debug) {
+      items.push({
+        label: "Debug",
+        icon: "i-ph-bug",
+        click: () => debug(options.conversation.id)
+      });
+    }
+    items.push({
       label: "Excluir",
       icon: "i-ph-trash-bold",
       color: "negative",
       click: () => showDeleteModal.value = true
-    }
-  ];
+    });
+    return items;
+  });
   onBeforeUnmount(() => {
     clearRenameBlurTimer();
     if (typeof window !== "undefined")

package/dist/runtime/conversations/composables/conversation-list.d.ts

@@ -7,6 +7,7 @@ export type ConversationListOptions = {
     selectConversation?: (id: string) => void | Promise<void>;
     resetConversation?: () => void | Promise<void>;
     startConversation?: (groupId?: string | null) => void | Promise<void>;
+    showDebugOption?: boolean;
     loading?: boolean;
 };
 export type GroupDeleteTarget = {
@@ -120,7 +121,11 @@ export declare function useConversationList(options: ConversationListOptions): {
         draggable: boolean;
         userImage: string | undefined;
         selectConversation: ((id: string) => void | Promise<void>) | undefined;
+        copyLink: (conversationId: string) => Promise<void>;
+        debug: (() => void) | undefined;
     };
+    debugConversationId: any;
+    debugConversation: any;
     handleConversationDrop: (event: DragEvent, groupId: string | null) => Promise<void>;
     startConversationInGroup: (groupId: string) => void;
     startUngroupedConversation: () => void;

package/dist/runtime/conversations/composables/conversation-list.js

@@ -8,6 +8,7 @@ import { useChat } from "../../messages/composables/chat.js";
 import { useChatApi } from "../../shared/composables/chat-api.js";
 import { useConversationGroups } from "./conversation-groups.js";
 import { useConversations } from "./conversations.js";
+import { useConversationActions } from "./conversation-actions.js";
 import { useEmbedConfig } from "../../embed/composables/embed-config.js";
 const DRAG_OPEN_GROUP_DELAY_MS = 400;
 export function useConversationList(options) {
@@ -15,8 +16,18 @@ export function useConversationList(options) {
   const embedConfig = useEmbedConfig();
   const { activeOrganization } = useChatAuth();
   const { deleteConversation, renameConversation, duplicateConversation, moveConversationToGroup } = useConversations();
+  const { copyConversationLink } = useConversationActions();
   const { groups, fetchGroups, createGroup, deleteGroup, renameGroup, error: groupError, pendingRenameGroupId } = useConversationGroups();
-  const { setConversation } = useChat();
+  const { setConversation, currentConversation } = useChat();
+  const debugConversationId = ref(null);
+  const debugConversation = computed(() => {
+    const id = debugConversationId.value;
+    if (!id)
+      return null;
+    if (currentConversation.value?.id === id)
+      return currentConversation.value;
+    return options.conversations.find((conversation) => conversation.id === id) ?? null;
+  });
   const route = useRoute();
   const router = useRouter();
   const conversationSearch = ref("");
@@ -74,8 +85,8 @@ export function useConversationList(options) {
     () => hasConversationSearchQuery.value ? "Nenhuma conversa encontrada" : "Nenhuma conversa ainda"
   );
   const activeGroupId = computed(() => {
-    const currentConversation = options.conversations.find((conversation) => conversation.id === options.currentId);
-    return currentConversation?.groupId ?? null;
+    const currentConversation2 = options.conversations.find((conversation) => conversation.id === options.currentId);
+    return currentConversation2?.groupId ?? null;
   });
   onMounted(() => {
     void Promise.resolve(fetchGroups()).finally(() => {
@@ -486,7 +497,11 @@ export function useConversationList(options) {
       active: conversation.id === options.currentId,
       draggable: true,
       userImage: options.getMemberImage?.(conversation.userId),
-      selectConversation: options.selectConversation
+      selectConversation: options.selectConversation,
+      copyLink: copyConversationLink,
+      debug: options.showDebugOption ? () => {
+        debugConversationId.value = conversation.id;
+      } : void 0
     };
   }
   async function handleConversationDrop(event, groupId) {
@@ -588,6 +603,8 @@ export function useConversationList(options) {
     handleDragLeave,
     isDropTarget,
     getConversationItemProps,
+    debugConversationId,
+    debugConversation,
     handleConversationDrop,
     startConversationInGroup,
     startUngroupedConversation,

package/dist/runtime/{usage/components/chat-usage-view.d.vue.ts → embed/components/chat-details-panel.d.vue.ts}

@@ -1,7 +1,11 @@
+import type { ConversationFile } from '../../types/schemas/chat/files.js';
 type __VLS_Props = {
     conversationId: string;
+    files: ConversationFile[];
+    filesLoading: boolean;
     createdAt?: string | Date;
     updatedAt?: string | Date;
+    showUsage?: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;