Skip to content

Commit

Permalink
react-navigation, fragmentContainer, albumsView
Browse files Browse the repository at this point in the history
  • Loading branch information
luiscript committed Sep 21, 2017
1 parent 7ee33ce commit a951ea6
Show file tree
Hide file tree
Showing 18 changed files with 706 additions and 271 deletions.
4 changes: 3 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ The goal with this project it's to figure it out what are the best practices for

Work in progress, use it at your own risk.

---
![alt tag](./demo/appDemo.gif)
---

## How to run it
Expand All @@ -32,7 +34,7 @@ This example works out of the box, but if you change the GraphQL API you will ne

```bash
$ npm i get-graphql-schema -g
$ get-graphql-schema http://localhost:3001 > ./schema.graphql
$ get-graphql-schema http://localhost:3001/graphql > ./schema.graphql
$ npm i relay-compiler -g
$ relay-compiler --src ./src --schema ./schema.graphql
```
Expand Down
52 changes: 4 additions & 48 deletions app/index.android.js
Original file line number Diff line number Diff line change
@@ -1,53 +1,9 @@
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/

import React, { Component } from 'react';

import {
AppRegistry,
StyleSheet,
Text,
View
AppRegistry
} from 'react-native';

export default class app extends Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
To get started, edit index.android.js
</Text>
<Text style={styles.instructions}>
Double tap R on your keyboard to reload,{'\n'}
Shake or press menu button for dev menu
</Text>
</View>
);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
import Main from './src/containers/main';

AppRegistry.registerComponent('app', () => app);
AppRegistry.registerComponent('app', () => Main);
44 changes: 2 additions & 42 deletions app/index.ios.js
Original file line number Diff line number Diff line change
@@ -1,49 +1,9 @@
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/

import React, { Component } from 'react';

import {
AppRegistry,
StyleSheet,
Text,
View,
FlatList
AppRegistry
} from 'react-native';

import Main from './src/containers/main';

export default class app extends Component {
render() {
return (
<View style={styles.container}>
<Main />
</View>
);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
marginTop: 20
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});

AppRegistry.registerComponent('app', () => app);
AppRegistry.registerComponent('app', () => Main);
42 changes: 34 additions & 8 deletions app/ios/app.xcodeproj/project.pbxproj
Original file line number Diff line number Diff line change
Expand Up @@ -25,14 +25,14 @@
2D02E4BC1E0B4A80006451C7 /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };
2D02E4BD1E0B4A84006451C7 /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
2D02E4BF1E0B4AB3006451C7 /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
2D02E4C21E0B4AEC006451C7 /* libRCTAnimation-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157351DD0AC6500FF2AA8 /* libRCTAnimation-tvOS.a */; };
2D02E4C21E0B4AEC006451C7 /* libRCTAnimation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157351DD0AC6500FF2AA8 /* libRCTAnimation.a */; };
2D02E4C31E0B4AEC006451C7 /* libRCTImage-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3E841DF850E9000B6D8A /* libRCTImage-tvOS.a */; };
2D02E4C41E0B4AEC006451C7 /* libRCTLinking-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3E881DF850E9000B6D8A /* libRCTLinking-tvOS.a */; };
2D02E4C51E0B4AEC006451C7 /* libRCTNetwork-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3E8C1DF850E9000B6D8A /* libRCTNetwork-tvOS.a */; };
2D02E4C61E0B4AEC006451C7 /* libRCTSettings-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3E901DF850E9000B6D8A /* libRCTSettings-tvOS.a */; };
2D02E4C71E0B4AEC006451C7 /* libRCTText-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3E941DF850E9000B6D8A /* libRCTText-tvOS.a */; };
2D02E4C81E0B4AEC006451C7 /* libRCTWebSocket-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3E991DF850E9000B6D8A /* libRCTWebSocket-tvOS.a */; };
2D02E4C91E0B4AEC006451C7 /* libReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3EA31DF850E9000B6D8A /* libReact.a */; };
2D02E4C91E0B4AEC006451C7 /* libReact-tvOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 3DAD3EA31DF850E9000B6D8A /* libReact-tvOS.a */; };
2DCD954D1E0B4F2C00145EB5 /* appTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* appTests.m */; };
5E9157361DD0AC6A00FF2AA8 /* libRCTAnimation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */; };
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
Expand Down Expand Up @@ -236,6 +236,13 @@
remoteGlobalIDString = 358F4ED71D1E81A9004DF814;
remoteInfo = RCTBlob;
};
CB1E9D7A1F72E9C500482052 /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = ADBDB91F1DFEBF0600ED6528 /* RCTBlob.xcodeproj */;
proxyType = 2;
remoteGlobalIDString = ADD01A681E09402E00F6D226;
remoteInfo = "RCTBlob-tvOS";
};
/* End PBXContainerItemProxy section */

/* Begin PBXFileReference section */
Expand Down Expand Up @@ -299,8 +306,8 @@
isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647;
files = (
2D02E4C91E0B4AEC006451C7 /* libReact.a in Frameworks */,
2D02E4C21E0B4AEC006451C7 /* libRCTAnimation-tvOS.a in Frameworks */,
2D02E4C91E0B4AEC006451C7 /* libReact-tvOS.a in Frameworks */,
2D02E4C21E0B4AEC006451C7 /* libRCTAnimation.a in Frameworks */,
2D02E4C31E0B4AEC006451C7 /* libRCTImage-tvOS.a in Frameworks */,
2D02E4C41E0B4AEC006451C7 /* libRCTLinking-tvOS.a in Frameworks */,
2D02E4C51E0B4AEC006451C7 /* libRCTNetwork-tvOS.a in Frameworks */,
Expand Down Expand Up @@ -415,7 +422,6 @@
isa = PBXGroup;
children = (
146834041AC3E56700842450 /* libReact.a */,
3DAD3EA31DF850E9000B6D8A /* libReact.a */,
3DAD3EA51DF850E9000B6D8A /* libyoga.a */,
3DAD3EA71DF850E9000B6D8A /* libyoga.a */,
3DAD3EA91DF850E9000B6D8A /* libcxxreact.a */,
Expand All @@ -431,7 +437,7 @@
isa = PBXGroup;
children = (
5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */,
5E9157351DD0AC6500FF2AA8 /* libRCTAnimation-tvOS.a */,
5E9157351DD0AC6500FF2AA8 /* libRCTAnimation.a */,
);
name = Products;
sourceTree = "<group>";
Expand Down Expand Up @@ -501,6 +507,7 @@
isa = PBXGroup;
children = (
ADBDB9271DFEBF0700ED6528 /* libRCTBlob.a */,
CB1E9D7B1F72E9C500482052 /* libRCTBlob-tvOS.a */,
);
name = Products;
sourceTree = "<group>";
Expand Down Expand Up @@ -593,6 +600,10 @@
CreatedOnToolsVersion = 6.2;
TestTargetID = 13B07F861A680F5B00A75B9A;
};
13B07F861A680F5B00A75B9A = {
DevelopmentTeam = V7QMH2C73U;
ProvisioningStyle = Manual;
};
2D02E47A1E0B4A5D006451C7 = {
CreatedOnToolsVersion = 8.2.1;
ProvisioningStyle = Automatic;
Expand Down Expand Up @@ -830,10 +841,10 @@
remoteRef = 5E9157321DD0AC6500FF2AA8 /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
5E9157351DD0AC6500FF2AA8 /* libRCTAnimation-tvOS.a */ = {
5E9157351DD0AC6500FF2AA8 /* libRCTAnimation.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
path = "libRCTAnimation-tvOS.a";
path = libRCTAnimation.a;
remoteRef = 5E9157341DD0AC6500FF2AA8 /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
Expand All @@ -858,6 +869,13 @@
remoteRef = ADBDB9261DFEBF0700ED6528 /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
CB1E9D7B1F72E9C500482052 /* libRCTBlob-tvOS.a */ = {
isa = PBXReferenceProxy;
fileType = archive.ar;
path = "libRCTBlob-tvOS.a";
remoteRef = CB1E9D7A1F72E9C500482052 /* PBXContainerItemProxy */;
sourceTree = BUILT_PRODUCTS_DIR;
};
/* End PBXReferenceProxy section */

/* Begin PBXResourcesBuildPhase section */
Expand Down Expand Up @@ -1031,14 +1049,18 @@
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CURRENT_PROJECT_VERSION = 1;
DEAD_CODE_STRIPPING = NO;
DEVELOPMENT_TEAM = V7QMH2C73U;
INFOPLIST_FILE = app/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
OTHER_LDFLAGS = (
"$(inherited)",
"-ObjC",
"-lc++",
);
PRODUCT_BUNDLE_IDENTIFIER = com.luiscript.example.app;
PRODUCT_NAME = app;
PROVISIONING_PROFILE = "90025fa6-164f-4dc8-a882-48160e1e2532";
PROVISIONING_PROFILE_SPECIFIER = "iOS Dev - Agosto 2017";
VERSIONING_SYSTEM = "apple-generic";
};
name = Debug;
Expand All @@ -1048,14 +1070,18 @@
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
CURRENT_PROJECT_VERSION = 1;
DEVELOPMENT_TEAM = V7QMH2C73U;
INFOPLIST_FILE = app/Info.plist;
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
OTHER_LDFLAGS = (
"$(inherited)",
"-ObjC",
"-lc++",
);
PRODUCT_BUNDLE_IDENTIFIER = com.luiscript.example.app;
PRODUCT_NAME = app;
PROVISIONING_PROFILE = "90025fa6-164f-4dc8-a882-48160e1e2532";
PROVISIONING_PROFILE_SPECIFIER = "iOS Dev - Agosto 2017";
VERSIONING_SYSTEM = "apple-generic";
};
name = Release;
Expand Down
29 changes: 14 additions & 15 deletions app/ios/app/Info.plist
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<key>CFBundleExecutable</key>
<string>$(EXECUTABLE_NAME)</string>
<key>CFBundleIdentifier</key>
<string>org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)</string>
<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
<key>CFBundleInfoDictionaryVersion</key>
<string>6.0</string>
<key>CFBundleName</key>
Expand All @@ -24,6 +24,19 @@
<string>1</string>
<key>LSRequiresIPhoneOS</key>
<true/>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSExceptionDomains</key>
<dict>
<key>localhost</key>
<dict>
<key>NSExceptionAllowsInsecureHTTPLoads</key>
<true/>
</dict>
</dict>
</dict>
<key>NSLocationWhenInUseUsageDescription</key>
<string></string>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
<key>UIRequiredDeviceCapabilities</key>
Expand All @@ -38,19 +51,5 @@
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>NSLocationWhenInUseUsageDescription</key>
<string></string>
<key>NSAppTransportSecurity</key>
<!--See http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ -->
<dict>
<key>NSExceptionDomains</key>
<dict>
<key>localhost</key>
<dict>
<key>NSExceptionAllowsInsecureHTTPLoads</key>
<true/>
</dict>
</dict>
</dict>
</dict>
</plist>
1 change: 1 addition & 0 deletions app/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
"dependencies": {
"react": "16.0.0-alpha.12",
"react-native": "^0.48.3",
"react-navigation": "^1.0.0-beta.11",
"react-relay": "^1.3.0"
},
"devDependencies": {
Expand Down
24 changes: 21 additions & 3 deletions app/schema.graphql
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
schema {
query: ArtistList
query: artistsList
}

# Returns an album
Expand Down Expand Up @@ -32,9 +32,9 @@ type AlbumTypeEdge {
}

# A collection of Artists.
type ArtistList {
type artistsList {
# Returns a collection of artists
artistsList: [ArtistType]
artistsList(after: String, first: Int, before: String, last: Int): ArtistTypeConnection
}

# Returns artist info.
Expand All @@ -45,6 +45,24 @@ type ArtistType implements Node {
albums(after: String, first: Int, before: String, last: Int): AlbumTypeConnection
}

# A connection to a list of items.
type ArtistTypeConnection {
# Information to aid in pagination.
pageInfo: PageInfo!

# A list of edges.
edges: [ArtistTypeEdge]
}

# An edge in a connection.
type ArtistTypeEdge {
# The item at the end of the edge
node: ArtistType

# A cursor for use in pagination
cursor: String!
}

# An object with an ID
interface Node {
# The id of the object.
Expand Down
Loading

0 comments on commit a951ea6

Please sign in to comment.