refine style

Author: Jicheng Lu

src/lib/common/FileDropZone.svelte

@@ -376,38 +376,41 @@
 
 <svelte:window on:focus={onWindowFocus} on:dragover={onDocumentDragOver} on:drop={onDocumentDrop} />
 
-<div
-    bind:this={rootRef}
-    tabindex="0"
-    role="button"
-    class="{disableDefaultStyles ? '' : 'file-dropzone'} {containerClasses}"
-    style={`${containerStyles}`}
-    on:keydown={composeKeyboardHandler(onKeyDownCb)}
-    on:focus={composeKeyboardHandler(onFocusCb)}
-    on:blur={composeKeyboardHandler(onBlurCb)}
-    on:click={composeHandler(onClickCb)}
-    on:dragenter={composeDragHandler(onDragEnterCb)}
-    on:dragover={composeDragHandler(onDragOverCb)}
-    on:dragleave={composeDragHandler(onDragLeaveCb)}
-    on:drop={composeDragHandler(onDropCb)}
->
-    <input
-        {accept}
-        {multiple}
-        {required}
-        type="file"
-        {name}
-        autocomplete="off"
-        tabindex="-1"
-        on:change={onDropCb}
-        on:click={onInputElementClick}
-        bind:this={inputElement}
-        style="display: none;"
-    />
-    <slot>
-        <p class={`file-drop-text ${isError ? 'text-danger' : isSuccess ? 'text-success' : ''}`}>{innerDropText}</p>
-    </slot>
+<div style="display: block;">
+    <div
+        bind:this={rootRef}
+        tabindex="0"
+        role="button"
+        class="{disableDefaultStyles ? '' : 'file-dropzone'} {containerClasses}"
+        style={`${containerStyles}`}
+        on:keydown={composeKeyboardHandler(onKeyDownCb)}
+        on:focus={composeKeyboardHandler(onFocusCb)}
+        on:blur={composeKeyboardHandler(onBlurCb)}
+        on:click={composeHandler(onClickCb)}
+        on:dragenter={composeDragHandler(onDragEnterCb)}
+        on:dragover={composeDragHandler(onDragOverCb)}
+        on:dragleave={composeDragHandler(onDragLeaveCb)}
+        on:drop={composeDragHandler(onDropCb)}
+    >
+        <input
+            {accept}
+            {multiple}
+            {required}
+            type="file"
+            {name}
+            autocomplete="off"
+            tabindex="-1"
+            on:change={onDropCb}
+            on:click={onInputElementClick}
+            bind:this={inputElement}
+            style="display: none;"
+        />
+        <slot>
+            <p class={`file-drop-text ${isError ? 'text-danger' : isSuccess ? 'text-success' : ''}`}>{innerDropText}</p>
+        </slot>
+    </div>
 </div>
+
   
 <style>
     .file-dropzone {

src/lib/common/FileGallery.svelte

@@ -31,7 +31,6 @@
         e.stopPropagation();
         onDelete && onDelete(idx);
     }
-
 </script>
 
 {#if files?.length > 0}

src/lib/scss/custom/components/_gallery.scss

@@ -16,13 +16,14 @@
                 color: white;
                 cursor: pointer;
                 z-index: 1000;
-                right: 0;
+                right: 3px;
                 font-size: 1.5em;
             }
 
             .gallery-item-image {
                 width: 100%;
                 height: 100%;
+                border-radius: 10px;
             }
         }
     }

src/lib/scss/custom/pages/_chat.scss

@@ -165,8 +165,9 @@
         }
 
         .msg-container {
-            max-width: 80%;
-            flex: 0 0 fit-content;
+            display: flex;
+            flex-direction: column;
+            width: 80%;
 
             .button-group-container {
                 display: flex;
@@ -247,6 +248,7 @@
 
         .image-wrap {
             margin-top: 2px;
+            width: fit-content;
 
             img {
                 max-width: 25vw;

src/routes/chat/[agentId]/[conversationId]/chat-box.svelte

@@ -24,7 +24,7 @@
 	import ChatTextArea from '$lib/common/ChatTextArea.svelte';
 	import { utcToLocal } from '$lib/helpers/datetime';
 	import { replaceNewLine } from '$lib/helpers/http';
-	import { SenderAction, UserRole } from '$lib/helpers/enums';
+	import { EditorType, SenderAction, UserRole } from '$lib/helpers/enums';
 	import RichContent from './richContent/rich-content.svelte';
 	import ContentLog from './contentLogs/content-log.svelte';
 	import _ from "lodash";
@@ -904,7 +904,7 @@
 												onConfirm={confirmSelectedOption}
 											/>
 											<ChatAttachment
-												displayComponents={message.message_id === lastBotMsg?.message_id}
+												displayComponents={message.message_id === lastBotMsg?.message_id && lastBotMsg?.rich_content?.editor === EditorType.File}
 												disabled={isSendingMsg || isThinking}
 												bind:files={conversationFiles}
 											/>