From 12ded168e34cc0579e643bd6d0eed279a71d6078 Mon Sep 17 00:00:00 2001 From: Norbert Schuler Date: Fri, 31 Dec 2021 16:49:15 +0100 Subject: [PATCH] fixed virtualized list view errors --- app/actions/loadTposAction.js | 1 + .../Challenge/challengeList.native.js | 1 + .../Common/CurrencySelectorList.native.js | 56 ++++---- .../components/CompetitionsListTabs.native.js | 1 + .../Companies/CompaniesLeaderBoard.js | 102 +++++++------- .../Countries/CountriesLeaderBoard.js | 103 +++++++------- .../Countries/CountryDetails.js | 104 +++++++-------- .../Individuals/IndividualsLeaderBoard.js | 106 ++++++++------- .../Schools/SchoolsLeaderBoard.js | 102 +++++++------- .../LeaderboardRefresh/TPOs/tpoLeaderBoard.js | 110 ++++++++------- .../PublicTreecounter.native.js | 4 +- .../ContributionCardList.native.js | 24 ++-- app/components/UserHome/index.native.js | 126 +++++++++--------- .../SelectedPlantProject/index.native.js | 34 ++--- app/utils/getRandomImage.js | 4 +- package.json | 4 + 16 files changed, 431 insertions(+), 451 deletions(-) diff --git a/app/actions/loadTposAction.js b/app/actions/loadTposAction.js index 0d6dcceb5..5739eab98 100644 --- a/app/actions/loadTposAction.js +++ b/app/actions/loadTposAction.js @@ -59,6 +59,7 @@ export function loadProject(plantProject, options = {}) { request .then(res => { //debug('========================', res.data); + dispatch(setSelectedPlantProjectId(parseInt(res.data.id))); dispatch(mergeEntities(normalize(res.data, plantProjectSchema))); dispatch(mergeEntities(normalize(res.data.tpoData, tpoSchema))); options.loading && dispatch(setProgressModelState(false)); diff --git a/app/components/Challenge/challengeList.native.js b/app/components/Challenge/challengeList.native.js index 2805b8d65..1ef1aa260 100644 --- a/app/components/Challenge/challengeList.native.js +++ b/app/components/Challenge/challengeList.native.js @@ -8,6 +8,7 @@ class ChallengeList extends Component { render() { const { challenges } = this.props; return ( + /* This crashes if embedded into a ScrollView */ countryCodes.find(c => c.code == currency.value) || {}; @@ -208,8 +208,8 @@ class CurrencySelectorList extends Component { {this.state.search ? ( ) : ( - - )} + + )} - - - {this.state.search ? null : ( + {this.state.search ? ( + + ) : ( + <> + {i18n.t('label.featured_currencies')} - )} - - - - {this.state.search ? null : ( + + + {i18n.t('label.all_currencies')} - )} - - - + + + + )} diff --git a/app/components/Competition/components/CompetitionsListTabs.native.js b/app/components/Competition/components/CompetitionsListTabs.native.js index 7041b6140..2e321e337 100644 --- a/app/components/Competition/components/CompetitionsListTabs.native.js +++ b/app/components/Competition/components/CompetitionsListTabs.native.js @@ -216,6 +216,7 @@ const CompetitionsList = props => { }; return ( + /* This crashes if embedded into a ScrollView */ { return (
- - - - - {i18n.t('label.lbr_companies')} - - - - - {i18n.t('label.lbr_c_leaderboard')} - - + + + + {i18n.t('label.lbr_companies')} + + + + + {i18n.t('label.lbr_c_leaderboard')} + - + + setPeriod('1w')} + style={ + styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] + } > - setPeriod('1w')} - style={ - styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] - } + - - {i18n.t('label.lbr_c_this_week')} - - - setPeriod('1y')} - style={ - styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_this_week')} + + + setPeriod('1y')} + style={ + styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_year')} - - - setPeriod('all')} - style={ - styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_year')} + + + setPeriod('all')} + style={ + styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_all_time')} - - - - {renderCompanyList()} + {i18n.t('label.lbr_c_all_time')} + + + {renderCompanyList()} ); }; diff --git a/app/components/LeaderboardRefresh/Countries/CountriesLeaderBoard.js b/app/components/LeaderboardRefresh/Countries/CountriesLeaderBoard.js index 57d55e711..dd1b86f8b 100644 --- a/app/components/LeaderboardRefresh/Countries/CountriesLeaderBoard.js +++ b/app/components/LeaderboardRefresh/Countries/CountriesLeaderBoard.js @@ -119,67 +119,62 @@ const CountriesLeaderBoard = ({ navigation }) => { return (
+ + + + {i18n.t('label.lbr_c_countries')} + + + + + {i18n.t('label.lbr_c_leaderboard')} + + + - - - - {i18n.t('label.lbr_c_countries')} - - - - - {i18n.t('label.lbr_c_leaderboard')} - - - - setPeriod('1w')} + style={ + styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] + } > - setPeriod('1w')} - style={ - styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] - } + - - {i18n.t('label.lbr_c_this_week')} - - - setPeriod('1y')} - style={ - styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_this_week')} + + + setPeriod('1y')} + style={ + styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_year')} - - - setPeriod('all')} - style={ - styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_year')} + + + setPeriod('all')} + style={ + styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_all_time')} - - - - {renderCountryList()} + {i18n.t('label.lbr_c_all_time')} + + + {renderCountryList()} ); }; diff --git a/app/components/LeaderboardRefresh/Countries/CountryDetails.js b/app/components/LeaderboardRefresh/Countries/CountryDetails.js index 00e7de56e..1869c91ab 100644 --- a/app/components/LeaderboardRefresh/Countries/CountryDetails.js +++ b/app/components/LeaderboardRefresh/Countries/CountryDetails.js @@ -85,63 +85,61 @@ const CountryDetails = ({ navigation }) => { return (
- - - - {section} - - - - {i18n.t('label.lbr_c_d_leaderboard')} - - + + + {section} - + + {i18n.t('label.lbr_c_d_leaderboard')} + + + + + setPeriod('1w')} + style={ + styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] + } > - setPeriod('1w')} - style={ - styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] - } + - - {i18n.t('label.lbr_c_d_this_week')} - - - setPeriod('1y')} - style={ - styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_d_this_week')} + + + setPeriod('1y')} + style={ + styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_d_year')} - - - setPeriod('all')} - style={ - styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_d_year')} + + + setPeriod('all')} + style={ + styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_d_all_time')} - - - - {renderList()} + {i18n.t('label.lbr_c_d_all_time')} + + - + {renderList()} + ); }; @@ -176,8 +174,8 @@ const CompanyListItem = ({ onPressListItem, item, index }) => { }} /> ) : ( - - )} + + )} diff --git a/app/components/LeaderboardRefresh/Individuals/IndividualsLeaderBoard.js b/app/components/LeaderboardRefresh/Individuals/IndividualsLeaderBoard.js index 668da2ae1..09b63d3f6 100644 --- a/app/components/LeaderboardRefresh/Individuals/IndividualsLeaderBoard.js +++ b/app/components/LeaderboardRefresh/Individuals/IndividualsLeaderBoard.js @@ -81,66 +81,64 @@ const IndividualsLeaderBoard = ({ navigation }) => { return (
- - - - - {i18n.t('label.lbr_individuals')} - - - - - {i18n.t('label.lbr_c_leaderboard')} - - + + + + {i18n.t('label.lbr_individuals')} + + + + + {i18n.t('label.lbr_c_leaderboard')} + - + + setPeriod('1w')} + style={ + styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] + } > - setPeriod('1w')} - style={ - styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] - } + - - {i18n.t('label.lbr_c_this_week')} - - - setPeriod('1y')} - style={ - styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_this_week')} + + + setPeriod('1y')} + style={ + styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_year')} - - - setPeriod('all')} - style={ - styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_year')} + + + setPeriod('all')} + style={ + styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_all_time')} - - - - - {renderIndividualsList()} - + {i18n.t('label.lbr_c_all_time')} + + + + {renderIndividualsList()} + ); }; diff --git a/app/components/LeaderboardRefresh/Schools/SchoolsLeaderBoard.js b/app/components/LeaderboardRefresh/Schools/SchoolsLeaderBoard.js index 1e0b54b92..f7f83cba0 100644 --- a/app/components/LeaderboardRefresh/Schools/SchoolsLeaderBoard.js +++ b/app/components/LeaderboardRefresh/Schools/SchoolsLeaderBoard.js @@ -80,62 +80,60 @@ const SchoolsLeaderBoard = ({ navigation }) => { return (
- - - - {i18n.t('label.lbr_schools')} - - - - {i18n.t('label.lbr_c_leaderboard')} - - + + + {i18n.t('label.lbr_schools')} - + + {i18n.t('label.lbr_c_leaderboard')} + + + + + setPeriod('1w')} + style={ + styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] + } > - setPeriod('1w')} - style={ - styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] - } + - - {i18n.t('label.lbr_c_this_week')} - - - setPeriod('1y')} - style={ - styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_this_week')} + + + setPeriod('1y')} + style={ + styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_year')} - - - setPeriod('all')} - style={ - styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_year')} + + + setPeriod('all')} + style={ + styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_all_time')} - - - - {renderSchoolsList()} + {i18n.t('label.lbr_c_all_time')} + + + {renderSchoolsList()} ); }; @@ -163,8 +161,8 @@ const CompanyListItem = ({ onPressListItem, item, index }) => { }} /> ) : ( - - )} + + )} diff --git a/app/components/LeaderboardRefresh/TPOs/tpoLeaderBoard.js b/app/components/LeaderboardRefresh/TPOs/tpoLeaderBoard.js index 9f9ead69b..6b8504d84 100644 --- a/app/components/LeaderboardRefresh/TPOs/tpoLeaderBoard.js +++ b/app/components/LeaderboardRefresh/TPOs/tpoLeaderBoard.js @@ -80,66 +80,64 @@ const tpoLeaderBoard = ({ navigation }) => { return (
- - - - - {i18n.t('label.lbr_tree_planting_organizations')} - - - - - {i18n.t('label.lbr_c_leaderboard')} - - + + + + {i18n.t('label.lbr_tree_planting_organizations')} + + + + + {i18n.t('label.lbr_c_leaderboard')} + - + + setPeriod('1w')} + style={ + styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] + } > - setPeriod('1w')} - style={ - styles[period == '1w' ? 'activeChipContainer' : 'chipContainer'] - } + - - {i18n.t('label.lbr_c_this_week')} - - - setPeriod('1y')} - style={ - styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_this_week')} + + + setPeriod('1y')} + style={ + styles[period == '1y' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_year')} - - - setPeriod('all')} - style={ - styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] - } + {i18n.t('label.lbr_c_year')} + + + setPeriod('all')} + style={ + styles[period == 'all' ? 'activeChipContainer' : 'chipContainer'] + } + > + - - {i18n.t('label.lbr_c_all_time')} - - - - - {renderOrganizationsList()} - + {i18n.t('label.lbr_c_all_time')} + + + + {renderOrganizationsList()} + ); }; @@ -167,8 +165,8 @@ const CompanyListItem = ({ onPressListItem, item, index }) => { }} /> ) : ( - - )} + + )} diff --git a/app/components/PublicTreeCounter/PublicTreecounter.native.js b/app/components/PublicTreeCounter/PublicTreecounter.native.js index 669ae1687..776181477 100644 --- a/app/components/PublicTreeCounter/PublicTreecounter.native.js +++ b/app/components/PublicTreeCounter/PublicTreecounter.native.js @@ -10,7 +10,6 @@ import { TouchableOpacity, SafeAreaView, Image - // FlatList } from 'react-native'; import { backArrow } from './../../assets'; import { debug } from '../../debug'; @@ -126,8 +125,9 @@ class PublicTreeCounter extends React.Component { this.props.clearSupport(); this.props.selectPlantProjectIdAction(id); const { navigation } = this.props; - updateRoute('app_selectedProject', navigation, null, { + updateRoute('app_selectedProject', navigation, 1, { titleParam: name, + projectName: name, id: id }); } diff --git a/app/components/UserContributions/ContributionCardList.native.js b/app/components/UserContributions/ContributionCardList.native.js index 092710751..44645fd38 100644 --- a/app/components/UserContributions/ContributionCardList.native.js +++ b/app/components/UserContributions/ContributionCardList.native.js @@ -1,6 +1,5 @@ import PropTypes from 'prop-types'; import React from 'react'; -import { FlatList } from 'react-native'; import ContributionCard from './ContributionCard'; import { convertNumIdToString } from '../../utils/utils'; @@ -19,19 +18,16 @@ const ContributionCardList = props => { return new Date(b.plantDate ? b.plantDate : b.redemptionDate) - new Date(a.plantDate ? a.plantDate : a.redemptionDate); }); return ( - 3 && showAllContributions ? contributions : contributions.slice(0, 3))} - renderItem={({ item }) => ( - - )} - /> + (convertNumIdToString(contributions.length > 3 && showAllContributions ? contributions : contributions.slice(0, 3))).map((item) => ( + + )) ) }; diff --git a/app/components/UserHome/index.native.js b/app/components/UserHome/index.native.js index 60296d1f9..aec5be105 100644 --- a/app/components/UserHome/index.native.js +++ b/app/components/UserHome/index.native.js @@ -1,7 +1,7 @@ /* eslint-disable no-underscore-dangle */ import PropTypes from 'prop-types'; import React, { Component } from 'react'; -import { Dimensions, findNodeHandle, FlatList, Image, LayoutAnimation, Linking, Platform, RefreshControl, ScrollView, Share, Text, TouchableOpacity, UIManager, View } from 'react-native'; +import { Dimensions, findNodeHandle, Image, LayoutAnimation, Linking, Platform, RefreshControl, ScrollView, Share, Text, TouchableOpacity, UIManager, View } from 'react-native'; import { SafeAreaView } from 'react-navigation'; import { withNavigation } from 'react-navigation'; import { fullscreen_icon } from '../../assets/index'; @@ -445,27 +445,27 @@ class UserHome extends Component { userProfile.synopsis2 || userProfile.linkText || userProfile.url ? ( - - {userProfile.synopsis1 ? ( - - {userProfile.synopsis1} - - ) : null} - {userProfile.synopsis2 ? ( - - {userProfile.synopsis2} - - ) : null} - {userProfile.url ? ( - this._goToURL(userProfile.url)} - > - {userProfile.linkText || i18n.t('label.read_more')} - - ) : null} - - ) : null} + + {userProfile.synopsis1 ? ( + + {userProfile.synopsis1} + + ) : null} + {userProfile.synopsis2 ? ( + + {userProfile.synopsis2} + + ) : null} + {userProfile.url ? ( + this._goToURL(userProfile.url)} + > + {userProfile.linkText || i18n.t('label.read_more')} + + ) : null} + + ) : null} ) : null} @@ -484,7 +484,7 @@ class UserHome extends Component { ) : null} - {/* Competitions */} + {/* Competitions {userProfile.treecounter.competitions.length > 0 ? ( ) : null} + */} {/* Plant Projects of TPO */} {userProfile.plantProjects ? ( @@ -499,27 +500,24 @@ class UserHome extends Component { ) : null} {userProfile.plantProjects ? ( - { - let project = item; - return ( - - this.onPlantProjectClick(id, project.name) - } - plantProject={project} - onSelectClickedFeaturedProjects={id => - this.onPlantProjectClick(id, project.name) - } - showMoreButton={false} - tpoName={project.tpo_name} - navigation={this.props.navigation} - /> - ); - }} - /> + (convertNumIdToString(userProfile.plantProjects)).map((item) => { + let project = item; + return ( + + this.onPlantProjectClick(id, project.name) + } + plantProject={project} + onSelectClickedFeaturedProjects={id => + this.onPlantProjectClick(id, project.name) + } + showMoreButton={false} + tpoName={project.tpo_name} + navigation={this.props.navigation} + /> + ); + }) ) : null} @@ -541,11 +539,11 @@ class UserHome extends Component { {this.props.userContributions && this.props.userContributions.length > 3 ? ( - this.readMore()} - showMore={showAllContributions} - /> - ) : null} + this.readMore()} + showMore={showAllContributions} + /> + ) : null} {/* {competitions.length > 0 ? ( - { - let competition = item; - return ( - - props.onCompetitionClick(id, competition.name) - } - competition={competition} - type="all" - /> - ); - }} - /> + (convertNumIdToString(competitions)).map((item) => { + let competition = item; + return ( + + props.onCompetitionClick(id, competition.name) + } + competition={competition} + type="all" + /> + ); + }) ) : null} diff --git a/app/containers/SelectedPlantProject/index.native.js b/app/containers/SelectedPlantProject/index.native.js index 78d7a27a4..3ae1763be 100644 --- a/app/containers/SelectedPlantProject/index.native.js +++ b/app/containers/SelectedPlantProject/index.native.js @@ -1,6 +1,6 @@ import React from 'react'; -import {connect} from 'react-redux'; -import {bindActionCreators} from 'redux'; +import { connect } from 'react-redux'; +import { bindActionCreators } from 'redux'; import PropTypes from 'prop-types'; import { selectedPlantProjectIdSelector, @@ -8,9 +8,9 @@ import { selectedTpoSelector, currentUserProfileSelector } from '../../selectors'; -import {updateStaticRoute} from '../../helpers/routerHelper'; +import { updateStaticRoute } from '../../helpers/routerHelper'; import PlantProjectFull from '../../components/PlantProjects/PlantProjectFull'; -import {loadProject} from '../../actions/loadTposAction'; +import { loadProject } from '../../actions/loadTposAction'; import { clearPlantProject, selectPlantProjectAction @@ -18,24 +18,18 @@ import { const SelectedPlantProjectContainer = props => { const getProjectDetails = async (projectSlug) => { - if (projectSlug) { - const project = await props.loadProject( - { id: projectSlug || props.selectedPlantProjectId }, - { loading: true } - ); - props.selectPlantProjectAction(project.id); - } else { - props.loadProject( - {id: props.selectedPlantProjectId}, - {loading: true} - ); - } + const project = await props.loadProject( + { id: projectSlug || props.selectedPlantProjectId }, + { loading: true } + ); }; + React.useEffect(() => { - getProjectDetails(props.navigation.state.params.projectName); + getProjectDetails(); }, [props.navigation.state.params.projectName]); + const selectProject = id => { - const {navigation} = props; + const { navigation } = props; props.selectPlantProjectAction(id); if (navigation) { updateStaticRoute('app_donate_detail', navigation, { @@ -46,7 +40,7 @@ const SelectedPlantProjectContainer = props => { } }; - return ( + return props.selectedProject ? ( { selectProject={id => selectProject(id)} currentUserProfile={props.currentUserProfile} /> - ); + ) : null; }; SelectedPlantProjectContainer.navigationOptions = () => ({ diff --git a/app/utils/getRandomImage.js b/app/utils/getRandomImage.js index 97b72ecb7..b4fd0efe7 100644 --- a/app/utils/getRandomImage.js +++ b/app/utils/getRandomImage.js @@ -34,7 +34,7 @@ export default function GetRandomImage(props) { // clean up }, []); - return ( + return selectedImage ? ( - ); + ) : null; } diff --git a/package.json b/package.json index 6d17683ad..2ce3c60b0 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,11 @@ "shake": "adb shell input keyevent 82", "clean": "./clean.sh", "ios": "ENVFILE=.env.develop react-native run-ios --scheme 'TreecounterApp(.env.develop)'", + "ios:staging": "ENVFILE=.env.staging react-native run-ios --scheme 'TreecounterApp(.env.staging)'", + "ios:production": "ENVFILE=.env.production react-native run-ios --scheme 'TreecounterApp(.env.production)'", "android": "ENVFILE=.env.develop react-native run-android --variant 'developDebug'", + "android:staging": "ENVFILE=.env.staging react-native run-android --variant 'stagingDebug'", + "android:production": "ENVFILE=.env.production react-native run-android --variant 'productionDebug'", "metro": "react-native start --reset-cache", "snyk-protect": "snyk protect", "prepare": "npm run snyk-protect"