File tree Expand file tree Collapse file tree 5 files changed +54
-15
lines changed Expand file tree Collapse file tree 5 files changed +54
-15
lines changed Original file line number Diff line number Diff line change 16
16
{
17
17
"command" : " vscode-react-developer-toolkit.createReactComponent" ,
18
18
"title" : " Create React Component"
19
+ },
20
+ {
21
+ "command" : " vscode-react-developer-toolkit.createReactHook" ,
22
+ "title" : " Create React Hook"
23
+ },
24
+ {
25
+ "command" : " vscode-react-developer-toolkit.createReactHOC" ,
26
+ "title" : " Create React HOC"
19
27
}
20
28
],
21
29
"menus" : {
30
38
{
31
39
"command" : " vscode-react-developer-toolkit.createReactComponent" ,
32
40
"group" : " 1_create"
41
+ },
42
+ {
43
+ "command" : " vscode-react-developer-toolkit.createReactHook" ,
44
+ "group" : " 1_create"
45
+ },
46
+ {
47
+ "command" : " vscode-react-developer-toolkit.createReactHOC" ,
48
+ "group" : " 1_create"
33
49
}
34
50
]
35
51
},
Original file line number Diff line number Diff line change
1
+ import * as vscode from 'vscode' ;
2
+ import * as fs from 'fs' ;
3
+ import * as fspath from 'path' ;
4
+ import { reactHookFactory } from '../factory/ReactHook.factory' ;
5
+
6
+ export const createReactHookCommand = ( uri : vscode . Uri ) => {
7
+ const path = uri . fsPath ;
8
+
9
+ vscode . window . showInputBox ( {
10
+ prompt : 'Enter React hook name' ,
11
+ placeHolder : 'MyHook (or useMyHook)' ,
12
+ } ) . then ( ( hookName ) => {
13
+ if ( typeof hookName === 'string' ) {
14
+ let newHookName = hookName ;
15
+ if ( hookName . startsWith ( 'use' ) === false ) newHookName = `use${ hookName } ` ;
16
+
17
+ vscode . window . showInformationMessage ( newHookName ) ;
18
+
19
+ const hookFileContent = reactHookFactory ( newHookName ) ;
20
+
21
+ fs . writeFileSync (
22
+ fspath . join ( path , `${ newHookName } .ts` ) ,
23
+ hookFileContent ,
24
+ ) ;
25
+ }
26
+ } ) ;
27
+ } ;
Original file line number Diff line number Diff line change 1
1
import * as vscode from 'vscode' ;
2
- import { createReactComponent } from './commands/CreateReactComponent.command ' ;
2
+ import { commandsFactory } from './factory ' ;
3
3
4
4
export function activate ( context : vscode . ExtensionContext ) {
5
- let disposable = vscode . commands . registerCommand ( 'vscode-react-developer-toolkit.createReactComponent' , ( uri : vscode . Uri ) => {
6
- if ( uri && uri . fsPath ) {
7
- vscode . window . showInputBox ( {
8
- prompt : 'Enter React component name' ,
9
- placeHolder : 'MyComponent'
10
- } ) . then ( componentName => {
11
- if ( componentName ) {
12
- createReactComponent ( uri . fsPath , componentName ) ;
13
- }
14
- } ) ;
15
- }
16
- } ) ;
17
-
18
- context . subscriptions . push ( disposable ) ;
5
+ commandsFactory ( context ) ;
19
6
}
Original file line number Diff line number Diff line change 1
1
import * as vscode from 'vscode' ;
2
2
import { createReactComponentCommand } from "../commands/CreateReactComponent.command" ;
3
+ import { createReactHookCommand } from '../commands/CreateReactHook.factory' ;
3
4
4
5
export const commandsFactory = ( context : vscode . ExtensionContext ) => {
5
6
commands . forEach ( ( command ) => {
@@ -12,6 +13,10 @@ const commands = [
12
13
'vscode-react-developer-toolkit.createReactComponent' ,
13
14
createReactComponentCommand ,
14
15
) ,
16
+ vscode . commands . registerCommand (
17
+ 'vscode-react-developer-toolkit.createReactHook' ,
18
+ createReactHookCommand ,
19
+ ) ,
15
20
] ;
16
21
17
22
export default commandsFactory ;
Original file line number Diff line number Diff line change
1
+ export const reactHookFactory = ( hookName : string ) => `export const ${ hookName } = () => {
2
+
3
+ };
4
+ ` ;
You can’t perform that action at this time.
0 commit comments