Skip to content

Commit

Permalink
Fixed problem with ability to see more ballot items on Ballot page. F…
Browse files Browse the repository at this point in the history 
…ixed a few ESLINT warnings/errors. Turned off RepresentativeList when no data found.
  • Loading branch information
@DaleMcGrew
DaleMcGrew committed Feb 19, 2024
1 parent 31fa01b commit e38347d
Show file tree
Hide file tree
Showing 10 changed files with 168 additions and 71 deletions.
12 changes: 12 additions & 0 deletions src/js/common/components/Campaign/CampaignListRoot.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,17 @@ class CampaignListRoot extends Component {
this.campaignStoreListener.remove();
}

handleNumberOfResults (numberOfFilteredResults, numberOfSearchResults) {
// console.log('RepresentativeListRoot handleNumberOfResults numberOfFilteredResults:', numberOfFilteredResults, ', numberOfSearchResults:', numberOfSearchResults);
if (this.props.handleNumberOfResults) {
// Delay telling the parent component that the number of results has changed
// if (this.timer) clearTimeout(this.timer);
// this.timer = setTimeout(() => {
this.props.handleNumberOfResults(numberOfFilteredResults, numberOfSearchResults);
// }, 500);
}
}

onCampaignSupporterStoreChange () {
// We need to instantiate CampaignSupporterStore before we call campaignListRetrieve so that store gets filled with data
}
Expand Down Expand Up @@ -358,6 +369,7 @@ class CampaignListRoot extends Component {
}
CampaignListRoot.propTypes = {
classes: PropTypes.object,
handleNumberOfResults: PropTypes.func,
hideCampaignsLinkedToPoliticians: PropTypes.bool,
hideIfNoResults: PropTypes.bool,
hideTitle: PropTypes.bool,
Expand Down
4 changes: 1 addition & 3 deletions src/js/components/Ballot/BallotItemCompressed.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export default class BallotItemCompressed extends PureComponent {
const {
ballotItemDisplayName, candidateList, candidatesToShowForSearchResults,
isFirstBallotItem, isMeasure,
totalNumberOfBallotItems, weVoteId,
weVoteId,
} = this.props;
return (
<div id={weVoteId}>
Expand All @@ -26,7 +26,6 @@ export default class BallotItemCompressed extends PureComponent {
candidateList={candidateList}
candidatesToShowForSearchResults={candidatesToShowForSearchResults}
isFirstBallotItem={isFirstBallotItem}
totalNumberOfBallotItems={totalNumberOfBallotItems}
/>
)}
</div>
Expand All @@ -39,6 +38,5 @@ BallotItemCompressed.propTypes = {
candidatesToShowForSearchResults: PropTypes.array,
isFirstBallotItem: PropTypes.bool,
isMeasure: PropTypes.bool,
totalNumberOfBallotItems: PropTypes.number,
weVoteId: PropTypes.string.isRequired,
};
49 changes: 25 additions & 24 deletions src/js/components/Ballot/OfficeItemCompressed.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@ const IssuesByBallotItemDisplayList = React.lazy(() => import(/* webpackChunkNam
const ItemActionBar = React.lazy(() => import(/* webpackChunkName: 'ItemActionBar' */ '../Widgets/ItemActionBar/ItemActionBar'));
const ShowMoreButtons = React.lazy(() => import(/* webpackChunkName: 'ShowMoreButtons' */ '../Widgets/ShowMoreButtons'));

const SHOW_ALL_CANDIDATES_IF_FEWER_THAN_THIS_NUMBER_OF_BALLOT_ITEMS = 5;
const NUMBER_OF_CANDIDATES_TO_DISPLAY = 3;

// This is related to components/VoterGuide/VoterGuideOfficeItemCompressed
Expand All @@ -43,7 +42,6 @@ class OfficeItemCompressed extends Component {
this.state = {
candidateListLength: 0,
candidateListForDisplay: [],
limitNumberOfCandidatesShownToThisNumber: NUMBER_OF_CANDIDATES_TO_DISPLAY,
organizationWeVoteId: '',
positionListFromFriendsHasBeenRetrievedOnce: {},
positionListHasBeenRetrievedOnce: {},
Expand Down Expand Up @@ -199,14 +197,6 @@ class OfficeItemCompressed extends Component {
let sortedCandidateList = {};
if (candidateListForDisplay && candidateListForDisplay.length) {
sortedCandidateList = sortCandidateList(candidateListForDisplay);
const { totalNumberOfBallotItems } = this.props;
const limitCandidatesShownBecauseMoreThanDefaultNumberOfBallotItems = (totalNumberOfBallotItems && totalNumberOfBallotItems > SHOW_ALL_CANDIDATES_IF_FEWER_THAN_THIS_NUMBER_OF_BALLOT_ITEMS);
if (!limitCandidatesShownBecauseMoreThanDefaultNumberOfBallotItems) {
// If the ballot is only show 5 ballot items, then don't limit the number of candidates we show
this.setState({
limitNumberOfCandidatesShownToThisNumber: candidateList.length,
});
}
}
this.setState({
candidateListForDisplay: sortedCandidateList,
Expand Down Expand Up @@ -262,27 +252,43 @@ class OfficeItemCompressed extends Component {
const { candidateList } = this.props;
let { candidatesToShowForSearchResults } = this.props;
candidatesToShowForSearchResults = candidatesToShowForSearchResults || [];
const { candidateListForDisplay, showAllCandidates } = this.state;
const { showAllCandidates } = this.state;
const supportedCandidatesList = candidateList.filter((candidate) => candidatesToShowForSearchResults.includes(candidate.we_vote_id) || (SupportStore.getVoterSupportsByBallotItemWeVoteId(candidate.we_vote_id) && !candidate.withdrawn_from_election));
const opposedCandidatesList = candidateList.filter((candidate) => candidatesToShowForSearchResults.includes(candidate.we_vote_id) || (SupportStore.getVoterOpposesByBallotItemWeVoteId(candidate.we_vote_id) && !candidate.withdrawn_from_election));
const supportedAndOpposedCandidatesList = supportedCandidatesList.concat(opposedCandidatesList);
const candidatesToRender = (supportedCandidatesList.length && !showAllCandidates) ? supportedAndOpposedCandidatesList : candidateListForDisplay;
return candidatesToRender.length;
// console.log('OfficeItemCompressed getCandidatesToRenderCount candidatesToRender: ', candidatesToRender);
if (showAllCandidates) {
return candidateList.length;
} else if (supportedAndOpposedCandidatesList && supportedAndOpposedCandidatesList.length > 0) {
return supportedAndOpposedCandidatesList.length;
} else {
return NUMBER_OF_CANDIDATES_TO_DISPLAY;
}
}

// eslint-disable-next-line no-unused-vars
generateCandidates = (officeWeVoteId) => {
const { candidateList, externalUniqueId, isFirstBallotItem } = this.props;
let { candidatesToShowForSearchResults } = this.props;
candidatesToShowForSearchResults = candidatesToShowForSearchResults || [];
const { candidateListForDisplay, limitNumberOfCandidatesShownToThisNumber, showAllCandidates } = this.state;
const { candidateListForDisplay, showAllCandidates } = this.state; // limitNumberOfCandidatesShownToThisNumber
// If voter has chosen 1+ candidates, only show those
const supportedCandidatesList = candidateList.filter((candidate) => candidatesToShowForSearchResults.includes(candidate.we_vote_id) || (SupportStore.getVoterSupportsByBallotItemWeVoteId(candidate.we_vote_id) && !candidate.withdrawn_from_election));
const opposedCandidatesList = candidateList.filter((candidate) => candidatesToShowForSearchResults.includes(candidate.we_vote_id) || (SupportStore.getVoterOpposesByBallotItemWeVoteId(candidate.we_vote_id) && !candidate.withdrawn_from_election));
const supportedAndOpposedCandidatesList = supportedCandidatesList.concat(opposedCandidatesList);
// If there are supported candidates, then limit what we show to supported and opposed candidates
const candidatesToRender = (supportedCandidatesList.length && !showAllCandidates) ? supportedAndOpposedCandidatesList : candidateListForDisplay;
const candidatesToRenderLength = candidatesToRender.length;
let candidatesToRender;
let limitNumberOfCandidatesShownToThisNumber;
if (showAllCandidates) {
candidatesToRender = candidateList;
limitNumberOfCandidatesShownToThisNumber = candidatesToRender.length;
} else if (supportedAndOpposedCandidatesList && supportedAndOpposedCandidatesList.length > 0) {
candidatesToRender = supportedAndOpposedCandidatesList;
limitNumberOfCandidatesShownToThisNumber = candidatesToRender.length;
} else {
candidatesToRender = candidateListForDisplay;
limitNumberOfCandidatesShownToThisNumber = NUMBER_OF_CANDIDATES_TO_DISPLAY;
}
const hideItemActionBar = false;
const hideCandidateDetails = false; // supportedCandidatesList.length;
let candidateCount = 0;
Expand Down Expand Up @@ -450,7 +456,8 @@ class OfficeItemCompressed extends Component {
</PositionRowListOuterWrapper>
</CandidateContainer>
</BallotHorizontallyScrollingContainer>
{((candidateCount < candidatesToRenderLength) && (candidateCount < limitNumberOfCandidatesShownToThisNumber)) && (
{/* {((candidateCount < candidatesToRenderLength) && (candidateCount < limitNumberOfCandidatesShownToThisNumber)) && ( */}
{(candidateCount < limitNumberOfCandidatesShownToThisNumber) && (
<div>
<HrSeparator />
</div>
Expand All @@ -464,14 +471,12 @@ class OfficeItemCompressed extends Component {

showAllCandidates () {
this.setState({
limitNumberOfCandidatesShownToThisNumber: 99,
showAllCandidates: true,
});
}

showLessCandidates () {
this.setState({
limitNumberOfCandidatesShownToThisNumber: NUMBER_OF_CANDIDATES_TO_DISPLAY,
showAllCandidates: false,
}, () => {
this.targetRef.scrollIntoView({
Expand Down Expand Up @@ -513,9 +518,6 @@ class OfficeItemCompressed extends Component {
const { isFirstBallotItem, officeWeVoteId } = this.props; // classes
const { candidateListLength, showAllCandidates, totalNumberOfCandidates } = this.state;
ballotItemDisplayName = toTitleCase(ballotItemDisplayName);
// const supportedCandidatesList = candidateList.filter((candidate) => (SupportStore.getVoterSupportsByBallotItemWeVoteId(candidate.we_vote_id) && !candidate.withdrawn_from_election));
// const thereIsAtLeastOneSupportedCandidate = supportedCandidatesList.length > 0;
// Even if voter has chosen 1+ candidates, show the "Show more" link
const candidatesToRenderCount = this.getCandidatesToRenderCount();
const moreCandidatesToDisplay = (candidatesToRenderCount < totalNumberOfCandidates);
// console.log('ballotItemDisplayName:', ballotItemDisplayName, ', candidatesToRenderCount:', candidatesToRenderCount, ', totalNumberOfCandidates:', totalNumberOfCandidates, ', moreCandidatesToDisplay:', moreCandidatesToDisplay);
Expand All @@ -534,7 +536,7 @@ class OfficeItemCompressed extends Component {
{ballotItemDisplayName}
</OfficeNameH2>
{/* *************************
Display either a) the candidates the voter supports, or b) the first several candidates running for this office
Display either a) the candidates the voter supports, or b) the first few candidates running for this office
************************* */}
{this.generateCandidates(officeWeVoteId)}

Expand Down Expand Up @@ -574,7 +576,6 @@ OfficeItemCompressed.propTypes = {
isFirstBallotItem: PropTypes.bool,
organization: PropTypes.object,
organizationWeVoteId: PropTypes.string,
totalNumberOfBallotItems: PropTypes.number,
};

const styles = (theme) => ({
Expand Down
25 changes: 18 additions & 7 deletions src/js/components/CandidateListRoot/CandidateListRoot.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,17 @@ class CandidateListRoot extends Component {
this.candidateStoreListener.remove();
}

handleNumberOfResults (numberOfFilteredResults, numberOfSearchResults) {
// console.log('RepresentativeListRoot handleNumberOfResults numberOfFilteredResults:', numberOfFilteredResults, ', numberOfSearchResults:', numberOfSearchResults);
if (this.props.handleNumberOfResults) {
// Delay telling the parent component that the number of results has changed
// if (this.timer) clearTimeout(this.timer);
// this.timer = setTimeout(() => {
this.props.handleNumberOfResults(numberOfFilteredResults, numberOfSearchResults);
// }, 500);
}
}

onCandidateStoreChange () {
this.onIncomingListChange();
}
Expand Down Expand Up @@ -255,7 +266,7 @@ class CandidateListRoot extends Component {
filteredList = filteredList.sort(this.orderByUltimateElectionDate);
let searchResults = [];
let hideDisplayBecauseNoSearchResults = false;
this.callbackToParentHideIfNoResults(false);
// this.callbackToParentHideIfNoResults(false);
if (searchText && searchText.length > 0) {
const searchTextLowercase = searchText.toLowerCase();
// console.log('searchTextLowercase:', searchTextLowercase);
Expand Down Expand Up @@ -288,7 +299,7 @@ class CandidateListRoot extends Component {
});
if (searchResults.length === 0) {
hideDisplayBecauseNoSearchResults = true;
this.callbackToParentHideIfNoResults(true);
// this.callbackToParentHideIfNoResults(true);
}
if (searchResults.length > 0) {
// Only allow the first politician entry to be displayed (when there are multiple candidate entries for the same politician)
Expand Down Expand Up @@ -327,7 +338,7 @@ class CandidateListRoot extends Component {
filteredList,
hideDisplayBecauseNoSearchResults,
timeStampOfChange: Date.now(),
});
}, () => { this.handleNumberOfResults(filteredList.length, searchResults.length); });
}

leftAndRightArrowSetState = (el) => {
Expand All @@ -351,9 +362,9 @@ class CandidateListRoot extends Component {
});
}

callbackToParentHideIfNoResults = (newValue) => {
this.props.onHideIfNoResultsChange(newValue);
}
// callbackToParentHideIfNoResults = (newValue) => {
// this.props.onHideIfNoResultsChange(newValue);
// }

render () {
renderLog('CandidateListRoot'); // Set LOG_RENDER_EVENTS to log all renders
Expand Down Expand Up @@ -438,8 +449,8 @@ class CandidateListRoot extends Component {
}
CandidateListRoot.propTypes = {
classes: PropTypes.object,
handleNumberOfResults: PropTypes.func,
hideIfNoResults: PropTypes.bool,
onHideIfNoResultsChange: PropTypes.func,
hideTitle: PropTypes.bool,
incomingList: PropTypes.array,
incomingListTimeStampOfChange: PropTypes.number,
Expand Down
2 changes: 1 addition & 1 deletion src/js/components/Friends/AskFriendsModal.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@ class AskFriendsModal extends Component {
const { location: { pathname } } = window;
const {
currentFriendListFilteredBySearch, electionDateInFutureFormatted,
electionDateIsToday, numberOfItemsToDisplay, searchFilterOn, searchTerm,
electionDateIsToday, numberOfItemsToDisplay, searchFilterOn,
totalCurrentFriendListCount,
} = this.state;
let { currentFriendList } = this.state;
Expand Down
15 changes: 14 additions & 1 deletion src/js/components/RepresentativeListRoot/RepresentativeListRoot.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,18 @@ class RepresentativeListRoot extends Component {

componentWillUnmount () {
this.representativeStoreListener.remove();
if (this.timer) clearTimeout(this.timer);
}

handleNumberOfResults (numberOfFilteredResults, numberOfSearchResults) {
// console.log('RepresentativeListRoot handleNumberOfResults numberOfFilteredResults:', numberOfFilteredResults, ', numberOfSearchResults:', numberOfSearchResults);
if (this.props.handleNumberOfResults) {
// Delay telling the parent component that the number of results has changed
// if (this.timer) clearTimeout(this.timer);
// this.timer = setTimeout(() => {
this.props.handleNumberOfResults(numberOfFilteredResults, numberOfSearchResults);
// }, 500);
}
}

onRepresentativeStoreChange () {
Expand Down Expand Up @@ -336,7 +348,7 @@ class RepresentativeListRoot extends Component {
hideDisplayBecauseNoSearchResults,
representativeSearchResults: searchResults,
timeStampOfChange: Date.now(),
});
}, () => { this.handleNumberOfResults(filteredList.length, searchResults.length); });
}

leftAndRightArrowSetState = (el) => {
Expand Down Expand Up @@ -439,6 +451,7 @@ class RepresentativeListRoot extends Component {
}
RepresentativeListRoot.propTypes = {
classes: PropTypes.object,
handleNumberOfResults: PropTypes.func,
hideIfNoResults: PropTypes.bool,
hideTitle: PropTypes.bool,
incomingList: PropTypes.array,
Expand Down
2 changes: 1 addition & 1 deletion src/js/components/Search/SearchBar.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -132,4 +132,4 @@ SearchBar.propTypes = {

const SearchInput = styled('input')`
${isIPhoneMiniOrSmaller() ? 'font-size: 0.8rem' : ''};
`;
`;
2 changes: 1 addition & 1 deletion src/js/components/VoterGuide/OrganizationVoterGuideTabs.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export default class OrganizationVoterGuideTabs extends Component {
VoterGuideActions.voterGuideFollowersRetrieve(organizationWeVoteId);
VoterGuideActions.voterGuidesRecommendedByOrganizationRetrieve(organizationWeVoteId, VoterStore.electionId());
// Positions for this organization, for this voter / election
OrganizationActions.positionListForOpinionMaker(organizationWeVoteId, true); // Needed for friends
OrganizationActions.positionListForOpinionMaker(organizationWeVoteId, true, false); // Needed for friends
// Positions for this organization, NOT including for this voter / election
OrganizationActions.positionListForOpinionMaker(organizationWeVoteId, false, true);
// New call for all positions
Expand Down
14 changes: 7 additions & 7 deletions src/js/components/Widgets/FriendsOnlyIndicator.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@ const groupIcon = '../../../img/global/svg-icons/group-icon.svg';
const publicIcon = '../../../img/global/svg-icons/public-icon.svg';


export default function FriendsOnlyIndicator({ isFriendsOnly }){
export default function FriendsOnlyIndicator ({ isFriendsOnlyIncoming }) {
renderLog('FriendsOnlyIndicator'); // Set LOG_RENDER_EVENTS to log all renders


let isFriendsOnly = isFriendsOnlyIncoming;
let labelText = '';
let visibilityIcon = '';

if (isFriendsOnly === undefined) {
if (isFriendsOnlyIncoming === undefined) {
isFriendsOnly = true;
}

Expand Down Expand Up @@ -71,16 +72,15 @@ export default function FriendsOnlyIndicator({ isFriendsOnly }){
<PublicFriendsIndicator>{visibilityIcon}</PublicFriendsIndicator>
</FriendsOnlyOverlayTrigger>
);

};
}

FriendsOnlyIndicator.propTypes = {
isFriendsOnly: PropTypes.bool,
isFriendsOnlyIncoming: PropTypes.bool,
};

const PublicFriendsIndicator = styled('span')`
color: #999;
display: inline-block;
margin-top: -5px;
height: 18px;
`;
`;
Loading

0 comments on commit e38347d

Please sign in to comment.