Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit 7064125

Browse filesBrowse files
lokeetolokeeto
committed
ref: Lemoncode#187 adding types
1 parent 4b9952e commit 7064125
Copy full SHA for 7064125

File tree

Expand file treeCollapse file tree

39 files changed

+148
-169
lines changed
Filter options
Expand file treeCollapse file tree

39 files changed

+148
-169
lines changed

‎hooks/02_Properties/src/hello.tsx

Copy file name to clipboardExpand all lines: hooks/02_Properties/src/hello.tsx
+3-3Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => (
8-
<h2>Hello user: {props.userName} !</h2>
9-
);
7+
export const HelloComponent: React.FC<Props> = (props) => (
8+
<h2>Hello user: {props.userName} !</h2>
9+
);

‎hooks/03_State/src/hello.tsx

Copy file name to clipboardExpand all lines: hooks/03_State/src/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/03_State/src/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/03_State/src/nameEdit.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ interface Props {
55
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
66
}
77

8-
export const NameEditComponent = (props: Props) => (
8+
export const NameEditComponent: React.FC<Props> = (props) => (
99
<>
1010
<label>Update name:</label>
1111
<input value={props.userName} onChange={props.onChange} />

‎hooks/04_Callback/src/hello.tsx

Copy file name to clipboardExpand all lines: hooks/04_Callback/src/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/04_Callback/src/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/04_Callback/src/nameEdit.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ interface Props {
55
onNameUpdated: (newName: string) => any;
66
}
77

8-
export const NameEditComponent = (props: Props) => {
8+
export const NameEditComponent: React.FC<Props> = (props) => {
99
const [editingName, setEditingName] = React.useState(props.initialUserName);
1010

1111
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {

‎hooks/05_Refactor/src/hello.tsx

Copy file name to clipboardExpand all lines: hooks/05_Refactor/src/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/05_Refactor/src/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/05_Refactor/src/nameEdit.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ interface Props {
77
onEditingNameUpdated: (newEditingName: string) => any;
88
}
99

10-
export const NameEditComponent = (props: Props) => {
10+
export const NameEditComponent: React.FC<Props> = (props) => {
1111
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
1212
props.onEditingNameUpdated(e.target.value);
1313
};

‎hooks/06_Enable/src/hello.tsx

Copy file name to clipboardExpand all lines: hooks/06_Enable/src/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/06_Enable/src/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/06_Enable/src/nameEdit.tsx
+5-6Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ interface Props {
55
editingName: string;
66
onNameUpdated: () => any;
77
onEditingNameUpdated: (newEditingName: string) => any;
8-
disabled : boolean;
8+
disabled: boolean;
99
}
1010

11-
export const NameEditComponent = (props: Props) => {
11+
export const NameEditComponent: React.FC<Props> = (props) => {
1212
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
1313
props.onEditingNameUpdated(e.target.value);
1414
};
@@ -21,10 +21,9 @@ export const NameEditComponent = (props: Props) => {
2121
<>
2222
<label>Update name:</label>
2323
<input value={props.editingName} onChange={onChange} />
24-
<button
25-
onClick={onNameSubmit}
26-
disabled={props.disabled}
27-
>Change</button>
24+
<button onClick={onNameSubmit} disabled={props.disabled}>
25+
Change
26+
</button>
2827
</>
2928
);
3029
};

‎hooks/07_ColorPicker/src/components/colorBrowser.tsx

Copy file name to clipboardExpand all lines: hooks/07_ColorPicker/src/components/colorBrowser.tsx
+2-4Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,11 @@ interface Props {
55
color: Color;
66
}
77

8-
export const ColorBrowser = (props: Props) => {
8+
export const ColorBrowser: React.FC<Props> = (props) => {
99
const divStyle: React.CSSProperties = {
1010
width: "11rem",
1111
height: "7rem",
12-
backgroundColor: `rgb(${props.color.red},${props.color.green}, ${
13-
props.color.blue
14-
})`
12+
backgroundColor: `rgb(${props.color.red},${props.color.green}, ${props.color.blue})`,
1513
};
1614

1715
return <div style={divStyle} />;

‎hooks/07_ColorPicker/src/components/colorPicker.tsx

Copy file name to clipboardExpand all lines: hooks/07_ColorPicker/src/components/colorPicker.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ interface Props {
66
onColorUpdated: (color: Color) => void;
77
}
88

9-
export const ColorPicker = (props: Props) => (
9+
export const ColorPicker: React.FC<Props> = (props) => (
1010
<div>
1111
<input
1212
type="range"

‎hooks/07_ColorPicker/src/components/hello.tsx

Copy file name to clipboardExpand all lines: hooks/07_ColorPicker/src/components/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/07_ColorPicker/src/components/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/07_ColorPicker/src/components/nameEdit.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ interface Props {
88
disabled : boolean;
99
}
1010

11-
export const NameEditComponent = (props: Props) => {
11+
export const NameEditComponent: React.FC<Props> = (props) => {
1212
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
1313
props.onEditingNameUpdated(e.target.value);
1414
};

‎hooks/08_ColorPickerRefactor/src/components/colorBrowser.tsx

Copy file name to clipboardExpand all lines: hooks/08_ColorPickerRefactor/src/components/colorBrowser.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ interface Props {
55
color: Color;
66
}
77

8-
export const ColorBrowser = (props: Props) => {
8+
export const ColorBrowser: React.FC<Props> = (props) => {
99
const divStyle: React.CSSProperties = {
1010
width: "11rem",
1111
height: "7rem",

‎hooks/08_ColorPickerRefactor/src/components/colorPicker.tsx

Copy file name to clipboardExpand all lines: hooks/08_ColorPickerRefactor/src/components/colorPicker.tsx
+4-4Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@ const updateColor = (props: Props, colorId: keyof Color) => (value: any) => {
1010
// keyof Color ensures only 'red', 'blue' or 'green' can be passed in.
1111
props.onColorUpdated({
1212
...props.color, // this creates a clone of the current props.color object...
13-
[colorId]: value // ... which gets one of its properties (colorId) immediately replaced by a new value.
13+
[colorId]: value, // ... which gets one of its properties (colorId) immediately replaced by a new value.
1414
});
1515
};
1616

17-
export const ColorPicker = (props: Props) => (
17+
export const ColorPicker: React.FC<Props> = (props) => (
1818
<div>
1919
<ColorSliderComponent
2020
value={props.color.red}
@@ -40,15 +40,15 @@ interface PropsColorSlider {
4040
onValueUpdated: (newValue: number) => void;
4141
}
4242

43-
const ColorSliderComponent = (props: PropsColorSlider) => {
43+
const ColorSliderComponent: React.FC<PropsColorSlider> = (props: PropsColorSlider) => {
4444
return (
4545
<div>
4646
<input
4747
type="range"
4848
min="0"
4949
max="255"
5050
value={props.value}
51-
onChange={event => props.onValueUpdated(+event.target.value)}
51+
onChange={(event) => props.onValueUpdated(+event.target.value)}
5252
/>
5353
{props.value}
5454
</div>

‎hooks/08_ColorPickerRefactor/src/components/hello.tsx

Copy file name to clipboardExpand all lines: hooks/08_ColorPickerRefactor/src/components/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/08_ColorPickerRefactor/src/components/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/08_ColorPickerRefactor/src/components/nameEdit.tsx
+5-6Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ interface Props {
55
editingName: string;
66
onNameUpdated: () => any;
77
onEditingNameUpdated: (newEditingName: string) => any;
8-
disabled : boolean;
8+
disabled: boolean;
99
}
1010

11-
export const NameEditComponent = (props: Props) => {
11+
export const NameEditComponent: React.FC<Props> = (props) => {
1212
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
1313
props.onEditingNameUpdated(e.target.value);
1414
};
@@ -21,10 +21,9 @@ export const NameEditComponent = (props: Props) => {
2121
<>
2222
<label>Update name:</label>
2323
<input value={props.editingName} onChange={onChange} />
24-
<button
25-
onClick={onNameSubmit}
26-
disabled={props.disabled}
27-
>Change</button>
24+
<button onClick={onNameSubmit} disabled={props.disabled}>
25+
Change
26+
</button>
2827
</>
2928
);
3029
};

‎hooks/09_Sidebar/src/components/colorBrowser.tsx

Copy file name to clipboardExpand all lines: hooks/09_Sidebar/src/components/colorBrowser.tsx
+2-4Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,11 @@ interface Props {
55
color: Color;
66
}
77

8-
export const ColorBrowser = (props: Props) => {
8+
export const ColorBrowser: React.FC<Props> = (props) => {
99
const divStyle: React.CSSProperties = {
1010
width: "11rem",
1111
height: "7rem",
12-
backgroundColor: `rgb(${props.color.red},${props.color.green}, ${
13-
props.color.blue
14-
})`
12+
backgroundColor: `rgb(${props.color.red},${props.color.green}, ${props.color.blue})`,
1513
};
1614

1715
return <div style={divStyle} />;

‎hooks/09_Sidebar/src/components/colorPicker.tsx

Copy file name to clipboardExpand all lines: hooks/09_Sidebar/src/components/colorPicker.tsx
+5-5Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,15 @@ interface Props {
66
onColorUpdated: (color: Color) => void;
77
}
88

9-
const updateColor = (props: Props, colorId: keyof Color) => value => {
9+
const updateColor = (props: Props, colorId: keyof Color) => (value) => {
1010
// keyof Color ensures only 'red', 'blue' or 'green' can be passed in.
1111
props.onColorUpdated({
1212
...props.color, // this creates a clone of the current props.color object...
13-
[colorId]: value // ... which gets one of its properties (colorId) immediately replaced by a new value.
13+
[colorId]: value, // ... which gets one of its properties (colorId) immediately replaced by a new value.
1414
});
1515
};
1616

17-
export const ColorPicker = (props: Props) => (
17+
export const ColorPicker: React.FC<Props> = (props) => (
1818
<div>
1919
<ColorSliderComponent
2020
value={props.color.red}
@@ -40,15 +40,15 @@ interface PropsColorSlider {
4040
onValueUpdated: (newValue: number) => void;
4141
}
4242

43-
const ColorSliderComponent = (props: PropsColorSlider) => {
43+
const ColorSliderComponent: React.FC<PropsColorSlider> = (props) => {
4444
return (
4545
<div>
4646
<input
4747
type="range"
4848
min="0"
4949
max="255"
5050
value={props.value}
51-
onChange={event => props.onValueUpdated(+event.target.value)}
51+
onChange={(event) => props.onValueUpdated(+event.target.value)}
5252
/>
5353
{props.value}
5454
</div>

‎hooks/09_Sidebar/src/components/hello.tsx

Copy file name to clipboardExpand all lines: hooks/09_Sidebar/src/components/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

‎hooks/09_Sidebar/src/components/nameEdit.tsx

Copy file name to clipboardExpand all lines: hooks/09_Sidebar/src/components/nameEdit.tsx
+5-6Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ interface Props {
55
editingName: string;
66
onNameUpdated: () => any;
77
onEditingNameUpdated: (newEditingName: string) => any;
8-
disabled : boolean;
8+
disabled: boolean;
99
}
1010

11-
export const NameEditComponent = (props: Props) => {
11+
export const NameEditComponent: React.FC<Props> = (props) => {
1212
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
1313
props.onEditingNameUpdated(e.target.value);
1414
};
@@ -21,10 +21,9 @@ export const NameEditComponent = (props: Props) => {
2121
<>
2222
<label>Update name:</label>
2323
<input value={props.editingName} onChange={onChange} />
24-
<button
25-
onClick={onNameSubmit}
26-
disabled={props.disabled}
27-
>Change</button>
24+
<button onClick={onNameSubmit} disabled={props.disabled}>
25+
Change
26+
</button>
2827
</>
2928
);
3029
};

‎hooks/09_Sidebar/src/components/sidebar.tsx

Copy file name to clipboardExpand all lines: hooks/09_Sidebar/src/components/sidebar.tsx
+2-4Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,11 @@ interface Props {
77
}
88

99
const divStyle = (props: Props): React.CSSProperties => ({
10-
width: props.isVisible ? "23rem" : "0rem"
10+
width: props.isVisible ? "23rem" : "0rem",
1111
});
1212

13-
export const SidebarComponent: React.StatelessComponent<Props> = props => (
13+
export const SidebarComponent: React.StatelessComponent<Props> = (props) => (
1414
<div id="mySidenav" className={classNames.sidenav} style={divStyle(props)}>
1515
{props.children}
1616
</div>
1717
);
18-
19-

‎hooks/10_TableMock/src/components/colorBrowser.tsx

Copy file name to clipboardExpand all lines: hooks/10_TableMock/src/components/colorBrowser.tsx
+2-4Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,11 @@ interface Props {
55
color: Color;
66
}
77

8-
export const ColorBrowser = (props: Props) => {
8+
export const ColorBrowser: React.FC<Props> = (props) => {
99
const divStyle: React.CSSProperties = {
1010
width: "11rem",
1111
height: "7rem",
12-
backgroundColor: `rgb(${props.color.red},${props.color.green}, ${
13-
props.color.blue
14-
})`
12+
backgroundColor: `rgb(${props.color.red},${props.color.green}, ${props.color.blue})`,
1513
};
1614

1715
return <div style={divStyle} />;

‎hooks/10_TableMock/src/components/colorPicker.tsx

Copy file name to clipboardExpand all lines: hooks/10_TableMock/src/components/colorPicker.tsx
+5-5Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,15 @@ interface Props {
66
onColorUpdated: (color: Color) => void;
77
}
88

9-
const updateColor = (props: Props, colorId: keyof Color) => value => {
9+
const updateColor = (props: Props, colorId: keyof Color) => (value) => {
1010
// keyof Color ensures only 'red', 'blue' or 'green' can be passed in.
1111
props.onColorUpdated({
1212
...props.color, // this creates a clone of the current props.color object...
13-
[colorId]: value // ... which gets one of its properties (colorId) immediately replaced by a new value.
13+
[colorId]: value, // ... which gets one of its properties (colorId) immediately replaced by a new value.
1414
});
1515
};
1616

17-
export const ColorPicker = (props: Props) => (
17+
export const ColorPicker: React.FC<Props> = (props) => (
1818
<div>
1919
<ColorSliderComponent
2020
value={props.color.red}
@@ -40,15 +40,15 @@ interface PropsColorSlider {
4040
onValueUpdated: (newValue: number) => void;
4141
}
4242

43-
const ColorSliderComponent = (props: PropsColorSlider) => {
43+
const ColorSliderComponent: React.FC<PropsColorSlider> = (props) => {
4444
return (
4545
<div>
4646
<input
4747
type="range"
4848
min="0"
4949
max="255"
5050
value={props.value}
51-
onChange={event => props.onValueUpdated(+event.target.value)}
51+
onChange={(event) => props.onValueUpdated(+event.target.value)}
5252
/>
5353
{props.value}
5454
</div>

‎hooks/10_TableMock/src/components/hello.tsx

Copy file name to clipboardExpand all lines: hooks/10_TableMock/src/components/hello.tsx
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ interface Props {
44
userName: string;
55
}
66

7-
export const HelloComponent = (props: Props) => {
7+
export const HelloComponent: React.FC<Props> = (props) => {
88
return <h2>Hello user: {props.userName} !</h2>;
99
};

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.