Skip to content

Commit aa6b32d

Browse files
linhewewoor
linhe
authored and
wewoor
committed
feat(problems and notification): update problems and notification code
#103
1 parent 823f68f commit aa6b32d

35 files changed

+481
-110
lines changed

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
"@types/react-dom": "^17.0.3",
3636
"immutability-helper": "^3.1.1",
3737
"lodash": "^4.17.21",
38-
"monaco-editor": "^0.21.2",
38+
"monaco-editor": "0.21.2",
3939
"rc-collapse": "~2.0.1",
4040
"rc-dialog": "8.2.1",
4141
"rc-textarea": "~0.3.1",

‎src/controller/index.ts

+2
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,10 @@ import { FolderTreeController } from './explorer/folderTree';
44
import { SearchController } from './search/search';
55
import { NotificationController } from './notification';
66
import { SettingsController } from './settings';
7+
import { ProblemsController } from './problems';
78
export const explorerController = container.resolve(ExplorerController);
89
export const searchController = container.resolve(SearchController);
910
export const folderTreeController = container.resolve(FolderTreeController);
1011
export const notificationController = container.resolve(NotificationController);
1112
export const settingController = container.resolve(SettingsController);
13+
export const problemsController = container.resolve(ProblemsController);

‎src/controller/notification.tsx

+10-8
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,6 @@ import * as ReactDOM from 'react-dom';
55
import { connect } from 'mo/react';
66
import { IStatusBarItem } from 'mo/model';
77
import { Controller } from 'mo/react/controller';
8-
import { Notification } from 'mo/workbench/statusBar/notification';
9-
import { NotificationPanel } from 'mo/workbench/statusBar/notification/notificationPanel';
10-
118
import { IActionBarItem } from 'mo/components/actionBar';
129
import {
1310
INotificationItem,
@@ -17,10 +14,15 @@ import {
1714
import { select } from 'mo/common/dom';
1815
import { ID_APP } from 'mo/common/id';
1916
import {
17+
NotificationPanel,
18+
NotificationStatusBarView,
19+
} from 'mo/workbench/notification';
20+
import {
21+
IStatusBarService,
22+
StatusBarService,
2023
INotificationService,
2124
NotificationService,
22-
} from 'mo/services/notificationService';
23-
import { IStatusBarService, StatusBarService } from 'mo/services';
25+
} from 'mo/services';
2426

2527
export interface INotificationController {
2628
onCloseNotification(item: INotificationItem): void;
@@ -45,11 +47,11 @@ export class NotificationController
4547
this.init();
4648
}
4749

48-
public onCloseNotification(item: INotificationItem<any>): void {
50+
public onCloseNotification = (item: INotificationItem<any>): void => {
4951
if (typeof item.id === 'number') {
5052
this.notificationService.removeNotification(item.id);
5153
}
52-
}
54+
};
5355

5456
private _notificationPanel: HTMLDivElement | undefined = undefined;
5557

@@ -80,7 +82,7 @@ export class NotificationController
8082
const notificationItem = this.notificationService.getState();
8183
const NotificationView = connect(
8284
this.notificationService,
83-
Notification
85+
NotificationStatusBarView
8486
);
8587
this.notificationService.setState({
8688
...notificationItem,

‎src/controller/problems.tsx

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import 'reflect-metadata';
2+
import * as React from 'react';
3+
import { IStatusBarItem } from 'mo';
4+
import { Controller } from 'mo/react/controller';
5+
import {
6+
IPanelService,
7+
PanelService,
8+
IStatusBarService,
9+
StatusBarService,
10+
} from 'mo/services';
11+
import { singleton, container } from 'tsyringe';
12+
import { STATUS_PROBLEMS, PANEL_PROBLEMS } from 'mo/model/problems';
13+
export interface IProblemsController {
14+
onClick?: (e: React.MouseEvent, item: IStatusBarItem) => void;
15+
}
16+
@singleton()
17+
export class ProblemsController
18+
extends Controller
19+
implements IProblemsController {
20+
private readonly panelService: IPanelService;
21+
private readonly statusBarService: IStatusBarService;
22+
constructor() {
23+
super();
24+
this.panelService = container.resolve(PanelService);
25+
this.statusBarService = container.resolve(StatusBarService);
26+
this.init();
27+
}
28+
private showHideProblems() {
29+
const { current, hidden } = this.panelService.getState();
30+
if (hidden) {
31+
this.panelService.showHide();
32+
} else if (current?.id !== PANEL_PROBLEMS.id) {
33+
this.panelService.open(PANEL_PROBLEMS);
34+
} else {
35+
this.panelService.showHide();
36+
}
37+
}
38+
39+
public onClick = (e: React.MouseEvent, item: IStatusBarItem) => {
40+
this.showHideProblems();
41+
};
42+
private init() {
43+
this.statusBarService.appendLeftItem(
44+
Object.assign(STATUS_PROBLEMS, {
45+
onClick: this.onClick,
46+
})
47+
);
48+
this.panelService.add(PANEL_PROBLEMS);
49+
}
50+
}

‎src/controller/statusBar.tsx

+1-22
Original file line numberDiff line numberDiff line change
@@ -2,40 +2,19 @@ import 'reflect-metadata';
22
import * as React from 'react';
33
import { IStatusBarItem, StatusBarEvent } from 'mo/model';
44
import { Controller } from 'mo/react/controller';
5-
import { container, singleton } from 'tsyringe';
6-
import { PANEL_PROBLEMS } from 'mo/model/workbench/panel';
7-
import { STATUS_PROBLEMS } from 'mo/model/workbench/statusBar';
8-
import { IPanelService, PanelService } from 'mo/services';
9-
5+
import { singleton } from 'tsyringe';
106
export interface IStatusBarController {
117
onClick?: (e: React.MouseEvent, item: IStatusBarItem) => void;
128
}
139
@singleton()
1410
export class StatusBarController
1511
extends Controller
1612
implements IStatusBarController {
17-
private readonly panelService: IPanelService;
18-
1913
constructor() {
2014
super();
21-
this.panelService = container.resolve(PanelService);
2215
}
2316

2417
public onClick = (e: React.MouseEvent, item: IStatusBarItem) => {
25-
const { id } = item;
26-
switch (id) {
27-
case STATUS_PROBLEMS.id /** Problems */:
28-
const { current, hidden } = this.panelService.getState();
29-
if (hidden) {
30-
this.panelService.showHide();
31-
} else if (current?.id !== PANEL_PROBLEMS.id) {
32-
this.panelService.open(PANEL_PROBLEMS);
33-
} else {
34-
this.panelService.showHide();
35-
}
36-
break;
37-
default:
38-
}
3918
this.emit(StatusBarEvent.onClick, e, item);
4019
};
4120
}

‎src/extensions/editor/index.tsx

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { IExtensionService } from 'mo';
2+
import { IExtension } from 'mo/model/extension';
3+
4+
function init() {}
5+
6+
export const ExtendEditor: IExtension = {
7+
activate(extensionCtx: IExtensionService) {
8+
init();
9+
},
10+
};

‎src/workbench/statusBar/editor/index.tsx ‎src/extensions/editor/statusBarView/index.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22

3-
export function EditorMarkers(props: any) {
3+
export function EditorStatusBarView(props: any) {
44
const { data = { ln: 0, col: 0 } } = props;
55
return <span>{`Ln ${data.ln}, Col ${data.col}`}</span>;
66
}

‎src/extensions/index.ts

+7
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
11
import { ExtendStatusBar } from './statusBar';
2+
import { ExtendEditor } from './editor';
3+
import { ExtendNotification } from './notification';
4+
import { ExtendProblems } from './problems';
5+
26
import { defaultColorThemeExtension } from './theme-defaults';
37
import { monokaiColorThemeExtension } from './theme-monokai';
48
import { paleNightColorThemeExtension } from './vscode-palenight-theme';
@@ -8,7 +12,10 @@ import { ExtendFolderTree } from './folderTree';
812
* Default extensions
913
*/
1014
export const defaultExtensions = [
15+
ExtendEditor,
1116
ExtendStatusBar,
17+
ExtendProblems,
18+
ExtendNotification,
1219
defaultColorThemeExtension,
1320
monokaiColorThemeExtension,
1421
paleNightColorThemeExtension,

‎src/extensions/notification/index.tsx

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import React from 'react';
2+
import { IExtension } from 'mo/model/extension';
3+
import { IExtensionService, notificationService } from 'mo';
4+
import { Button } from 'mo/components/button';
5+
function init() {
6+
notificationService.addNotifications([
7+
{
8+
id: 1,
9+
value: '测试消息模块1',
10+
status: 1,
11+
render: (item) => {
12+
return (
13+
<div>
14+
<div>{item.value}</div>
15+
<Button>测试</Button>
16+
</div>
17+
);
18+
},
19+
},
20+
{
21+
id: 2,
22+
value: '测试消息模块2',
23+
status: 1,
24+
},
25+
{
26+
id: 3,
27+
value: '测试消息模块3',
28+
status: 1,
29+
},
30+
]);
31+
}
32+
33+
export const ExtendNotification: IExtension = {
34+
activate(extensionCtx: IExtensionService) {
35+
init();
36+
},
37+
};

‎src/extensions/problems/index.tsx

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { IExtensionService } from 'mo';
2+
import { IExtension } from 'mo/model/extension';
3+
import { problemsService } from 'mo';
4+
5+
function init() {
6+
const MockItem = {
7+
id: 1,
8+
name: 'text.tsx',
9+
value: {
10+
code: 'text.tsx',
11+
message: '文件夹',
12+
startLineNumber: 0,
13+
startColumn: 1,
14+
endLineNumber: 0,
15+
endColumn: 1,
16+
status: 1,
17+
},
18+
children: [
19+
{
20+
id: 3,
21+
name: '0-1',
22+
value: {
23+
code: 'endLineNumber',
24+
message: '语法错误',
25+
startLineNumber: 0,
26+
startColumn: 1,
27+
endLineNumber: 0,
28+
endColumn: 1,
29+
status: 2,
30+
},
31+
children: [],
32+
},
33+
],
34+
};
35+
problemsService.addProblems(MockItem);
36+
}
37+
38+
export const ExtendProblems: IExtension = {
39+
activate(extensionCtx: IExtensionService) {
40+
init();
41+
},
42+
};

‎src/index.ts

+4
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,8 @@ import {
3737
ExtensionService,
3838
ISettingsService,
3939
SettingsService,
40+
IProblemsService,
41+
ProblemsService,
4042
} from 'mo/services';
4143

4244
/**
@@ -59,6 +61,7 @@ const panelService = container.resolve<IPanelService>(PanelService);
5961
const notificationService = container.resolve<INotificationService>(
6062
NotificationService
6163
);
64+
const problemsService = container.resolve<IProblemsService>(ProblemsService);
6265

6366
/**
6467
* The ColorTheme service,
@@ -92,4 +95,5 @@ export {
9295
colorThemeService,
9396
settingsService,
9497
notificationService,
98+
problemsService,
9599
};

‎src/model/notification.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ export enum NotificationStatus {
1111
export interface INotificationItem<T = any> {
1212
id?: number;
1313
value: T;
14+
render?(item: INotificationItem): ReactNode;
1415
status?: NotificationStatus;
1516
}
1617

‎src/model/problems.ts

-1
This file was deleted.

‎src/model/problems.tsx

+76
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
import * as React from 'react';
2+
import { injectable } from 'tsyringe';
3+
import { IStatusBarItem } from 'mo/model/workbench/statusBar';
4+
import { IPanelItem } from 'mo/model/workbench/panel';
5+
import {
6+
ProblemsStatusBarView,
7+
ProblemsPanelView,
8+
} from 'mo/workbench/problems';
9+
10+
export enum MarkerSeverity {
11+
Hint = 1,
12+
Info = 2,
13+
Warning = 4,
14+
Error = 8,
15+
}
16+
export interface IRelatedInformation {
17+
code: string;
18+
message: string;
19+
startLineNumber: number;
20+
startColumn: number;
21+
endLineNumber: number;
22+
endColumn: number;
23+
status: MarkerSeverity;
24+
}
25+
export interface IProblemsItem<T = any> {
26+
id?: number;
27+
name: string;
28+
value: IRelatedInformation;
29+
children: IProblemsItem[];
30+
}
31+
32+
export interface IProblems<T = any> {
33+
id: string;
34+
name: string;
35+
data: IProblemsItem<T>[];
36+
show?: boolean;
37+
}
38+
export const STATUS_PROBLEMS: IStatusBarItem = {
39+
id: 'MoProblems',
40+
sortIndex: 1,
41+
data: {
42+
warnings: 0,
43+
errors: 0,
44+
infos: 0,
45+
},
46+
name: 'Problems',
47+
render: (item: IStatusBarItem) => <ProblemsStatusBarView {...item} />,
48+
};
49+
export const PANEL_PROBLEMS: IPanelItem = {
50+
id: 'ProblemsPane',
51+
name: 'problems',
52+
data: null,
53+
renderPane: (item) => <ProblemsPanelView {...item} />,
54+
};
55+
56+
@injectable()
57+
export class ProblemsModel<T> implements IProblems<T> {
58+
static readonly ID = 'MO_PROBLEMS';
59+
static readonly NAME = 'Problems';
60+
public id: string;
61+
public name: string;
62+
public data: IProblemsItem<T>[];
63+
public show: boolean;
64+
65+
constructor(
66+
id: string = ProblemsModel.ID,
67+
name: string = ProblemsModel.NAME,
68+
data: IProblemsItem<T>[] = [],
69+
show: boolean = false
70+
) {
71+
this.id = id;
72+
this.name = name;
73+
this.show = show;
74+
this.data = data;
75+
}
76+
}

0 commit comments

Comments
 (0)