Skip to content

Commit

Permalink
fix: fix progress bar not loaded
Browse files Browse the repository at this point in the history
  • Loading branch information
@wzhudev
wzhudev committed Oct 18, 2024
1 parent fb27675 commit e0cca8e
Show file tree
Hide file tree
Showing 15 changed files with 118 additions and 296 deletions.
3 changes: 0 additions & 3 deletions packages-experimental/uniui/src/plugin.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,6 @@ import {
IMessageService,
INotificationService,
IPlatformService,
IProgressService,
IShortcutService,
ISidebarService,
IUIController,
Expand All @@ -61,7 +60,6 @@ import {
MenuManagerService,
MenuService,
PlatformService,
ProgressService,
SharedController,
ShortcutPanelController,
ShortcutPanelService,
Expand Down Expand Up @@ -127,7 +125,6 @@ export class UniverUniUIPlugin extends Plugin {
[IBeforeCloseService, { useClass: DesktopBeforeCloseService }],
[ILocalFileService, { useClass: DesktopLocalFileService }],
[ICanvasPopupService, { useClass: CanvasPopupService }],
[IProgressService, { useClass: ProgressService }],
[CanvasFloatDomService],
[IUIController, {
useFactory: () => this._injector.createInstance(UniverUniUIController, this._config),
Expand Down
3 changes: 1 addition & 2 deletions packages-experimental/uniui/src/views/uni-toolbar/UniFormulaBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import { DeviceInputEventType } from '@univerjs/engine-render';
import { CheckMarkSingle, CloseSingle, FxSingle } from '@univerjs/icons';
import { RangeProtectionPermissionEditPoint, RangeProtectionRuleModel, SheetsSelectionsService, WorkbookEditablePermission, WorksheetEditPermission, WorksheetProtectionRuleModel, WorksheetSetCellValuePermission } from '@univerjs/sheets';
import { IEditorBridgeService, IFormulaEditorManagerService, useActiveWorkbook } from '@univerjs/sheets-ui';
import { KeyCode, ProgressBar } from '@univerjs/ui';
import { KeyCode } from '@univerjs/ui';
import clsx from 'clsx';
import React, { useCallback, useLayoutEffect, useState } from 'react';
import { EMPTY, merge, switchMap } from 'rxjs';
Expand Down Expand Up @@ -230,7 +230,6 @@ export function FormulaBar() {
<CheckMarkSingle />
</span>
</div>
<ProgressBar barColor={progressBarColor} />
</div>
);
}
7 changes: 4 additions & 3 deletions packages/sheets-formula-ui/src/controllers/formula-ui.controller.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import type { Dependency } from '@univerjs/core';
import { connectInjector, Disposable, ICommandService, Inject, Injector, UniverInstanceType } from '@univerjs/core';
import { IRenderManagerService } from '@univerjs/engine-render';

import { SheetsUIPart } from '@univerjs/sheets-ui';
import { BuiltInUIPart, ComponentManager, IMenuManagerService, IShortcutService, IUIPartsService } from '@univerjs/ui';
import { SheetOnlyPasteFormulaCommand } from '../commands/commands/formula-clipboard.command';
import { SelectEditorFormulaOperation } from '../commands/operations/editor-formula.operation';
Expand All @@ -26,6 +27,7 @@ import { InsertFunctionOperation } from '../commands/operations/insert-function.
import { MoreFunctionsOperation } from '../commands/operations/more-functions.operation';
import { ReferenceAbsoluteOperation } from '../commands/operations/reference-absolute.operation';
import { SearchFunctionOperation } from '../commands/operations/search-function.operation';
import { FormulaProgressBar } from '../views/formula-progress/FormulaProgress';
import { RenderFormulaPromptContent } from '../views/FormulaPromptContainer';
import { MORE_FUNCTIONS_COMPONENT } from '../views/more-functions/interface';
import { MoreFunctions } from '../views/more-functions/MoreFunctions';
Expand Down Expand Up @@ -93,9 +95,8 @@ export class FormulaUIController extends Disposable {
}

private _registerComponents(): void {
this.disposeWithMe(
this._uiPartsService.registerComponent(BuiltInUIPart.CONTENT, () => connectInjector(RenderFormulaPromptContent, this._injector))
);
this.disposeWithMe(this._uiPartsService.registerComponent(BuiltInUIPart.CONTENT, () => connectInjector(RenderFormulaPromptContent, this._injector)));
this.disposeWithMe(this._uiPartsService.registerComponent(SheetsUIPart.FORMULA_AUX, () => connectInjector(FormulaProgressBar, this._injector)));

this._componentManager.register(MORE_FUNCTIONS_COMPONENT, MoreFunctions);
}
Expand Down
34 changes: 34 additions & 0 deletions packages/sheets-formula-ui/src/views/formula-progress/FormulaProgress.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
/**
* Copyright 2023-present DreamNum Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

import { ICommandService, useDependency, useObservable } from '@univerjs/core';
import { SetFormulaCalculationStopMutation } from '@univerjs/engine-formula';
import { TriggerCalculationController } from '@univerjs/sheets-formula';
import { ProgressBar } from '@univerjs/ui';
import React, { useCallback } from 'react';

export function FormulaProgressBar() {
const triggerCalculationController = useDependency(TriggerCalculationController);
const commandService = useDependency(ICommandService);

const progress = useObservable(triggerCalculationController.progress$)!;

const terminateCalculation = useCallback(() => {
commandService.executeCommand(SetFormulaCalculationStopMutation.id);
}, [commandService]);

return <ProgressBar progress={progress} onTerminate={terminateCalculation} />;
}
106 changes: 40 additions & 66 deletions packages/sheets-formula/src/controllers/trigger-calculation.controller.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import type {
ISetFormulaCalculationNotificationMutation,
} from '@univerjs/engine-formula';
import type { ISetRangeValuesMutationParams } from '@univerjs/sheets';
import { Disposable, ICommandService, throttle } from '@univerjs/core';
import { Disposable, ICommandService } from '@univerjs/core';
import {
FormulaExecutedStateType,
FormulaExecuteStageType,
Expand All @@ -45,10 +45,12 @@ import { BehaviorSubject } from 'rxjs';
* This interface is for the progress bar to display the calculation progress.
*/
export interface ICalculationProgress {
/** Task that already completed. */
done: number;
/** The total number of formulas need to calculate. */
count: number;
}

const NilProgress: ICalculationProgress = { done: 0, count: 0 };

const lo = { onlyLocal: true };
Expand All @@ -70,17 +72,41 @@ export class TriggerCalculationController extends Disposable {

private _startExecutionTime: number = 0;

private _formulaCalculationDoneCount: number = 0;

private _arrayFormulaCalculationDoneCount: number = 0;

private _executionInProgressParams: Nullable<IExecutionInProgressParams> = null;

private _restartCalculation = false;

private _totalCalculationTaskCount = 0;
private _formulaCalculationDoneCount = 0;
private readonly _progress$ = new BehaviorSubject<ICalculationProgress>(NilProgress);
readonly progress$ = this._progress$.asObservable();

private _updateProgress(): void {
this._progress$.next({ done: this._formulaCalculationDoneCount, count: this._totalCalculationTaskCount });
}

private _addTotalCount(count: number): void {
this._totalCalculationTaskCount += count;
this._updateProgress();
}

private _addDoneTask(count: number): void {
this._formulaCalculationDoneCount += count;
this._formulaCalculationDoneCount = Math.min(this._formulaCalculationDoneCount, this._totalCalculationTaskCount);
this._updateProgress();
}

private _completeProgress(): void {
this._formulaCalculationDoneCount = this._totalCalculationTaskCount;
this._updateProgress();
}

private _clearPregress(): void {
this._formulaCalculationDoneCount = 0;
this._totalCalculationTaskCount = 0;
this._updateProgress();
}

constructor(
@ICommandService private readonly _commandService: ICommandService,
@IActiveDirtyManagerService private readonly _activeDirtyManagerService: IActiveDirtyManagerService
Expand All @@ -90,7 +116,6 @@ export class TriggerCalculationController extends Disposable {
this._commandExecutedListener();
this._initialExecuteFormulaProcessListener();
this._initialExecuteFormula();
this._initialProgressBar();
}

override dispose(): void {
Expand Down Expand Up @@ -263,8 +288,6 @@ export class TriggerCalculationController extends Disposable {
// eslint-disable-next-line max-lines-per-function
private _initialExecuteFormulaProcessListener() {
// Assignment operation after formula calculation.
const debouncedFormulaPushTask = throttle(this._pushFormulaTask.bind(this), 300);
const debouncedArrayFormulaPushTask = throttle(this._pushArrayFormulaTask.bind(this), 300);
let startDependencyTimer: NodeJS.Timeout | null = null;
let calculationProcessCount = 0; // Multiple calculations are performed in parallel, but only one progress bar is displayed, and the progress is only closed after the last calculation is completed.
let formulaCalculationCount = 0;
Expand Down Expand Up @@ -303,9 +326,9 @@ export class TriggerCalculationController extends Disposable {
// If the total calculation time exceeds 1s, a progress bar is displayed. The first progress shows 5%
startDependencyTimer = setTimeout(() => {
// Ignore progress deviations, and finally the complete method ensures the correct completion of the progress
const taskCount = (formulaCalculationCount - this._formulaCalculationDoneCount) + (arrayFormulaCalculationCount - this._arrayFormulaCalculationDoneCount) + 100;
// this._progressService.insertTaskCount(taskCount);
// this._progressService.pushTask({ count: 5 });
const taskCount = (formulaCalculationCount + arrayFormulaCalculationCount - this._formulaCalculationDoneCount) + 100;
this._addTotalCount(taskCount);
this._addDoneTask(5);
startDependencyTimer = null;
}, 1000);
} else if (stage === FormulaExecuteStageType.CURRENTLY_CALCULATING) {
Expand All @@ -315,30 +338,22 @@ export class TriggerCalculationController extends Disposable {
if (startDependencyTimer) {
formulaCalculationCount += totalFormulasToCalculate;
} else {
// this._progressService.insertTaskCount(totalFormulasToCalculate);
this._addTotalCount(totalFormulasToCalculate);
}
}

if (startDependencyTimer) {
this._formulaCalculationDoneCount = completedFormulasCount;
} else {
debouncedFormulaPushTask(completedFormulasCount);
}
this._addDoneTask(completedFormulasCount);
} else if (stage === FormulaExecuteStageType.CURRENTLY_CALCULATING_ARRAY_FORMULA) {
if (completedArrayFormulasCount === 1 && !needStartArrayFormulaProgress) {
needStartArrayFormulaProgress = true;
if (startDependencyTimer) {
arrayFormulaCalculationCount += totalArrayFormulasToCalculate;
} else {
// this._progressService.insertTaskCount(totalArrayFormulasToCalculate);
this._addTotalCount(totalArrayFormulasToCalculate);
}
}

if (startDependencyTimer) {
this._arrayFormulaCalculationDoneCount = completedArrayFormulasCount;
} else {
debouncedArrayFormulaPushTask(completedArrayFormulasCount);
}
this._addDoneTask(completedArrayFormulasCount);
}

this._executionInProgressParams = params.stageInfo;
Expand All @@ -357,7 +372,7 @@ export class TriggerCalculationController extends Disposable {
case FormulaExecutedStateType.STOP_EXECUTION:
result = 'The execution of the formula has been stopped';
// this._executingCommandQueue = [];
// this._progressService.stop();
this._clearPregress();
calculationProcessCount = 0;
break;
case FormulaExecutedStateType.SUCCESS:
Expand All @@ -379,12 +394,11 @@ export class TriggerCalculationController extends Disposable {
} else {
// Manually hide the progress bar only if no other calculations are in process
if (state === FormulaExecutedStateType.SUCCESS) {
// this._progressService.complete();
this._completeProgress();
}
}

this._formulaCalculationDoneCount = 0;
this._arrayFormulaCalculationDoneCount = 0;
needStartFormulaProgress = false;
needStartArrayFormulaProgress = false;
}
Expand Down Expand Up @@ -430,44 +444,4 @@ export class TriggerCalculationController extends Disposable {
lo
);
}

/**
* The user manually stops the progress bar
*/
private _initialProgressBar() {
// TODO: expose method to stop calculation
// this.disposeWithMe(this._progressService.progressVisible$.subscribe((isVisible) => {
// if (!isVisible) {
// this._commandService.executeCommand(SetFormulaCalculationStopMutation.id, {});
// }
// }));
}

/**
* Update progress by completed count
* @param completedCount
*/
private _pushFormulaTask(completedCount: number) {
// if (this._progressService.getTaskCount() === 0) {
// return;
// }

const count = completedCount - this._formulaCalculationDoneCount;
this._formulaCalculationDoneCount = completedCount;
// this._progressService.pushTask({ count });
}

/**
* Update progress by completed count
* @param completedCount
*/
private _pushArrayFormulaTask(completedCount: number) {
// if (this._progressService.getTaskCount() === 0) {
// return;
// }

// const count = completedCount - this._arrayFormulaCalculationDoneCount;
// this._arrayFormulaCalculationDoneCount = completedCount;
// this._progressService.pushTask({ count });
}
}
2 changes: 2 additions & 0 deletions packages/sheets-formula/src/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@
export { type IInsertFunction, type IInsertFunctionCommandParams, InsertFunctionCommand } from './commands/commands/insert-function.command';
export { OtherFormulaMarkDirty } from './commands/mutations/formula.mutation';
export { UpdateDefinedNameController } from './controllers/update-defined-name.controller';
export { TriggerCalculationController } from './controllers/trigger-calculation.controller';

// #region - all commands

export { UpdateFormulaController } from './controllers/update-formula.controller';
Expand Down
1 change: 1 addition & 0 deletions packages/sheets-ui/src/consts/ui-name.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,4 +17,5 @@
export enum SheetsUIPart {
FILTER_PANEL_EMBED_POINT = 'filter-panel-embed-point',
SHEETS_FOOTER = 'sheets-footer',
FORMULA_AUX = 'formula-aux',
}
22 changes: 11 additions & 11 deletions packages/sheets-ui/src/views/formula-bar/FormulaBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,20 +14,19 @@
* limitations under the License.
*/

import { BooleanNumber, DEFAULT_EMPTY_DOCUMENT_VALUE, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DocumentFlavor, HorizontalAlign, IPermissionService, IUniverInstanceService, Rectangle, ThemeService, UniverInstanceType, useDependency, useObservable, VerticalAlign, WrapStrategy } from '@univerjs/core';
import type { IDocumentData, Nullable, Workbook } from '@univerjs/core';
import { BooleanNumber, DEFAULT_EMPTY_DOCUMENT_VALUE, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DocumentFlavor, HorizontalAlign, IPermissionService, IUniverInstanceService, Rectangle, UniverInstanceType, useDependency, useObservable, VerticalAlign, WrapStrategy } from '@univerjs/core';
import { TextEditor } from '@univerjs/docs-ui';
import { DeviceInputEventType } from '@univerjs/engine-render';
import { CheckMarkSingle, CloseSingle, DropdownSingle, FxSingle } from '@univerjs/icons';
import { RangeProtectionPermissionEditPoint, RangeProtectionRuleModel, SheetsSelectionsService, WorkbookEditablePermission, WorksheetEditPermission, WorksheetProtectionRuleModel, WorksheetSetCellValuePermission } from '@univerjs/sheets';
import { KeyCode, ProgressBar } from '@univerjs/ui';
import { ComponentContainer, KeyCode, useComponentsOfPart } from '@univerjs/ui';
import clsx from 'clsx';
import React, { useEffect, useLayoutEffect, useState } from 'react';

import { EMPTY, merge, switchMap } from 'rxjs';
import type { IDocumentData, Nullable, Workbook } from '@univerjs/core';
import { useActiveWorkbook } from '../../components/hook';
import { SheetsUIPart } from '../../consts/ui-name';
import { IFormulaEditorManagerService } from '../../services/editor/formula-editor-manager.service';

import { IEditorBridgeService } from '../../services/editor-bridge.service';
import { DefinedName } from '../defined-name/DefinedName';
import styles from './index.module.less';
Expand All @@ -43,17 +42,18 @@ export function FormulaBar() {

const formulaEditorManagerService = useDependency(IFormulaEditorManagerService);
const editorBridgeService = useDependency(IEditorBridgeService);
const themeService = useDependency(ThemeService);
const progressBarColor = themeService.getCurrentTheme().primaryColor;
const [disable, setDisable] = useState<boolean>(false);
const univerInstanceService = useDependency(IUniverInstanceService);
const selectionManager = useDependency(SheetsSelectionsService);
const worksheetProtectionRuleModel = useDependency(WorksheetProtectionRuleModel);
const rangeProtectionRuleModel = useDependency(RangeProtectionRuleModel);
const univerInstanceService = useDependency(IUniverInstanceService);
const selectionManager = useDependency(SheetsSelectionsService);
const permissionService = useDependency(IPermissionService);

const [disable, setDisable] = useState<boolean>(false);
const currentWorkbook = useActiveWorkbook();
const workbook = useObservable(() => univerInstanceService.getCurrentTypeOfUnit$<Workbook>(UniverInstanceType.UNIVER_SHEET), undefined, undefined, [])!;

const formulaAuxUIParts = useComponentsOfPart(SheetsUIPart.FORMULA_AUX);

function getPermissionIds(unitId: string, subUnitId: string): string[] {
return [
new WorkbookEditablePermission(unitId).id,
Expand Down Expand Up @@ -257,7 +257,7 @@ export function FormulaBar() {
</div>
</div>

<ProgressBar barColor={progressBarColor} />
<ComponentContainer key="formula-aux" components={formulaAuxUIParts}></ComponentContainer>
</div>
);
}
Loading

0 comments on commit e0cca8e

Please sign in to comment.