mirror of
https://github.com/status-im/react-native-camera-roll.git
synced 2026-08-27 11:21:08 +00:00
Bartol KaruzaandHarry Yu
4da8310892
BREAKING CHANGE: meta data is no longer added as default. This applies to `fileName`, `fileSize` and `location`. If you need this metadata use the new `include` parameter. Adding this metadata will slow down the `getPhotos` function, so consider only retrieving this meta data for smaller sets of images as needed, instead of for all images. * Created getPhotosFast function, fixed inconsistent getPhotos toDate logic * Fixed wrong param name, added better typechecking * Added example, renamed allowEmptyFilenames to skipGettingFilenames * Removed `after` from getPhotosFast docs * Redid implementation based on a new `include` param * Updated API to use include parameter * Fixed flow checking by converting index.ts to Typescript * Unformatted README.md * Unformatted README.md * Unformatted README.md * Added .prettierignore and ignored README.md for now * Made example/index.js not checked by Flow * Updated README.md to include notes in the outputs too * Made inclusion of fields consistent, addressed other feedback * Renamed GetPhotosFastParams back to GetPhotosParams * Updated documentation to reflect nullable types * Updated typings and documentation for fromTime, toTime * Updated to fix `hasNextPage` being incorrectly false in some cases Co-authored-by: Harry Yu <hy.harry.yu@gmail.com>
105 lines
2.6 KiB
TypeScript
105 lines
2.6 KiB
TypeScript
import * as React from 'react';
|
|
import {
|
|
SafeAreaView,
|
|
StyleSheet,
|
|
View,
|
|
Button,
|
|
Modal,
|
|
TouchableWithoutFeedback,
|
|
} from 'react-native';
|
|
// @ts-ignore: CameraRollExample has no typings in same folder
|
|
import CameraRollExample from './CameraRollExample';
|
|
import GetPhotosPerformanceExample from './GetPhotosPerformanceExample';
|
|
|
|
interface Props {}
|
|
|
|
interface State {
|
|
showChangeExampleModal: boolean;
|
|
currentExampleIndex: number;
|
|
}
|
|
|
|
interface Example {
|
|
label: string;
|
|
Component: React.ComponentType;
|
|
}
|
|
|
|
const examples: Example[] = [
|
|
{
|
|
label: 'CameraRollExample',
|
|
Component: CameraRollExample,
|
|
},
|
|
{
|
|
label: 'GetPhotosPerformanceExample',
|
|
Component: GetPhotosPerformanceExample,
|
|
},
|
|
];
|
|
|
|
/**
|
|
* Container for displaying and switching between multiple examples.
|
|
*
|
|
* Shows a button which opens up a Modal to switch between examples, as well
|
|
* as the current example itself.
|
|
*/
|
|
export default class ExamplesContainer extends React.Component<Props, State> {
|
|
state: State = {showChangeExampleModal: false, currentExampleIndex: 0};
|
|
|
|
render() {
|
|
const {currentExampleIndex} = this.state;
|
|
return (
|
|
<SafeAreaView style={styles.flex1}>
|
|
<Button
|
|
title="Change example"
|
|
onPress={() => this.setState({showChangeExampleModal: true})}
|
|
/>
|
|
{this._renderChangeExampleModal()}
|
|
<View style={styles.flex1}>
|
|
{React.createElement(examples[currentExampleIndex].Component)}
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
_renderChangeExampleModal() {
|
|
const {showChangeExampleModal} = this.state;
|
|
return (
|
|
<Modal visible={showChangeExampleModal} transparent>
|
|
<TouchableWithoutFeedback
|
|
onPress={() => this.setState({showChangeExampleModal: false})}>
|
|
<View style={styles.modalScrim}>
|
|
<SafeAreaView>
|
|
<View style={styles.modalInner}>
|
|
{examples.map((example, index) => (
|
|
<Button
|
|
key={example.label}
|
|
title={example.label}
|
|
onPress={() =>
|
|
this.setState({
|
|
currentExampleIndex: index,
|
|
showChangeExampleModal: false,
|
|
})
|
|
}
|
|
/>
|
|
))}
|
|
</View>
|
|
</SafeAreaView>
|
|
</View>
|
|
</TouchableWithoutFeedback>
|
|
</Modal>
|
|
);
|
|
}
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
modalScrim: {
|
|
flex: 1,
|
|
backgroundColor: '#00000080',
|
|
},
|
|
flex1: {
|
|
flex: 1,
|
|
},
|
|
modalInner: {
|
|
margin: 20,
|
|
backgroundColor: '#fff',
|
|
},
|
|
});
|