Skip to content

Commit

Permalink
fix checkAll on ReviewTable (#90)
Browse files Browse the repository at this point in the history
* fix checkAll on ReviewTable

* fix checkAll on CloseSUTable

* bump version

* fix package

* fix snapshots

* fix modalPreferences

* test: correct failing test

* review changes

* use NCO and some function

* fix tests

* bump version

---------

Co-authored-by: Grafikart <[email protected]>
Co-authored-by: Simon Demazière <[email protected]>
  • Loading branch information
3 people authored Jan 4, 2024
1 parent 6a1da77 commit ae314b3
Show file tree
Hide file tree
Showing 10 changed files with 4,509 additions and 4,296 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "sonor",
"version": "0.5.23",
"version": "0.5.24",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
Expand Down
63 changes: 31 additions & 32 deletions src/components/Close/CloseSUTable.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import SearchField from '../SearchField/SearchField';
import PaginationNav from '../PaginationNav/PaginationNav';
import CloseSurveyUnitLine from './CloseSurveyUnitLine';
import D from '../../i18n';
import Utils from '../../utils/Utils';

function makeTableForExport(data) {
const header = [[
Expand Down Expand Up @@ -40,7 +41,7 @@ class CloseSUTable extends React.Component {
this.state = {
pagination: { size: 10, page: 1 },
displayedLines: props.data,
checkboxArray: props.data.reduce((acc, curr) => { acc[curr.id] = false; return acc; }, {}),
checkboxArray: props.data?.map((element) => {return {id: element.id, isChecked: false}}) ?? [],
checkAll: false,
show: false,
stateModified: '',
Expand All @@ -51,37 +52,35 @@ class CloseSUTable extends React.Component {
const { data } = this.props;
if (prevProps.data !== data) {
this.setState({ displayedLines: data });
const newCheckboxArray = Array.isArray(data)
? data.reduce(
(acc, curr) => { acc[curr.id] = false; return acc; }, {},
)
: [];
const newCheckboxArray = data?.map((element) => {return {id: element.id, isChecked: false}}) ?? []
this.setState({ checkboxArray: newCheckboxArray, checkAll: false });
}
}

handlePageChange(pagination) {
this.setState({ pagination });
const checkAll = Utils.getCheckAllValue(this.state.checkboxArray, pagination);
this.setState({ pagination, checkAll });
}

handleCheckAll(e) {
const { checkboxArray } = this.state;
const newCheckboxArray = Object.keys(checkboxArray).reduce(
(acc, curr) => { acc[curr] = e.target.checked; return acc; }, {},
);
const { checkboxArray, displayedLines, pagination} = this.state;

const newCheckboxArray = Utils.handleCheckAll(e.target.checked, checkboxArray, displayedLines, pagination);

this.setState({
checkboxArray: newCheckboxArray,
checkAll: e.target.checked,
});
}

toggleCheckBox(i) {
const { checkboxArray } = this.state;
const newCheckboxArray = { ...checkboxArray };
newCheckboxArray[i] = !newCheckboxArray[i];
toggleCheckBox(id) {
const { checkboxArray, displayedLines, pagination } = this.state;

const {newCheckboxArray, newCheckAll} = Utils.getOnToggleChanges(id, checkboxArray, displayedLines, pagination);

this.setState({
checkboxArray: newCheckboxArray,
checkAll: !Object.values(newCheckboxArray).some((elm) => !elm),
checkAll: newCheckAll,
});
}

Expand All @@ -95,15 +94,15 @@ class CloseSUTable extends React.Component {

isDisabled() {
const { checkboxArray } = this.state;
return !Object.values(checkboxArray).some((elm) => elm);
return !checkboxArray.some((element) => element.isChecked );
}

validate() {
const { validateChangingState } = this.props;
const { checkboxArray, stateModified } = this.state;
const lstSUChangingState = Object.entries(checkboxArray)
.filter((su) => (su[1]))
.map((su) => (su[0]));
const lstSUChangingState = checkboxArray
.filter((su) => (su.isChecked))
.map((su) => (su.id));
validateChangingState(lstSUChangingState, stateModified);
}

Expand All @@ -124,9 +123,7 @@ class CloseSUTable extends React.Component {

updateLines(matchingLines) {
const { pagination, checkboxArray } = this.state;
const newCheckboxArray = Object.keys(checkboxArray).reduce(
(acc, curr) => { acc[curr] = false; return acc; }, {},
);
const newCheckboxArray = checkboxArray.map((element) => {return {id :element.id, isChecked: false}})
this.setState({
checkboxArray: newCheckboxArray,
checkAll: false,
Expand All @@ -144,7 +141,7 @@ class CloseSUTable extends React.Component {
pagination, displayedLines, checkboxArray, checkAll, show, stateModified,
} = this.state;
const toggleCheckBox = (i) => { this.toggleCheckBox(i); };
function handleSortFunct(property) { return () => { handleSort(property); }; }
function handleSortFunct(property) { return () => { handleSort(property); }; }
return (
<Card className="ViewCard">
<Card.Title className="PageTitle">
Expand Down Expand Up @@ -244,14 +241,16 @@ class CloseSUTable extends React.Component {
(pagination.page - 1) * pagination.size,
Math.min(pagination.page * pagination.size, displayedLines.length),
)
.map((line) => (
<CloseSurveyUnitLine
key={line.id}
lineData={line}
isChecked={checkboxArray[line.id]}
updateFunc={() => toggleCheckBox(line.id)}
/>
))}
.map((line) => {
const element = checkboxArray.find((checkbox) => checkbox.id === line.id)
return (
<CloseSurveyUnitLine
key={line.id}
lineData={line}
isChecked={ element?.isChecked ?? false}
updateFunc={() => toggleCheckBox(line.id)}
/>
)})}
</tbody>
</Table>
<div className="tableOptionsWrapper">
Expand Down
2 changes: 1 addition & 1 deletion src/components/Close/CloseSurveyUnitLine.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ function CloseSurveyUnitLine({ lineData, isChecked, updateFunc }) {
</td>
<td className="ColCampaign">{campaign}</td>
<td className="ColId">{id}</td>
<td className="ColInterviewer">{`${interviewer.interviewerLastName} ${interviewer.interviewerFirstName}`}</td>
<td className="ColInterviewer">{`${interviewer?.interviewerLastName ?? ""} ${interviewer?.interviewerFirstName ?? ""}`}</td>
<td className="ColSsech">{ssech}</td>
<td className="ColIdentificationState">{identificationState ? D[identificationState] : ''}</td>
<td className="ColLocation">{contactOutcome ? D[contactOutcome] : ''}</td>
Expand Down
6 changes: 3 additions & 3 deletions src/components/MainScreen/MainScreen.test.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ const TestingRouter = ({ ComponentWithRedirection }) => (
<div>
<div data-testid="Redirect-url">{JSON.stringify(routeProps.history.location.pathname)}</div>
<div data-testid="Redirect-survey">{!routeProps.history.location || !routeProps.history.location.survey || JSON.stringify(routeProps.history.location.survey)}</div>
<div data-testid="Redirect-surveyInfos">{!routeProps.history.location || !routeProps.history.location.survey || JSON.stringify(routeProps.history.location.surveyInfos)}</div>
<div data-testid="Redirect-surveyInfos">{!routeProps.history.location || !routeProps.history.location.surveyInfos || JSON.stringify(routeProps.history.location.surveyInfos)}</div>
</div>
)}
/>
Expand Down Expand Up @@ -141,8 +141,8 @@ it('Go to portal', async () => {
expect(screen.getByTestId('Redirect-url').innerHTML).toEqual(`\"${redirectUrl}\"`);

// Location should contain survey object
expect(screen.getByTestId('Redirect-survey').innerHTML).not.toEqual('');
expect(screen.getByTestId('Redirect-survey')).toMatchSnapshot();
expect(screen.getByTestId('Redirect-surveyInfos').innerHTML).not.toEqual('');
expect(screen.getByTestId('Redirect-surveyInfos')).toMatchSnapshot();

// Location should contain surveyInfi object
expect(screen.getByTestId('Redirect-surveyInfos').innerHTML).not.toEqual('');
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5765,9 +5765,9 @@ exports[`Go to monitoring table by site 1`] = `

exports[`Go to portal 1`] = `
<div
data-testid="Redirect-survey"
data-testid="Redirect-surveyInfos"
>
{"id":"vqs2021x00","label":"Everyday life and health survey 2021","collectionStartDate":1577837800000,"endDate":1641514600000,"allSurveys":[{"id":"vqs202fgd1x00","label":"Everyday life and health survey 2018","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"vqs2021x00","label":"Everyday life and health survey 2021","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"vqs2qfsdfsqe021x00","label":"Everyday life and health survey 2026","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"simpsosfqns2020x00","label":"Survey on something 2020","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"simpsonqsdfsqes2020x00","label":"Survey on something else 2020","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"simpsons2020x00","label":"Survey on the Simpsons tv show 2020","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true}]}
{"survey":{"id":"vqs202fgd1x00","label":"Everyday life and health survey 2018","collectionStartDate":1577837800000,"endDate":1641514600000,"allSurveys":[{"id":"vqs202fgd1x00","label":"Everyday life and health survey 2018","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"vqs2021x00","label":"Everyday life and health survey 2021","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"vqs2qfsdfsqe021x00","label":"Everyday life and health survey 2026","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"simpsosfqns2020x00","label":"Survey on something 2020","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"simpsonqsdfsqes2020x00","label":"Survey on something else 2020","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true},{"id":"simpsons2020x00","label":"Survey on the Simpsons tv show 2020","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true}]},"surveyInfo":{"id":"vqs202fgd1x00","label":"Everyday life and health survey 2018","managementStartDate":1576801000000,"interviewerStartDate":1575937000000,"identificationPhaseStartDate":1577233000000,"collectionStartDate":1577837800000,"collectionEndDate":1640996200000,"endDate":1641514600000,"allocated":4,"toProcessInterviewer":0,"toAffect":0,"toFollowUp":0,"toReview":0,"finalized":0,"preference":true}}
</div>
`;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ Object {
>
<div
class="modal-dialog"
role="document"
>
<div
class="modal-content"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ Object {
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.54); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
tabindex="-1"
value=""
/>
Expand Down Expand Up @@ -256,7 +256,7 @@ Object {
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.54); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
tabindex="-1"
value=""
/>
Expand Down Expand Up @@ -497,7 +497,7 @@ Object {
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.54); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
tabindex="-1"
value=""
/>
Expand Down Expand Up @@ -861,7 +861,7 @@ Object {
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.54); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; border-style: inset inset inset inset; border-width: 0px 0px 0px 0px; line-height: normal; padding: 0px 0px 0px 0px;"
tabindex="-1"
value=""
/>
Expand Down
Loading

0 comments on commit ae314b3

Please sign in to comment.