Skip to content

Commit 534b479

Browse files
ethanneffethanneff
committed
refactor: restructure example code
1 parent 1c6ae93 commit 534b479

File tree

14 files changed

+142
-92
lines changed

14 files changed

+142
-92
lines changed

‎src/commons/Config.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
interface IConfig {
1+
interface Config {
22
app: {
33
name: string;
44
};
@@ -12,7 +12,7 @@ interface IConfig {
1212
};
1313
}
1414

15-
const Config: IConfig = {
15+
export const Config: Config = {
1616
app: {
1717
name: "example"
1818
},
@@ -25,5 +25,3 @@ const Config: IConfig = {
2525
root: "root"
2626
}
2727
};
28-
29-
export default Config;

‎src/commons/index.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from "./Config";

‎src/components/Instructions/__tests__/__snapshots__/index.tsx.snap

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`Instructions renders correctly with defaults 1`] = `
4+
Array [
5+
<Text
6+
style={
7+
Object {
8+
"fontSize": 20,
9+
"margin": 10,
10+
"textAlign": "center",
11+
}
12+
}
13+
>
14+
Welcome to React Native!
15+
</Text>,
16+
<Text
17+
style={
18+
Object {
19+
"color": "#333333",
20+
"marginBottom": 5,
21+
"textAlign": "center",
22+
}
23+
}
24+
>
25+
To get started, edit ./src/containers/App/index.tsx
26+
</Text>,
27+
<Text
28+
style={
29+
Object {
30+
"color": "#333333",
31+
"marginBottom": 5,
32+
"textAlign": "center",
33+
}
34+
}
35+
>
36+
123
37+
</Text>,
38+
]
39+
`;

‎src/components/Instructions/__tests__/index.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as React from "react";
2+
import { create } from "react-test-renderer";
3+
import { Instructions } from "..";
4+
5+
describe("Instructions", () => {
6+
it("renders correctly with defaults", () => {
7+
const button = create(<Instructions instructions="123" />).toJSON();
8+
expect(button).toMatchSnapshot();
9+
});
10+
});

‎src/components/Instructions/index.tsx

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import * as React from "react";
2+
import { StyleSheet, Text } from "react-native";
3+
4+
const styles = StyleSheet.create({
5+
welcome: {
6+
fontSize: 20,
7+
textAlign: "center",
8+
margin: 10
9+
},
10+
instructions: {
11+
color: "#333333",
12+
textAlign: "center",
13+
marginBottom: 5
14+
}
15+
});
16+
17+
interface Props {
18+
instructions: string;
19+
}
20+
21+
export const Instructions = ({ instructions }: Props) => (
22+
<>
23+
<Text style={styles.welcome}>Welcome to React Native!</Text>
24+
<Text style={styles.instructions}>
25+
To get started, edit ./src/containers/App/index.tsx
26+
</Text>
27+
<Text style={styles.instructions}>{instructions}</Text>
28+
</>
29+
);

‎src/components/Hello/__tests__/__snapshots__/index.tsx.snap renamed to ‎src/components/Welcome/__tests__/__snapshots__/index.tsx.snap

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
exports[`Hello renders correctly with defaults 1`] = `
3+
exports[`Welcome renders correctly with defaults 1`] = `
44
<View
55
style={
66
Object {
@@ -37,13 +37,9 @@ exports[`Hello renders correctly with defaults 1`] = `
3737
}
3838
>
3939
<View
40-
accessibilityComponentType="button"
4140
accessibilityLabel="decrement"
42-
accessibilityTraits={
43-
Array [
44-
"button",
45-
]
46-
}
41+
accessibilityRole="button"
42+
accessibilityStates={Array []}
4743
accessible={true}
4844
isTVSelectable={true}
4945
onResponderGrant={[Function]}
@@ -91,13 +87,9 @@ exports[`Hello renders correctly with defaults 1`] = `
9187
}
9288
>
9389
<View
94-
accessibilityComponentType="button"
9590
accessibilityLabel="increment"
96-
accessibilityTraits={
97-
Array [
98-
"button",
99-
]
100-
}
91+
accessibilityRole="button"
92+
accessibilityStates={Array []}
10193
accessible={true}
10294
isTVSelectable={true}
10395
onResponderGrant={[Function]}

‎src/components/Hello/__tests__/index.tsx renamed to ‎src/components/Welcome/__tests__/index.tsx

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,41 @@
11
import * as React from "react";
22
import { create } from "react-test-renderer";
3-
import Hello, { IState } from "../";
3+
import { State, Welcome } from "..";
44

5-
describe("Hello", () => {
5+
describe("Welcome", () => {
66
it("renders correctly with defaults", () => {
7-
const button = create(<Hello name="World" enthusiasmLevel={1} />).toJSON();
7+
const button = create(
8+
<Welcome name="World" enthusiasmLevel={1} />
9+
).toJSON();
810
expect(button).toMatchSnapshot();
911
});
1012

1113
it("increments", () => {
1214
const button: any = create(
13-
<Hello name="World" enthusiasmLevel={1} />
15+
<Welcome name="World" enthusiasmLevel={1} />
1416
).getInstance();
1517
button.onIncrement();
1618
button.onIncrement();
17-
const state: IState = button.state;
19+
const state: State = button.state;
1820
expect(state.enthusiasmLevel).toBe(3);
1921
});
2022

2123
it("decrements", () => {
2224
const button: any = create(
23-
<Hello name="World" enthusiasmLevel={4} />
25+
<Welcome name="World" enthusiasmLevel={4} />
2426
).getInstance();
2527
button.onDecrement();
2628
button.onDecrement();
27-
const state: IState = button.state;
29+
const state: State = button.state;
2830
expect(state.enthusiasmLevel).toBe(2);
2931
});
3032

3133
it("decrements at zero", () => {
3234
const button: any = create(
33-
<Hello name="World" enthusiasmLevel={0} />
35+
<Welcome name="World" enthusiasmLevel={0} />
3436
).getInstance();
3537
button.onDecrement();
36-
const state: IState = button.state;
38+
const state: State = button.state;
3739
expect(state.enthusiasmLevel).toBe(0);
3840
});
3941
});

‎src/components/Hello/index.tsx renamed to ‎src/components/Welcome/index.tsx

Lines changed: 16 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import * as React from "react";
22
import { Button, StyleSheet, Text, View } from "react-native";
33

4-
// styles
54
const styles = StyleSheet.create({
65
root: {
76
alignItems: "center",
@@ -20,35 +19,23 @@ const styles = StyleSheet.create({
2019
}
2120
});
2221

23-
export interface IProps {
22+
interface Props {
2423
name: string;
2524
enthusiasmLevel?: number;
2625
}
2726

28-
export interface IState {
27+
export interface State {
2928
enthusiasmLevel: number;
3029
}
3130

32-
class Hello extends React.Component<IProps, IState> {
33-
constructor(props: IProps) {
31+
export class Welcome extends React.Component<Props, State> {
32+
constructor(props: Props) {
3433
super(props);
3534
this.state = {
3635
enthusiasmLevel: props.enthusiasmLevel || 1
3736
};
3837
}
3938

40-
public onIncrement = () =>
41-
this.setState({ enthusiasmLevel: this.state.enthusiasmLevel + 1 });
42-
43-
public onDecrement = () =>
44-
this.setState({
45-
enthusiasmLevel:
46-
this.state.enthusiasmLevel - 1 > 0 ? this.state.enthusiasmLevel - 1 : 0
47-
});
48-
49-
public getExclamationMarks = (numChars: number) =>
50-
Array(numChars + 1).join("!");
51-
5239
public render() {
5340
return (
5441
<View style={styles.root}>
@@ -78,6 +65,16 @@ class Hello extends React.Component<IProps, IState> {
7865
</View>
7966
);
8067
}
81-
}
8268

83-
export default Hello;
69+
private onIncrement = () =>
70+
this.setState({ enthusiasmLevel: this.state.enthusiasmLevel + 1 });
71+
72+
private onDecrement = () =>
73+
this.setState({
74+
enthusiasmLevel:
75+
this.state.enthusiasmLevel - 1 > 0 ? this.state.enthusiasmLevel - 1 : 0
76+
});
77+
78+
private getExclamationMarks = (numChars: number) =>
79+
Array(numChars + 1).join("!");
80+
}

‎src/components/index.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
export * from "./Welcome";
2+
export * from "./Instructions";

‎src/containers/App/__tests__/__snapshots__/index.tsx.snap

Lines changed: 4 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -81,13 +81,9 @@ Cmd+D or shake for dev menu
8181
}
8282
>
8383
<View
84-
accessibilityComponentType="button"
8584
accessibilityLabel="decrement"
86-
accessibilityTraits={
87-
Array [
88-
"button",
89-
]
90-
}
85+
accessibilityRole="button"
86+
accessibilityStates={Array []}
9187
accessible={true}
9288
isTVSelectable={true}
9389
onResponderGrant={[Function]}
@@ -135,13 +131,9 @@ Cmd+D or shake for dev menu
135131
}
136132
>
137133
<View
138-
accessibilityComponentType="button"
139134
accessibilityLabel="increment"
140-
accessibilityTraits={
141-
Array [
142-
"button",
143-
]
144-
}
135+
accessibilityRole="button"
136+
accessibilityStates={Array []}
145137
accessible={true}
146138
isTVSelectable={true}
147139
onResponderGrant={[Function]}

0 commit comments

Comments
 (0)