From be8db1876a9eccc4e7f73d8604f1093ed109ff93 Mon Sep 17 00:00:00 2001 From: Anoop M D Date: Fri, 6 Oct 2023 04:02:51 +0530 Subject: [PATCH] feat(#111): refactor new request auto open logic --- packages/bruno-app/src/providers/App/index.js | 2 + .../providers/App/useCollectionNextAction.js | 35 ++++++++++++++++ .../providers/App/useCollectionTreeSync.js | 40 ++----------------- .../ReduxStore/slices/collections/actions.js | 35 +++++++++++++--- .../ReduxStore/slices/collections/index.js | 16 +++++++- 5 files changed, 85 insertions(+), 43 deletions(-) create mode 100644 packages/bruno-app/src/providers/App/useCollectionNextAction.js diff --git a/packages/bruno-app/src/providers/App/index.js b/packages/bruno-app/src/providers/App/index.js index 9768802fc..041bf6e9d 100644 --- a/packages/bruno-app/src/providers/App/index.js +++ b/packages/bruno-app/src/providers/App/index.js @@ -1,6 +1,7 @@ import React, { useEffect } from 'react'; import useTelemetry from './useTelemetry'; import useCollectionTreeSync from './useCollectionTreeSync'; +import useCollectionNextAction from './useCollectionNextAction'; import { useDispatch } from 'react-redux'; import { refreshScreenWidth } from 'providers/ReduxStore/slices/app'; import StyledWrapper from './StyledWrapper'; @@ -10,6 +11,7 @@ export const AppContext = React.createContext(); export const AppProvider = (props) => { useTelemetry(); useCollectionTreeSync(); + useCollectionNextAction(); const dispatch = useDispatch(); diff --git a/packages/bruno-app/src/providers/App/useCollectionNextAction.js b/packages/bruno-app/src/providers/App/useCollectionNextAction.js new file mode 100644 index 000000000..94c58f604 --- /dev/null +++ b/packages/bruno-app/src/providers/App/useCollectionNextAction.js @@ -0,0 +1,35 @@ +import React, { useEffect } from 'react'; +import get from 'lodash/get'; +import each from 'lodash/each'; +import { addTab } from 'providers/ReduxStore/slices/tabs'; +import { getDefaultRequestPaneTab, findItemInCollectionByPathname } from 'utils/collections/index'; +import { hideHomePage } from 'providers/ReduxStore/slices/app'; +import { updateNextAction } from 'providers/ReduxStore/slices/collections/index'; +import { useSelector, useDispatch } from 'react-redux'; + +const useCollectionNextAction = () => { + const collections = useSelector((state) => state.collections.collections); + const dispatch = useDispatch(); + + useEffect(() => { + each(collections, (collection) => { + if (collection.nextAction && collection.nextAction.type === 'OPEN_REQUEST') { + const item = findItemInCollectionByPathname(collection, get(collection, 'nextAction.payload.pathname')); + + if (item) { + dispatch(updateNextAction(collection.uid, null)); + dispatch( + addTab({ + uid: item.uid, + collectionUid: collection.uid, + requestPaneTab: getDefaultRequestPaneTab(item.type) + }) + ); + dispatch(hideHomePage()); + } + } + }); + }, [collections, each, dispatch, updateNextAction, hideHomePage, addTab]); +}; + +export default useCollectionNextAction; diff --git a/packages/bruno-app/src/providers/App/useCollectionTreeSync.js b/packages/bruno-app/src/providers/App/useCollectionTreeSync.js index ba7193f31..caf057d5b 100644 --- a/packages/bruno-app/src/providers/App/useCollectionTreeSync.js +++ b/packages/bruno-app/src/providers/App/useCollectionTreeSync.js @@ -1,5 +1,5 @@ import { useEffect } from 'react'; -import { useDispatch, useSelector } from 'react-redux'; +import { useDispatch } from 'react-redux'; import { collectionAddDirectoryEvent, collectionAddFileEvent, @@ -17,15 +17,9 @@ import { import toast from 'react-hot-toast'; import { openCollectionEvent, collectionAddEnvFileEvent } from 'providers/ReduxStore/slices/collections/actions'; import { isElectron } from 'utils/common/platform'; -import { addTab } from 'providers/ReduxStore/slices/tabs'; -import { findCollectionByUid, getDefaultRequestPaneTab } from 'utils/collections/index'; -import { hideHomePage } from 'providers/ReduxStore/slices/app'; -import { updateLastAction } from 'providers/ReduxStore/slices/collections/index'; const useCollectionTreeSync = () => { const dispatch = useDispatch(); - const tabs = useSelector((state) => state.tabs.tabs); - const collections = useSelector((state) => state.collections.collections); useEffect(() => { if (!isElectron()) { @@ -56,25 +50,6 @@ const useCollectionTreeSync = () => { file: val }) ); - - const collectionUid = val.meta.collectionUid; - const lastAction = findCollectionByUid(collections, collectionUid)?.lastAction; - - // When the request was just created open it in a new tab - if (lastAction && lastAction.type === 'ADD_REQUEST') { - dispatch(updateLastAction({ lastAction: null, collectionUid })); - - if (lastAction.payload === val.data.name) { - dispatch( - addTab({ - uid: val.data.uid, - collectionUid: collectionUid, - requestPaneTab: getDefaultRequestPaneTab(val.data) - }) - ); - dispatch(hideHomePage()); - } - } } if (type === 'change') { dispatch( @@ -140,6 +115,8 @@ const useCollectionTreeSync = () => { dispatch(runRequestEvent(val)); }; + ipcRenderer.invoke('renderer:ready'); + const removeListener1 = ipcRenderer.on('main:collection-opened', _openCollection); const removeListener2 = ipcRenderer.on('main:collection-tree-updated', _collectionTreeUpdated); const removeListener3 = ipcRenderer.on('main:collection-already-opened', _collectionAlreadyOpened); @@ -167,16 +144,7 @@ const useCollectionTreeSync = () => { removeListener10(); removeListener11(); }; - }, [isElectron, tabs, collections]); - - useEffect(() => { - if (!isElectron()) { - return () => {}; - } - - const { ipcRenderer } = window; - ipcRenderer.invoke('renderer:ready'); - }, []); + }, [isElectron]); }; export default useCollectionTreeSync; diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js index 7d5577c86..c1ec2ff3b 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js @@ -26,6 +26,7 @@ import { sendNetworkRequest, cancelNetworkRequest } from 'utils/network'; import { updateLastAction, + updateNextAction, resetRunResults, requestCancelled, responseReceived, @@ -39,8 +40,7 @@ import { renameCollection as _renameCollection, removeCollection as _removeCollection, sortCollections as _sortCollections, - collectionAddEnvFileEvent as _collectionAddEnvFileEvent, - updateNewRequest + collectionAddEnvFileEvent as _collectionAddEnvFileEvent } from './index'; import { closeAllCollectionTabs } from 'providers/ReduxStore/slices/tabs'; @@ -596,8 +596,19 @@ export const newHttpRequest = (params) => (dispatch, getState) => { const { ipcRenderer } = window; ipcRenderer.invoke('renderer:new-request', fullName, item).then(resolve).catch(reject); - // Add the new request name here so it can be opened in a new tab in useCollectionTreeSync.js - dispatch(updateLastAction({ lastAction: { type: 'ADD_REQUEST', payload: item.name }, collectionUid })); + // the useCollectionNextAction() will track this and open the new request in a new tab + // once the request is created + dispatch( + updateNextAction({ + nextAction: { + type: 'OPEN_REQUEST', + payload: { + pathname: fullName + } + }, + collectionUid + }) + ); } else { return reject(new Error('Duplicate request names are not allowed under the same folder')); } @@ -615,8 +626,20 @@ export const newHttpRequest = (params) => (dispatch, getState) => { const { ipcRenderer } = window; ipcRenderer.invoke('renderer:new-request', fullName, item).then(resolve).catch(reject); - // Add the new request name here so it can be opened in a new tab in useCollectionTreeSync.js - dispatch(updateLastAction({ lastAction: { type: 'ADD_REQUEST', payload: item.name }, collectionUid })); + + // the useCollectionNextAction() will track this and open the new request in a new tab + // once the request is created + dispatch( + updateNextAction({ + nextAction: { + type: 'OPEN_REQUEST', + payload: { + pathname: fullName + } + }, + collectionUid + }) + ); } else { return reject(new Error('Duplicate request names are not allowed under the same folder')); } diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js index ec89bb85d..31cf6d6ca 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js @@ -39,6 +39,8 @@ export const collectionsSlice = createSlice({ createCollection: (state, action) => { const collectionUids = map(state.collections, (c) => c.uid); const collection = action.payload; + + // TODO: move this to use the nextAction approach // last action is used to track the last action performed on the collection // this is optional // this is used in scenarios where we want to know the last action performed on the collection @@ -47,6 +49,10 @@ export const collectionsSlice = createSlice({ collection.importedAt = new Date().getTime(); collection.lastAction = null; + // an improvement over the above approach. + // this defines an action that need to be performed next and is executed vy the useCollectionNextAction() + collection.nextAction = null; + collapseCollection(collection); addDepth(collection.items); if (!collectionUids.includes(collection.uid)) { @@ -93,6 +99,14 @@ export const collectionsSlice = createSlice({ collection.lastAction = lastAction; } }, + updateNextAction: (state, action) => { + const { collectionUid, nextAction } = action.payload; + const collection = findCollectionByUid(state.collections, collectionUid); + + if (collection) { + collection.nextAction = nextAction; + } + }, collectionUnlinkEnvFileEvent: (state, action) => { const { data: environment, meta } = action.payload; const collection = findCollectionByUid(state.collections, meta.collectionUid); @@ -1197,10 +1211,10 @@ export const { removeCollection, sortCollections, updateLastAction, + updateNextAction, collectionUnlinkEnvFileEvent, saveEnvironment, selectEnvironment, - updateNewRequest, newItem, deleteItem, renameItem,