ldc-com-app/ComApp/src/App/Views/DirectoriesScreen.js
Vincent BRIDIER 793ef4a1fa
add MainColor
2022-12-30 10:02:07 +01:00

90 lines
3 KiB
JavaScript

import React from 'react';
import {
View,
ScrollView,
TouchableOpacity,
Text,
Image
} from 'react-native';
// Redux
import { connect } from 'react-redux';
import { initDocuments } from '../Store/Actions/documents';
// Treeview
import TreeView from 'react-native-animated-tree-view';
// Icon
import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
// Assets
import arrowDown from '../../Resources/assets/img/arrow_down.png';
// Styles
import styles from '../../Resources/Styles/DirectoriesStyle';
function mapStateToProps(state) {
return {
documents: state.documents,
directories: state.directories,
locale: state.locale.locale,
mainColor: state.app.mainColor
};
}
class DirectoriesScreen extends React.Component {
state = {
documents: [],
};
render() {
const { folder } = this.props.route.params;
let documentList = this.state.documents.map(document => {
return (
<TouchableOpacity
key={document.id.toString()}
style={{ ...styles.file, backgroundColor: this.props.mainColor }}
onPress={() => this.openDocument(document)}>
{document.type === 'pdf' ? (
<FontAwesome5 name="file-pdf" color={'white'} size={60} />
) : (
<FontAwesome5 name="file-video" color={'white'} size={60} />
)}
<Text style={styles.fileTxt}>{document.title}</Text>
</TouchableOpacity>
);
});
return (
<View style={styles.container}>
<View
style={{ width: 290, borderRightWidth: 1, borderColor: 'lightgrey' }}>
<TreeView
data={folder}
leftImage={{}}
rightImage={{ uri: Image.resolveAssetSource(arrowDown).uri }}
containerStyle={styles.treeviewContainer}
onClick={folder => {
this.setState({
documents: this.props.documents.filter(
tmp => tmp.directory === folder.id,
)
});
}}
/>
</View>
<ScrollView style={styles.scrollview}>
<View style={styles.filesContainer}>{documentList}</View>
</ScrollView>
</View>
);
}
openDocument(document) {
this.props.dispatch({ type: 'SET_CURRENT_OPENED_DOC', data: document });
if (document.type === 'pdf') {
this.props.navigation.navigate('PDFScreen', { uuid: document.uuid });
} else if (document.type === 'mp4') {
this.props.navigation.navigate('VideoScreen', { uuid: document.uuid });
} else {
console.log('Inconnu');
}
}
}
export default connect(mapStateToProps)(DirectoriesScreen);