Skip to content

Commit 9a309a8

Browse files
authored
Merge pull request #3 from univdev/feature/create-react-hoc
Create function 'create react hook' menu
2 parents d610798 + be49b4b commit 9a309a8

File tree

3 files changed

+43
-0
lines changed

3 files changed

+43
-0
lines changed
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import * as vscode from 'vscode';
2+
import * as fs from 'fs';
3+
import * as fspath from 'path';
4+
import { reactHOCFactory } from '../factory/ReactHOC.factory';
5+
6+
export const createReactHOCCommand = (uri: vscode.Uri) => {
7+
const path = uri.fsPath;
8+
9+
vscode.window.showInputBox({
10+
prompt: 'Enter React hoc name',
11+
placeHolder: 'withMyHOC',
12+
}).then((hocName) => {
13+
if (hocName) {
14+
const hocFileContent = reactHOCFactory(hocName);
15+
16+
fs.writeFileSync(
17+
fspath.join(path, `${hocName}.hoc.tsx`),
18+
hocFileContent,
19+
);
20+
}
21+
});
22+
};

src/factory/Commands.factory.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import * as vscode from 'vscode';
22
import { createReactComponentCommand } from "../commands/CreateReactComponent.command";
33
import { createReactHookCommand } from '../commands/CreateReactHook.factory';
4+
import { createReactHOCCommand } from '../commands/CreateReactHOC.command';
45

56
export const commandsFactory = (context: vscode.ExtensionContext) => {
67
commands.forEach((command) => {
@@ -13,6 +14,10 @@ const commands = [
1314
'vscode-react-developer-toolkit.createReactComponent',
1415
createReactComponentCommand,
1516
),
17+
vscode.commands.registerCommand(
18+
'vscode-react-developer-toolkit.createReactHOC',
19+
createReactHOCCommand,
20+
),
1621
vscode.commands.registerCommand(
1722
'vscode-react-developer-toolkit.createReactHook',
1823
createReactHookCommand,

src/factory/ReactHOC.factory.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
export const reactHOCFactory = (hocName: string) => `import { ComponentType } from 'react';
2+
3+
export type IComponentRequiredProps = {
4+
// Write required props.
5+
};
6+
7+
export function ${hocName}<P = IComponentRequiredProps>(Component: ComponentType<P>) {
8+
return function(props: P) {
9+
return (
10+
<Component { ...props as any } />
11+
);
12+
};
13+
};
14+
15+
export default ${hocName};
16+
`;

0 commit comments

Comments
 (0)