@aerogel/core 0.0.0-next.b58141fee5d2fe7d25debdbca6b1d2bf1c13e48e → 0.0.0-next.b656a964404fbde17d9cce7668722596098e47fd
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/aerogel-core.d.ts +2082 -813
- package/dist/aerogel-core.js +3119 -0
- package/dist/aerogel-core.js.map +1 -0
- package/package.json +36 -34
- package/src/bootstrap/bootstrap.test.ts +7 -10
- package/src/bootstrap/index.ts +43 -14
- package/src/bootstrap/options.ts +4 -1
- package/src/components/AppLayout.vue +16 -0
- package/src/components/{AGAppModals.vue → AppModals.vue} +3 -4
- package/src/components/{AGAppOverlays.vue → AppOverlays.vue} +5 -6
- package/src/components/AppToasts.vue +16 -0
- package/src/components/contracts/AlertModal.ts +4 -0
- package/src/components/contracts/Button.ts +16 -0
- package/src/components/contracts/ConfirmModal.ts +41 -0
- package/src/components/contracts/DropdownMenu.ts +11 -0
- package/src/components/contracts/ErrorReportModal.ts +29 -0
- package/src/components/contracts/Input.ts +26 -0
- package/src/components/contracts/LoadingModal.ts +18 -0
- package/src/components/contracts/Modal.ts +13 -0
- package/src/components/contracts/PromptModal.ts +28 -0
- package/src/components/contracts/Select.ts +36 -0
- package/src/components/contracts/Toast.ts +13 -0
- package/src/components/contracts/index.ts +9 -0
- package/src/components/contracts/shared.ts +9 -0
- package/src/components/headless/HeadlessButton.vue +50 -0
- package/src/components/headless/HeadlessInput.vue +59 -0
- package/src/components/headless/HeadlessInputDescription.vue +27 -0
- package/src/components/headless/{forms/AGHeadlessInputError.vue → HeadlessInputError.vue} +4 -8
- package/src/components/headless/HeadlessInputInput.vue +75 -0
- package/src/components/headless/HeadlessInputLabel.vue +18 -0
- package/src/components/headless/HeadlessInputTextArea.vue +40 -0
- package/src/components/headless/{modals/AGHeadlessModal.vue → HeadlessModal.vue} +17 -19
- package/src/components/headless/HeadlessModalContent.vue +24 -0
- package/src/components/headless/HeadlessModalOverlay.vue +12 -0
- package/src/components/headless/HeadlessModalTitle.vue +12 -0
- package/src/components/headless/HeadlessSelect.vue +104 -0
- package/src/components/headless/HeadlessSelectError.vue +25 -0
- package/src/components/headless/HeadlessSelectLabel.vue +25 -0
- package/src/components/headless/HeadlessSelectOption.vue +34 -0
- package/src/components/headless/HeadlessSelectOptions.vue +30 -0
- package/src/components/headless/HeadlessSelectTrigger.vue +22 -0
- package/src/components/headless/HeadlessSelectValue.vue +15 -0
- package/src/components/headless/HeadlessToast.vue +18 -0
- package/src/components/headless/HeadlessToastAction.vue +13 -0
- package/src/components/headless/index.ts +18 -3
- package/src/components/index.ts +6 -9
- package/src/components/ui/AdvancedOptions.vue +18 -0
- package/src/components/ui/AlertModal.vue +13 -0
- package/src/components/ui/Button.vue +98 -0
- package/src/components/ui/Checkbox.vue +56 -0
- package/src/components/ui/ConfirmModal.vue +42 -0
- package/src/components/ui/DropdownMenu.vue +33 -0
- package/src/components/ui/EditableContent.vue +82 -0
- package/src/components/ui/ErrorMessage.vue +15 -0
- package/src/components/ui/ErrorReportModal.vue +62 -0
- package/src/components/{modals/AGErrorReportModalButtons.vue → ui/ErrorReportModalButtons.vue} +38 -29
- package/src/components/ui/ErrorReportModalTitle.vue +24 -0
- package/src/components/ui/Form.vue +24 -0
- package/src/components/ui/Input.vue +56 -0
- package/src/components/ui/Link.vue +12 -0
- package/src/components/ui/LoadingModal.vue +32 -0
- package/src/components/ui/Markdown.vue +69 -0
- package/src/components/ui/Modal.vue +70 -0
- package/src/components/ui/ModalContext.vue +30 -0
- package/src/components/ui/ProgressBar.vue +50 -0
- package/src/components/ui/PromptModal.vue +35 -0
- package/src/components/ui/Select.vue +21 -0
- package/src/components/ui/SelectLabel.vue +10 -0
- package/src/components/ui/SelectOptions.vue +31 -0
- package/src/components/ui/SelectTrigger.vue +29 -0
- package/src/components/ui/SettingsModal.vue +15 -0
- package/src/components/ui/StartupCrash.vue +31 -0
- package/src/components/ui/Toast.vue +42 -0
- package/src/components/ui/index.ts +27 -0
- package/src/directives/index.ts +13 -5
- package/src/directives/measure.ts +40 -0
- package/src/errors/Errors.state.ts +1 -1
- package/src/errors/Errors.ts +35 -34
- package/src/errors/JobCancelledError.ts +3 -0
- package/src/errors/index.ts +19 -29
- package/src/errors/utils.ts +35 -0
- package/src/forms/{Form.test.ts → FormController.test.ts} +33 -4
- package/src/forms/{Form.ts → FormController.ts} +94 -25
- package/src/forms/composition.ts +4 -4
- package/src/forms/index.ts +3 -1
- package/src/forms/utils.ts +36 -5
- package/src/forms/validation.ts +19 -0
- package/src/index.css +46 -0
- package/src/{main.ts → index.ts} +3 -0
- package/src/jobs/Job.ts +147 -0
- package/src/jobs/index.ts +10 -0
- package/src/jobs/listeners.ts +3 -0
- package/src/jobs/status.ts +4 -0
- package/src/lang/DefaultLangProvider.ts +46 -0
- package/src/lang/Lang.state.ts +11 -0
- package/src/lang/Lang.ts +44 -29
- package/src/lang/index.ts +11 -6
- package/src/lang/settings/Language.vue +48 -0
- package/src/lang/settings/index.ts +10 -0
- package/src/plugins/Plugin.ts +2 -1
- package/src/plugins/index.ts +22 -0
- package/src/services/App.state.ts +40 -6
- package/src/services/App.ts +48 -5
- package/src/services/Cache.ts +43 -0
- package/src/services/Events.test.ts +39 -0
- package/src/services/Events.ts +112 -32
- package/src/services/Service.ts +154 -49
- package/src/services/Storage.ts +20 -0
- package/src/services/index.ts +18 -6
- package/src/services/store.ts +8 -5
- package/src/services/utils.ts +18 -0
- package/src/testing/index.ts +26 -0
- package/src/testing/setup.ts +11 -0
- package/src/ui/UI.state.ts +19 -7
- package/src/ui/UI.ts +268 -57
- package/src/ui/index.ts +23 -17
- package/src/ui/utils.ts +16 -0
- package/src/utils/classes.ts +49 -0
- package/src/utils/composition/events.ts +3 -2
- package/src/utils/composition/forms.ts +14 -4
- package/src/utils/composition/persistent.test.ts +33 -0
- package/src/utils/composition/persistent.ts +11 -0
- package/src/utils/composition/state.test.ts +47 -0
- package/src/utils/composition/state.ts +33 -0
- package/src/utils/index.ts +4 -0
- package/src/utils/markdown.test.ts +50 -0
- package/src/utils/markdown.ts +19 -6
- package/src/utils/vue.ts +28 -118
- package/.eslintrc.js +0 -3
- package/dist/aerogel-core.cjs.js +0 -2
- package/dist/aerogel-core.cjs.js.map +0 -1
- package/dist/aerogel-core.esm.js +0 -2
- package/dist/aerogel-core.esm.js.map +0 -1
- package/dist/virtual.d.ts +0 -11
- package/noeldemartin.config.js +0 -5
- package/src/components/AGAppLayout.vue +0 -11
- package/src/components/AGAppSnackbars.vue +0 -13
- package/src/components/basic/AGErrorMessage.vue +0 -16
- package/src/components/basic/AGLink.vue +0 -9
- package/src/components/basic/AGMarkdown.vue +0 -36
- package/src/components/basic/index.ts +0 -5
- package/src/components/constants.ts +0 -8
- package/src/components/forms/AGButton.vue +0 -44
- package/src/components/forms/AGCheckbox.vue +0 -35
- package/src/components/forms/AGForm.vue +0 -26
- package/src/components/forms/AGInput.vue +0 -36
- package/src/components/forms/index.ts +0 -6
- package/src/components/headless/forms/AGHeadlessButton.vue +0 -51
- package/src/components/headless/forms/AGHeadlessInput.ts +0 -8
- package/src/components/headless/forms/AGHeadlessInput.vue +0 -54
- package/src/components/headless/forms/AGHeadlessInputInput.vue +0 -45
- package/src/components/headless/forms/AGHeadlessInputLabel.vue +0 -16
- package/src/components/headless/forms/index.ts +0 -6
- package/src/components/headless/modals/AGHeadlessModal.ts +0 -7
- package/src/components/headless/modals/AGHeadlessModalPanel.vue +0 -28
- package/src/components/headless/modals/AGHeadlessModalTitle.vue +0 -13
- package/src/components/headless/modals/index.ts +0 -6
- package/src/components/headless/snackbars/AGHeadlessSnackbar.vue +0 -10
- package/src/components/headless/snackbars/index.ts +0 -25
- package/src/components/modals/AGAlertModal.vue +0 -25
- package/src/components/modals/AGConfirmModal.vue +0 -30
- package/src/components/modals/AGErrorReportModal.ts +0 -20
- package/src/components/modals/AGErrorReportModal.vue +0 -62
- package/src/components/modals/AGErrorReportModalTitle.vue +0 -25
- package/src/components/modals/AGLoadingModal.vue +0 -19
- package/src/components/modals/AGModal.ts +0 -10
- package/src/components/modals/AGModal.vue +0 -37
- package/src/components/modals/AGModalContext.ts +0 -8
- package/src/components/modals/AGModalContext.vue +0 -22
- package/src/components/modals/AGModalTitle.vue +0 -9
- package/src/components/modals/index.ts +0 -23
- package/src/components/snackbars/AGSnackbar.vue +0 -42
- package/src/components/snackbars/index.ts +0 -3
- package/src/directives/initial-focus.ts +0 -11
- package/src/types/virtual.d.ts +0 -11
- package/tsconfig.json +0 -11
- package/vite.config.ts +0 -14
package/src/jobs/Job.ts
ADDED
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import { ListenersManager, PromisedValue, round, tap, toError } from '@noeldemartin/utils';
|
|
2
|
+
import type { Listeners } from '@noeldemartin/utils';
|
|
3
|
+
|
|
4
|
+
import JobCancelledError from '@aerogel/core/errors/JobCancelledError';
|
|
5
|
+
|
|
6
|
+
import type { JobListener } from './listeners';
|
|
7
|
+
import type { JobStatus } from './status';
|
|
8
|
+
|
|
9
|
+
export default abstract class Job<
|
|
10
|
+
Listener extends JobListener = JobListener,
|
|
11
|
+
Status extends JobStatus = JobStatus,
|
|
12
|
+
SerializedStatus extends JobStatus = JobStatus,
|
|
13
|
+
> {
|
|
14
|
+
|
|
15
|
+
protected status: Status;
|
|
16
|
+
protected _listeners: ListenersManager<JobListener>;
|
|
17
|
+
protected _progress?: number;
|
|
18
|
+
protected _cancelled?: PromisedValue<void>;
|
|
19
|
+
protected _started: PromisedValue<void>;
|
|
20
|
+
protected _completed: PromisedValue<void>;
|
|
21
|
+
|
|
22
|
+
constructor() {
|
|
23
|
+
this.status = this.getInitialStatus();
|
|
24
|
+
this._listeners = new ListenersManager();
|
|
25
|
+
this._started = new PromisedValue();
|
|
26
|
+
this._completed = new PromisedValue();
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
public async start(): Promise<void> {
|
|
30
|
+
this.beforeStart();
|
|
31
|
+
this._started.resolve();
|
|
32
|
+
|
|
33
|
+
try {
|
|
34
|
+
await this.updateProgress();
|
|
35
|
+
await this.run();
|
|
36
|
+
await this.updateProgress();
|
|
37
|
+
|
|
38
|
+
this._completed.resolve();
|
|
39
|
+
} catch (error) {
|
|
40
|
+
if (error instanceof JobCancelledError) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
throw tap(toError(error), (realError) => {
|
|
45
|
+
this._completed.reject(realError);
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
public async cancel(): Promise<void> {
|
|
51
|
+
this._cancelled = new PromisedValue();
|
|
52
|
+
|
|
53
|
+
await this._cancelled;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
public serialize(): SerializedStatus {
|
|
57
|
+
return this.serializeStatus(this.status);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
public get listeners(): Listeners<Listener> {
|
|
61
|
+
return this._listeners;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
public get progress(): number {
|
|
65
|
+
return this._progress ?? 0;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
public get cancelled(): boolean {
|
|
69
|
+
return !!this._cancelled?.isResolved();
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
public get started(): Promise<void> {
|
|
73
|
+
return this._started;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
public get completed(): Promise<void> {
|
|
77
|
+
return this._completed;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
protected abstract run(): Promise<void>;
|
|
81
|
+
|
|
82
|
+
protected getInitialStatus(): Status {
|
|
83
|
+
return { completed: false } as Status;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
protected beforeStart(): void {
|
|
87
|
+
if (!this._started.isResolved()) {
|
|
88
|
+
return;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
if (this._cancelled) {
|
|
92
|
+
delete this._progress;
|
|
93
|
+
delete this._cancelled;
|
|
94
|
+
|
|
95
|
+
return;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
throw new Error('Job already started!');
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
protected assertNotCancelled(): void {
|
|
102
|
+
if (!this._cancelled) {
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
this._cancelled.resolve();
|
|
107
|
+
|
|
108
|
+
throw new JobCancelledError();
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
protected calculateCurrentProgress(status?: JobStatus): number {
|
|
112
|
+
status ??= this.status;
|
|
113
|
+
|
|
114
|
+
if (status.completed) {
|
|
115
|
+
return 1;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
if (!status.children) {
|
|
119
|
+
return 0;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
return round(
|
|
123
|
+
status.children.reduce((total, child) => total + this.calculateCurrentProgress(child), 0) /
|
|
124
|
+
status.children.length,
|
|
125
|
+
2,
|
|
126
|
+
);
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
protected async updateProgress(update?: (status: Status) => unknown): Promise<void> {
|
|
130
|
+
await update?.(this.status);
|
|
131
|
+
|
|
132
|
+
const progress = this.calculateCurrentProgress();
|
|
133
|
+
|
|
134
|
+
if (progress === this._progress) {
|
|
135
|
+
return;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
this._progress = progress;
|
|
139
|
+
|
|
140
|
+
await this._listeners.emit('onUpdated', progress);
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
protected serializeStatus(status: Status): SerializedStatus {
|
|
144
|
+
return { ...status } as unknown as SerializedStatus;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { isDevelopment } from '@noeldemartin/utils';
|
|
2
|
+
|
|
3
|
+
import type { LangProvider } from './Lang';
|
|
4
|
+
|
|
5
|
+
export default class DefaultLangProvider implements LangProvider {
|
|
6
|
+
|
|
7
|
+
constructor(
|
|
8
|
+
private locale: string,
|
|
9
|
+
private fallbackLocale: string,
|
|
10
|
+
) {}
|
|
11
|
+
|
|
12
|
+
public getLocale(): string {
|
|
13
|
+
return this.locale;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
public async setLocale(locale: string): Promise<void> {
|
|
17
|
+
this.locale = locale;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
public getFallbackLocale(): string {
|
|
21
|
+
return this.fallbackLocale;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
public async setFallbackLocale(fallbackLocale: string): Promise<void> {
|
|
25
|
+
this.fallbackLocale = fallbackLocale;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
public getLocales(): string[] {
|
|
29
|
+
return ['en'];
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
public translate(key: string): string {
|
|
33
|
+
// eslint-disable-next-line no-console
|
|
34
|
+
isDevelopment() && console.warn('Lang provider is missing');
|
|
35
|
+
|
|
36
|
+
return key;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
public translateWithDefault(_: string, defaultMessage: string): string {
|
|
40
|
+
// eslint-disable-next-line no-console
|
|
41
|
+
isDevelopment() && console.warn('Lang provider is missing');
|
|
42
|
+
|
|
43
|
+
return defaultMessage;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { defineServiceState } from '@aerogel/core/services/Service';
|
|
2
|
+
|
|
3
|
+
export default defineServiceState({
|
|
4
|
+
name: 'lang',
|
|
5
|
+
persist: ['locale', 'fallbackLocale'],
|
|
6
|
+
initialState: {
|
|
7
|
+
locale: null as string | null,
|
|
8
|
+
locales: ['en'],
|
|
9
|
+
fallbackLocale: 'en',
|
|
10
|
+
},
|
|
11
|
+
});
|
package/src/lang/Lang.ts
CHANGED
|
@@ -1,10 +1,16 @@
|
|
|
1
|
-
import { facade
|
|
1
|
+
import { facade } from '@noeldemartin/utils';
|
|
2
2
|
|
|
3
|
-
import
|
|
4
|
-
import Service from '
|
|
3
|
+
import DefaultLangProvider from './DefaultLangProvider';
|
|
4
|
+
import Service from './Lang.state';
|
|
5
5
|
|
|
6
6
|
export interface LangProvider {
|
|
7
|
-
|
|
7
|
+
getLocale(): string;
|
|
8
|
+
setLocale(locale: string): Promise<void>;
|
|
9
|
+
getFallbackLocale(): string;
|
|
10
|
+
setFallbackLocale(fallbackLocale: string): Promise<void>;
|
|
11
|
+
getLocales(): string[];
|
|
12
|
+
translate(key: string, parameters?: Record<string, unknown> | number): string;
|
|
13
|
+
translateWithDefault(key: string, defaultMessage: string, parameters?: Record<string, unknown> | number): string;
|
|
8
14
|
}
|
|
9
15
|
|
|
10
16
|
export class LangService extends Service {
|
|
@@ -14,47 +20,56 @@ export class LangService extends Service {
|
|
|
14
20
|
constructor() {
|
|
15
21
|
super();
|
|
16
22
|
|
|
17
|
-
this.provider =
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
return key;
|
|
23
|
-
},
|
|
24
|
-
};
|
|
23
|
+
this.provider = new DefaultLangProvider(
|
|
24
|
+
this.getState('locale') ?? this.getBrowserLocale(),
|
|
25
|
+
this.getState('fallbackLocale'),
|
|
26
|
+
);
|
|
25
27
|
}
|
|
26
28
|
|
|
27
|
-
public setProvider(provider: LangProvider): void {
|
|
29
|
+
public async setProvider(provider: LangProvider): Promise<void> {
|
|
28
30
|
this.provider = provider;
|
|
31
|
+
this.locales = provider.getLocales();
|
|
32
|
+
|
|
33
|
+
await provider.setLocale(this.locale ?? this.getBrowserLocale());
|
|
34
|
+
await provider.setFallbackLocale(this.fallbackLocale);
|
|
29
35
|
}
|
|
30
36
|
|
|
31
|
-
public translate(key: string, parameters?: Record<string, unknown>): string {
|
|
37
|
+
public translate(key: string, parameters?: Record<string, unknown> | number): string {
|
|
32
38
|
return this.provider.translate(key, parameters) ?? key;
|
|
33
39
|
}
|
|
34
40
|
|
|
35
|
-
public translateWithDefault(key: string, defaultMessage: string): string;
|
|
36
|
-
public translateWithDefault(key: string, parameters: Record<string, unknown>, defaultMessage: string): string;
|
|
37
41
|
public translateWithDefault(
|
|
38
42
|
key: string,
|
|
39
|
-
|
|
40
|
-
|
|
43
|
+
defaultMessage: string,
|
|
44
|
+
parameters: Record<string, unknown> | number = {},
|
|
41
45
|
): string {
|
|
42
|
-
|
|
46
|
+
return this.provider.translateWithDefault(key, defaultMessage, parameters);
|
|
47
|
+
}
|
|
43
48
|
|
|
44
|
-
|
|
45
|
-
const
|
|
49
|
+
public getBrowserLocale(): string {
|
|
50
|
+
const locales = this.getState('locales');
|
|
46
51
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
52
|
+
return navigator.languages.find((locale) => locales.includes(locale)) ?? 'en';
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
protected override async boot(): Promise<void> {
|
|
56
|
+
if (!globalThis.document) {
|
|
57
|
+
return;
|
|
53
58
|
}
|
|
54
59
|
|
|
55
|
-
|
|
60
|
+
this.requireStore().$subscribe(
|
|
61
|
+
async () => {
|
|
62
|
+
await this.provider.setLocale(this.locale ?? this.getBrowserLocale());
|
|
63
|
+
await this.provider.setFallbackLocale(this.fallbackLocale);
|
|
64
|
+
|
|
65
|
+
this.locale
|
|
66
|
+
? document.querySelector('html')?.setAttribute('lang', this.locale)
|
|
67
|
+
: document.querySelector('html')?.removeAttribute('lang');
|
|
68
|
+
},
|
|
69
|
+
{ immediate: true },
|
|
70
|
+
);
|
|
56
71
|
}
|
|
57
72
|
|
|
58
73
|
}
|
|
59
74
|
|
|
60
|
-
export default facade(
|
|
75
|
+
export default facade(LangService);
|
package/src/lang/index.ts
CHANGED
|
@@ -1,10 +1,14 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
1
|
+
import App from '@aerogel/core/services/App';
|
|
2
|
+
import { bootServices } from '@aerogel/core/services';
|
|
3
|
+
import { definePlugin } from '@aerogel/core/plugins';
|
|
3
4
|
|
|
4
|
-
import Lang
|
|
5
|
+
import Lang from './Lang';
|
|
6
|
+
import settings from './settings';
|
|
7
|
+
import type { LangProvider } from './Lang';
|
|
5
8
|
import { translate, translateWithDefault } from './utils';
|
|
6
9
|
|
|
7
|
-
export { Lang,
|
|
10
|
+
export { Lang, translate, translateWithDefault };
|
|
11
|
+
export type { LangProvider };
|
|
8
12
|
|
|
9
13
|
const services = { $lang: Lang };
|
|
10
14
|
|
|
@@ -14,16 +18,17 @@ export default definePlugin({
|
|
|
14
18
|
async install(app) {
|
|
15
19
|
app.config.globalProperties.$t ??= translate;
|
|
16
20
|
app.config.globalProperties.$td = translateWithDefault;
|
|
21
|
+
App.settings.push(...settings);
|
|
17
22
|
|
|
18
23
|
await bootServices(app, services);
|
|
19
24
|
},
|
|
20
25
|
});
|
|
21
26
|
|
|
22
|
-
declare module '
|
|
27
|
+
declare module '@aerogel/core/services' {
|
|
23
28
|
export interface Services extends LangServices {}
|
|
24
29
|
}
|
|
25
30
|
|
|
26
|
-
declare module '
|
|
31
|
+
declare module 'vue' {
|
|
27
32
|
interface ComponentCustomProperties {
|
|
28
33
|
$td: typeof translateWithDefault;
|
|
29
34
|
}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<Select
|
|
3
|
+
v-model="$lang.locale"
|
|
4
|
+
class="flex flex-col items-start md:flex-row"
|
|
5
|
+
as="div"
|
|
6
|
+
:options
|
|
7
|
+
:render-option="renderLocale"
|
|
8
|
+
>
|
|
9
|
+
<div class="grow">
|
|
10
|
+
<SelectLabel>
|
|
11
|
+
{{ $td('settings.locale', 'Language') }}
|
|
12
|
+
</SelectLabel>
|
|
13
|
+
<Markdown
|
|
14
|
+
lang-key="settings.localeDescription"
|
|
15
|
+
lang-default="Choose the application's language."
|
|
16
|
+
class="mt-1 text-sm text-gray-500"
|
|
17
|
+
/>
|
|
18
|
+
</div>
|
|
19
|
+
<Button variant="ghost" :as="SelectTrigger" class="w-auto outline-none" />
|
|
20
|
+
<SelectOptions />
|
|
21
|
+
</Select>
|
|
22
|
+
</template>
|
|
23
|
+
|
|
24
|
+
<script setup lang="ts">
|
|
25
|
+
import Aerogel from 'virtual:aerogel';
|
|
26
|
+
|
|
27
|
+
import { computed } from 'vue';
|
|
28
|
+
|
|
29
|
+
import Markdown from '@aerogel/core/components/ui/Markdown.vue';
|
|
30
|
+
import Button from '@aerogel/core/components/ui/Button.vue';
|
|
31
|
+
import Select from '@aerogel/core/components/ui/Select.vue';
|
|
32
|
+
import SelectLabel from '@aerogel/core/components/ui/SelectLabel.vue';
|
|
33
|
+
import SelectTrigger from '@aerogel/core/components/ui/SelectTrigger.vue';
|
|
34
|
+
import SelectOptions from '@aerogel/core/components/ui/SelectOptions.vue';
|
|
35
|
+
import { Lang, translateWithDefault } from '@aerogel/core/lang';
|
|
36
|
+
|
|
37
|
+
const browserLocale = Lang.getBrowserLocale();
|
|
38
|
+
const options = computed(() => [null, ...Lang.locales]);
|
|
39
|
+
|
|
40
|
+
function renderLocale(locale: string | null): string {
|
|
41
|
+
return (
|
|
42
|
+
(locale && Aerogel.locales[locale]) ??
|
|
43
|
+
translateWithDefault('settings.localeDefault', '{locale} (default)', {
|
|
44
|
+
locale: Aerogel.locales[browserLocale] ?? browserLocale,
|
|
45
|
+
})
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
</script>
|
package/src/plugins/Plugin.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import type { App } from 'vue';
|
|
2
2
|
|
|
3
|
-
import type { AerogelOptions } from '
|
|
3
|
+
import type { AerogelOptions } from '@aerogel/core/bootstrap/options';
|
|
4
4
|
|
|
5
5
|
export interface Plugin {
|
|
6
|
+
name?: string;
|
|
6
7
|
install(app: App, options: AerogelOptions): void | Promise<void>;
|
|
7
8
|
}
|
package/src/plugins/index.ts
CHANGED
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
import type { GetClosureArgs } from '@noeldemartin/utils';
|
|
2
|
+
|
|
3
|
+
import App from '@aerogel/core/services/App';
|
|
4
|
+
|
|
1
5
|
import type { Plugin } from './Plugin';
|
|
2
6
|
|
|
3
7
|
export * from './Plugin';
|
|
@@ -5,3 +9,21 @@ export * from './Plugin';
|
|
|
5
9
|
export function definePlugin<T extends Plugin>(plugin: T): T {
|
|
6
10
|
return plugin;
|
|
7
11
|
}
|
|
12
|
+
|
|
13
|
+
export async function installPlugins(plugins: Plugin[], ...args: GetClosureArgs<Plugin['install']>): Promise<void> {
|
|
14
|
+
App.setState(
|
|
15
|
+
'plugins',
|
|
16
|
+
plugins.reduce(
|
|
17
|
+
(pluginsMap, plugin) => {
|
|
18
|
+
if (plugin.name) {
|
|
19
|
+
pluginsMap[plugin.name] = plugin;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
return pluginsMap;
|
|
23
|
+
},
|
|
24
|
+
{} as Record<string, Plugin>,
|
|
25
|
+
),
|
|
26
|
+
);
|
|
27
|
+
|
|
28
|
+
await Promise.all(plugins.map((plugin) => plugin.install(...args)) ?? []);
|
|
29
|
+
}
|
|
@@ -1,16 +1,50 @@
|
|
|
1
|
-
import
|
|
1
|
+
import Aerogel from 'virtual:aerogel';
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import { getEnv } from '@noeldemartin/utils';
|
|
4
|
+
import type { App, Component } from 'vue';
|
|
5
|
+
|
|
6
|
+
import { defineServiceState } from '@aerogel/core/services/Service';
|
|
7
|
+
import type { Plugin } from '@aerogel/core/plugins/Plugin';
|
|
8
|
+
|
|
9
|
+
export interface AppSetting {
|
|
10
|
+
component: Component;
|
|
11
|
+
priority: number;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
export function defineSettings<T extends AppSetting[]>(settings: T): T {
|
|
15
|
+
return settings;
|
|
16
|
+
}
|
|
4
17
|
|
|
5
18
|
export default defineServiceState({
|
|
6
19
|
name: 'app',
|
|
7
20
|
initialState: {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
21
|
+
plugins: {} as Record<string, Plugin>,
|
|
22
|
+
instance: null as App | null,
|
|
23
|
+
environment: getEnv() ?? 'development',
|
|
24
|
+
version: Aerogel.version,
|
|
25
|
+
sourceUrl: Aerogel.sourceUrl,
|
|
26
|
+
settings: [] as AppSetting[],
|
|
11
27
|
},
|
|
12
28
|
computed: {
|
|
13
29
|
development: (state) => state.environment === 'development',
|
|
14
|
-
|
|
30
|
+
staging: (state) => state.environment === 'staging',
|
|
31
|
+
testing: (state) => state.environment === 'test' || state.environment === 'testing',
|
|
32
|
+
versionName(state): string {
|
|
33
|
+
if (this.development) {
|
|
34
|
+
return 'dev.' + Aerogel.sourceHash.toString().substring(0, 7);
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
if (this.staging) {
|
|
38
|
+
return 'staging.' + Aerogel.sourceHash.toString().substring(0, 7);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
return `v${state.version}`;
|
|
42
|
+
},
|
|
43
|
+
versionUrl(state): string {
|
|
44
|
+
return (
|
|
45
|
+
state.sourceUrl +
|
|
46
|
+
(this.development || this.staging ? `/tree/${Aerogel.sourceHash}` : `/releases/tag/${this.versionName}`)
|
|
47
|
+
);
|
|
48
|
+
},
|
|
15
49
|
},
|
|
16
50
|
});
|
package/src/services/App.ts
CHANGED
|
@@ -1,15 +1,58 @@
|
|
|
1
|
-
import
|
|
1
|
+
import Aerogel from 'virtual:aerogel';
|
|
2
2
|
|
|
3
|
-
import
|
|
3
|
+
import { PromisedValue, facade, forever, updateLocationQueryParameters } from '@noeldemartin/utils';
|
|
4
|
+
|
|
5
|
+
import Events from '@aerogel/core/services/Events';
|
|
6
|
+
import type { Plugin } from '@aerogel/core/plugins';
|
|
7
|
+
import type { Services } from '@aerogel/core/services';
|
|
4
8
|
|
|
5
9
|
import Service from './App.state';
|
|
6
10
|
|
|
11
|
+
export { defineSettings } from './App.state';
|
|
12
|
+
export type { AppSetting } from './App.state';
|
|
13
|
+
|
|
7
14
|
export class AppService extends Service {
|
|
8
15
|
|
|
9
|
-
|
|
10
|
-
|
|
16
|
+
public readonly name = Aerogel.name;
|
|
17
|
+
public readonly ready = new PromisedValue<void>();
|
|
18
|
+
public readonly mounted = new PromisedValue<void>();
|
|
19
|
+
|
|
20
|
+
public isReady(): boolean {
|
|
21
|
+
return this.ready.isResolved();
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
public isMounted(): boolean {
|
|
25
|
+
return this.mounted.isResolved();
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
public async whenReady<T>(callback: () => T): Promise<T> {
|
|
29
|
+
const result = await this.ready.then(callback);
|
|
30
|
+
|
|
31
|
+
return result;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
public async reload(queryParameters?: Record<string, string | undefined>): Promise<void> {
|
|
35
|
+
queryParameters && updateLocationQueryParameters(queryParameters);
|
|
36
|
+
|
|
37
|
+
location.reload();
|
|
38
|
+
|
|
39
|
+
// Stall until the reload happens
|
|
40
|
+
await forever();
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
public plugin<T extends Plugin = Plugin>(name: string): T | null {
|
|
44
|
+
return (this.plugins[name] as T) ?? null;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
public service<T extends keyof Services>(name: T): Services[T] | null {
|
|
48
|
+
return this.instance?.config.globalProperties[name] ?? null;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
protected override async boot(): Promise<void> {
|
|
52
|
+
Events.once('application-ready', () => this.ready.resolve());
|
|
53
|
+
Events.once('application-mounted', () => this.mounted.resolve());
|
|
11
54
|
}
|
|
12
55
|
|
|
13
56
|
}
|
|
14
57
|
|
|
15
|
-
export default facade(
|
|
58
|
+
export default facade(AppService);
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { PromisedValue, facade, tap } from '@noeldemartin/utils';
|
|
2
|
+
|
|
3
|
+
import Service from '@aerogel/core/services/Service';
|
|
4
|
+
|
|
5
|
+
export class CacheService extends Service {
|
|
6
|
+
|
|
7
|
+
private cache?: PromisedValue<Cache> = undefined;
|
|
8
|
+
|
|
9
|
+
public async get(url: string): Promise<Response | null> {
|
|
10
|
+
const cache = await this.open();
|
|
11
|
+
const response = await cache.match(url);
|
|
12
|
+
|
|
13
|
+
return response ?? null;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
public async store(url: string, response: Response): Promise<void> {
|
|
17
|
+
const cache = await this.open();
|
|
18
|
+
|
|
19
|
+
await cache.put(url, response);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
public async replace(url: string, response: Response): Promise<void> {
|
|
23
|
+
const cache = await this.open();
|
|
24
|
+
const keys = await cache.keys(url);
|
|
25
|
+
|
|
26
|
+
if (keys.length === 0) {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
await cache.put(url, response);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
protected async open(): Promise<Cache> {
|
|
34
|
+
return (this.cache =
|
|
35
|
+
this.cache ??
|
|
36
|
+
tap(new PromisedValue<Cache>(), (cache) => {
|
|
37
|
+
caches.open('app').then((instance) => cache.resolve(instance));
|
|
38
|
+
}));
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export default facade(CacheService);
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { beforeEach, describe, expect, it } from 'vitest';
|
|
2
|
+
|
|
3
|
+
import Events, { EventListenerPriorities } from './Events';
|
|
4
|
+
|
|
5
|
+
describe('Events', () => {
|
|
6
|
+
|
|
7
|
+
beforeEach(() => void Events.reset());
|
|
8
|
+
|
|
9
|
+
it('registers listeners', async () => {
|
|
10
|
+
// Arrange
|
|
11
|
+
let counter = 0;
|
|
12
|
+
|
|
13
|
+
Events.on('trigger', () => counter++);
|
|
14
|
+
|
|
15
|
+
// Act
|
|
16
|
+
await Events.emit('trigger');
|
|
17
|
+
await Events.emit('trigger');
|
|
18
|
+
await Events.emit('trigger');
|
|
19
|
+
|
|
20
|
+
// Assert
|
|
21
|
+
expect(counter).toEqual(3);
|
|
22
|
+
});
|
|
23
|
+
|
|
24
|
+
it('triggers listeners by priority', async () => {
|
|
25
|
+
// Arrange
|
|
26
|
+
const storage: string[] = [];
|
|
27
|
+
|
|
28
|
+
Events.on('trigger', () => storage.push('second'));
|
|
29
|
+
Events.on('trigger', { priority: EventListenerPriorities.Low }, () => storage.push('third'));
|
|
30
|
+
Events.on('trigger', { priority: EventListenerPriorities.High }, () => storage.push('first'));
|
|
31
|
+
|
|
32
|
+
// Act
|
|
33
|
+
await Events.emit('trigger');
|
|
34
|
+
|
|
35
|
+
// Assert
|
|
36
|
+
expect(storage).toEqual(['first', 'second', 'third']);
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
});
|