Skip to content

Commit

Permalink
Merge pull request wevote#4066 from DaleMcGrew/Dale_WebApp_Sept28b-2024
Browse files Browse the repository at this point in the history
Adding support for ChallengeInviteTextDefault. Search bug fix. Made "Create Challenge" a button on Challenges page. Fixed Challenges header to be highlighted.
  • Loading branch information
DaleMcGrew authored Sep 28, 2024
2 parents e43e878 + a576c82 commit cbf155f
Show file tree
Hide file tree
Showing 15 changed files with 345 additions and 139 deletions.
17 changes: 17 additions & 0 deletions src/js/common/actions/ChallengeStartActions.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ export default {
challengeEditAllSave (
challengeWeVoteId,
challengeDescriptionQueuedToSave, challengeDescriptionQueuedToSaveSet,
challengeInviteTextDefaultQueuedToSave, challengeInviteTextDefaultQueuedToSaveSet,
challengePhotoQueuedToDelete, challengePhotoQueuedToDeleteSet,
challengePhotoQueuedToSave, challengePhotoQueuedToSaveSet,
challengePoliticianDeleteListJson,
Expand All @@ -32,6 +33,8 @@ export default {
{
challenge_description: challengeDescriptionQueuedToSave,
challenge_description_changed: challengeDescriptionQueuedToSaveSet,
challenge_invite_text_default: challengeInviteTextDefaultQueuedToSave,
challenge_invite_text_default_changed: challengeInviteTextDefaultQueuedToSaveSet,
challenge_photo_from_file_reader: challengePhotoQueuedToSave,
challenge_photo_changed: challengePhotoQueuedToSaveSet,
challenge_photo_delete: challengePhotoQueuedToDelete,
Expand All @@ -45,6 +48,20 @@ export default {
});
},

challengeInviteTextDefaultQueuedToSave (challengeInviteTextDefault) {
Dispatcher.dispatch({ type: 'challengeInviteTextDefaultQueuedToSave', payload: challengeInviteTextDefault });
},

challengeInviteTextDefaultSave (challengeWeVoteId, challengeInviteTextDefault) {
// console.log('challengeInviteTextDefaultSave: ', challengeInviteTextDefault);
Dispatcher.loadEndpoint('challengeStartSave',
{
challenge_invite_text_default: challengeInviteTextDefault,
challenge_invite_text_default_changed: true,
challenge_we_vote_id: challengeWeVoteId,
});
},

challengePhotoQueuedToDelete (deleteChallengePhoto = true) {
Dispatcher.dispatch({ type: 'challengePhotoQueuedToDelete', payload: deleteChallengePhoto });
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -70,8 +70,9 @@ const styles = () => ({
});

const ChallengeInviteeListRootContainer = styled.div`
max-width: 100vw;
margin: 0 auto;
max-width: 620px;
//margin: 0 auto;
width: 100%;
`;

const Heading = styled.div`
Expand Down
13 changes: 12 additions & 1 deletion src/js/common/components/ChallengeListRoot/ChallengeListRoot.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -242,7 +242,18 @@ class ChallengeListRoot extends Component {
challengeSearchResults,
filteredList,
timeStampOfChange: Date.now(),
});
}, () => { this.handleNumberOfResults(filteredList.length, challengeSearchResults.length); });
}

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);
}
}

leftAndRightArrowSetState = (el) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ class ChallengeDescriptionInputField extends Component {
<TextField
// classes={{ root: classes.textField }} // Not working yet
id={`challengeDescriptionTextArea-${externalUniqueId}`}
label="Challenge description"
name="challengeDescription"
margin="dense"
multiline
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,148 @@
import { FormControl, TextField } from '@mui/material';
import styled from 'styled-components';
import withStyles from '@mui/styles/withStyles';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import ChallengeStartActions from '../../actions/ChallengeStartActions';
import { renderLog } from '../../utils/logging';
import ChallengeStartStore from '../../stores/ChallengeStartStore';
import ChallengeStore from '../../stores/ChallengeStore';

class ChallengeInviteTextDefaultInputField extends Component {
constructor (props) {
super(props);
this.state = {
challengeInviteTextDefault: '',
};

this.handleKeyPress = this.handleKeyPress.bind(this);
this.updateChallengeInviteTextDefault = this.updateChallengeInviteTextDefault.bind(this);
}

componentDidMount () {
// console.log('ChallengeInviteTextDefaultInputField, componentDidMount');
this.challengeStartStoreListener = ChallengeStartStore.addListener(this.onChallengeStartStoreChange.bind(this));
this.challengeStoreListener = ChallengeStore.addListener(this.onChallengeStartStoreChange.bind(this));
this.onChallengeStartStoreChange();
}

componentDidUpdate (prevProps) {
// console.log('ChallengeInviteTextDefaultInputField componentDidUpdate');
const {
challengeWeVoteId: challengeWeVoteIdPrevious,
} = prevProps;
const {
challengeWeVoteId,
} = this.props;
if (challengeWeVoteId) {
if (challengeWeVoteId !== challengeWeVoteIdPrevious) {
this.onChallengeStartStoreChange();
}
}
}

componentWillUnmount () {
this.challengeStartStoreListener.remove();
this.challengeStoreListener.remove();
}

handleKeyPress () {
//
}

onChallengeStartStoreChange () {
const { challengeWeVoteId, editExistingChallenge } = this.props;
let challengeInviteTextDefault = '';
if (editExistingChallenge) {
const challenge = ChallengeStore.getChallengeByWeVoteId(challengeWeVoteId);
if (challenge && challenge.challenge_we_vote_id) {
challengeInviteTextDefault = challenge.challenge_invite_text_default;
}
} else {
challengeInviteTextDefault = ChallengeStartStore.getChallengeInviteTextDefault();
}
const challengeInviteTextDefaultQueuedToSave = ChallengeStartStore.getChallengeInviteTextDefaultQueuedToSave();
const challengeInviteTextDefaultQueuedToSaveSet = ChallengeStartStore.getChallengeInviteTextDefaultQueuedToSaveSet();
let challengeInviteTextDefaultAdjusted = challengeInviteTextDefault;
if (challengeInviteTextDefaultQueuedToSaveSet) {
challengeInviteTextDefaultAdjusted = challengeInviteTextDefaultQueuedToSave;
}
// console.log('onChallengeStartStoreChange challengeInviteTextDefault: ', challengeInviteTextDefault, ', challengeInviteTextDefaultQueuedToSave: ', challengeInviteTextDefaultQueuedToSave, ', challengeInviteTextDefaultAdjusted:', challengeInviteTextDefaultAdjusted);
this.setState({
challengeInviteTextDefault: challengeInviteTextDefaultAdjusted,
});
}

updateChallengeInviteTextDefault (event) {
if (event.target.name === 'challengeInviteTextDefault') {
ChallengeStartActions.challengeInviteTextDefaultQueuedToSave(event.target.value);
this.setState({
challengeInviteTextDefault: event.target.value,
});
}
}

render () {
renderLog('ChallengeInviteTextDefaultInputField'); // Set LOG_RENDER_EVENTS to log all renders

const { classes, externalUniqueId } = this.props;
const { challengeInviteTextDefault } = this.state;

return (
<div className="">
<form onSubmit={(e) => { e.preventDefault(); }}>
<Wrapper>
<ColumnFullWidth>
<FormControl classes={{ root: classes.formControl }}>
<TextField
// classes={{ root: classes.textField }} // Not working yet
id={`challengeInviteTextDefaultTextArea-${externalUniqueId}`}
label="Text participants will send to friends"
name="challengeInviteTextDefault"
margin="dense"
multiline
rows={8}
variant="outlined"
placeholder="Text participants will send to friends"
value={challengeInviteTextDefault}
onKeyDown={this.handleKeyPress}
onChange={this.updateChallengeInviteTextDefault}
/>
</FormControl>
</ColumnFullWidth>
</Wrapper>
</form>
</div>
);
}
}
ChallengeInviteTextDefaultInputField.propTypes = {
challengeWeVoteId: PropTypes.string,
classes: PropTypes.object,
editExistingChallenge: PropTypes.bool,
externalUniqueId: PropTypes.string,
};

const styles = () => ({
formControl: {
width: '100%',
},
// TODO: Figure out how to apply to TextField
textField: {
fontSize: '22px',
},
});

const ColumnFullWidth = styled('div')`
padding: 8px 12px;
width: 100%;
`;

const Wrapper = styled('div')`
display: flex;
justify-content: space-between;
margin-left: -12px;
width: calc(100% + 24px);
`;

export default withStyles(styles)(ChallengeInviteTextDefaultInputField);
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,7 @@ class ChallengeTitleInputField extends Component {
<TextField
// classes={{ root: classes.textField }} // Not working yet
id={`challengeTitleTextArea-${externalUniqueId}`}
label={challengeTitlePlaceholder || 'Challenge name'}
name="challengeTitle"
margin="dense"
variant="outlined"
Expand Down
3 changes: 2 additions & 1 deletion src/js/common/components/Navigation/ChallengeInviteSteps.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
import { withStyles } from '@mui/styles';
import styled from 'styled-components';
import commonMuiStyles from '../Style/commonMuiStyles';
import DesignTokenColors from '../Style/DesignTokenColors';

// Import icons
import RocketIcon from '../../../../img/global/svg-icons/issues/rocket-ship.svg';
Expand Down Expand Up @@ -201,7 +202,7 @@ ChallengeInviteSteps.propTypes = {

const ChallengeInviteStepsContainer = styled('div')`
align-items: center;
background-color: #f2f2f0;
background-color: ${DesignTokenColors.neutralUI50};
display: flex;
flex-direction: column;
max-width: 620px;
Expand Down
2 changes: 2 additions & 0 deletions src/js/common/components/Style/commonMuiStyles.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import muiTheme from './muiTheme';
const theme = muiTheme;
const commonMuiStyles = {
buttonDefault: {
borderRadius: 25,
boxShadow: 'none !important',
fontSize: '18px',
height: '45px !important',
Expand All @@ -19,6 +20,7 @@ const commonMuiStyles = {
width: '100%',
},
buttonDesktop: {
borderRadius: 25,
boxShadow: 'none !important',
fontSize: '18px',
height: '45px !important',
Expand Down
Loading

0 comments on commit cbf155f

Please sign in to comment.