refactor: enhance OpenAPISyncTab functionality and clean up unused code (#7392)

- Updated OpenAPISyncTab to utilize Redux state for active tab management, improving state consistency.
- Removed unnecessary loading state checks from OverviewSection and SpecStatusSection for cleaner logic.
- Streamlined prop usage in OverviewSection by eliminating the isLoading prop.
- Cleaned up useOpenAPISync hook by removing unused state clearing logic on unmount.
- Improved file handling in openapi-sync IPC by ensuring new files are created in the appropriate folder based on tags.

packages/bruno-app/src/components/OpenAPISyncTab/OverviewSection/index.js

@@ -50,7 +50,7 @@ const SUMMARY_CARDS = [
   }
 ];
 
-const OverviewSection = ({ collection, storedSpec, collectionDrift, specDrift, remoteDrift, onTabSelect, error, isLoading, fileNotFound, onOpenSettings }) => {
+const OverviewSection = ({ collection, storedSpec, collectionDrift, specDrift, remoteDrift, onTabSelect, error, fileNotFound, onOpenSettings }) => {
   const openApiSyncConfig = collection?.brunoConfig?.openapi?.[0];
 
   const reduxError = useSelector((state) => state.openapiSync?.collectionUpdates?.[collection.uid]?.error);
@@ -119,14 +119,6 @@ const OverviewSection = ({ collection, storedSpec, collectionDrift, specDrift, r
         buttons: ['open-settings']
       };
     }
-    if (isLoading) {
-      return {
-        variant: 'muted',
-        title: 'Checking for updates...',
-        subtitle: null,
-        buttons: []
-      };
-    }
     if (specDrift?.storedSpecMissing && !lastSyncDate) {
       return {
         variant: 'warning',
@@ -175,7 +167,7 @@ const OverviewSection = ({ collection, storedSpec, collectionDrift, specDrift, r
     //   buttons: []
     // };
     return null;
-  }, [activeError, isLoading, fileNotFound, hasDriftData, hasSpecUpdates, hasCollectionChanges, specDrift?.storedSpecMissing, lastSyncDate]);
+  }, [activeError, fileNotFound, hasDriftData, hasSpecUpdates, hasCollectionChanges, specDrift?.storedSpecMissing, lastSyncDate]);
 
   return (
     <div className="overview-section">

packages/bruno-app/src/components/OpenAPISyncTab/SpecStatusSection/index.js

@@ -32,9 +32,6 @@ const SpecStatusSection = ({
   const lastSyncedAt = openApiSyncConfig?.lastSyncDate;
 
   const bannerState = useMemo(() => {
-    if (isLoading) {
-      return { variant: 'muted', message: 'Checking for updates...', actions: [] };
-    }
     if (fileNotFound) {
       return { variant: 'danger', message: `Source file not found at ${sourceUrl}`, actions: ['open-settings'] };
     }

packages/bruno-app/src/components/OpenAPISyncTab/hooks/useOpenAPISync.js

@@ -27,13 +27,6 @@ const useOpenAPISync = (collection) => {
 
   const isConfigured = !!openApiSyncConfig?.sourceUrl;
 
-  // Clear Redux state when the sync tab is closed (unmount)
-  useEffect(() => {
-    return () => {
-      dispatch(clearCollectionState({ collectionUid: collection.uid }));
-    };
-  }, [collection.uid]);
-
   // Flatten collection items including nested items in folders
   const allHttpItems = useMemo(() => {
     return flattenItems(collection?.items || []).filter((item) => item.type === 'http-request');

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

@@ -1,8 +1,9 @@
-import { useState, useMemo } from 'react';
-import { useDispatch } from 'react-redux';
+import { useState, useMemo, useCallback } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
 import { v4 as uuid } from 'uuid';
 import { addTab } from 'providers/ReduxStore/slices/tabs';
-import { IconLoader2, IconClock } from '@tabler/icons';
+import { setTabUiState } from 'providers/ReduxStore/slices/openapi-sync';
+import { IconClock } from '@tabler/icons';
 import ResponsiveTabs from 'ui/ResponsiveTabs';
 import StyledWrapper from './StyledWrapper';
 import OpenAPISyncHeader from './OpenAPISyncHeader';
@@ -47,7 +48,10 @@ const OpenAPISyncTab = ({ collection }) => {
 
   const [showSettingsModal, setShowSettingsModal] = useState(false);
   const [showDisconnectModal, setShowDisconnectModal] = useState(false);
-  const [activeTab, setActiveTab] = useState('overview');
+  const activeTab = useSelector((state) => state.openapiSync?.tabUiState?.[collection.uid]?.activeTab) || 'overview';
+  const setActiveTab = useCallback((tab) => {
+    dispatch(setTabUiState({ collectionUid: collection.uid, activeTab: tab }));
+  }, [dispatch, collection.uid]);
 
   const hasDriftData = collectionDrift && !collectionDrift.noStoredSpec;
   const collectionChangesCount = hasDriftData
@@ -133,12 +137,7 @@ const OpenAPISyncTab = ({ collection }) => {
 
             {activeTab === 'collection-changes' && (
               <div className="sync-tab-content">
-                {isDriftLoading && !collectionDrift && (
-                  <div className="state-message">
-                    <IconLoader2 size={24} className="animate-spin" />
-                    <span>Checking collection status...</span>
-                  </div>
-                )}
+
                 {collectionDrift && !collectionDrift.noStoredSpec ? (
                   <CollectionStatusSection
                     collection={collection}

packages/bruno-electron/src/ipc/openapi-sync.js

@@ -1307,10 +1307,10 @@ const registerOpenAPISyncIpc = (mainWindow) => {
               const content = await stringifyRequestViaWorker(mergedRequest, { format: existingFile.fileFormat });
               await writeFile(existingFile.filePath, content);
             } else {
-              // Truly new — create file as before
+              // Truly new — create file in the appropriate folder
               let targetFolder = collectionPath;
-              if (endpoint.tags?.length > 0 && groupBy === 'tags') {
-                targetFolder = await ensureTagFolder(collectionPath, endpoint.tags[0], format);
+              if (result.folderName && groupBy === 'tags') {
+                targetFolder = await ensureTagFolder(collectionPath, result.folderName, format);
               }
 
               const requestContent = await stringifyRequestViaWorker(newItem, { format });