diff --git a/Libraries/CameraRoll/CameraRoll.js b/Libraries/CameraRoll/CameraRoll.js index f4eb2e5a4..ad8db2793 100644 --- a/Libraries/CameraRoll/CameraRoll.js +++ b/Libraries/CameraRoll/CameraRoll.js @@ -32,10 +32,12 @@ const ASSET_TYPE_OPTIONS = { Photos: 'Photos', }; -type GetPhotosParams = { +export type GroupTypes = $Keys; + +export type GetPhotosParams = { first: number, after?: string, - groupTypes?: $Keys, + groupTypes?: GroupTypes, groupName?: string, assetType?: $Keys, mimeTypes?: Array, @@ -84,6 +86,7 @@ export type PhotoIdentifier = { type: string, group_name: string, image: { + filename: string, uri: string, height: number, width: number, @@ -153,8 +156,8 @@ const getPhotosReturnChecker = deprecatedCreateStrictShapeTypeChecker({ * See https://facebook.github.io/react-native/docs/cameraroll.html */ class CameraRoll { - static GroupTypesOptions: Object = GROUP_TYPES_OPTIONS; - static AssetTypeOptions: Object = ASSET_TYPE_OPTIONS; + static GroupTypesOptions = GROUP_TYPES_OPTIONS; + static AssetTypeOptions = ASSET_TYPE_OPTIONS; /** * `CameraRoll.saveImageWithTag()` is deprecated. Use `CameraRoll.saveToCameraRoll()` instead. diff --git a/RNTester/js/AssetScaledImageExample.js b/RNTester/js/AssetScaledImageExample.js index 4e09489e6..ae74d599c 100644 --- a/RNTester/js/AssetScaledImageExample.js +++ b/RNTester/js/AssetScaledImageExample.js @@ -14,10 +14,17 @@ var React = require('react'); var ReactNative = require('react-native'); var {Image, StyleSheet, View, ScrollView} = ReactNative; -class AssetScaledImageExample extends React.Component< - $FlowFixMeProps, - $FlowFixMeState, -> { +import type {PhotoIdentifier} from 'CameraRoll'; + +type Props = $ReadOnly<{| + asset: PhotoIdentifier, +|}>; + +type State = {| + asset: PhotoIdentifier, +|}; + +class AssetScaledImageExample extends React.Component { state = { asset: this.props.asset, }; diff --git a/RNTester/js/CameraRollExample.js b/RNTester/js/CameraRollExample.js index 9630f436a..322f73c97 100644 --- a/RNTester/js/CameraRollExample.js +++ b/RNTester/js/CameraRollExample.js @@ -28,18 +28,32 @@ const CameraRollView = require('./CameraRollView'); const AssetScaledImageExampleView = require('./AssetScaledImageExample'); -import type {PhotoIdentifier} from 'CameraRoll'; +import type {PhotoIdentifier, GroupTypes} from 'CameraRoll'; -class CameraRollExample extends React.Component< - $FlowFixMeProps, - $FlowFixMeState, -> { +type Props = $ReadOnly<{| + navigator?: ?Array< + $ReadOnly<{| + title: string, + component: Class>, + backButtonTitle: string, + passProps: $ReadOnly<{|asset: PhotoIdentifier|}>, + |}>, + >, +|}>; + +type State = {| + groupTypes: GroupTypes, + sliderValue: number, + bigImages: boolean, +|}; + +class CameraRollExample extends React.Component { state = { groupTypes: 'SavedPhotos', sliderValue: 1, bigImages: true, }; - _cameraRollView: ?CameraRollView; + _cameraRollView: ?React.ElementRef; render() { return ( @@ -139,7 +153,7 @@ exports.description = exports.examples = [ { title: 'Photos', - render(): React.Element { + render(): React.Node { return ; }, }, diff --git a/RNTester/js/CameraRollView.js b/RNTester/js/CameraRollView.js index 70313b6c3..7220008f7 100644 --- a/RNTester/js/CameraRollView.js +++ b/RNTester/js/CameraRollView.js @@ -28,9 +28,13 @@ const ListViewDataSource = require('ListViewDataSource'); const groupByEveryN = require('groupByEveryN'); const logError = require('logError'); -import type {PhotoIdentifier, PhotoIdentifiersPage} from 'CameraRoll'; +import type { + PhotoIdentifier, + PhotoIdentifiersPage, + GetPhotosParams, +} from 'CameraRoll'; -const rowHasChanged = function(r1: Array, r2: Array): boolean { +function rowHasChanged(r1: Array, r2: Array): boolean { if (r1.length !== r2.length) { return true; } @@ -42,9 +46,9 @@ const rowHasChanged = function(r1: Array, r2: Array): boolean { } return false; -}; +} -type PropsObject = {| +type Props = $ReadOnly<{| /** * The group where the photos will be fetched from. Possible * values are 'Album', 'All', 'Event', 'Faces', 'Library', 'PhotoStream' @@ -79,9 +83,7 @@ type PropsObject = {| * The asset type, one of 'Photos', 'Videos' or 'All' */ assetType: 'Photos' | 'Videos' | 'All', -|}; - -type Props = $ReadOnly; +|}>; type State = {| assets: Array, @@ -131,7 +133,7 @@ class CameraRollView extends React.Component { this.fetch(); } - UNSAFE_componentWillReceiveProps(nextProps: $Shape) { + UNSAFE_componentWillReceiveProps(nextProps: Props) { if (this.props.groupTypes !== nextProps.groupTypes) { this.fetch(true); } @@ -157,7 +159,7 @@ class CameraRollView extends React.Component { } } - const fetchParams: Object = { + const fetchParams: GetPhotosParams = { first: this.props.batchSize, groupTypes: this.props.groupTypes, assetType: this.props.assetType,