update

Author: MrWangJustToDo

packages/core/src/diff-file.ts

@@ -710,10 +710,10 @@ export class DiffFile {
   }
 
   initId() {
-    let id = "diff--" + Math.random().toString().slice(2);
+    let id = "-diff--" + Math.random().toString().slice(2);
 
     while (idSet.has(id)) {
-      id = "diff--" + Math.random().toString().slice(2);
+      id = "-diff--" + Math.random().toString().slice(2);
     }
 
     idSet.add(id);

packages/core/src/file.ts

@@ -107,10 +107,10 @@ export class File {
   }
 
   initId() {
-    let id = "file--" + Math.random().toString().slice(2);
+    let id = "-file--" + Math.random().toString().slice(2);
 
     while (idSet.has(id)) {
-      id = "file--" + Math.random().toString().slice(2);
+      id = "-file--" + Math.random().toString().slice(2);
     }
 
     idSet.add(id);

packages/react/src/components/DiffViewWithMultiSelect.tsx

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useRef, useImperativeHandle, useState,
 
 import { multiSelectClassNames, createDiffMultiSelectManager } from "..";
 import { useCallbackRef } from "../hooks/useCallbackRef";
+import { useUpdateEffect } from "../hooks/useUpdateEffect";
 
 import { DiffModeEnum, DiffView, SplitSide } from "./DiffView";
 
@@ -124,6 +125,10 @@ const InternalDiffViewWithMultiSelect = <T extends unknown>(
 
   const isUnifiedMode = !(diffViewMode & DiffModeEnum.Split);
 
+  useUpdateEffect(() => {
+    setMultiResult(undefined);
+  }, [props.diffViewWrap, diffViewMode]);
+
   const getDiffFile = useCallback(() => {
     return diffViewRef.current?.getDiffFileInstance() ?? null;
   }, []);
@@ -289,6 +294,8 @@ const InternalDiffViewWithMultiSelect = <T extends unknown>(
           if (multiResult) {
             const currentSide = SplitSide[side] as unknown as "new" | "old";
             const currentMultiResult = multiResult[currentSide] as number[];
+            const otherSide = currentSide === "new" ? "old" : "new";
+            const otherMultiResult = multiResult[otherSide] as number[];
             if (currentMultiResult?.length) {
               const max = Math.max(...currentMultiResult);
               if (max === lineNum) {
@@ -298,6 +305,19 @@ const InternalDiffViewWithMultiSelect = <T extends unknown>(
                 return;
               }
             }
+            if (isUnifiedMode && otherMultiResult?.length) {
+              const max = Math.max(...otherMultiResult);
+              if (max === lineNum) {
+                const finalResult = { [otherSide]: otherMultiResult };
+                setMultiResult(finalResult as typeof multiResult);
+                onAddWidgetClick?.({
+                  lineNumber: max,
+                  fromLineNumber: Math.min(...otherMultiResult),
+                  side: otherSide === "old" ? SplitSide.old : SplitSide.new,
+                });
+                return;
+              }
+            }
             setMultiResult({ old: [], new: [] });
             onAddWidgetClick?.({ lineNumber: lineNum, fromLineNumber: lineNum, side });
           } else {

packages/react/src/hooks/useUpdateEffect.ts

@@ -0,0 +1,15 @@
+import { useEffect, useRef } from "react";
+
+import type { DependencyList, EffectCallback } from "react";
+
+export const useUpdateEffect = (effect: EffectCallback, deps: DependencyList) => {
+  const isMounted = useRef(false);
+
+  useEffect(() => {
+    if (isMounted.current) {
+      return effect();
+    }
+    isMounted.current = true;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, deps);
+};

packages/solid/src/components/DiffViewWithMultiSelect.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unnecessary-type-constraint */
 import { SplitSide, createDiffMultiSelectManager, multiSelectClassNames } from "@git-diff-view/core";
 import { DiffModeEnum } from "@git-diff-view/utils";
-import { type JSXElement, type JSX, createSignal, createEffect, createMemo, onCleanup } from "solid-js";
+import { type JSXElement, type JSX, createSignal, createEffect, createMemo, onCleanup, on } from "solid-js";
 
 import { DiffView } from "./DiffView";
 
@@ -123,6 +123,16 @@ const InternalDiffViewWithMultiSelect = <T extends unknown>(props: DiffViewWithM
   const enableMultiSelect = () => props.enableMultiSelect ?? true;
   const isUnifiedMode = () => !((props.diffViewMode ?? DiffModeEnum.SplitGitHub) & DiffModeEnum.Split);
 
+  createEffect(
+    on(
+      () => [props.diffViewWrap, props.diffViewMode],
+      () => {
+        setMultiResult(undefined);
+      },
+      { defer: true }
+    )
+  );
+
   createEffect(() => {
     const container = containerRef();
     const diffFile = innerDiffFile();
@@ -218,7 +228,9 @@ const InternalDiffViewWithMultiSelect = <T extends unknown>(props: DiffViewWithM
     const currentMultiResult = multiResult();
     if (currentMultiResult) {
       const currentSide = SplitSide[side] as unknown as "new" | "old";
+      const otherSide = currentSide === "new" ? "old" : "new";
       const sideResult = currentMultiResult[currentSide] as number[];
+      const otherSideResult = currentMultiResult[otherSide] as number[];
       if (sideResult?.length) {
         const max = Math.max(...sideResult);
         if (max === lineNum) {
@@ -232,6 +244,19 @@ const InternalDiffViewWithMultiSelect = <T extends unknown>(props: DiffViewWithM
           return;
         }
       }
+      if (isUnifiedMode() && otherSideResult?.length) {
+        const max = Math.max(...otherSideResult);
+        if (max === lineNum) {
+          const finalResult = { [otherSide]: otherSideResult };
+          setMultiResult(finalResult as ReturnType<typeof extendDataToPreselectedLines>);
+          props.onAddWidgetClick?.({
+            lineNumber: max,
+            fromLineNumber: Math.min(...otherSideResult),
+            side: otherSide === "old" ? SplitSide.old : SplitSide.new,
+          });
+          return;
+        }
+      }
       setMultiResult({ old: [], new: [] });
       props.onAddWidgetClick?.({ lineNumber: lineNum, fromLineNumber: lineNum, side });
     } else {

packages/svelte/src/lib/components/DiffViewWithMultiSelect.svelte

@@ -202,6 +202,17 @@
 		}
 	};
 
+	let isWrapModeInitial = true;
+	$effect(() => {
+		props.diffViewWrap;
+		props.diffViewMode;
+		if (isWrapModeInitial) {
+			isWrapModeInitial = false;
+			return;
+		}
+		multiResult = undefined;
+	});
+
 	$effect(initManager);
 
 	$effect(() => {
@@ -219,6 +230,8 @@
 		if (multiResult) {
 			const currentSide = SplitSide[side] as unknown as 'new' | 'old';
 			const currentMultiResult = multiResult[currentSide] as number[];
+			const otherSide = currentSide === "new" ? "old" : "new";
+			const otherMultiResult = multiResult[otherSide] as number[];
 			if (currentMultiResult?.length) {
 				const max = Math.max(...currentMultiResult);
 				if (max === lineNum) {
@@ -232,6 +245,19 @@
 					return;
 				}
 			}
+			if (isUnifiedMode && otherMultiResult?.length) {
+				const max = Math.max(...otherMultiResult);
+				if (max === lineNum) {
+					const finalResult = { [otherSide]: otherMultiResult };
+					multiResult = finalResult as typeof multiResult;
+					props.onAddWidgetClick?.({
+						lineNumber: max,
+						fromLineNumber: Math.min(...otherMultiResult),
+						side: otherSide === "old" ? SplitSide.old : SplitSide.new
+					});
+					return;
+				}
+			}
 			multiResult = { old: [], new: [] };
 			props.onAddWidgetClick?.({ lineNumber: lineNum, fromLineNumber: lineNum, side });
 		} else {

packages/vue/src/components/DiffViewWithMultiSelect.tsx

@@ -150,6 +150,13 @@ export const DiffViewWithMultiSelect = defineComponent<
       });
     };
 
+    watch(
+      () => [props.diffViewWrap, props.diffViewMode],
+      () => {
+        multiResult.value = undefined;
+      }
+    );
+
     watchEffect((onClean) => initManager(onClean));
 
     watch(
@@ -192,6 +199,8 @@ export const DiffViewWithMultiSelect = defineComponent<
       if (multiResult.value) {
         const currentSide = SplitSide[side] as unknown as "new" | "old";
         const currentMultiResult = multiResult.value[currentSide] as number[];
+        const otherSide = currentSide === "new" ? "old" : "new";
+        const otherMultiResult = multiResult.value[otherSide] as number[];
         if (currentMultiResult?.length) {
           const max = Math.max(...currentMultiResult);
           if (max === lineNum) {
@@ -205,6 +214,19 @@ export const DiffViewWithMultiSelect = defineComponent<
             return;
           }
         }
+        if (isUnifiedMode.value && otherMultiResult?.length) {
+          const max = Math.max(...otherMultiResult);
+          if (max === lineNum) {
+            const finalResult = { [otherSide]: otherMultiResult };
+            multiResult.value = finalResult as typeof multiResult.value;
+            options.emit("onAddWidgetClick", {
+              lineNumber: max,
+              fromLineNumber: Math.min(...otherMultiResult),
+              side: otherSide === "old" ? SplitSide.old : SplitSide.new,
+            });
+            return;
+          }
+        }
         multiResult.value = { old: [], new: [] };
         options.emit("onAddWidgetClick", { lineNumber: lineNum, fromLineNumber: lineNum, side });
       } else {