123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475 |
- // @flow
-
- import * as React from 'react';
- import packageJson from '../../../package';
- import {List} from 'react-native-paper';
- import {StackNavigationProp} from "@react-navigation/stack";
- import CollapsibleFlatList from "../../components/Collapsible/CollapsibleFlatList";
- import {View} from "react-native-animatable";
-
- type listItem = {
- name: string,
- version: string
- };
-
- /**
- * Generates the dependencies list from the raw json
- *
- * @param object The raw json
- * @return {Array<listItem>}
- */
- function generateListFromObject(object: { [key: string]: string }): Array<listItem> {
- let list = [];
- let keys = Object.keys(object);
- let values = Object.values(object);
- for (let i = 0; i < keys.length; i++) {
- list.push({name: keys[i], version: values[i]});
- }
- //$FlowFixMe
- return list;
- }
-
- type Props = {
- navigation: StackNavigationProp,
- }
-
- const LIST_ITEM_HEIGHT = 64;
-
- /**
- * Class defining a screen showing the list of libraries used by the app, taken from package.json
- */
- export default class AboutDependenciesScreen extends React.Component<Props> {
-
- data: Array<listItem>;
-
- constructor() {
- super();
- this.data = generateListFromObject(packageJson.dependencies);
- }
-
- keyExtractor = (item: listItem) => item.name;
-
- renderItem = ({item}: { item: listItem }) =>
- <List.Item
- title={item.name}
- description={item.version.replace('^', '').replace('~', '')}
- style={{height: LIST_ITEM_HEIGHT}}
- />;
-
- itemLayout = (data: any, index: number) => ({length: LIST_ITEM_HEIGHT, offset: LIST_ITEM_HEIGHT * index, index});
-
- render() {
- return (
- <View>
- <CollapsibleFlatList
- data={this.data}
- keyExtractor={this.keyExtractor}
- renderItem={this.renderItem}
- // Performance props, see https://reactnative.dev/docs/optimizing-flatlist-configuration
- removeClippedSubviews={true}
- getItemLayout={this.itemLayout}
- />
- </View>
- );
- }
- }
|