Fix env editor switching

src-web/components/core/PairEditor.tsx

@@ -12,6 +12,7 @@ import {
 } from 'react';
 import type { XYCoord } from 'react-dnd';
 import { useDrag, useDrop } from 'react-dnd';
+import { useRandomKey } from '../../hooks/useRandomKey';
 import { useToggle } from '../../hooks/useToggle';
 import { languageFromContentType } from '../../lib/contentType';
 import { showDialog } from '../../lib/dialog';
@@ -107,6 +108,9 @@ export const PairEditor = forwardRef<PairEditorRef, PairEditorProps>(function Pa
   const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);
   const [pairs, setPairs] = useState<PairWithId[]>([]);
   const [showAll, toggleShowAll] = useToggle(false);
+  // NOTE: Use local force update key because we trigger an effect on forceUpdateKey change. If
+  //  we simply pass forceUpdateKey to the editor, the data set by useEffect will be stale.
+  const [localForceUpdateKey, regenerateLocalForceUpdateKey] = useRandomKey();
 
   useImperativeHandle(
     ref,
@@ -136,6 +140,7 @@ export const PairEditor = forwardRef<PairEditorRef, PairEditorProps>(function Pa
     }
 
     setPairs(newPairs);
+    regenerateLocalForceUpdateKey();
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [forceUpdateKey]);
@@ -240,7 +245,7 @@ export const PairEditor = forwardRef<PairEditorRef, PairEditorProps>(function Pa
               forcedEnvironmentId={forcedEnvironmentId}
               forceFocusNamePairId={forceFocusNamePairId}
               forceFocusValuePairId={forceFocusValuePairId}
-              forceUpdateKey={forceUpdateKey}
+              forceUpdateKey={localForceUpdateKey}
               index={i}
               isLast={isLast}
               nameAutocomplete={nameAutocomplete}

src-web/hooks/useImportCurl.ts

@@ -1,5 +1,6 @@
-import type { HttpRequest} from '@yaakapp-internal/models';
-import { createWorkspaceModel, patchModelById } from '@yaakapp-internal/models';
+import type { HttpRequest } from '@yaakapp-internal/models';
+import { patchModelById } from '@yaakapp-internal/models';
+import { createRequestAndNavigate } from '../lib/createRequestAndNavigate';
 import { jotaiStore } from '../lib/jotai';
 import { invokeCmd } from '../lib/tauri';
 import { showToast } from '../lib/toast';
@@ -26,7 +27,7 @@ export function useImportCurl() {
       let verb;
       if (overwriteRequestId == null) {
         verb = 'Created';
-        await createWorkspaceModel(importedRequest);
+        await createRequestAndNavigate(importedRequest);
       } else {
         verb = 'Updated';
         await patchModelById(importedRequest.model, overwriteRequestId, (r: HttpRequest) => ({

src-web/lib/contentType.ts

@@ -11,7 +11,7 @@ export function languageFromContentType(
   } else if (justContentType.includes('xml')) {
     return 'xml';
   } else if (justContentType.includes('html')) {
-    const detected = detectFromContent(content, 'html');
+    const detected = detectFromContent(content);
     if (detected === 'xml') {
       // If it's detected as XML, but is already HTML, don't change it
       return 'html';
@@ -19,7 +19,8 @@ export function languageFromContentType(
       return detected;
     }
   } else if (justContentType.includes('javascript')) {
-    return 'javascript';
+    // Sometimes `application/javascript` returns JSON, so try detecting that
+    return detectFromContent(content, 'javascript');
   }
 
   return detectFromContent(content, 'text');
@@ -27,7 +28,7 @@ export function languageFromContentType(
 
 function detectFromContent(
   content: string | null,
-  fallback: EditorProps['language'],
+  fallback?: EditorProps['language'],
 ): EditorProps['language'] {
   if (content == null) return 'text';