Skip to content

Commit d296634

Browse files
iobuhoviobuhov
committed
refactor: get rid off private elements (fields)
1 parent 7615586 commit d296634

File tree

5 files changed

+87
-103
lines changed

5 files changed

+87
-103
lines changed

‎packages/pluggableWidgets/datagrid-web/src/helpers/state/SelectAllBarViewModel.ts‎

Lines changed: 25 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { ReactiveController, ReactiveControllerHost } from "@mendix/widget-plugi
55
import { action, makeAutoObservable, reaction } from "mobx";
66
import { DatagridContainerProps } from "../../../typings/DatagridProps";
77

8-
type Props = Pick<
8+
type DynamicProps = Pick<
99
DatagridContainerProps,
1010
| "cancelSelectionLabel"
1111
| "selectAllTemplate"
@@ -19,23 +19,18 @@ type Props = Pick<
1919
| "enableSelectAll"
2020
>;
2121

22-
type Gate = DerivedPropsGate<Props>;
23-
2422
export class SelectAllBarViewModel implements ReactiveController {
2523
private barVisible = false;
2624
private clearVisible = false;
27-
pending = false;
25+
private readonly enableSelectAll: boolean;
2826

29-
readonly #gate: Gate;
30-
readonly #selectAllController: SelectAllController;
31-
readonly #count: SelectionCountStore;
32-
readonly #enableSelectAll: boolean;
27+
pending = false;
3328

3429
constructor(
3530
host: ReactiveControllerHost,
36-
gate: Gate,
37-
selectAllController: SelectAllController,
38-
count = new SelectionCountStore(gate)
31+
private readonly gate: DerivedPropsGate<DynamicProps>,
32+
private readonly selectAllController: SelectAllController,
33+
private readonly count = new SelectionCountStore(gate)
3934
) {
4035
host.addController(this);
4136
type PrivateMembers = "setClearVisible" | "setPending" | "hideBar" | "showBar";
@@ -45,10 +40,7 @@ export class SelectAllBarViewModel implements ReactiveController {
4540
hideBar: action,
4641
showBar: action
4742
});
48-
this.#gate = gate;
49-
this.#selectAllController = selectAllController;
50-
this.#count = count;
51-
this.#enableSelectAll = gate.props.enableSelectAll;
43+
this.enableSelectAll = gate.props.enableSelectAll;
5244
}
5345

5446
private setClearVisible(value: boolean): void {
@@ -69,38 +61,40 @@ export class SelectAllBarViewModel implements ReactiveController {
6961
}
7062

7163
private get total(): number {
72-
return this.#gate.props.datasource.totalCount ?? 0;
64+
return this.gate.props.datasource.totalCount ?? 0;
7365
}
7466

7567
private get selectAllFormat(): string {
76-
return this.#gate.props.selectAllTemplate?.value ?? "select.all.n.items";
68+
return this.gate.props.selectAllTemplate?.value ?? "select.all.n.items";
7769
}
7870

7971
private get selectAllText(): string {
80-
return this.#gate.props.selectAllText?.value ?? "select.all.items";
72+
return this.gate.props.selectAllText?.value ?? "select.all.items";
8173
}
8274

8375
private get allSelectedText(): string {
84-
const str = this.#gate.props.allSelectedText?.value ?? "all.selected";
85-
return str.replace("%d", `${this.#count.selectedCount}`);
76+
const str = this.gate.props.allSelectedText?.value ?? "all.selected";
77+
return str.replace("%d", `${this.count.selectedCount}`);
8678
}
8779

8880
private get isCurrentPageSelected(): boolean {
89-
const selection = this.#gate.props.itemSelection;
81+
const selection = this.gate.props.itemSelection;
82+
9083
if (!selection || selection.type === "Single") return false;
91-
const pageIds = new Set(this.#gate.props.datasource.items?.map(item => item.id) ?? []);
84+
85+
const pageIds = new Set(this.gate.props.datasource.items?.map(item => item.id) ?? []);
9286
const selectionSubArray = selection.selection.filter(item => pageIds.has(item.id));
9387
return selectionSubArray.length === pageIds.size && pageIds.size > 0;
9488
}
9589

9690
private get isAllItemsSelected(): boolean {
97-
if (this.total > 0) return this.total === this.#count.selectedCount;
91+
if (this.total > 0) return this.total === this.count.selectedCount;
9892

99-
const { offset, limit, items = [], hasMoreItems } = this.#gate.props.datasource;
93+
const { offset, limit, items = [], hasMoreItems } = this.gate.props.datasource;
10094
const noMoreItems = typeof hasMoreItems === "boolean" && hasMoreItems === false;
10195
const fullyLoaded = offset === 0 && limit >= items.length;
10296

103-
return fullyLoaded && noMoreItems && items.length === this.#count.selectedCount;
97+
return fullyLoaded && noMoreItems && items.length === this.count.selectedCount;
10498
}
10599

106100
get selectAllLabel(): string {
@@ -109,16 +103,16 @@ export class SelectAllBarViewModel implements ReactiveController {
109103
}
110104

111105
get clearSelectionLabel(): string {
112-
return this.#gate.props.clearSelectionCaption?.value ?? "clear.selection.caption";
106+
return this.gate.props.clearSelectionCaption?.value ?? "clear.selection.caption";
113107
}
114108

115109
get selectionStatus(): string {
116110
if (this.isAllItemsSelected) return this.allSelectedText;
117-
return this.#count.selectedCountText;
111+
return this.count.selectedCountText;
118112
}
119113

120114
get isBarVisible(): boolean {
121-
return this.#enableSelectAll && this.barVisible;
115+
return this.enableSelectAll && this.barVisible;
122116
}
123117

124118
get isClearVisible(): boolean {
@@ -134,7 +128,7 @@ export class SelectAllBarViewModel implements ReactiveController {
134128
}
135129

136130
setup(): (() => void) | void {
137-
if (!this.#enableSelectAll) return;
131+
if (!this.enableSelectAll) return;
138132

139133
return reaction(
140134
() => this.isCurrentPageSelected,
@@ -149,13 +143,13 @@ export class SelectAllBarViewModel implements ReactiveController {
149143
}
150144

151145
onClear(): void {
152-
this.#selectAllController.clearSelection();
146+
this.selectAllController.clearSelection();
153147
}
154148

155149
async onSelectAll(): Promise<void> {
156150
this.setPending(true);
157151
try {
158-
const { success } = await this.#selectAllController.selectAllPages();
152+
const { success } = await this.selectAllController.selectAllPages();
159153
this.setClearVisible(success);
160154
} finally {
161155
this.setPending(false);

‎packages/pluggableWidgets/datagrid-web/src/helpers/state/SelectionProgressDialogViewModel.ts‎

Lines changed: 16 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -5,35 +5,28 @@ import { ReactiveController, ReactiveControllerHost } from "@mendix/widget-plugi
55
import { DynamicValue } from "mendix";
66
import { action, makeAutoObservable, reaction } from "mobx";
77

8-
type Gate = DerivedPropsGate<{
8+
interface DynamicProps {
99
selectingAllLabel?: DynamicValue<string>;
1010
cancelSelectionLabel?: DynamicValue<string>;
11-
}>;
11+
}
1212

1313
export class SelectionProgressDialogViewModel implements ReactiveController {
1414
/**
1515
* This state is synced with progressStore, but with short delay to
1616
* avoid UI flickering.
1717
*/
1818
private dialogOpen = false;
19-
20-
#gate: Gate;
21-
#progressStore: ProgressStore;
22-
#selectAllController: SelectAllController;
23-
#timerId: ReturnType<typeof setTimeout> | undefined;
19+
private timerId: ReturnType<typeof setTimeout> | undefined;
2420

2521
constructor(
2622
host: ReactiveControllerHost,
27-
gate: Gate,
28-
progressStore: ProgressStore,
29-
selectAllController: SelectAllController
23+
private readonly gate: DerivedPropsGate<DynamicProps>,
24+
private readonly progressStore: ProgressStore,
25+
private readonly selectAllController: SelectAllController
3026
) {
3127
host.addController(this);
3228
type PrivateMembers = "setDialogOpen";
3329
makeAutoObservable<this, PrivateMembers>(this, { setDialogOpen: action });
34-
this.#gate = gate;
35-
this.#progressStore = progressStore;
36-
this.#selectAllController = selectAllController;
3730
}
3831

3932
private setDialogOpen(value: boolean): void {
@@ -45,40 +38,40 @@ export class SelectionProgressDialogViewModel implements ReactiveController {
4538
}
4639

4740
get progress(): number {
48-
return this.#progressStore.loaded;
41+
return this.progressStore.loaded;
4942
}
5043

5144
get total(): number {
52-
return this.#progressStore.total;
45+
return this.progressStore.total;
5346
}
5447

5548
get selectingAllLabel(): string {
56-
return this.#gate.props.selectingAllLabel?.value ?? "Selecting all items...";
49+
return this.gate.props.selectingAllLabel?.value ?? "Selecting all items...";
5750
}
5851

5952
get cancelSelectionLabel(): string {
60-
return this.#gate.props.cancelSelectionLabel?.value ?? "Cancel selection";
53+
return this.gate.props.cancelSelectionLabel?.value ?? "Cancel selection";
6154
}
6255

6356
setup(): () => void {
6457
return reaction(
65-
() => this.#progressStore.inProgress,
58+
() => this.progressStore.inProgress,
6659
inProgress => {
6760
if (inProgress) {
68-
// Delay showing dialog for 2 second
69-
this.#timerId = setTimeout(() => {
61+
// Delay showing dialog to avoid flickering for fast operations
62+
this.timerId = setTimeout(() => {
7063
this.setDialogOpen(true);
71-
this.#timerId = undefined;
64+
this.timerId = undefined;
7265
}, 1500);
7366
} else {
7467
this.setDialogOpen(false);
75-
clearTimeout(this.#timerId);
68+
clearTimeout(this.timerId);
7669
}
7770
}
7871
);
7972
}
8073

8174
onCancel(): void {
82-
this.#selectAllController.abort();
75+
this.selectAllController.abort();
8376
}
8477
}

‎packages/pluggableWidgets/datagrid-web/src/helpers/state/useRootStore.ts‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,7 @@ export function useRootStore(props: DatagridContainerProps): RootGridStore {
2222

2323
const selectAllGateProvider = useConst(() => new GateProvider(props));
2424

25-
const selectAllHost = useSetup(
26-
() => new SelectAllHost({ gate: selectAllGateProvider.gate, selectAllProgressStore })
27-
);
25+
const selectAllHost = useSetup(() => new SelectAllHost(selectAllGateProvider.gate, selectAllProgressStore));
2826

2927
const rootStore = useSetup(
3028
() =>

0 commit comments

Comments
 (0)