diff --git a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx
index b35228008..548dc74ef 100644
--- a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx
+++ b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx
@@ -16,7 +16,6 @@ export default function BuildTrigger({
   open,
   flow,
   setIsBuilt,
-  isBuilt,
 }: {
   open: boolean;
   flow: FlowType;
@@ -168,7 +167,7 @@ export default function BuildTrigger({
       leaveFrom="translate-y-0"
       leaveTo="translate-y-96"
     >
-      <div className={`fixed right-4` + (isBuilt ? " bottom-20" : " bottom-4")}>
+      <div className="fixed right-4 bottom-20">
         <div
           className={`${eventClick} flex justify-center align-center py-1 px-3 w-12 h-12 rounded-full shadow-md shadow-[#0000002a] hover:shadow-[#00000032] bg-[#E2E7EE] dark:border-gray-600 cursor-pointer`}
           onClick={() => {
diff --git a/src/frontend/src/components/chatComponent/chatTrigger/index.tsx b/src/frontend/src/components/chatComponent/chatTrigger/index.tsx
index c173e9135..167ca5cfc 100644
--- a/src/frontend/src/components/chatComponent/chatTrigger/index.tsx
+++ b/src/frontend/src/components/chatComponent/chatTrigger/index.tsx
@@ -29,23 +29,15 @@ export default function ChatTrigger({ open, setOpen, isBuilt }) {
       leaveFrom="translate-y-0"
       leaveTo="translate-y-96"
     >
-      <div className="fixed bottom-4 right-4">
-        <div
-          className="flex justify-center align-center py-1 px-3 w-12 h-12 rounded-full shadow-md shadow-[#0000002a] hover:shadow-[#00000032]
-          bg-[#E2E7EE] dark:border-gray-600 cursor-pointer"
-          onClick={handleClick}
-        >
-          <button>
+          <button onClick={handleClick} className={ "transition-all fixed bottom-4 right-4 flex justify-center items-center py-1 px-3 w-12 h-12 rounded-full shadow-md shadow-[#0000002a] hover:shadow-[#00000032] bg-[#E2E7EE] dark:border-gray-600 "+ (!isBuilt ? "cursor-not-allowed" : "cursor-pointer")}>
             <div className="flex gap-3">
               <MessagesSquare
-                className="pth-6 w-6 fill-[#5c8be1] stroke-1 stroke-[#5c8be1]"
+                className={"h-6 w-6 transition-all " + (isBuilt ? "fill-[#5c8be1] stroke-1 stroke-[#5c8be1]" : "fill-[#a5bae0] stroke-1 stroke-[#a5bae0]")}
                 style={{ color: "white" }}
                 strokeWidth={1.5}
               />
             </div>
           </button>
-        </div>
-      </div>
     </Transition>
   );
 }
diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx
index 8cdc3a981..3c01e9c8b 100644
--- a/src/frontend/src/components/chatComponent/index.tsx
+++ b/src/frontend/src/components/chatComponent/index.tsx
@@ -13,7 +13,7 @@ import * as _ from "lodash";
 export default function Chat({ flow }: ChatType) {
   const [open, setOpen] = useState(false);
   const [isBuilt, setIsBuilt] = useState(false);
-  const {tabsState} = useContext(TabsContext);
+  const { tabsState } = useContext(TabsContext);
 
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
@@ -47,12 +47,14 @@ export default function Chat({ flow }: ChatType) {
   const nodes = useNodes();
   useEffect(() => {
     const prevNodes = prevNodesRef.current;
-    const currentNodes = nodes.map(
-      (node: NodeType) => _.cloneDeep(node.data.node.template)
-      );
+    const currentNodes = nodes.map((node: NodeType) =>
+      _.cloneDeep(node.data.node.template)
+    );
     if (
-      tabsState && tabsState[flow.id] && tabsState[flow.id].isPending
-      && JSON.stringify(prevNodes) !== JSON.stringify(currentNodes)
+      tabsState &&
+      tabsState[flow.id] &&
+      tabsState[flow.id].isPending &&
+      JSON.stringify(prevNodes) !== JSON.stringify(currentNodes)
     ) {
       setIsBuilt(false);
     }
@@ -62,25 +64,18 @@ export default function Chat({ flow }: ChatType) {
 
   return (
     <>
-      {isBuilt ? (
-        <div>
-          <BuildTrigger
-            open={open}
-            flow={flow}
-            setIsBuilt={setIsBuilt}
-            isBuilt={isBuilt}
-          />
-          <FormModal key={flow.id} flow={flow} open={open} setOpen={setOpen} />
-          <ChatTrigger open={open} setOpen={setOpen} isBuilt={isBuilt} />
-        </div>
-      ) : (
+      <div>
         <BuildTrigger
           open={open}
           flow={flow}
           setIsBuilt={setIsBuilt}
           isBuilt={isBuilt}
         />
-      )}
+        {isBuilt && (
+          <FormModal key={flow.id} flow={flow} open={open} setOpen={setOpen} />
+        )}
+        <ChatTrigger open={open} setOpen={setOpen} isBuilt={isBuilt} />
+      </div>
     </>
   );
 }