diff --git a/packages/insomnia/src/ui/components/panes/request-pane.tsx b/packages/insomnia/src/ui/components/panes/request-pane.tsx
index b308eff68d..38053f6a86 100644
--- a/packages/insomnia/src/ui/components/panes/request-pane.tsx
+++ b/packages/insomnia/src/ui/components/panes/request-pane.tsx
@@ -4,6 +4,7 @@ import React, { FC, useCallback, useEffect, useRef } from 'react';
 import { Tab, TabList, TabPanel, Tabs } from 'react-tabs';
 import { useMount } from 'react-use';
 
+import { getContentTypeFromHeaders } from '../../../common/constants';
 import * as models from '../../../models';
 import { queryAllWorkspaceUrls } from '../../../models/helpers/query-all-workspace-urls';
 import { update } from '../../../models/helpers/request-operations';
@@ -34,10 +35,8 @@ interface Props {
   forceUpdateRequest: (r: Request, patch: Partial<Request>) => Promise<Request>;
   forceUpdateRequestHeaders: (r: Request, headers: RequestHeader[]) => Promise<Request>;
   handleImport: Function;
-  headerEditorKey: string;
   request?: Request | null;
   settings: Settings;
-  updateRequestMimeType: (mimeType: string | null) => Promise<Request | null>;
   workspace: Workspace;
 }
 
@@ -47,10 +46,8 @@ export const RequestPane: FC<Props> = ({
   forceUpdateRequest,
   forceUpdateRequestHeaders,
   handleImport,
-  headerEditorKey,
   request,
   settings,
-  updateRequestMimeType,
   workspace,
 }) => {
 
@@ -126,11 +123,24 @@ export const RequestPane: FC<Props> = ({
     );
   }
 
+  async function updateRequestMimeType(mimeType: string | null): Promise<Request | null> {
+    if (!request) {
+      console.warn('Tried to update request mime-type when no active request');
+      return null;
+    }
+    const requestMeta = await models.requestMeta.getOrCreateByParentId(request._id,);
+    // Switched to No body
+    const savedRequestBody = typeof mimeType !== 'string' ? request.body : {};
+    // Clear saved value in requestMeta
+    await models.requestMeta.update(requestMeta, { savedRequestBody });
+    // @ts-expect-error -- TSCONVERSION mimeType can be null when no body is selected but the updateMimeType logic needs to be reexamined
+    return models.request.updateMimeType(request, mimeType, false, requestMeta.savedRequestBody);
+  }
   const numParameters = request.parameters.filter(p => !p.disabled).length;
   const numHeaders = request.headers.filter(h => !h.disabled).length;
   const urlHasQueryParameters = request.url.indexOf('?') >= 0;
   const uniqueKey = `${forceRefreshCounter}::${request._id}`;
-
+  const contentType = getContentTypeFromHeaders(request.headers) || request.body.mimeType;
   return (
     <Pane type="request">
       <PaneHeader>
@@ -150,9 +160,7 @@ export const RequestPane: FC<Props> = ({
       <Tabs className={classnames(paneBodyClasses, 'react-tabs')} forceRenderTabPanel>
         <TabList>
           <Tab tabIndex="-1">
-            <ContentTypeDropdown
-              onChange={updateRequestMimeType}
-            />
+            <ContentTypeDropdown onChange={updateRequestMimeType} />
           </Tab>
           <Tab tabIndex="-1">
             <AuthDropdown />
@@ -215,7 +223,7 @@ export const RequestPane: FC<Props> = ({
               errorClassName="tall wide vertically-align font-error pad text-center"
             >
               <RequestParametersEditor
-                key={headerEditorKey}
+                key={contentType}
                 request={request}
                 bulk={settings.useBulkParametersEditor}
               />
@@ -240,7 +248,7 @@ export const RequestPane: FC<Props> = ({
         <TabPanel className="react-tabs__tab-panel header-editor">
           <ErrorBoundary key={uniqueKey} errorClassName="font-error pad text-center">
             <RequestHeadersEditor
-              key={headerEditorKey}
+              key={contentType}
               request={request}
               bulk={settings.useBulkHeaderEditor}
             />
diff --git a/packages/insomnia/src/ui/components/websockets/websocket-request-pane.tsx b/packages/insomnia/src/ui/components/websockets/websocket-request-pane.tsx
index fca4681bf9..4d7ba35c11 100644
--- a/packages/insomnia/src/ui/components/websockets/websocket-request-pane.tsx
+++ b/packages/insomnia/src/ui/components/websockets/websocket-request-pane.tsx
@@ -154,14 +154,13 @@ interface Props {
   workspaceId: string;
   environmentId: string;
   forceRefreshKey: number;
-  headerEditorKey: string;
 }
 
 // requestId is something we can read from the router params in the future.
 // essentially we can lift up the states and merge request pane and response pane into a single page and divide the UI there.
 // currently this is blocked by the way page layout divide the panes with dragging functionality
 // TODO: @gatzjames discuss above assertion in light of request and settings drills
-export const WebSocketRequestPane: FC<Props> = ({ request, workspaceId, environmentId, forceRefreshKey, headerEditorKey }) => {
+export const WebSocketRequestPane: FC<Props> = ({ request, workspaceId, environmentId, forceRefreshKey }) => {
   const readyState = useWSReadyState(request._id);
   const { useBulkParametersEditor } = useSelector(selectSettings);
 
@@ -277,7 +276,6 @@ export const WebSocketRequestPane: FC<Props> = ({ request, workspaceId, environm
               errorClassName="tall wide vertically-align font-error pad text-center"
             >
               <RequestParametersEditor
-                key={headerEditorKey}
                 request={request}
                 bulk={useBulkParametersEditor}
                 disabled={disabled}
diff --git a/packages/insomnia/src/ui/components/wrapper-debug.tsx b/packages/insomnia/src/ui/components/wrapper-debug.tsx
index 2c67b42612..9f15f7f805 100644
--- a/packages/insomnia/src/ui/components/wrapper-debug.tsx
+++ b/packages/insomnia/src/ui/components/wrapper-debug.tsx
@@ -44,8 +44,6 @@ interface Props {
   handleForceUpdateRequestHeaders: (r: Request, headers: RequestHeader[]) => Promise<Request>;
   handleImport: Function;
   handleSetResponseFilter: (filter: string) => void;
-  handleUpdateRequestMimeType: (mimeType: string | null) => Promise<Request | null>;
-  headerEditorKey: string;
   vcs: VCS | null;
 }
 export const WrapperDebug: FC<Props> = ({
@@ -58,8 +56,6 @@ export const WrapperDebug: FC<Props> = ({
   handleForceUpdateRequestHeaders,
   handleImport,
   handleSetResponseFilter,
-  handleUpdateRequestMimeType,
-  headerEditorKey,
   vcs,
 }) => {
   const activeProject = useSelector(selectActiveProject);
@@ -136,7 +132,6 @@ export const WrapperDebug: FC<Props> = ({
                   workspaceId={activeWorkspace._id}
                   environmentId={activeEnvironment ? activeEnvironment._id : ''}
                   forceRefreshKey={forceRefreshKey}
-                  headerEditorKey={headerEditorKey}
                 />
               ) : (
                 <RequestPane
@@ -145,10 +140,8 @@ export const WrapperDebug: FC<Props> = ({
                   forceUpdateRequest={handleForceUpdateRequest}
                   forceUpdateRequestHeaders={handleForceUpdateRequestHeaders}
                   handleImport={handleImport}
-                  headerEditorKey={headerEditorKey}
                   request={activeRequest}
                   settings={settings}
-                  updateRequestMimeType={handleUpdateRequestMimeType}
                   workspace={activeWorkspace}
                 />
               )
diff --git a/packages/insomnia/src/ui/components/wrapper.tsx b/packages/insomnia/src/ui/components/wrapper.tsx
index ed7475add7..0ff00daeed 100644
--- a/packages/insomnia/src/ui/components/wrapper.tsx
+++ b/packages/insomnia/src/ui/components/wrapper.tsx
@@ -121,8 +121,6 @@ const spectral = initializeSpectral();
 
 export type Props = ReturnType<typeof mapStateToProps> & ReturnType<typeof mapDispatchToProps> & {
   handleSetResponseFilter: Function;
-  handleUpdateRequestMimeType: (mimeType: string | null) => Promise<Request | null>;
-  headerEditorKey: string;
   vcs: VCS | null;
   gitVCS: GitVCS | null;
 };
@@ -313,10 +311,8 @@ export class WrapperClass extends PureComponent<Props, State> {
       activeGitRepository,
       activeWorkspace,
       activeApiSpec,
-      handleUpdateRequestMimeType,
       gitVCS,
       vcs,
-      headerEditorKey,
     } = this.props;
 
     // Setup git sync dropdown for use in Design/Debug pages
@@ -492,10 +488,8 @@ export class WrapperClass extends PureComponent<Props, State> {
                   handleForceUpdateRequestHeaders={this._handleForceUpdateRequestHeaders}
                   handleImport={this._handleImport}
                   handleSetResponseFilter={this._handleSetResponseFilter}
-                  handleUpdateRequestMimeType={handleUpdateRequestMimeType}
                   handleSetActiveResponse={this.handleSetActiveResponse}
                   vcs={vcs}
-                  headerEditorKey={headerEditorKey}
                 />
               </Suspense>
             }
diff --git a/packages/insomnia/src/ui/containers/app.tsx b/packages/insomnia/src/ui/containers/app.tsx
index 9f46d87b15..e1191e5bd0 100644
--- a/packages/insomnia/src/ui/containers/app.tsx
+++ b/packages/insomnia/src/ui/containers/app.tsx
@@ -26,10 +26,10 @@ import { GrpcRequest, isGrpcRequest } from '../../models/grpc-request';
 import { getByParentId as getGrpcRequestMetaByParentId } from '../../models/grpc-request-meta';
 import * as requestOperations from '../../models/helpers/request-operations';
 import { isNotDefaultProject } from '../../models/project';
-import { Request, updateMimeType } from '../../models/request';
+import { Request } from '../../models/request';
 import { type RequestGroupMeta } from '../../models/request-group-meta';
 import { getByParentId as getRequestMetaByParentId } from '../../models/request-meta';
-import { isWebSocketRequest, WebSocketRequest } from '../../models/websocket-request';
+import { WebSocketRequest } from '../../models/websocket-request';
 import { isWorkspace } from '../../models/workspace';
 import * as plugins from '../../plugins';
 import * as themes from '../../plugins/misc';
@@ -90,7 +90,6 @@ interface State {
   vcs: VCS | null;
   gitVCS: GitVCS | null;
   forceRefreshCounter: number;
-  forceRefreshHeaderCounter: number;
   isMigratingChildren: boolean;
 }
 
@@ -108,7 +107,6 @@ class App extends PureComponent<AppProps, State> {
       vcs: null,
       gitVCS: null,
       forceRefreshCounter: 0,
-      forceRefreshHeaderCounter: 0,
       isMigratingChildren: false,
     };
 
@@ -348,41 +346,6 @@ class App extends PureComponent<AppProps, State> {
     }, 2000);
   }
 
-  async _handleUpdateRequestMimeType(mimeType: string | null): Promise<Request | null> {
-    if (!this.props.activeRequest) {
-      console.warn('Tried to update request mime-type when no active request');
-      return null;
-    }
-
-    if (isWebSocketRequest(this.props.activeRequest)) {
-      console.warn('Tried to update request mime-type on WebSocket request');
-      return null;
-    }
-
-    const requestMeta = await models.requestMeta.getOrCreateByParentId(
-      this.props.activeRequest._id,
-    );
-    const savedBody = requestMeta.savedRequestBody;
-    const saveValue =
-      typeof mimeType !== 'string' // Switched to No body
-        ? this.props.activeRequest.body
-        : {};
-    // Clear saved value in requestMeta
-    await models.requestMeta.update(requestMeta, {
-      savedRequestBody: saveValue,
-    });
-    // @ts-expect-error -- TSCONVERSION should skip this if active request is grpc request
-    const newRequest = await updateMimeType(this.props.activeRequest, mimeType, false, savedBody);
-    // Force it to update, because other editor components (header editor)
-    // needs to change. Need to wait a delay so the next render can finish
-    setTimeout(() => {
-      this.setState({
-        forceRefreshHeaderCounter: this.state.forceRefreshHeaderCounter + 1,
-      });
-    }, 500);
-    return newRequest;
-  }
-
   _handleKeyDown(event: KeyboardEvent) {
     for (const [definition, callback] of this._globalKeyMap) {
       executeHotKey(event, definition, callback);
@@ -810,7 +773,6 @@ class App extends PureComponent<AppProps, State> {
       gitVCS,
       vcs,
       forceRefreshCounter,
-      forceRefreshHeaderCounter,
     } = this.state;
     const uniquenessKey = `${forceRefreshCounter}::${activeWorkspace?._id || 'n/a'}`;
     return (
@@ -824,8 +786,6 @@ class App extends PureComponent<AppProps, State> {
                 <Wrapper
                   ref={this._setWrapperRef}
                   handleSetResponseFilter={this._handleSetResponseFilter}
-                  handleUpdateRequestMimeType={this._handleUpdateRequestMimeType}
-                  headerEditorKey={forceRefreshHeaderCounter + ''}
                   vcs={vcs}
                   gitVCS={gitVCS}
                 />