fix: fix permission rangeSelector & insert menu

packages/sheets-ui/src/controllers/menu/insert.menu.ts

@@ -14,6 +14,8 @@
  * limitations under the License.
  */
 
+import type { IAccessor } from '@univerjs/core';
+import type { IMenuButtonItem, IMenuSelectorItem } from '@univerjs/ui';
 import {
  InsertColAfterCommand,
  InsertColBeforeCommand,
@@ -25,13 +27,11 @@ import {
  WorksheetInsertColumnPermission,
  WorksheetInsertRowPermission,
 } from '@univerjs/sheets';
-import type { IMenuButtonItem, IMenuSelectorItem } from '@univerjs/ui';
 import { MenuItemType } from '@univerjs/ui';
-import type { IAccessor } from '@univerjs/core';
 
 import { InsertRangeMoveDownConfirmCommand } from '../../commands/commands/insert-range-move-down-confirm.command';
 import { InsertRangeMoveRightConfirmCommand } from '../../commands/commands/insert-range-move-right-confirm.command';
-import { getBaseRangeMenuHidden$, getCellMenuHidden$, getCurrentRangeDisable$, getInsertAfterMenuHidden$, getInsertBeforeMenuHidden$, getObservableWithExclusiveRange$ } from './menu-util';
+import { getBaseRangeMenuHidden$, getCellMenuHidden$, getCurrentRangeDisable$, getObservableWithExclusiveRange$ } from './menu-util';
 
 export const COL_INSERT_MENU_ID = 'sheet.menu.col-insert';
 export function ColInsertMenuItemFactory(accessor: IAccessor): IMenuSelectorItem<string> {
@@ -40,7 +40,6 @@ export function ColInsertMenuItemFactory(accessor: IAccessor): IMenuSelectorItem
  type: MenuItemType.SUBITEMS,
  title: 'rightClick.insert',
  icon: 'Insert',
- hidden$: getBaseRangeMenuHidden$(accessor),
  disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetEditPermission, WorksheetInsertColumnPermission] }),
  };
 }
@@ -52,8 +51,7 @@ export function RowInsertMenuItemFactory(accessor: IAccessor): IMenuSelectorItem
  type: MenuItemType.SUBITEMS,
  title: 'rightClick.insert',
  icon: 'Insert',
- hidden$: getBaseRangeMenuHidden$(accessor),
- disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertRowPermission, WorksheetEditPermission], rangeTypes: [RangeProtectionPermissionEditPoint] }),
+ disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertRowPermission, WorksheetEditPermission] }),
  };
 }
 
@@ -75,8 +73,7 @@ export function InsertRowBeforeMenuItemFactory(accessor: IAccessor): IMenuButton
  type: MenuItemType.BUTTON,
  title: 'rightClick.insertRowBefore',
  icon: 'InsertRowAbove',
- disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertRowPermission, WorksheetEditPermission], rangeTypes: [RangeProtectionPermissionEditPoint] }),
- hidden$: getInsertBeforeMenuHidden$(accessor, 'row'),
+ disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertRowPermission, WorksheetEditPermission] }),
  };
 }
 
@@ -86,8 +83,7 @@ export function InsertRowAfterMenuItemFactory(accessor: IAccessor): IMenuButtonI
  type: MenuItemType.BUTTON,
  title: 'rightClick.insertRow',
  icon: 'InsertRowBelow',
- disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertRowPermission, WorksheetEditPermission], rangeTypes: [RangeProtectionPermissionEditPoint] }),
- hidden$: getInsertAfterMenuHidden$(accessor, 'row'),
+ disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertRowPermission, WorksheetEditPermission] }),
  };
 }
 
@@ -97,8 +93,7 @@ export function InsertColBeforeMenuItemFactory(accessor: IAccessor): IMenuButton
  type: MenuItemType.BUTTON,
  title: 'rightClick.insertColumnBefore',
  icon: 'LeftInsertColumn',
- disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertColumnPermission, WorksheetEditPermission], rangeTypes: [RangeProtectionPermissionEditPoint] }),
- hidden$: getInsertBeforeMenuHidden$(accessor, 'col'),
+ disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertColumnPermission, WorksheetEditPermission] }),
  };
 }
 
@@ -108,8 +103,7 @@ export function InsertColAfterMenuItemFactory(accessor: IAccessor): IMenuButtonI
  type: MenuItemType.BUTTON,
  title: 'rightClick.insertColumn',
  icon: 'RightInsertColumn',
- disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertColumnPermission, WorksheetEditPermission], rangeTypes: [RangeProtectionPermissionEditPoint] }),
- hidden$: getInsertAfterMenuHidden$(accessor, 'col'),
+ disabled$: getCurrentRangeDisable$(accessor, { workbookTypes: [WorkbookEditablePermission], worksheetTypes: [WorksheetInsertColumnPermission, WorksheetEditPermission] }),
  };
 }
 

packages/sheets-ui/src/views/permission/panel-detail/index.tsx

@@ -59,7 +59,7 @@ export const SheetPermissionPanelDetail = ({ fromSheetBar }: { fromSheetBar: boo
 
  const selectUserList = useObservable(sheetPermissionUserManagerService.selectUserList$, sheetPermissionUserManagerService.selectUserList);
 
-// The status of these two collaborators is updated directly by calling the interface, and will not be written to the snapshot or undoredo, so they are pulled in real time when they need to be displayed.
+ // The status of these two collaborators is updated directly by calling the interface, and will not be written to the snapshot or undoredo, so they are pulled in real time when they need to be displayed.
  const [editorGroupValue, setEditorGroupValue] = React.useState<editState>(selectUserList.length ? editState.designedUserCanEdit : editState.onlyMe);
  const [viewGroupValue, setViewGroupValue] = React.useState(viewState.othersCanView);
  const [loading, setLoading] = useState(!!activeRule?.permissionId);
@@ -330,6 +330,61 @@ export const SheetPermissionPanelDetail = ({ fromSheetBar }: { fromSheetBar: boo
  handleOutClick && handleOutClick(e, isFocusRangeSelectorSet);
  };
 
+ useLayoutEffect(() => {
+ const isEdit = activeRule?.permissionId;
+ if (isEdit) {
+ if (activeRule.unitType === UnitObject.Worksheet) {
+ sheetPermissionPanelModel.setRule({
+ ranges: [{
+ startRow: 0,
+ startColumn: 0,
+ endRow: worksheet.getRowCount() - 1,
+ endColumn: worksheet.getColumnCount() - 1,
+ rangeType: RANGE_TYPE.ALL,
+ }],
+ });
+ }
+ return;
+ }
+ if (fromSheetBar) {
+ selectionManagerService.clearCurrentSelections();
+ selectionManagerService.addSelections([
+ {
+ primary: null,
+ style: null,
+ range: {
+ startRow: 0,
+ startColumn: 0,
+ endRow: worksheet.getRowCount() - 1,
+ endColumn: worksheet.getColumnCount() - 1,
+ rangeType: RANGE_TYPE.ALL,
+ },
+ },
+ ]);
+ }
+ const ranges = selectionManagerService.getCurrentSelections()?.map((s) => s.range) ?? [];
+ const rangeErrorString = checkRangeValid(ranges);
+ sheetPermissionPanelModel.setRangeErrorMsg(rangeErrorString);
+ const rangeStr = ranges?.length
+ ? ranges.map((range) => {
+ const v = serializeRange(range);
+ return v === 'NaN' ? '' : v;
+ }).filter((r) => !!r).join(',')
+ : '';
+ const sheetName = worksheet.getName();
+ sheetPermissionPanelModel.setRule({
+ ranges,
+ name: fromSheetBar ? `${sheetName}` : `${sheetName}(${rangeStr})`,
+ unitId,
+ subUnitId,
+ unitType: fromSheetBar ? UnitObject.Worksheet : UnitObject.SelectRange,
+
+ });
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [activeRule?.permissionId, fromSheetBar, subUnitId, unitId, worksheet]);
+
+ const rangeStr = activeRule?.ranges?.map((i) => serializeRange(i)).join(',');
+
  return (
  <div className={styles.permissionPanelDetailWrapper} onClick={handlePanelClick}>
  {/* <FormLayout className={styles.sheetPermissionPanelTitle} label={localeService.t('permission.panel.name')}>
@@ -344,16 +399,17 @@ export const SheetPermissionPanelDetail = ({ fromSheetBar }: { fromSheetBar: boo
  <FormLayout className={styles.sheetPermissionPanelTitle} label={localeService.t('permission.panel.protectedRange')}>
  {RangeSelector && (
  <RangeSelector
+ key={rangeStr}
  unitId={unitId}
  errorText={rangeErrorMsg}
  subUnitId={subUnitId}
- initValue={activeRule?.ranges?.map((i) => serializeRange(i)).join(',')}
+ initValue={rangeStr}
  onChange={handleRangeChange}
- // onVerify={handleVerify}
+  // onVerify={handleVerify}
  isFocus={isFocusRangeSelector}
  actions={rangeSelectorActionsRef.current}
  />
- ) }
+ )}
  </FormLayout>
  <FormLayout className={styles.sheetPermissionPanelTitle} label={localeService.t('permission.panel.permissionDirection')}>
  <Input