feat: allow to run multiple task in paralel

Author: yaroslav8765

custom/ChatSurface.vue

@@ -88,7 +88,6 @@
           <div class="flex items-center justify-center">
             <Button 
               @click="agentStore.createPreSession(); agentStore.setSessionHistoryOpen(false); agentStore.focusTextInput();" 
-              :disabled="agentStore.isResponseInProgress" 
               class="!py-1 !px-2 rounded-3xl text-gray-800 dark:text-gray-200 max-w-64 mr-2"
             >
               <IconPlusOutline class="w-5 h-5" />

custom/SessionsHistory.vue

@@ -9,10 +9,6 @@
     <div class="w-full flex items-center justify-center">
     </div>
     <div class="w-full border-b border-gray-200 dark:border-gray-700"/>
-    <div class="absolute w-full h-full flex flex-col items-center justify-center bg-gray-100/50 dark:bg-gray-700/50 z-10" v-if="agentStore.isResponseInProgress">
-      <Spinner class="w-8 h-8" v-if="agentStore.isResponseInProgress" />
-      <p class="mt-2 text-gray-800 dark:text-gray-200">{{ $t('Generation in progress...') }}</p>
-    </div>
     <div v-for="group in groupedSessions" :key="group.dayKey" class="w-full py-2">
       <div class="px-4 pb-2 text-xs font-semibold uppercase tracking-[0.2em] text-gray-500 dark:text-gray-400">
         {{ group.label }}
@@ -24,10 +20,8 @@
         class=" flex items-center justify-between w-full px-4 py-2 cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors duration-200 ease-in-out text-gray-800 dark:text-gray-200"
         :class="{
           'bg-lightPrimary/20 hover:bg-lightPrimary/20 dark:bg-darkPrimary/20 dark:hover:bg-darkPrimary/20': agentStore.activeSessionId === session.sessionId, 
-          'cursor-default opacity-50 pointer-events-none': agentStore.isResponseInProgress,
          }"
         @click="agentStore.setActiveSession(session.sessionId); agentStore.setSessionHistoryOpen(false);"
-        :disabled="agentStore.isResponseInProgress"
       >
         <p class="truncate">{{ session.title || session.sessionId }}</p>
         <div @click.stop="agentStore.deleteSession(session.sessionId)" class="w-7 h-7 p-1 hover:scale-110 hover:bg-gray-200 dark:hover:bg-gray-500 flex items-center justify-center rounded">

custom/composables/useAgentStore.ts

@@ -60,6 +60,10 @@ export const useAgentStore = defineStore('agent', () => {
   const activeModeName = ref<string | null>(null);
   const hasTypedMessageInPageSession = ref(false);
   const { width: windowWidth } = useWindowSize();
+
+  const chats = new Map<string, Chat<any>>();
+  const currentChat = shallowRef<Chat<any>>();
+
   let placeholderAnimationTimer: ReturnType<typeof setTimeout> | null = null;
 
   function setLocalStorageItem(key: string, value: string) {
@@ -189,8 +193,6 @@ export const useAgentStore = defineStore('agent', () => {
       }
     }
   })
-  const chats = new Map<string, Chat<any>>();
-  const currentChat = shallowRef<Chat<any>>();
 
   function setAvailableModes(modes: AgentMode[], defaultModeName?: string | null) {
     availableModes.value = modes;
@@ -549,14 +551,16 @@ export const useAgentStore = defineStore('agent', () => {
     }
     currentSession.value = sessions.value[sessionId];
     setCurrentChat(sessionId);
-    currentChat.value.messages = currentSession.value?.messages.map((m: any) => ({
-      role: m.role,
-      parts:[{
-        type: 'text',
-        text: m.text,
-        state: 'done',
-      }]
-    }));
+    if (currentChat.value.messages.length === 0) {
+      currentChat.value.messages = currentSession.value?.messages.map((m: any) => ({
+        role: m.role,
+        parts:[{
+          type: 'text',
+          text: m.text,
+          state: 'done',
+        }]
+      }));
+    }
   }
 
   async function fetchSessionsList() {

custom/conversation_area/ProcessingTimeline.vue

@@ -74,6 +74,11 @@
 
   onMounted(() => {
     thinkingStartTime.value = Date.now();
+    if (isResponseInProgress.value) {
+      isExpanded.value = true;
+    } else {
+      isExpanded.value = false;
+    }
   })
 
   onUnmounted(() => {

custom/conversation_area/TextRenderer.vue

@@ -17,12 +17,12 @@
       :incremark-options="incremarkOptions"
     />
     <p v-else class="text-red-500 py-2">
-      {{ $t('Error occurred') }}
+      {{ $t('No content to render') }}
     </p>
   </div>
 </template>
 
-<script setup lang="ts">const isExpanded = ref(true);
+<script setup lang="ts">
 
   import { computed, defineAsyncComponent, onMounted, ref, watch } from 'vue';
   import { useRouter } from 'vue-router';