Merge pull request #298 from n4ze3m/next

v1.11.1
n4ze3m · Sep 19, 2024 · 9def27a · 9def27a
2 parents 1274ad6 + c24f6b7
commit 9def27a
Show file tree

Hide file tree

Showing 14 changed files with 188 additions and 107 deletions.
diff --git a/app/ui/package.json b/app/ui/package.json
@@ -1,7 +1,7 @@
 {
   "name": "app",
   "private": true,
-  "version": "1.11.0",
+  "version": "1.11.1",
   "type": "module",
   "scripts": {
     "dev": "vite",

diff --git a/app/ui/src/App.tsx b/app/ui/src/App.tsx
@@ -54,7 +54,7 @@ const router = createHashRouter([
   {
     path: "/bot/:id",
     element: (
-      <BotLayout>
+      <BotLayout asideSpace="">
         <BotPreviewRoot />
       </BotLayout>
     ),
@@ -70,7 +70,7 @@ const router = createHashRouter([
   {
     path: "/bot/:id/playground/:history_id",
     element: (
-      <BotLayout>
+      <BotLayout asideSpace="">
         <BotPreviewRoot />
       </BotLayout>
     ),

diff --git a/app/ui/src/Layout/BotLayout.tsx b/app/ui/src/Layout/BotLayout.tsx
@@ -62,9 +62,11 @@ function classNames(...classes) {
 
 export default function BotLayout({
   children,
+  asideSpace = "md:ml-16",
 }: {
   children: React.ReactNode;
   noPadding?: boolean;
+  asideSpace?: string;
 }) {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const params = useParams<{ id: string }>();
@@ -190,7 +192,7 @@ export default function BotLayout({
         </Transition.Root>
 
         <div className="flex flex-col">
-          <div className="sticky top-0 z-[999] flex h-14  bg-white border-b border-gray-200 dark:bg-[#171717] dark:border-gray-600">
+          <header className="sticky top-0 z-[999] flex h-14 bg-white border-b border-gray-200 dark:bg-[#171717] dark:border-gray-600">
             <button
               type="button"
               className="border-r border-gray-200 px-4 text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 md:hidden dark:border-gray-600 dark:text-gray-200"
@@ -210,55 +212,53 @@ export default function BotLayout({
                 {`v${__APP_VERSION__}`}
               </span>
             </Link>
-
             <div className="flex flex-1 justify-end px-4">
               <div className="ml-4 flex items-center md:ml-6">
                 <ApplicationMenu />
               </div>
             </div>
-          </div>
-          <main className="flex-1">
-            {children}
-            {/* <div className="py-4">
-                  <div className="h-96 rounded-lg border-4 border-dashed border-gray-200" />
-                </div> */}
-          </main>
-        </div>
-
-        <div className="hidden md:fixed md:inset-y-0 md:flex md:flex-col ">
-          <div className="flex flex-grow flex-col overflow-y-auto border-r border-gray-200 bg-white pt-5 dark:bg-[#171717] dark:border-gray-600">
-            <div className="mt-14 flex flex-grow flex-col">
-              <nav className="flex-1 space-y-1 px-2 pb-4">
-                {navigation.map((item) => (
-                  <Tooltip placement="right" key={item.name} title={item.name}>
-                    <Link
-                      to={{
-                        pathname: item.href.replace(":id", params.id!),
-                      }}
-                      className={classNames(
-                        location.pathname ===
-                          item.href.replace(":id", params.id!)
-                          ? "bg-gray-100 text-gray-900 dark:bg-[#262626] dark:text-white"
-                          : "text-gray-600 hover:bg-gray-50 hover:text-gray-900 dark:text-gray-200 dark:hover:text-white dark:hover:bg-[#262626]",
-                        "group  flex items-center px-2 py-2 text-sm font-medium rounded-md"
-                      )}
-                    >
-                      <item.icon
-                        className={classNames(
-                          location.pathname ===
-                            item.href.replace(":id", params.id!)
-                            ? "text-gray-500 dark:text-white"
-                            : "text-gray-400 group-hover:text-gray-500 dark:text-gray-400 dark:group-hover:text-white",
-                          "flex-shrink-0 h-6 w-6"
-                        )}
-                        aria-hidden="true"
-                      />
-                      {/* {item.name} */}
-                    </Link>
-                  </Tooltip>
-                ))}
-              </nav>
-            </div>
+          </header>
+          <div className="flex flex-1">
+            <aside className="hidden md:flex md:flex-col md:w-16 md:fixed md:inset-y-0">
+              <div className="flex flex-grow flex-col overflow-y-auto border-r border-gray-200 bg-white pt-5 dark:bg-[#171717] dark:border-gray-600">
+                <div className="mt-14 flex flex-grow flex-col">
+                  <nav className="flex-1 space-y-1 px-2 pb-4">
+                    {navigation.map((item) => (
+                      <Tooltip
+                        placement="right"
+                        key={item.name}
+                        title={item.name}
+                      >
+                        <Link
+                          to={{
+                            pathname: item.href.replace(":id", params.id!),
+                          }}
+                          className={classNames(
+                            location.pathname ===
+                              item.href.replace(":id", params.id!)
+                              ? "bg-gray-100 text-gray-900 dark:bg-[#262626] dark:text-white"
+                              : "text-gray-600 hover:bg-gray-50 hover:text-gray-900 dark:text-gray-200 dark:hover:text-white dark:hover:bg-[#262626]",
+                            "group flex items-center justify-center px-2 py-2 text-sm font-medium rounded-md"
+                          )}
+                        >
+                          <item.icon
+                            className={classNames(
+                              location.pathname ===
+                                item.href.replace(":id", params.id!)
+                                ? "text-gray-500 dark:text-white"
+                                : "text-gray-400 group-hover:text-gray-500 dark:text-gray-400 dark:group-hover:text-white",
+                              "flex-shrink-0 h-6 w-6"
+                            )}
+                            aria-hidden="true"
+                          />
+                        </Link>
+                      </Tooltip>
+                    ))}
+                  </nav>
+                </div>
+              </div>
+            </aside>
+            <main className={`flex-1 ${asideSpace}`}>{children}</main>
           </div>
         </div>
       </div>

diff --git a/app/ui/src/components/Bot/Integration/IntegrationForm.tsx b/app/ui/src/components/Bot/Integration/IntegrationForm.tsx
@@ -8,6 +8,7 @@ import axios from "axios";
 import { ClipboardIcon } from "@heroicons/react/24/outline";
 // import Switch from antd as AntdSwitch
 import { Switch as AntdSwitch } from "antd";
+import { clipbardCopy } from "../../../utils/clipboard";
 
 //@ts-ignore
 function classNames(...classes) {
@@ -163,8 +164,8 @@ export const IntegrationForm: React.FC<Props> = ({ onClose, data }) => {
                   <div className="flex-shrink-0 ml-3">
                     <button
                       type="button"
-                      onClick={() => {
-                        navigator.clipboard.writeText(
+                      onClick={async () => {
+                        await clipbardCopy(
                           `${hostUrl}/api/v1/bot/integration/${params.id}/whatsapp`
                         );
                         notification.success({

diff --git a/app/ui/src/components/Bot/Playground/Message.tsx b/app/ui/src/components/Bot/Playground/Message.tsx
@@ -11,6 +11,7 @@ import { removeUUID } from "../../../utils/filename";
 import { useSpeechSynthesis } from "../../../hooks/useSpeechSynthesis";
 import { useElevenLabsTTS } from "../../../hooks/useElevenLabsTTS";
 import { Collapse } from "antd";
+import { clipbardCopy } from "../../../utils/clipboard";
 
 type Props = Message & {
   onSourceClick(source: any): void;
@@ -98,8 +99,8 @@ export const PlaygroundMessage = (props: Props) => {
             <div className="flex space-x-2">
               {!props.hideCopy && (
                 <button
-                  onClick={() => {
-                    navigator.clipboard.writeText(props.message);
+                  onClick={async () => {
+                    await clipbardCopy(props.message);
                     setIsBtnPressed(true);
                     setTimeout(() => {
                       setIsBtnPressed(false);

diff --git a/app/ui/src/components/Common/CopyBtn.tsx b/app/ui/src/components/Common/CopyBtn.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from "react";
 import { ClipboardIcon, CheckIcon } from "@heroicons/react/24/outline";
 import { clcx } from "../../utils/classname";
+import { clipbardCopy } from "../../utils/clipboard";
 
 type Props = {
   value: string;
@@ -19,7 +20,7 @@ export const CopyBtn: React.FC<Props> = ({
 
   const handleCopy = async () => {
     try {
-      await navigator.clipboard.writeText(value);
+      await clipbardCopy(value);
       setCopied(true);
       setTimeout(() => setCopied(false), 2000);
     } catch (err) {

diff --git a/app/ui/src/components/Common/Markdown.tsx b/app/ui/src/components/Common/Markdown.tsx
@@ -10,6 +10,7 @@ import React from "react";
 import { Modal, Tooltip } from "antd";
 import Mermaid from "./Mermaid";
 import { useMessage } from "../../hooks/useMessage";
+import { clipbardCopy } from "../../utils/clipboard";
 
 export default function Markdown({ message }: { message: string }) {
   const [isBtnPressed, setIsBtnPressed] = React.useState(false);
@@ -64,8 +65,8 @@ export default function Markdown({ message }: { message: string }) {
                     )}
                     <Tooltip title="Copy to clipboard">
                       <button
-                        onClick={() => {
-                          navigator.clipboard.writeText(children[0] as string);
+                        onClick={async () => {
+                          await clipbardCopy(children[0] as string);
                           setIsBtnPressed(true);
                         }}
                         className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-200 hover:bg-gray-700 hover:text-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 focus:ring-offset-gray-100"

diff --git a/app/ui/src/components/Common/Mermaid.tsx b/app/ui/src/components/Common/Mermaid.tsx
@@ -11,6 +11,7 @@ import {
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import { nightOwl } from "react-syntax-highlighter/dist/cjs/styles/prism";
 import { useMessage } from "../../hooks/useMessage";
+import { clipbardCopy } from "../../utils/clipboard";
 mermaid.initialize({
   startOnLoad: true,
   flowchart: {
@@ -112,8 +113,8 @@ const Mermaid = React.memo((props: { code: string }) => {
 
           <Tooltip title="Copy to clipboard">
             <button
-              onClick={() => {
-                navigator.clipboard.writeText(props.code);
+              onClick={async () => {
+                await clipbardCopy(props.code);
                 setIsBtnCopied(true);
 
                 setTimeout(() => {

diff --git a/app/ui/src/utils/clipboard.ts b/app/ui/src/utils/clipboard.ts
@@ -0,0 +1,12 @@
+export const clipbardCopy = async (value: string) => {
+    if (navigator.clipboard) {
+        await navigator.clipboard.writeText(value);
+    } else {
+        const textArea = document.createElement("textarea");
+        textArea.value = value;
+        document.body.appendChild(textArea);
+        textArea.select();
+        document.execCommand("copy");
+        document.body.removeChild(textArea);
+    }
+}
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "dialoqbase",
-  "version": "1.11.0",
+  "version": "1.11.1",
   "description": "Create chatbots with ease",
   "scripts": {
     "ui:dev": "pnpm run --filter ui dev",

diff --git a/server/src/handlers/api/v1/bot/bot/api.handler.ts b/server/src/handlers/api/v1/bot/bot/api.handler.ts
@@ -29,6 +29,7 @@ export const createBotAPIHandler = async (
     question_generator_prompt,
     system_prompt,
     temperature,
+    options
   } = request.body;
 
   const prisma = request.server.prisma;
@@ -112,6 +113,7 @@ export const createBotAPIHandler = async (
 
   const bot = await prisma.bot.create({
     data: {
+      ...options,
       name,
       embedding: embeddingInfo.model_id,
       model: modelInfo.model_id,

diff --git a/server/src/handlers/api/v1/bot/bot/types.ts b/server/src/handlers/api/v1/bot/bot/types.ts
@@ -96,6 +96,16 @@ export interface CreateBotAPIRequest {
     system_prompt?: string;
     question_generator_prompt?: string;
     temperature?: number;
+    options?: {
+      noOfDocumentsToRetrieve?: number,
+      noOfChatHistoryInContext?: number,
+      publicBotPwdProtected? : boolean,
+      semanticSearchSimilarityScore?: "none" |"0.2" |"0.5" |"0.7"
+      autoResetSession?: boolean,
+      internetSearchEnabled?: boolean
+      use_hybrid_search?: boolean
+      autoSyncDataSources?: boolean
+    }
   };
 }