fix(sheets-formula-ui): handle range selector close (#7603)

Author: wpxp123456

packages/sheets-formula-ui/src/views/range-selector/Global.tsx

@@ -40,8 +40,10 @@ export const GlobalRangeSelector = () => {
         <RangeSelector
             unitId={current?.unitId ?? ''}
             subUnitId={current?.subUnitId ?? ''}
+            maxRangeCount={current?.maxRangeCount}
             hideEditor
             selectorRef={instance}
+            onClose={() => current?.callback([])}
             onChange={(_, value) => {
                 current?.callback(value?.split(',').map((i) => deserializeRangeWithSheet(i)) ?? []);
             }}

packages/sheets-formula-ui/src/views/range-selector/__tests__/GlobalRangeSelector.spec.tsx

@@ -36,7 +36,7 @@ import { RediContext } from '@univerjs/ui';
 import { act, createRef } from 'react';
 import { createRoot } from 'react-dom/client';
 import { Subject } from 'rxjs';
-import { afterEach, beforeEach, describe, expect, it } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { GlobalRangeSelectorService } from '../../../services/range-selector.service';
 import { GlobalRangeSelector } from '../Global';
 import { RangeSelector } from '../index';
@@ -275,6 +275,60 @@ describe('GlobalRangeSelector', () => {
         ]);
     });
 
+    it('applies maxRangeCount to the global selector dialog', async () => {
+        const { injector, service } = createGlobalRangeSelectorTestBed();
+
+        await act(async () => {
+            root.render(
+                <RediContext.Provider value={{ injector }}>
+                    <GlobalRangeSelector />
+                </RediContext.Provider>
+            );
+            await Promise.resolve();
+        });
+
+        await act(async () => {
+            service.showRangeSelectorDialog({
+                unitId: 'book-1',
+                subUnitId: 'sheet-1',
+                maxRangeCount: 1,
+                callback: vi.fn(),
+            });
+            await Promise.resolve();
+        });
+
+        expect(document.body.textContent).not.toContain('Add range');
+    });
+
+    it('calls the callback with an empty range when the global selector dialog is cancelled', async () => {
+        const { injector, service } = createGlobalRangeSelectorTestBed();
+        const callback = vi.fn();
+
+        await act(async () => {
+            root.render(
+                <RediContext.Provider value={{ injector }}>
+                    <GlobalRangeSelector />
+                </RediContext.Provider>
+            );
+            await Promise.resolve();
+        });
+
+        let promise!: Promise<IUnitRangeName[]>;
+        await act(async () => {
+            promise = service.showRangeSelectorDialog({
+                unitId: 'book-1',
+                subUnitId: 'sheet-1',
+                callback,
+            });
+            await Promise.resolve();
+        });
+
+        await clickButton('Cancel');
+
+        expect(callback).toHaveBeenCalledWith([]);
+        await expect(promise).resolves.toEqual([]);
+    });
+
     it('restores the caller selection when a range selector dialog is cancelled', async () => {
         const { commandService, injector } = createGlobalRangeSelectorTestBed();
         const selectorRef = createRef<IRangeSelectorInstance | null>();

packages/sheets-formula-ui/src/views/range-selector/index.tsx

@@ -65,6 +65,7 @@ export interface IRangeSelectorProps extends IRichTextEditorProps {
     hideEditor?: boolean;
     forceShowDialogWhenSelectionChanged?: boolean;
     resetRange?: ISelectionWithStyle[];
+    onClose?: () => void;
 };
 
 export interface IRangeSelectorDialogProps {
@@ -258,6 +259,7 @@ export function RangeSelector(props: IRangeSelectorProps) {
         forceShowDialogWhenSelectionChanged,
         hideEditor,
         resetRange,
+        onClose,
     } = props;
     const [focusing, setFocusing] = useState(autoFocus ?? false);
     const [popupVisible, setPopupVisible] = useState(false);
@@ -378,6 +380,7 @@ export function RangeSelector(props: IRangeSelectorProps) {
                 onClose={() => {
                     setPopupVisible(false);
                     setRangeSelectorRanges([]);
+                    onClose?.();
                 }}
                 supportAcrossSheet={supportAcrossSheet}
                 keepSheetReference={keepSheetReference}