diff --git a/src/components/organisms/NavigatorPane/NavigatorPane.tsx b/src/components/organisms/NavigatorPane/NavigatorPane.tsx
index b2dbee1b45..8be47e8174 100644
--- a/src/components/organisms/NavigatorPane/NavigatorPane.tsx
+++ b/src/components/organisms/NavigatorPane/NavigatorPane.tsx
@@ -1,59 +1,23 @@
-import {useCallback, useMemo} from 'react';
-
-import {Dropdown, Tooltip} from 'antd';
-
-import AntdIcon from '@ant-design/icons';
-
-import styled from 'styled-components';
-
-import {TOOLTIP_DELAY} from '@constants/constants';
-import {
-  CollapseResourcesTooltip,
-  DisabledAddResourceTooltip,
-  ExpandResourcesTooltip,
-  NewResourceTooltip,
-} from '@constants/tooltips';
+import {useCallback} from 'react';
 
 import {useAppDispatch, useAppSelector} from '@redux/hooks';
-import {collapseResourceKinds, expandResourceKinds, toggleResourceFilters} from '@redux/reducers/ui';
-import {activeResourceCountSelector, navigatorResourceKindsSelector} from '@redux/selectors/resourceMapSelectors';
+import {toggleResourceFilters} from '@redux/reducers/ui';
 
 import {CheckedResourcesActionsMenu, ResourceFilter} from '@molecules';
 
-import {CollapseIcon, ExpandIcon} from '@components/atoms/Icons';
-import {TitleBarWrapper} from '@components/atoms/StyledComponents/TitleBarWrapper';
-
-import {useNewResourceMenuItems} from '@hooks/menuItemsHooks';
-
-import {useSelectorWithRef} from '@utils/hooks';
-
-import {TitleBar} from '@monokle/components';
-import {ROOT_FILE_ENTRY} from '@shared/constants/fileEntry';
-import {Colors} from '@shared/styles';
-import {trackEvent} from '@shared/utils';
-import {isInClusterModeSelector, isInPreviewModeSelector} from '@shared/utils/selectors';
-
-import NavigatorDescription from './NavigatorDescription';
-import * as S from './NavigatorPane.styled';
 import ResourceNavigator from './ResourceNavigator';
+import {ResourceTitleBar} from './ResourceTitleBar';
+
+import * as S from './styled';
 
 const NavPane: React.FC = () => {
   const dispatch = useAppDispatch();
 
   const checkedResourceIdentifiers = useAppSelector(state => state.main.checkedResourceIdentifiers);
-  const isFolderOpen = useAppSelector(state => Boolean(state.main.fileMap[ROOT_FILE_ENTRY]));
-  const isInClusterMode = useAppSelector(isInClusterModeSelector);
-  const isInPreviewMode = useAppSelector(isInPreviewModeSelector);
+
   const isPreviewLoading = useAppSelector(state => state.main.previewOptions.isLoading);
   const isResourceFiltersOpen = useAppSelector(state => state.ui.isResourceFiltersOpen);
 
-  const newResourceMenuItems = useNewResourceMenuItems();
-
-  const isAddResourceDisabled = useMemo(
-    () => !isFolderOpen || isInPreviewMode || isInClusterMode,
-    [isFolderOpen, isInClusterMode, isInPreviewMode]
-  );
-
   const resourceFilterButtonHandler = useCallback(() => {
     dispatch(toggleResourceFilters());
   }, [dispatch]);
@@ -65,46 +29,7 @@ const NavPane: React.FC = () => {
           <CheckedResourcesActionsMenu />
         </S.SelectionBar>
       ) : (
-        <TitleBarWrapper $navigator>
-          <TitleBar
-            type="secondary"
-            title="Kubernetes Resources"
-            description={<NavigatorDescription />}
-            descriptionStyle={{paddingTop: '5px'}}
-            actions={
-              <S.TitleBarRightButtons>
-                <CollapseAction />
-
-                <Dropdown
-                  trigger={['click']}
-                  menu={{items: newResourceMenuItems}}
-                  overlayClassName="dropdown-secondary"
-                  disabled={isAddResourceDisabled}
-                >
-                  <Tooltip
-                    mouseEnterDelay={TOOLTIP_DELAY}
-                    title={
-                      isAddResourceDisabled
-                        ? DisabledAddResourceTooltip({
-                            type: isInClusterMode ? 'cluster' : isInPreviewMode ? 'preview' : 'other',
-                          })
-                        : NewResourceTooltip
-                    }
-                  >
-                    <S.NewButton
-                      id="create-resource-button"
-                      disabled={isAddResourceDisabled}
-                      size="small"
-                      type="primary"
-                    >
-                      New
-                    </S.NewButton>
-                  </Tooltip>
-                </Dropdown>
-              </S.TitleBarRightButtons>
-            }
-          />
-        </TitleBarWrapper>
+        <ResourceTitleBar />
       )}
 
       <ResourceFilter active={isResourceFiltersOpen} onToggle={resourceFilterButtonHandler} />
@@ -117,61 +42,3 @@ const NavPane: React.FC = () => {
 };
 
 export default NavPane;
-
-function CollapseAction() {
-  const dispatch = useAppDispatch();
-  const [hasAnyActiveResources, hasAnyActiveResourcesRef] = useSelectorWithRef(
-    state => activeResourceCountSelector(state) > 0
-  );
-
-  const [collapsedKinds, collapsedKindsRef] = useSelectorWithRef(s => s.ui.navigator.collapsedResourceKinds);
-  const [navigatorKinds, navigatorKindsRef] = useSelectorWithRef(navigatorResourceKindsSelector);
-
-  const isCollapsed = useMemo(
-    () => collapsedKinds.length === navigatorKinds.length,
-    [collapsedKinds.length, navigatorKinds.length]
-  );
-
-  const onClick = useCallback(() => {
-    if (!hasAnyActiveResourcesRef.current) {
-      return;
-    }
-
-    if (collapsedKindsRef.current.length === navigatorKindsRef.current.length) {
-      dispatch(expandResourceKinds(navigatorKindsRef.current));
-      trackEvent('navigator/expand_all');
-      return;
-    }
-
-    dispatch(collapseResourceKinds(navigatorKindsRef.current));
-    trackEvent('navigator/collapse_all');
-  }, [hasAnyActiveResourcesRef, collapsedKindsRef, navigatorKindsRef, dispatch]);
-
-  return (
-    <>
-      <Tooltip mouseEnterDelay={TOOLTIP_DELAY} title={isCollapsed ? ExpandResourcesTooltip : CollapseResourcesTooltip}>
-        {isCollapsed ? (
-          <StyledFullscreenOutlined component={ExpandIcon} onClick={onClick} $disabled={!hasAnyActiveResources} />
-        ) : (
-          <StyledFullscreenExitOutlined component={CollapseIcon} onClick={onClick} $disabled={!hasAnyActiveResources} />
-        )}
-      </Tooltip>
-    </>
-  );
-}
-
-// Styled Components
-
-const StyledFullscreenOutlined = styled(AntdIcon)<{$disabled: boolean}>`
-  color: ${({$disabled}) => ($disabled ? Colors.grey6 : Colors.blue6)};
-  cursor: ${({$disabled}) => ($disabled ? 'not-allowed' : 'pointer')};
-  padding-right: 10px;
-  font-size: 16px;
-`;
-
-const StyledFullscreenExitOutlined = styled(AntdIcon)<{$disabled: boolean}>`
-  color: ${({$disabled}) => ($disabled ? Colors.grey6 : Colors.blue6)};
-  cursor: ${({$disabled}) => ($disabled ? 'not-allowed' : 'pointer')};
-  padding-right: 10px;
-  font-size: 16px;
-`;
diff --git a/src/components/organisms/NavigatorPane/ResourceTitleBar.tsx b/src/components/organisms/NavigatorPane/ResourceTitleBar.tsx
new file mode 100644
index 0000000000..5f052e4df1
--- /dev/null
+++ b/src/components/organisms/NavigatorPane/ResourceTitleBar.tsx
@@ -0,0 +1,122 @@
+import {useCallback, useMemo} from 'react';
+
+import {Dropdown, Tooltip} from 'antd';
+
+import {TOOLTIP_DELAY} from '@constants/constants';
+import {
+  CollapseResourcesTooltip,
+  DisabledAddResourceTooltip,
+  ExpandResourcesTooltip,
+  NewResourceTooltip,
+} from '@constants/tooltips';
+
+import {useAppDispatch, useAppSelector} from '@redux/hooks';
+import {collapseResourceKinds, expandResourceKinds} from '@redux/reducers/ui';
+import {activeResourceCountSelector, navigatorResourceKindsSelector} from '@redux/selectors/resourceMapSelectors';
+
+import {TitleBarWrapper} from '@components/atoms';
+import {CollapseIcon, ExpandIcon} from '@components/atoms/Icons';
+
+import {useNewResourceMenuItems} from '@hooks/menuItemsHooks';
+
+import {useSelectorWithRef} from '@utils/hooks';
+
+import {TitleBar} from '@monokle/components';
+import {ROOT_FILE_ENTRY} from '@shared/constants/fileEntry';
+import {isInClusterModeSelector, isInPreviewModeSelector, trackEvent} from '@shared/utils';
+
+import NavigatorDescription from './NavigatorDescription';
+
+import * as S from './styled';
+
+export const ResourceTitleBar = () => {
+  const isFolderOpen = useAppSelector(state => Boolean(state.main.fileMap[ROOT_FILE_ENTRY]));
+  const isInClusterMode = useAppSelector(isInClusterModeSelector);
+  const isInPreviewMode = useAppSelector(isInPreviewModeSelector);
+
+  const newResourceMenuItems = useNewResourceMenuItems();
+
+  const isAddResourceDisabled = useMemo(
+    () => !isFolderOpen || isInPreviewMode || isInClusterMode,
+    [isFolderOpen, isInClusterMode, isInPreviewMode]
+  );
+  return (
+    <TitleBarWrapper $navigator>
+      <TitleBar
+        type="secondary"
+        title="Kubernetes Resources"
+        description={<NavigatorDescription />}
+        descriptionStyle={{paddingTop: '5px'}}
+        actions={
+          <S.TitleBarRightButtons>
+            <CollapseAction />
+
+            <Dropdown
+              trigger={['click']}
+              menu={{items: newResourceMenuItems}}
+              overlayClassName="dropdown-secondary"
+              disabled={isAddResourceDisabled}
+            >
+              <Tooltip
+                mouseEnterDelay={TOOLTIP_DELAY}
+                title={
+                  isAddResourceDisabled
+                    ? DisabledAddResourceTooltip({
+                        type: isInClusterMode ? 'cluster' : isInPreviewMode ? 'preview' : 'other',
+                      })
+                    : NewResourceTooltip
+                }
+              >
+                <S.NewButton id="create-resource-button" disabled={isAddResourceDisabled} size="small" type="primary">
+                  New
+                </S.NewButton>
+              </Tooltip>
+            </Dropdown>
+          </S.TitleBarRightButtons>
+        }
+      />
+    </TitleBarWrapper>
+  );
+};
+
+function CollapseAction() {
+  const dispatch = useAppDispatch();
+  const [hasAnyActiveResources, hasAnyActiveResourcesRef] = useSelectorWithRef(
+    state => activeResourceCountSelector(state) > 0
+  );
+
+  const [collapsedKinds, collapsedKindsRef] = useSelectorWithRef(s => s.ui.navigator.collapsedResourceKinds);
+  const [navigatorKinds, navigatorKindsRef] = useSelectorWithRef(navigatorResourceKindsSelector);
+
+  const isCollapsed = useMemo(
+    () => collapsedKinds.length === navigatorKinds.length,
+    [collapsedKinds.length, navigatorKinds.length]
+  );
+
+  const onClick = useCallback(() => {
+    if (!hasAnyActiveResourcesRef.current) {
+      return;
+    }
+
+    if (collapsedKindsRef.current.length === navigatorKindsRef.current.length) {
+      dispatch(expandResourceKinds(navigatorKindsRef.current));
+      trackEvent('navigator/expand_all');
+      return;
+    }
+
+    dispatch(collapseResourceKinds(navigatorKindsRef.current));
+    trackEvent('navigator/collapse_all');
+  }, [hasAnyActiveResourcesRef, collapsedKindsRef, navigatorKindsRef, dispatch]);
+
+  return (
+    <>
+      <Tooltip mouseEnterDelay={TOOLTIP_DELAY} title={isCollapsed ? ExpandResourcesTooltip : CollapseResourcesTooltip}>
+        {isCollapsed ? (
+          <S.FullscreenOutlined component={ExpandIcon} onClick={onClick} $disabled={!hasAnyActiveResources} />
+        ) : (
+          <S.FullscreenExitOutlined component={CollapseIcon} onClick={onClick} $disabled={!hasAnyActiveResources} />
+        )}
+      </Tooltip>
+    </>
+  );
+}
diff --git a/src/components/organisms/NavigatorPane/NavigatorPane.styled.tsx b/src/components/organisms/NavigatorPane/styled.tsx
similarity index 69%
rename from src/components/organisms/NavigatorPane/NavigatorPane.styled.tsx
rename to src/components/organisms/NavigatorPane/styled.tsx
index 71fd6f2839..ddd6f4fc63 100644
--- a/src/components/organisms/NavigatorPane/NavigatorPane.styled.tsx
+++ b/src/components/organisms/NavigatorPane/styled.tsx
@@ -1,3 +1,5 @@
+import AntdIcon from '@ant-design/icons';
+
 import styled from 'styled-components';
 
 import {DEFAULT_PANE_TITLE_HEIGHT} from '@constants/constants';
@@ -56,3 +58,17 @@ export const TitleBarRightButtons = styled.div`
   display: flex;
   align-items: center;
 `;
+
+export const FullscreenOutlined = styled(AntdIcon)<{$disabled: boolean}>`
+  color: ${({$disabled}) => ($disabled ? Colors.grey6 : Colors.blue6)};
+  cursor: ${({$disabled}) => ($disabled ? 'not-allowed' : 'pointer')};
+  padding-right: 10px;
+  font-size: 16px;
+`;
+
+export const FullscreenExitOutlined = styled(AntdIcon)<{$disabled: boolean}>`
+  color: ${({$disabled}) => ($disabled ? Colors.grey6 : Colors.blue6)};
+  cursor: ${({$disabled}) => ($disabled ? 'not-allowed' : 'pointer')};
+  padding-right: 10px;
+  font-size: 16px;
+`;