Skip to content

Commit d7e98e4

Browse files
markeriksonmarkerikson
authored
Merge pull request #115 from aryaemami59/add-rn-ts-template
Add React Native template featuring RTK 2.0
2 parents ffdfdf7 + 551f793 commit d7e98e4

File tree

78 files changed

+3385
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

78 files changed

+3385
-0
lines changed

‎packages/react-native-template-redux-typescript/.gitignore

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
# OSX
2+
#
3+
.DS_Store
4+
5+
# Xcode
6+
#
7+
build/
8+
*.pbxuser
9+
!default.pbxuser
10+
*.mode1v3
11+
!default.mode1v3
12+
*.mode2v3
13+
!default.mode2v3
14+
*.perspectivev3
15+
!default.perspectivev3
16+
xcuserdata
17+
*.xccheckout
18+
*.moved-aside
19+
DerivedData
20+
*.hmap
21+
*.ipa
22+
*.xcuserstate
23+
ios/.xcode.env.local
24+
25+
# Android/IntelliJ
26+
#
27+
build/
28+
.idea
29+
.gradle
30+
local.properties
31+
*.iml
32+
*.hprof
33+
.cxx/
34+
*.keystore
35+
!debug.keystore
36+
37+
# node.js
38+
#
39+
node_modules/
40+
npm-debug.log
41+
yarn-error.log
42+
.yarn/
43+
template/package-lock.json
44+
template/yarn.lock
45+
46+
# fastlane
47+
#
48+
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
49+
# screenshots whenever they are needed.
50+
# For more information about the recommended setup visit:
51+
# https://docs.fastlane.tools/best-practices/source-control/
52+
53+
**/fastlane/report.xml
54+
**/fastlane/Preview.html
55+
**/fastlane/screenshots
56+
**/fastlane/test_output
57+
58+
# Bundle artifact
59+
*.jsbundle
60+
61+
# Ruby / CocoaPods
62+
/ios/Pods/
63+
/vendor/bundle/
64+
65+
# Temporary files created by Metro to check the health of the file watcher
66+
.metro-health-check*
67+
68+
# testing
69+
/coverage
70+
71+
#IDE
72+
.vscode

‎packages/react-native-template-redux-typescript/package.json

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"name": "react-native-template-redux-typescript",
3+
"version": "0.0.1",
4+
"private": true,
5+
"description": "The official Redux+TS template for React Native",
6+
"files": [
7+
"template",
8+
"template.config.js"
9+
],
10+
"scripts": {
11+
"format": "prettier --write \"./**/*.{js,ts,jsx,tsx,mjs,cts,md}\"",
12+
"lint": "eslint './template/src/**/*.{ts,tsx,js,jsx}'",
13+
"test": "jest",
14+
"type-check": "tsc"
15+
},
16+
"keywords": [
17+
"react-native",
18+
"typescript",
19+
"jest",
20+
"template",
21+
"boilerplate"
22+
]
23+
}

‎packages/react-native-template-redux-typescript/template.config.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
/**
2+
* Configuration settings for a template.
3+
*
4+
* @typedef {Object} TemplateConfig
5+
* @property {string} placeholderName A unique identifier or name for the placeholder within the template.
6+
* @property {string} templateDir The file path to the directory where the template is located.
7+
* @property {string} [postInitScript] The path to a script that should be executed after the template initialization is complete (optional).
8+
* @property {string} [titlePlaceholder] A placeholder for the title within the template (optional).
9+
*/
10+
11+
/**
12+
* @type TemplateConfig
13+
*/
14+
module.exports = {
15+
placeholderName: "RNTemplate",
16+
templateDir: "./template",
17+
};

‎packages/react-native-template-redux-typescript/template/.bundle/config

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
BUNDLE_PATH: "vendor/bundle"
2+
BUNDLE_FORCE_RUBY_PLATFORM: 1

‎packages/react-native-template-redux-typescript/template/.eslintrc.json

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"extends": [
3+
"eslint:recommended",
4+
"@react-native",
5+
"plugin:react/jsx-runtime",
6+
"prettier"
7+
],
8+
"parser": "@typescript-eslint/parser",
9+
"parserOptions": { "project": true, "tsconfigRootDir": "./" },
10+
"plugins": ["@typescript-eslint"],
11+
"root": true,
12+
"rules": {
13+
"@typescript-eslint/consistent-type-imports": [
14+
2,
15+
{ "fixStyle": "separate-type-imports" }
16+
],
17+
"@typescript-eslint/no-restricted-imports": [
18+
2,
19+
{
20+
"paths": [
21+
{
22+
"name": "react-redux",
23+
"importNames": ["useSelector", "useStore", "useDispatch"],
24+
"message": "Please use pre-typed versions from `src/app/hooks.ts` instead."
25+
}
26+
]
27+
}
28+
]
29+
},
30+
"overrides": [
31+
{ "files": ["*.{c,m,}{t,j}s", "*.{t,j}sx"] },
32+
{ "files": ["*{test,spec}.{t,j}s?(x)"], "env": { "jest": true } }
33+
]
34+
}

‎packages/react-native-template-redux-typescript/template/.gitignore

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
# OSX
2+
#
3+
.DS_Store
4+
5+
# Xcode
6+
#
7+
build/
8+
*.pbxuser
9+
!default.pbxuser
10+
*.mode1v3
11+
!default.mode1v3
12+
*.mode2v3
13+
!default.mode2v3
14+
*.perspectivev3
15+
!default.perspectivev3
16+
xcuserdata
17+
*.xccheckout
18+
*.moved-aside
19+
DerivedData
20+
*.hmap
21+
*.ipa
22+
*.xcuserstate
23+
ios/.xcode.env.local
24+
25+
# Android/IntelliJ
26+
#
27+
build/
28+
.idea
29+
.gradle
30+
local.properties
31+
*.iml
32+
*.hprof
33+
.cxx/
34+
*.keystore
35+
!debug.keystore
36+
37+
# node.js
38+
#
39+
node_modules/
40+
npm-debug.log
41+
yarn-error.log
42+
.yarn/
43+
44+
# fastlane
45+
#
46+
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
47+
# screenshots whenever they are needed.
48+
# For more information about the recommended setup visit:
49+
# https://docs.fastlane.tools/best-practices/source-control/
50+
51+
**/fastlane/report.xml
52+
**/fastlane/Preview.html
53+
**/fastlane/screenshots
54+
**/fastlane/test_output
55+
56+
# Bundle artifact
57+
*.jsbundle
58+
59+
# Ruby / CocoaPods
60+
/ios/Pods/
61+
/vendor/bundle/
62+
63+
# Temporary files created by Metro to check the health of the file watcher
64+
.metro-health-check*
65+
66+
# testing
67+
/coverage
68+
69+
#IDE
70+
.vscode

‎packages/react-native-template-redux-typescript/template/.prettierrc.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"semi": false,
3+
"arrowParens": "avoid"
4+
}

‎packages/react-native-template-redux-typescript/template/.watchmanconfig

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

‎packages/react-native-template-redux-typescript/template/App.test.tsx

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
import { screen, waitFor } from "@testing-library/react-native"
2+
import { App } from "./App"
3+
import { renderWithProviders } from "./src/utils/test-utils"
4+
5+
test("App should have correct initial render", () => {
6+
renderWithProviders(<App />)
7+
8+
// The app should be rendered correctly
9+
expect(screen.getByText(/learn more redux/i)).toBeOnTheScreen()
10+
11+
// Initial state: count should be 0, incrementValue should be 2
12+
expect(screen.getByLabelText("Count")).toHaveTextContent("0")
13+
expect(screen.getByLabelText("Set increment amount")).toHaveDisplayValue("2")
14+
})
15+
16+
test("Increment value and Decrement value should work as expected", async () => {
17+
const { user } = renderWithProviders(<App />)
18+
19+
// Click on "+" => Count should be 1
20+
await user.press(screen.getByLabelText("Increment value"))
21+
expect(screen.getByLabelText("Count")).toHaveTextContent("1")
22+
23+
// Click on "-" => Count should be 0
24+
await user.press(screen.getByLabelText("Decrement value"))
25+
expect(screen.getByLabelText("Count")).toHaveTextContent("0")
26+
})
27+
28+
test("Add Amount should work as expected", async () => {
29+
const { user } = renderWithProviders(<App />)
30+
31+
// "Add Amount" button is clicked => Count should be 2
32+
await user.press(screen.getByText("Add Amount"))
33+
expect(screen.getByLabelText("Count")).toHaveTextContent("2")
34+
35+
const incrementValueInput = screen.getByLabelText("Set increment amount")
36+
// incrementValue is 2, click on "Add Amount" => Count should be 4
37+
await user.clear(incrementValueInput)
38+
await user.type(incrementValueInput, "2")
39+
await user.press(screen.getByText("Add Amount"))
40+
expect(screen.getByLabelText("Count")).toHaveTextContent("4")
41+
42+
// [Negative number] incrementValue is -1, click on "Add Amount" => Count should be 3
43+
await user.clear(incrementValueInput)
44+
await user.type(incrementValueInput, "-1")
45+
await user.press(screen.getByText("Add Amount"))
46+
expect(screen.getByLabelText("Count")).toHaveTextContent("3")
47+
})
48+
49+
it("Add Async should work as expected", async () => {
50+
const { user } = renderWithProviders(<App />)
51+
52+
// "Add Async" button is clicked => Count should be 2
53+
await user.press(screen.getByText("Add Async"))
54+
55+
await waitFor(() => {
56+
expect(screen.getByLabelText("Count")).toHaveTextContent("2")
57+
})
58+
59+
const incrementValueInput = screen.getByLabelText("Set increment amount")
60+
// incrementValue is 2, click on "Add Async" => Count should be 4
61+
await user.clear(incrementValueInput)
62+
await user.type(incrementValueInput, "2")
63+
64+
await user.press(screen.getByText("Add Async"))
65+
await waitFor(() => {
66+
expect(screen.getByLabelText("Count")).toHaveTextContent("4")
67+
})
68+
69+
// [Negative number] incrementValue is -1, click on "Add Async" => Count should be 3
70+
await user.clear(incrementValueInput)
71+
await user.type(incrementValueInput, "-1")
72+
await user.press(screen.getByText("Add Async"))
73+
await waitFor(() => {
74+
expect(screen.getByLabelText("Count")).toHaveTextContent("3")
75+
})
76+
})
77+
78+
test("Add If Odd should work as expected", async () => {
79+
const { user } = renderWithProviders(<App />)
80+
81+
// "Add If Odd" button is clicked => Count should stay 0
82+
await user.press(screen.getByText("Add If Odd"))
83+
expect(screen.getByLabelText("Count")).toHaveTextContent("0")
84+
85+
// Click on "+" => Count should be updated to 1
86+
await user.press(screen.getByLabelText("Increment value"))
87+
expect(screen.getByLabelText("Count")).toHaveTextContent("1")
88+
89+
// "Add If Odd" button is clicked => Count should be updated to 3
90+
await user.press(screen.getByText("Add If Odd"))
91+
expect(screen.getByLabelText("Count")).toHaveTextContent("3")
92+
93+
const incrementValueInput = screen.getByLabelText("Set increment amount")
94+
// incrementValue is 1, click on "Add If Odd" => Count should be updated to 4
95+
await user.clear(incrementValueInput)
96+
await user.type(incrementValueInput, "1")
97+
await user.press(screen.getByText("Add If Odd"))
98+
expect(screen.getByLabelText("Count")).toHaveTextContent("4")
99+
100+
// click on "Add If Odd" => Count should stay 4
101+
await user.clear(incrementValueInput)
102+
await user.type(incrementValueInput, "-1")
103+
await user.press(screen.getByText("Add If Odd"))
104+
expect(screen.getByLabelText("Count")).toHaveTextContent("4")
105+
})

0 commit comments

Comments
 (0)