Skip to content

Commit 173b425

Browse files
bruceplaibruceplai
authored
Merge pull request #1071 from civictechindex/org-hierarchy-1039
Open grandparent org if filter and org count conditions are met (#1039)
2 parents 09bf2b5 + 15f060d commit 173b425

File tree

5 files changed

+74
-65
lines changed

5 files changed

+74
-65
lines changed

‎cypress/integration/pages/organizations.spec.js‎

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,18 @@ describe('Contributors Page (using API)', () => {
33
const parentOrg = 'Code for America';
44
const affiliatedOrg = 'Code for ABQ';
55
const affiliatedOrgPartial = 'ABQ';
6-
const parentOrgCount = 24;
6+
const parentOrgCount1 = 24;
7+
const parentOrgCount2 = 1;
78

8-
it(`should load grandparentOrg, ${parentOrgCount} children, parentOrg, affiliatedOrg`, () => {
9+
it(`should load grandparentOrg, parentOrg, affiliatedOrg`, () => {
910
cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`).as('getOrganizations');
1011
cy.visit('/organizations/all');
1112
cy.wait('@getOrganizations');
1213
cy.get('[data-cy=index-contributors-checkbox] input:checkbox').uncheck();
1314
cy.contains(grandparentOrg).should('have.length', 1);
14-
// cy.get('[href*=codeforall]').should('have.length', 1);
1515
cy.get('[data-cy=code-for-all-chevron]').click();
1616
cy.get('[data-cy=affiliated-organizations]').within(() => {
17-
cy.get('[data-cy=thumbnail-dropdown]').should('have.length', parentOrgCount);
17+
cy.get('[data-cy=thumbnail-dropdown]').should('have.length', parentOrgCount1);
1818
cy.get('[data-cy=thumbnail-dropdown]')
1919
.contains(parentOrg)
2020
.parentsUntil('[data-cy=thumbnail-dropdown]')
@@ -27,36 +27,33 @@ describe('Contributors Page (using API)', () => {
2727

2828
it('should find affiliatedOrg via search', () => {
2929
cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`).as('getOrganizations');
30-
cy.visit('/organizations/all');
30+
cy.visit('/organizations/affiliated');
3131
cy.wait('@getOrganizations');
32-
cy.get('[data-cy=organization-search]').type(affiliatedOrg);
33-
cy.get('[class*=makeStyles-gpGrid]').click();
32+
cy.get('[data-cy=organization-search]').type(affiliatedOrg).type('{enter}');
3433
cy.get('[data-cy=affiliated-organizations]').within(() => {
3534
cy.get('[data-cy=thumbnail-dropdown]').should('have.length', 1);
3635
cy.get('[data-cy=contributor-thumbnail-text]').contains(affiliatedOrg);
3736
});
38-
cy.get('[class*=endAdornment]').click().within(() => {
39-
cy.get('button').click();
40-
});
4137
cy.get('[data-cy=affiliated-organizations]').within(() => {
42-
cy.get('[data-cy=thumbnail-dropdown]').should('have.length', parentOrgCount);
38+
cy.get('[data-cy=thumbnail-dropdown]').should('have.length', parentOrgCount2);
4339
});
40+
cy.get('[data-cy=organization-search]').clear();
4441
});
4542

4643
it('should find affiliatedOrg via partial search', () => {
4744
cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`).as(
4845
'getOrganizations'
4946
);
50-
cy.visit('/organizations/all');
47+
cy.visit('/organizations/affiliated');
5148
cy.wait('@getOrganizations');
5249
cy.get('[data-cy=organization-search]').type(affiliatedOrgPartial);
5350
cy.get('[data-cy=organization-search-list]').should('have.length', 1);
5451
cy.get('[data-cy=organization-search-list]').click();
55-
cy.get('[class*=makeStyles-gpGrid]').click();
5652
cy.get('[data-cy=affiliated-organizations]').within(() => {
5753
cy.get('[data-cy=thumbnail-dropdown]').should('have.length', 1);
5854
cy.get('[data-cy=contributor-thumbnail-text]').contains(affiliatedOrg);
5955
});
56+
cy.get('[data-cy=organization-search]').clear();
6057
});
6158

6259
it('should visit organizations page from home page link', () => {
@@ -78,8 +75,9 @@ describe('Contributors Page (using fixture)', () => {
7875
before(() => {
7976
cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`, {
8077
fixture: 'orgs.json',
81-
});
78+
}).as('getOrganizations');
8279
cy.visit('/organizations/all');
80+
cy.wait('@getOrganizations');
8381
});
8482

8583
it('should load 24 affiliated orgs', () => {
@@ -107,7 +105,11 @@ describe('Contributors Page (using fixture)', () => {
107105
});
108106

109107
it('should navigate to unaffiliated and show unaffiliated orgs tab selected', () => {
108+
cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`, {
109+
fixture: 'orgs.json',
110+
}).as('getOrganizations');
110111
cy.visit('/organizations/unaffiliated');
112+
cy.wait('@getOrganizations');
111113
cy.get('[class*=MuiTabs-flexContainer]').within(() => {
112114
cy.get('button')
113115
.eq(0)
@@ -125,7 +127,11 @@ describe('Contributors Page (using fixture)', () => {
125127
});
126128

127129
it('should navigate to affiliated and show affiliated orgs tab selected', () => {
130+
cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`, {
131+
fixture: 'orgs.json',
132+
}).as('getOrganizations');
128133
cy.visit('/organizations/affiliated');
134+
cy.wait('@getOrganizations');
129135
cy.get('[class*=MuiTabs-flexContainer]').within(() => {
130136
cy.get('button')
131137
.eq(0)
@@ -209,7 +215,7 @@ describe('Contributors Page (using fixture)', () => {
209215
});
210216
cy.get('[class*=affiliatedThumbnailsWrapper]')
211217
.find('[class*=afflnThumbnails]')
212-
.should('have.length', 8);
218+
.should('have.length', 6);
213219
});
214220
});
215221

@@ -221,7 +227,7 @@ describe('Contributors Page (using fixture)', () => {
221227
});
222228
cy.get('[class*=affiliatedThumbnailsWrapper]')
223229
.find('[class*=afflnThumbnails]')
224-
.should('have.length.greaterThan', 8);
230+
.should('have.length.greaterThan', 6);
225231
});
226232
});
227233

‎package-lock.json‎

Lines changed: 34 additions & 27 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@
6060
"@testing-library/react": "^12.0.0",
6161
"babel-plugin-istanbul": "^6.0.0",
6262
"babel-plugin-transform-class-properties": "^6.24.1",
63-
"cypress": "^8.3.0",
63+
"cypress": "^8.7.0",
6464
"eslint": "^6.8.0",
6565
"eslint-plugin-cypress": "^2.11.3",
6666
"eslint-plugin-react": "^7.23.2",

‎src/pages/Contributors/Affiliated.js‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/* eslint-disable max-lines-per-function */
2-
import React, { useState } from 'react';
2+
import React, { useEffect, useState } from 'react';
33
import Typography from '@material-ui/core/Typography';
44
import { DropdownArrow } from '../../components/DropdownArrow.js';
55
import Grid from '@material-ui/core/Grid';
@@ -125,6 +125,13 @@ export const Affiliated = (props) => {
125125
} = props;
126126
const classesLocal = useStyles();
127127
const [dropdownOpen, setDropdownOpen] = useState(false);
128+
useEffect(() => {
129+
if (filtersActive && organizations.length) {
130+
setDropdownOpen(true);
131+
} else {
132+
setDropdownOpen(false);
133+
}
134+
}, [filtersActive, organizations])
128135
return (
129136
<Grid>
130137
<Grid style={{ padding: '40px' }}>

‎src/pages/Contributors/AffiliatedOrganizations.js‎

Lines changed: 9 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -123,22 +123,16 @@ export const AffiliatedOrganizations = ({
123123
return parentdata;
124124
};
125125

126-
const [currentThumbnails, setCurrentThumbnails] = useState(getParentData);
126+
const [currentThumbnails, setCurrentThumbnails] = useState([]);
127127

128128
useEffect(() => {
129-
setCurrentThumbnails(getParentData);
130-
// eslint-disable-next-line react-hooks/exhaustive-deps
131-
}, [
132-
inputValue,
133-
organizations,
134-
organizationData,
135-
showIndexContrib,
136-
filtersActive,
137-
]);
129+
setCurrentThumbnails(getParentData());
130+
// eslint-disable-next-line react-hooks/exhaustive-deps
131+
}, [organizations]);
138132

139133
let childSort;
140134
let childNode;
141-
if (currentThumbnails && inputValue.length === 0) {
135+
if (!filtersActive) {
142136
return (
143137
<Grid
144138
className={classes.thumbnailGrid}
@@ -147,7 +141,7 @@ export const AffiliatedOrganizations = ({
147141
>
148142
{currentThumbnails.map((org, i) => {
149143
childSort = org.childNodes;
150-
childNode = org.isOpen ? childSort : childSort.slice(0, 8);
144+
childNode = org.isOpen ? childSort : childSort.slice(0, 6);
151145
return (
152146
<Dropdown
153147
checkboxValue={showIndexContrib}
@@ -200,7 +194,7 @@ export const AffiliatedOrganizations = ({
200194
filtersActive={filtersActive}
201195
/>
202196
)}
203-
{org.childNodes.length > 8 ? (
197+
{org.childNodes.length > 6 ? (
204198
<Grid
205199
item
206200
container
@@ -227,12 +221,7 @@ export const AffiliatedOrganizations = ({
227221
})}
228222
</Grid>
229223
);
230-
} else if (
231-
currentThumbnails &&
232-
inputValue !== null &&
233-
inputValue.length > 0 &&
234-
inputValue !== ''
235-
) {
224+
} else {
236225
return (
237226
<Grid
238227
className={classes.thumbnailGrid}
@@ -244,7 +233,7 @@ export const AffiliatedOrganizations = ({
244233
organization={org}
245234
key={`affiliatedThumbnailsWrapper_${i}`}
246235
dropdownLength={org.childNodes.length}
247-
isOpen={org.childNodes.length <= 5 ? true : false}
236+
isOpen={org.childNodes.length <= 6 && i === 0}
248237
inputValue={inputValue}
249238
checkboxValue={showIndexContrib}
250239
filtersActive={filtersActive}

0 commit comments

Comments
 (0)