Skip to content

Commit 7531bc4

Browse files
author
Krzysztof Borowy
authored
feat: [v2] example mobile app (#161)
1 parent 9d35ffe commit 7531bc4

File tree

83 files changed

+9676
-169
lines changed

Some content is hidden

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

83 files changed

+9676
-169
lines changed

README.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,14 @@ A storage system for React Native.
44

55
## Work in progress
66

7-
Async Storage v2 is still under development.
7+
Async Storage v2 is under development.
88

99
If you're looking for published and operational Async Storage version, please check out [`LEGACY`](https://github.com/react-native-community/async-storage/tree/LEGACY) branch.
1010

1111
If you'd like to see the progress of v2, [please visit Project page.](https://github.com/react-native-community/async-storage/projects/1)
1212

13+
## Running Examples
14+
15+
### React Native
16+
1317

examples/mobile/.babelrc

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"presets": ["module:metro-react-native-babel-preset"],
3+
"plugins": [
4+
["module-resolver",
5+
{
6+
"alias": {
7+
"@react-native-community/async-storage": "../../packages/core/build",
8+
"@react-native-community/async-storage-legacy": "../../packages/storage-legacy/build"
9+
},
10+
"cwd": "babelrc"
11+
}
12+
]
13+
]
14+
}
15+

examples/mobile/.buckconfig

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
2+
[android]
3+
target = Google Inc.:Google APIs:23
4+
5+
[maven_repositories]
6+
central = https://repo1.maven.org/maven2

examples/mobile/.flowconfig

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
[ignore]
2+
; We fork some components by platform
3+
.*/*[.]android.js
4+
5+
; Ignore "BUCK" generated dirs
6+
<PROJECT_ROOT>/\.buckd/
7+
8+
; Ignore unexpected extra "@providesModule"
9+
.*/node_modules/.*/node_modules/fbjs/.*
10+
11+
; Ignore duplicate module providers
12+
; For RN Apps installed via npm, "Libraries" folder is inside
13+
; "node_modules/react-native" but in the source repo it is in the root
14+
node_modules/react-native/Libraries/react-native/React.js
15+
16+
; Ignore polyfills
17+
node_modules/react-native/Libraries/polyfills/.*
18+
19+
; These should not be required directly
20+
; require from fbjs/lib instead: require('fbjs/lib/warning')
21+
node_modules/warning/.*
22+
23+
; Flow doesn't support platforms
24+
.*/Libraries/Utilities/HMRLoadingView.js
25+
26+
[untyped]
27+
.*/node_modules/@react-native-community/cli/.*/.*
28+
29+
[include]
30+
31+
[libs]
32+
node_modules/react-native/Libraries/react-native/react-native-interface.js
33+
node_modules/react-native/flow/
34+
35+
[options]
36+
emoji=true
37+
38+
esproposal.optional_chaining=enable
39+
esproposal.nullish_coalescing=enable
40+
41+
module.file_ext=.js
42+
module.file_ext=.json
43+
module.file_ext=.ios.js
44+
45+
module.system=haste
46+
module.system.haste.use_name_reducers=true
47+
# get basename
48+
module.system.haste.name_reducers='^.*/\([a-zA-Z0-9$_.-]+\.js\(\.flow\)?\)$' -> '\1'
49+
# strip .js or .js.flow suffix
50+
module.system.haste.name_reducers='^\(.*\)\.js\(\.flow\)?$' -> '\1'
51+
# strip .ios suffix
52+
module.system.haste.name_reducers='^\(.*\)\.ios$' -> '\1'
53+
module.system.haste.name_reducers='^\(.*\)\.android$' -> '\1'
54+
module.system.haste.name_reducers='^\(.*\)\.native$' -> '\1'
55+
module.system.haste.paths.blacklist=.*/__tests__/.*
56+
module.system.haste.paths.blacklist=.*/__mocks__/.*
57+
module.system.haste.paths.whitelist=<PROJECT_ROOT>/node_modules/react-native/Libraries/.*
58+
module.system.haste.paths.whitelist=<PROJECT_ROOT>/node_modules/react-native/RNTester/.*
59+
module.system.haste.paths.whitelist=<PROJECT_ROOT>/node_modules/react-native/IntegrationTests/.*
60+
module.system.haste.paths.blacklist=<PROJECT_ROOT>/node_modules/react-native/Libraries/react-native/react-native-implementation.js
61+
module.system.haste.paths.blacklist=<PROJECT_ROOT>/node_modules/react-native/Libraries/Animated/src/polyfills/.*
62+
63+
munge_underscores=true
64+
65+
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
66+
67+
suppress_type=$FlowIssue
68+
suppress_type=$FlowFixMe
69+
suppress_type=$FlowFixMeProps
70+
suppress_type=$FlowFixMeState
71+
72+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)
73+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)?:? #[0-9]+
74+
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
75+
76+
[lints]
77+
sketchy-null-number=warn
78+
sketchy-null-mixed=warn
79+
sketchy-number=warn
80+
untyped-type-import=warn
81+
nonstrict-import=warn
82+
deprecated-type=warn
83+
unsafe-getters-setters=warn
84+
inexact-spread=warn
85+
unnecessary-invariant=warn
86+
signature-verification-failure=warn
87+
deprecated-utility=error
88+
89+
[strict]
90+
deprecated-type
91+
nonstrict-import
92+
sketchy-null
93+
unclear-type
94+
unsafe-getters-setters
95+
untyped-import
96+
untyped-type-import
97+
98+
[version]
99+
^0.98.0

examples/mobile/.gitattributes

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
*.pbxproj -text

examples/mobile/.gitignore

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
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+
project.xcworkspace
24+
25+
# Android/IntelliJ
26+
#
27+
build/
28+
.idea
29+
.gradle
30+
local.properties
31+
*.iml
32+
33+
# node.js
34+
#
35+
node_modules/
36+
npm-debug.log
37+
yarn-error.log
38+
39+
# BUCK
40+
buck-out/
41+
\.buckd/
42+
*.keystore
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+
55+
# Bundle artifact
56+
*.jsbundle
57+
58+
# CocoaPods
59+
/ios/Pods/

examples/mobile/.watchmanconfig

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

examples/mobile/App.js

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
/**
2+
*
3+
* @format
4+
* @flow
5+
*/
6+
7+
import React from 'react';
8+
import {
9+
StyleSheet,
10+
View,
11+
SafeAreaView,
12+
Button,
13+
Text,
14+
TouchableOpacity,
15+
} from 'react-native';
16+
17+
import {Colors} from 'react-native/Libraries/NewAppScreen';
18+
19+
import LegacyExample from './src/legacy';
20+
21+
const Examples = {
22+
legacy: {
23+
title: 'Legacy',
24+
screen: LegacyExample,
25+
},
26+
};
27+
28+
class AsyncStorageExampleApp extends React.Component {
29+
state = {
30+
page: Examples.legacy,
31+
};
32+
33+
render() {
34+
const Example = this.state.page;
35+
36+
return (
37+
<SafeAreaView style={styles.sectionContainer}>
38+
<TouchableOpacity
39+
style={styles.resetButton}
40+
onPress={() => {
41+
this.setState({page: null});
42+
}}>
43+
<Text style={{color: '#fff'}}>Reset</Text>
44+
</TouchableOpacity>
45+
46+
<View style={styles.buttonContainer}>
47+
{Object.keys(Examples).map(pageKey => {
48+
const example = Examples[pageKey];
49+
return (
50+
<View style={styles.sectionButton} key={example.title}>
51+
<Button
52+
title={example.title}
53+
onPress={() => {
54+
this.setState({page: example});
55+
}}
56+
/>
57+
</View>
58+
);
59+
})}
60+
</View>
61+
{Example ? (
62+
<>
63+
<Text style={styles.sectionTitle}>{Example.title} Example</Text>
64+
<Example.screen />
65+
</>
66+
) : (
67+
<Text>Please select an example</Text>
68+
)}
69+
</SafeAreaView>
70+
);
71+
}
72+
}
73+
74+
const styles = StyleSheet.create({
75+
sectionContainer: {
76+
marginTop: 16,
77+
alignItems: 'center',
78+
flex: 1,
79+
paddingHorizontal: 16,
80+
},
81+
buttonContainer: {
82+
width: '100%',
83+
flexDirection: 'row',
84+
marginVertical: 12,
85+
justifyContent: 'flex-start',
86+
},
87+
sectionTitle: {
88+
fontSize: 24,
89+
marginBottom: 8,
90+
fontWeight: '600',
91+
color: Colors.black,
92+
},
93+
sectionButton: {
94+
marginRight: 15,
95+
},
96+
resetButton: {
97+
backgroundColor: '#ffb340',
98+
paddingHorizontal: 8,
99+
paddingVertical: 4,
100+
elevation: 3,
101+
alignSelf: 'flex-end',
102+
},
103+
});
104+
105+
export default AsyncStorageExampleApp;

examples/mobile/README.md

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# Async Storage mobile examples
2+
3+
## Running the example
4+
5+
1. Get dependencies
6+
7+
```bash
8+
$ yarn install
9+
```
10+
11+
2. Install the app
12+
13+
```bash
14+
# Android
15+
$ yarn start:android
16+
17+
# iOS
18+
$ yarn start:ios
19+
```
20+
21+
3. Run packager
22+
23+
```bash
24+
$ yarn start
25+
```
26+
27+
## Feedback
28+
29+
Let me know about any issue found or feedback you have at [Async-Storage issue page](https://github.com/react-native-community/async-storage/issues).
30+
Please mark it as `examples` label.
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
/**
2+
* @format
3+
*/
4+
5+
import 'react-native';
6+
import React from 'react';
7+
import App from '../App';
8+
9+
// Note: test renderer must be required after react-native.
10+
import renderer from 'react-test-renderer';
11+
12+
it('renders correctly', () => {
13+
renderer.create(<App />);
14+
});

0 commit comments

Comments
 (0)