feat: run again, run collection and close functionality in collection runner

packages/bruno-app/src/components/RunnerResults/index.js

@@ -1,7 +1,10 @@
 import React, { useState, useEffect } from 'react';
 import path from 'path';
+import { useDispatch } from 'react-redux';
 import { get, each, cloneDeep } from 'lodash';
-import { findItemInCollection } from 'utils/collections';
+import { runCollectionFolder } from 'providers/ReduxStore/slices/collections/actions';
+import { closeCollectionRunner } from 'providers/ReduxStore/slices/collections';
+import { findItemInCollection, getTotalRequestCountInCollection } from 'utils/collections';
 import { IconRefresh, IconCircleCheck, IconCircleX, IconCheck, IconX, IconRun } from '@tabler/icons';
 import ResponsePane from './ResponsePane';
 import StyledWrapper from './StyledWrapper';
@@ -13,6 +16,7 @@ const getRelativePath = (fullPath, pathname) => {
 }
 
 export default function RunnerResults({collection}) {
+  const dispatch = useDispatch();
   const [selectedItem, setSelectedItem] = useState(null);
 
   useEffect(() => {
@@ -23,6 +27,7 @@ export default function RunnerResults({collection}) {
 
   const collectionCopy = cloneDeep(collection);
   const items = cloneDeep(get(collection, 'runnerResult.items', []));
+  const runnerInfo = get(collection, 'runnerResult.info', {});
   each(items, (item) => {
     const info = findItemInCollection(collectionCopy, item.uid);
 
@@ -43,9 +48,47 @@ export default function RunnerResults({collection}) {
     }
   });
 
+  const runCollection = () => {
+    dispatch(runCollectionFolder(collection.uid, null, true));
+  };
+
+  const runAgain = () => {
+    dispatch(runCollectionFolder(collection.uid, runnerInfo.folderUid, runnerInfo.isRecursive));
+  };
+
+  const closeRunner = () => {
+    dispatch(closeCollectionRunner({
+      collectionUid: collection.uid,
+    }));
+  };
+
+  const totalRequestsInCollection = getTotalRequestCountInCollection(collectionCopy);
   const passedRequests = items.filter((item) => item.status !== "error" && item.testStatus === 'pass');
   const failedRequests = items.filter((item) => item.status !== "error" && item.testStatus === 'fail');
 
+  if(!items || !items.length) {
+    return (
+      <StyledWrapper className='px-4'>
+        <div className='font-medium mt-6 title flex items-center'>
+          Runner
+          <IconRun size={20} strokeWidth={1.5} className='ml-2'/>
+        </div>
+
+        <div className='mt-6'>
+          You have <span className='font-medium'>{totalRequestsInCollection}</span> requests in this collection.
+        </div>
+
+        <button type="submit" className="submit btn btn-sm btn-secondary mt-6" onClick={runCollection}>
+          Run Collection
+        </button>
+
+        <button className="submit btn btn-sm btn-close mt-6 ml-3" onClick={closeRunner}>
+          Close
+        </button>
+      </StyledWrapper>
+    );
+  }
+
   return (
     <StyledWrapper className='px-4'>
       <div className='font-medium mt-6 mb-4 title flex items-center'>
@@ -115,6 +158,20 @@ export default function RunnerResults({collection}) {
               </div>
             );
           })}
+
+          {runnerInfo.status === 'ended' ? (
+            <div className="mt-2 mb-4">
+              <button type="submit" className="submit btn btn-sm btn-secondary mt-6" onClick={runAgain}>
+                Run Again
+              </button>
+              <button type="submit" className="submit btn btn-sm btn-secondary mt-6 ml-3" onClick={runCollection}>
+                Run Collection
+              </button>
+              <button className="btn btn-sm btn-close mt-6 ml-3" onClick={closeRunner}>
+                Close
+              </button>
+            </div>
+          ) : null}
         </div>
         <div className='flex flex-1' style={{width: '50%'}}>
           {selectedItem ? (

packages/bruno-app/src/globalStyles.js

@@ -43,7 +43,11 @@ const GlobalStyle = createGlobalStyle`
   .btn-close {
     color: ${(props) => props.theme.button.close.color};
     background: ${(props) => props.theme.button.close.bg};
-    border: solid 1px ${(props) => props.theme.button.close.border};;
+    border: solid 1px ${(props) => props.theme.button.close.border};
+
+    &.btn-border {
+      border: solid 1px #696969;
+    }
 
     &:hover,
     &:focus {

packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js

@@ -888,10 +888,8 @@ export const collectionsSlice = createSlice({
       const { collectionUid } = action.payload;
       const collection = findCollectionByUid(state.collections, collectionUid);
 
-      console.log('here');
       if (collection) {
-      console.log('here2');
-      collection.showRunner = !collection.showRunner;
+        collection.showRunner = !collection.showRunner;
       }
     },
     showRunnerView: (state, action) => {
@@ -919,14 +917,30 @@ export const collectionsSlice = createSlice({
       }
     },
     runFolderEvent: (state, action) => {
-      const { collectionUid, folderUid, itemUid, type, error } = action.payload;
+      const { collectionUid, folderUid, itemUid, type, isRecursive, error } = action.payload;
       const collection = findCollectionByUid(state.collections, collectionUid);
 
       if (collection) {
         const folder = findItemInCollection(collection, folderUid);
         const request = findItemInCollection(collection, itemUid);
 
-        collection.runnerResult = collection.runnerResult || {items: []};
+        collection.runnerResult = collection.runnerResult || {info: {}, items: []};
+
+        // todo
+        // get startedAt and endedAt from the runner and display it in the UI
+        if(type === 'testrun-started') {
+          const info = collection.runnerResult.info;
+          info.collectionUid = collectionUid;
+          info.folderUid = folderUid;
+          info.isRecursive = isRecursive;
+          info.status = 'started';
+        }
+
+        if(type === 'testrun-ended') {
+          const info = collection.runnerResult.info;
+          info.status = 'ended';
+        }
+
 
         if(type === 'request-queued') {
           collection.runnerResult.items.push({
@@ -959,6 +973,15 @@ export const collectionsSlice = createSlice({
           item.status = "error";
         }
       }
+    },
+    closeCollectionRunner: (state, action) => {
+      const { collectionUid } = action.payload;
+      const collection = findCollectionByUid(state.collections, collectionUid);
+
+      if (collection) {
+        collection.runnerResult = null;
+        collection.showRunner = false;
+      }
     }
   }
 });
@@ -1017,7 +1040,8 @@ export const {
   showRunnerView,
   hideRunnerView,
   resetRunResults,
-  runFolderEvent
+  runFolderEvent,
+  closeCollectionRunner
 } = collectionsSlice.actions;
 
 export default collectionsSlice.reducer;

packages/bruno-app/src/utils/collections/index.js

@@ -518,6 +518,19 @@ export const getEnvironmentVariables = (collection) => {
   return variables;
 }
 
+export const getTotalRequestCountInCollection = (collection) => {
+  let count = 0;
+  each(collection.items, (item) => {
+    if (isItemARequest(item)) {
+      count++;
+    } else if (isItemAFolder(item)) {
+      count += getTotalRequestCountInCollection(item);
+    }
+  });
+
+  return count;
+};
+
 export const getAllVariables = (collection) => {
   const environmentVariables = getEnvironmentVariables(collection);
 

packages/bruno-electron/src/ipc/network/index.js

@@ -229,6 +229,13 @@ const registerNetworkIpc = (mainWindow, watcher, lastOpenedCollections) => {
       folder = collection;
     }
 
+    mainWindow.webContents.send('main:run-folder-event', {
+      type: 'testrun-started',
+      isRecursive: recursive,
+      collectionUid,
+      folderUid
+    });
+
     try {
       const envVars = getEnvVars(environment);
       let folderRequests = [];
@@ -374,6 +381,12 @@ const registerNetworkIpc = (mainWindow, watcher, lastOpenedCollections) => {
           });
         }
       }
+
+      mainWindow.webContents.send('main:run-folder-event', {
+        type: 'testrun-ended',
+        collectionUid,
+        folderUid
+      });
     } catch (error) {
       mainWindow.webContents.send('main:run-folder-event', {
         type: 'error',