@univerjs/sheets-filter-ui 1.0.0-alpha.2 → 1.0.0-alpha.3

package/lib/index.js

@@ -7,7 +7,7 @@ import { INTERCEPTOR_POINT, RangeProtectionPermissionViewPoint, RefRangeService,
 import { BehaviorSubject, ReplaySubject, Subject, combineLatest, distinctUntilChanged, filter, map, merge as merge$1, of, shareReplay, startWith, switchMap, takeUntil, throttleTime } from "rxjs";
 import { AIcon, BanIcon, FilterIcon, InfoIcon, SuccessIcon } from "@univerjs/icons";
 import { Button, Checkbox, Input, MessageType, Radio, RadioGroup, Segmented, Select, Switch, Tooltip, Tree, borderClassName, clsx } from "@univerjs/design";
-import { useCallback, useMemo } from "react";
+import { useCallback } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { IRPCChannelService, fromModule, toModule } from "@univerjs/rpc";
 
@@ -1478,7 +1478,7 @@ const OpenFilterPanelOperation = {
 	handler: (accessor, params) => {
 		const contextService = accessor.get(IContextService);
 		const sheetsFilterService = accessor.get(SheetsFilterService);
-		const sheetsFilterPanelService = accessor.get(SheetsFilterPanelService);
+		const sheetsFilterPanelService = accessor.get(ISheetsFilterPanelService);
 		const commandService = accessor.get(ICommandService);
 		const editorBridgeService = accessor.has(IEditorBridgeService) ? accessor.get(IEditorBridgeService) : null;
 		if (editorBridgeService === null || editorBridgeService === void 0 ? void 0 : editorBridgeService.isVisible().visible) commandService.syncExecuteCommand(SetCellEditVisibleOperation.id, { visible: false });
@@ -1495,7 +1495,7 @@ const CloseFilterPanelOperation = {
 	type: CommandType.OPERATION,
 	handler: (accessor) => {
 		const contextService = accessor.get(IContextService);
-		const sheetsFilterPanelService = accessor.get(SheetsFilterPanelService);
+		const sheetsFilterPanelService = accessor.get(ISheetsFilterPanelService);
 		const layoutService = accessor.get(ILayoutService, Quantity.OPTIONAL);
 		if (contextService.getContextValue("FILTER_PANEL_OPENED")) {
 			contextService.setContextValue(FILTER_PANEL_OPENED_KEY, false);
@@ -1510,14 +1510,73 @@ const ChangeFilterByOperation = {
 	type: CommandType.OPERATION,
 	handler: (accessor, params) => {
 		const { filterBy } = params;
-		return accessor.get(SheetsFilterPanelService).changeFilterBy(filterBy);
+		return accessor.get(ISheetsFilterPanelService).changeFilterBy(filterBy);
 	}
 };
 
+//#endregion
+//#region src/menu/sheets-filter.menu.ts
+function SmartToggleFilterMenuItemFactory(accessor) {
+	const sheetsFilterService = accessor.get(SheetsFilterService);
+	return {
+		id: SmartToggleSheetsFilterCommand.id,
+		type: MenuItemType.BUTTON_SELECTOR,
+		icon: "FilterIcon",
+		tooltip: "sheets-filter-ui.toolbar.smart-toggle-filter-tooltip",
+		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
+		activated$: sheetsFilterService.activeFilterModel$.pipe(map((model) => !!model)),
+		disabled$: getObservableWithExclusiveRange$(accessor, getCurrentRangeDisable$(accessor, {
+			worksheetTypes: [WorksheetFilterPermission, WorksheetViewPermission],
+			rangeTypes: [RangeProtectionPermissionViewPoint]
+		}))
+	};
+}
+function ClearFilterCriteriaMenuItemFactory(accessor) {
+	const sheetsFilterService = accessor.get(SheetsFilterService);
+	return {
+		id: ClearSheetsFilterCriteriaCommand.id,
+		type: MenuItemType.BUTTON,
+		title: "sheets-filter-ui.toolbar.clear-filter-criteria",
+		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
+		disabled$: sheetsFilterService.activeFilterModel$.pipe(switchMap((model) => {
+			var _model$hasCriteria$$p;
+			return (_model$hasCriteria$$p = model === null || model === void 0 ? void 0 : model.hasCriteria$.pipe(map((m) => !m))) !== null && _model$hasCriteria$$p !== void 0 ? _model$hasCriteria$$p : of(true);
+		}))
+	};
+}
+function ReCalcFilterMenuItemFactory(accessor) {
+	const sheetsFilterService = accessor.get(SheetsFilterService);
+	return {
+		id: ReCalcSheetsFilterCommand.id,
+		type: MenuItemType.BUTTON,
+		title: "sheets-filter-ui.toolbar.re-calc-filter-conditions",
+		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
+		disabled$: sheetsFilterService.activeFilterModel$.pipe(switchMap((model) => {
+			var _model$hasCriteria$$p2;
+			return (_model$hasCriteria$$p2 = model === null || model === void 0 ? void 0 : model.hasCriteria$.pipe(map((m) => !m))) !== null && _model$hasCriteria$$p2 !== void 0 ? _model$hasCriteria$$p2 : of(true);
+		}))
+	};
+}
+
+//#endregion
+//#region src/menu/schema.ts
+const menuSchema = { [RibbonDataGroup.ORGANIZATION]: { [SmartToggleSheetsFilterCommand.id]: {
+	order: 2,
+	menuItemFactory: SmartToggleFilterMenuItemFactory,
+	[ClearSheetsFilterCriteriaCommand.id]: {
+		order: 0,
+		menuItemFactory: ClearFilterCriteriaMenuItemFactory
+	},
+	[ReCalcSheetsFilterCommand.id]: {
+		order: 1,
+		menuItemFactory: ReCalcFilterMenuItemFactory
+	}
+} } };
+
 //#endregion
 //#region package.json
 var name = "@univerjs/sheets-filter-ui";
-var version = "1.0.0-alpha.2";
+var version = "1.0.0-alpha.3";
 
 //#endregion
 //#region src/config/config.ts
@@ -1594,6 +1653,28 @@ function CheckedIcon() {
 
 //#endregion
 //#region src/views/components/SheetsFilterByConditionsPanel.tsx
+const PRIMARY_CONDITION_GROUPS = [
+	[FilterConditionItems.NONE],
+	[FilterConditionItems.EMPTY, FilterConditionItems.NOT_EMPTY],
+	[
+		FilterConditionItems.TEXT_CONTAINS,
+		FilterConditionItems.DOES_NOT_CONTAIN,
+		FilterConditionItems.STARTS_WITH,
+		FilterConditionItems.ENDS_WITH,
+		FilterConditionItems.EQUALS
+	],
+	[
+		FilterConditionItems.GREATER_THAN,
+		FilterConditionItems.GREATER_THAN_OR_EQUAL,
+		FilterConditionItems.LESS_THAN,
+		FilterConditionItems.LESS_THAN_OR_EQUAL,
+		FilterConditionItems.EQUAL,
+		FilterConditionItems.NOT_EQUAL,
+		FilterConditionItems.BETWEEN,
+		FilterConditionItems.NOT_BETWEEN
+	],
+	[FilterConditionItems.CUSTOM]
+];
 /**
 * Filter by conditions.
 */
@@ -1607,11 +1688,17 @@ function FilterByCondition(props) {
 	const onRadioChange = useCallback((key) => {
 		model.onConditionFormChange({ and: key === "AND" });
 	}, [model]);
-	const primaryOptions = usePrimaryOptions(localeService);
+	const primaryOptions = PRIMARY_CONDITION_GROUPS.map((group) => ({ options: group.map((conditionItem) => ({
+		label: localeService.t(conditionItem.label),
+		value: conditionItem.operator
+	})) }));
 	const onPrimaryConditionChange = useCallback((value) => {
 		model.onPrimaryConditionChange(value);
 	}, [model]);
-	const secondaryOptions = useSecondaryOptions(localeService);
+	const secondaryOptions = FilterConditionItems.ALL_CONDITIONS.filter((conditionItem) => conditionItem.numOfParameters !== 2).map((conditionItem) => ({
+		label: localeService.t(conditionItem.label),
+		value: conditionItem.operator
+	}));
 	const onFormParamsChange = useCallback((diffParams) => {
 		model.onConditionFormChange(diffParams);
 	}, [model]);
@@ -1669,87 +1756,6 @@ function FilterByCondition(props) {
 		}) : null] })
 	});
 }
-function usePrimaryOptions(localeService) {
-	return useMemo(() => [
-		{ options: [{
-			label: localeService.t(FilterConditionItems.NONE.label),
-			value: FilterConditionItems.NONE.operator
-		}] },
-		{ options: [{
-			label: localeService.t(FilterConditionItems.EMPTY.label),
-			value: FilterConditionItems.EMPTY.operator
-		}, {
-			label: localeService.t(FilterConditionItems.NOT_EMPTY.label),
-			value: FilterConditionItems.NOT_EMPTY.operator
-		}] },
-		{ options: [
-			{
-				label: localeService.t(FilterConditionItems.TEXT_CONTAINS.label),
-				value: FilterConditionItems.TEXT_CONTAINS.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.DOES_NOT_CONTAIN.label),
-				value: FilterConditionItems.DOES_NOT_CONTAIN.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.STARTS_WITH.label),
-				value: FilterConditionItems.STARTS_WITH.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.ENDS_WITH.label),
-				value: FilterConditionItems.ENDS_WITH.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.EQUALS.label),
-				value: FilterConditionItems.EQUALS.operator
-			}
-		] },
-		{ options: [
-			{
-				label: localeService.t(FilterConditionItems.GREATER_THAN.label),
-				value: FilterConditionItems.GREATER_THAN.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.GREATER_THAN_OR_EQUAL.label),
-				value: FilterConditionItems.GREATER_THAN_OR_EQUAL.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.LESS_THAN.label),
-				value: FilterConditionItems.LESS_THAN.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.LESS_THAN_OR_EQUAL.label),
-				value: FilterConditionItems.LESS_THAN_OR_EQUAL.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.EQUAL.label),
-				value: FilterConditionItems.EQUAL.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.NOT_EQUAL.label),
-				value: FilterConditionItems.NOT_EQUAL.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.BETWEEN.label),
-				value: FilterConditionItems.BETWEEN.operator
-			},
-			{
-				label: localeService.t(FilterConditionItems.NOT_BETWEEN.label),
-				value: FilterConditionItems.NOT_BETWEEN.operator
-			}
-		] },
-		{ options: [{
-			label: localeService.t(FilterConditionItems.CUSTOM.label),
-			value: FilterConditionItems.CUSTOM.operator
-		}] }
-	], [localeService.getCurrentLocale(), localeService]);
-}
-function useSecondaryOptions(localeService) {
-	return useMemo(() => FilterConditionItems.ALL_CONDITIONS.filter((c) => c.numOfParameters !== 2).map((c) => ({
-		label: localeService.t(c.label),
-		value: c.operator
-	})), [localeService.getCurrentLocale(), localeService]);
-}
 
 //#endregion
 //#region src/views/components/SheetsFilterByValuesPanel.tsx
@@ -1897,6 +1903,20 @@ function FilterSyncSwitch() {
 
 //#endregion
 //#region src/views/components/SheetsFilterPanel.tsx
+const FILTER_BY_OPTIONS = [
+	{
+		label: "sheets-filter-ui.panel.by-values",
+		value: FilterBy.VALUES
+	},
+	{
+		label: "sheets-filter-ui.panel.by-colors",
+		value: FilterBy.COLORS
+	},
+	{
+		label: "sheets-filter-ui.panel.by-conditions",
+		value: FilterBy.CONDITIONS
+	}
+];
 /**
 * This Filter Panel component is used to filter the data in the sheet.
 *
@@ -1904,13 +1924,16 @@ function FilterSyncSwitch() {
 */
 function FilterPanel() {
 	var _filterService$active;
-	const sheetsFilterPanelService = useDependency(SheetsFilterPanelService);
+	const sheetsFilterPanelService = useDependency(ISheetsFilterPanelService);
 	const localeService = useDependency(LocaleService);
 	const commandService = useDependency(ICommandService);
 	const filterBy = useObservable(sheetsFilterPanelService.filterBy$, void 0, true);
 	const filterByModel = useObservable(sheetsFilterPanelService.filterByModel$, void 0, false);
 	const canApply = useObservable(() => (filterByModel === null || filterByModel === void 0 ? void 0 : filterByModel.canApply$) || of(false), void 0, false, [filterByModel]);
-	const items = useFilterByOptions(localeService);
+	const items = FILTER_BY_OPTIONS.map((option) => ({
+		...option,
+		label: localeService.t(option.label)
+	}));
 	const clearFilterDisabled = !useObservable(sheetsFilterPanelService.hasCriteria$);
 	const onFilterByTypeChange = useCallback((value) => {
 		commandService.executeCommand(ChangeFilterByOperation.id, { filterBy: value });
@@ -1980,22 +2003,6 @@ function FilterPanel() {
 	});
 }
 const FILTER_PANEL_POPUP_KEY = "FILTER_PANEL_POPUP";
-function useFilterByOptions(localeService) {
-	return useMemo(() => [
-		{
-			label: localeService.t("sheets-filter-ui.panel.by-values"),
-			value: FilterBy.VALUES
-		},
-		{
-			label: localeService.t("sheets-filter-ui.panel.by-colors"),
-			value: FilterBy.COLORS
-		},
-		{
-			label: localeService.t("sheets-filter-ui.panel.by-conditions"),
-			value: FilterBy.CONDITIONS
-		}
-	], [localeService.getCurrentLocale(), localeService]);
-}
 
 //#endregion
 //#region src/controllers/components.controller.ts
@@ -2434,65 +2441,6 @@ UniverSheetsFilterMobileUIPlugin = __decorate([
 	__decorateParam(2, IConfigService)
 ], UniverSheetsFilterMobileUIPlugin);
 
-//#endregion
-//#region src/menu/sheets-filter.menu.ts
-function SmartToggleFilterMenuItemFactory(accessor) {
-	const sheetsFilterService = accessor.get(SheetsFilterService);
-	return {
-		id: SmartToggleSheetsFilterCommand.id,
-		type: MenuItemType.BUTTON_SELECTOR,
-		icon: "FilterIcon",
-		tooltip: "sheets-filter-ui.toolbar.smart-toggle-filter-tooltip",
-		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
-		activated$: sheetsFilterService.activeFilterModel$.pipe(map((model) => !!model)),
-		disabled$: getObservableWithExclusiveRange$(accessor, getCurrentRangeDisable$(accessor, {
-			worksheetTypes: [WorksheetFilterPermission, WorksheetViewPermission],
-			rangeTypes: [RangeProtectionPermissionViewPoint]
-		}))
-	};
-}
-function ClearFilterCriteriaMenuItemFactory(accessor) {
-	const sheetsFilterService = accessor.get(SheetsFilterService);
-	return {
-		id: ClearSheetsFilterCriteriaCommand.id,
-		type: MenuItemType.BUTTON,
-		title: "sheets-filter-ui.toolbar.clear-filter-criteria",
-		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
-		disabled$: sheetsFilterService.activeFilterModel$.pipe(switchMap((model) => {
-			var _model$hasCriteria$$p;
-			return (_model$hasCriteria$$p = model === null || model === void 0 ? void 0 : model.hasCriteria$.pipe(map((m) => !m))) !== null && _model$hasCriteria$$p !== void 0 ? _model$hasCriteria$$p : of(true);
-		}))
-	};
-}
-function ReCalcFilterMenuItemFactory(accessor) {
-	const sheetsFilterService = accessor.get(SheetsFilterService);
-	return {
-		id: ReCalcSheetsFilterCommand.id,
-		type: MenuItemType.BUTTON,
-		title: "sheets-filter-ui.toolbar.re-calc-filter-conditions",
-		hidden$: getMenuHiddenObservable(accessor, UniverInstanceType.UNIVER_SHEET),
-		disabled$: sheetsFilterService.activeFilterModel$.pipe(switchMap((model) => {
-			var _model$hasCriteria$$p2;
-			return (_model$hasCriteria$$p2 = model === null || model === void 0 ? void 0 : model.hasCriteria$.pipe(map((m) => !m))) !== null && _model$hasCriteria$$p2 !== void 0 ? _model$hasCriteria$$p2 : of(true);
-		}))
-	};
-}
-
-//#endregion
-//#region src/menu/schema.ts
-const menuSchema = { [RibbonDataGroup.ORGANIZATION]: { [SmartToggleSheetsFilterCommand.id]: {
-	order: 2,
-	menuItemFactory: SmartToggleFilterMenuItemFactory,
-	[ClearSheetsFilterCriteriaCommand.id]: {
-		order: 0,
-		menuItemFactory: ClearFilterCriteriaMenuItemFactory
-	},
-	[ReCalcSheetsFilterCommand.id]: {
-		order: 1,
-		menuItemFactory: ReCalcFilterMenuItemFactory
-	}
-} } };
-
 //#endregion
 //#region src/controllers/sheets-filter.shortcut.ts
 const SmartToggleFilterShortcut = {
@@ -2580,7 +2528,7 @@ let SheetsFilterUIDesktopController = class SheetsFilterUIDesktopController exte
 };
 SheetsFilterUIDesktopController = __decorate([
 	__decorateParam(0, Inject(Injector)),
-	__decorateParam(1, Inject(SheetsFilterPanelService)),
+	__decorateParam(1, ISheetsFilterPanelService),
 	__decorateParam(2, Inject(SheetCanvasPopManagerService)),
 	__decorateParam(3, Inject(SheetsFilterService)),
 	__decorateParam(4, Inject(LocaleService)),
@@ -2610,7 +2558,7 @@ let UniverSheetsFilterUIPlugin = class UniverSheetsFilterUIPlugin extends Plugin
 		this._injector.add([ComponentsController]);
 		this._injector.get(ComponentsController);
 		registerDependencies(this._injector, [
-			[SheetsFilterPanelService],
+			[ISheetsFilterPanelService, { useClass: SheetsFilterPanelService }],
 			[SheetsFilterPermissionController],
 			[SheetsFilterUIDesktopController]
 		]);
@@ -2664,4 +2612,4 @@ UniverSheetsFilterUIWorkerPlugin = __decorate([
 ], UniverSheetsFilterUIWorkerPlugin);
 
 //#endregion
-export { ChangeFilterByOperation, CloseFilterPanelOperation, OpenFilterPanelOperation, UniverSheetsFilterMobileUIPlugin, UniverSheetsFilterUIPlugin, UniverSheetsFilterUIWorkerPlugin };
+export { ChangeFilterByOperation, CloseFilterPanelOperation, OpenFilterPanelOperation, menuSchema as SheetsFilterUIMenuSchema, UniverSheetsFilterMobileUIPlugin, UniverSheetsFilterUIPlugin, UniverSheetsFilterUIWorkerPlugin };

package/lib/types/controllers/ui.controller.d.ts

@@ -18,7 +18,7 @@ import { IRenderManagerService } from '@univerjs/engine-render';
 import { SheetsFilterService } from '@univerjs/sheets-filter';
 import { SheetCanvasPopManagerService, SheetsRenderService } from '@univerjs/sheets-ui';
 import { IMenuManagerService, IMessageService, IShortcutService } from '@univerjs/ui';
-import { SheetsFilterPanelService } from '../services/sheets-filter-panel.service';
+import { ISheetsFilterPanelService } from '../services/sheets-filter-panel.service';
 import { SheetsFilterUIMobileController } from './ui-mobile.controller';
 /**
  * This controller controls the UI of "filter" features. Menus, commands and filter panel etc. Except for the rendering.
@@ -34,7 +34,7 @@ export declare class SheetsFilterUIDesktopController extends SheetsFilterUIMobil
     private readonly _menuManagerService;
     private readonly _contextService;
     private readonly _messageService;
-    constructor(_injector: Injector, _sheetsFilterPanelService: SheetsFilterPanelService, _sheetCanvasPopupService: SheetCanvasPopManagerService, _sheetsFilterService: SheetsFilterService, _localeService: LocaleService, _shortcutService: IShortcutService, _commandService: ICommandService, _menuManagerService: IMenuManagerService, _contextService: IContextService, _messageService: IMessageService, sheetsRenderService: SheetsRenderService, renderManagerService: IRenderManagerService);
+    constructor(_injector: Injector, _sheetsFilterPanelService: ISheetsFilterPanelService, _sheetCanvasPopupService: SheetCanvasPopManagerService, _sheetsFilterService: SheetsFilterService, _localeService: LocaleService, _shortcutService: IShortcutService, _commandService: ICommandService, _menuManagerService: IMenuManagerService, _contextService: IContextService, _messageService: IMessageService, sheetsRenderService: SheetsRenderService, renderManagerService: IRenderManagerService);
     dispose(): void;
     private _initShortcuts;
     private _initCommands;

package/lib/types/index.d.ts

@@ -17,6 +17,7 @@ import './global.css';
 export { ChangeFilterByOperation, CloseFilterPanelOperation, OpenFilterPanelOperation } from './commands/operations/sheets-filter.operation';
 export type { IOpenFilterPanelOperationParams } from './commands/operations/sheets-filter.operation';
 export type { IUniverSheetsFilterUIConfig } from './config/config';
+export { menuSchema as SheetsFilterUIMenuSchema } from './menu/schema';
 export { UniverSheetsFilterMobileUIPlugin } from './mobile-plugin';
 export { UniverSheetsFilterUIPlugin } from './plugin';
 export { UniverSheetsFilterUIWorkerPlugin } from './worker/plugin';

package/lib/types/services/sheets-filter-panel.service.d.ts

@@ -44,16 +44,16 @@ export interface IFilterByColorItem {
     checked?: boolean;
 }
 export interface ISheetsFilterPanelService {
-    /**
-     * Set up the panel to change the filter condition on a specific column.
-     * @param filterModel the filter model we will be working on
-     * @param col
-     * @returns if the filter condition is set up successfully
-     */
-    setUpFilterConditionOfCol(filterModel: FilterModel, col: number): boolean;
-    /**
-     * Terminate the filter panel without applying changes.
-     */
+    readonly col: number;
+    readonly col$: Observable<number>;
+    readonly filterBy: FilterBy;
+    readonly filterBy$: Observable<FilterBy>;
+    readonly filterByModel: Nullable<IFilterByModel>;
+    readonly filterByModel$: Observable<Nullable<IFilterByModel>>;
+    readonly filterModel: Nullable<FilterModel>;
+    readonly hasCriteria$: Observable<boolean>;
+    setupCol(filterModel: FilterModel, col: number): void;
+    changeFilterBy(filterBy: FilterBy): boolean;
     terminate(): boolean;
 }
 export declare const ISheetsFilterPanelService: import("@wendellhu/redi").IdentifierDecorator<ISheetsFilterPanelService>;
@@ -67,7 +67,7 @@ export interface IFilterByModel extends IDisposable {
  * This service controls the state of the filter panel. There should be only one instance of the filter panel
  * at one time.
  */
-export declare class SheetsFilterPanelService extends Disposable {
+export declare class SheetsFilterPanelService extends Disposable implements ISheetsFilterPanelService {
     private readonly _injector;
     private readonly _refRangeService;
     private readonly _filterBy$;