Merge branch 'main' into dependabot/npm_and_yarn/axios-0.21.2

Author: bruceplai

cypress/integration/pages/organizations.spec.js

@@ -251,12 +251,15 @@ describe('Contributors Page (using fixture)', () => {
 
   // TODO: click open Code for America. need to adjust 25 number to 7 (?)
   it('should show index contributor indicators', () => {
+    cy.intercept(`${Cypress.env('REACT_APP_API_URL')}/api/organizations/`, {
+      fixture: 'orgs.json',
+    }).as('getOrganizations');
     cy.visit('/organizations/affiliated');
+    cy.wait('@getOrganizations');
     cy.get('[data-cy=index-contributors-checkbox] input:checkbox').check();
     cy.get('[class*=makeStyles-gpGrid]').within(() => {
       cy.get('[class*=contributorIcon]').should('exist');
     });
-    cy.get('[class*=makeStyles-gpGrid]').click();
     // cy.get('[data-cy=contributor-icon]').should('have.length', 25);
     cy.get('[class*=makeStyles-dropDownGrid]').within(() => {
       cy.contains('Code for America').parent().parent().parent().within(() => {

src/App.js

@@ -7,14 +7,14 @@ import About from './pages/About';
 import Contact from './pages/Contact';
 import Collaborate from './pages/Collaborate';
 import Contributors from './pages/Contributors';
-import Donation from './pages/Donation';
+import Donate from './pages/Donate';
 import Faq from './pages/Faq';
 import IndvOrgPage from './pages/IndvOrganization';
 import Home from './pages/Home';
-import HowToUse from './pages/HowToUse';
+import HowToAdd from './pages/HowToAdd';
 import Landing from './pages/Landing';
 import SearchProjects from './pages/SearchProjects';
-import TagCreator from './pages/TagCreator';
+import TagGenerator from './pages/TagGenerator';
 import Error404 from './pages/Error404';
 import ShareTheCti from './pages/Share';
 import Guides from './guides/';
@@ -48,10 +48,10 @@ const App = () => {
             <RouteTitled exact path='/organizations/contributors' component={Contributors} title='Index Contributors' />
             <RouteTitled exact path='/home' component={Home} title='Home' />
             <RouteTitled exact path='/projects' component={SearchProjects} title='Search Projects' />
-            <RouteTitled exact path='/join-index' component={TagCreator} title='Join the Index' />
-            <RouteTitled exact path='/join-index/how-to-add' component={HowToUse} title='How to Add Your Project' />
+            <RouteTitled exact path='/join-index' component={TagGenerator} title='Join the Index' />
+            <RouteTitled exact path='/join-index/how-to-add' component={HowToAdd} title='How to Add Your Project' />
             <RouteTitled exact path='/support/collaborate' component={Collaborate} title='Collaborate with Us' />
-            <RouteTitled exact path='/support/donate' component={Donation} title='Donate' />
+            <RouteTitled exact path='/support/donate' component={Donate} title='Donate' />
             <RouteTitled exact path='/support/share' component={ShareTheCti} title='Share the CTI' />
             <Route exact path='/organization/:name' component={IndvOrgPage} />
             {/* test and error page routes begin */}

src/guides/topic-tags.js

@@ -4,7 +4,7 @@ import CardContent from '@material-ui/core/CardContent';
 import Container from '@material-ui/core/Container';
 import Typography from '@material-ui/core/Typography';
 
-import { GeneratedTopicTag,CopyPasteTopicTag,ClickableTopicTag }  from '../pages/TagCreator/TopicTag'
+import { GeneratedTopicTag,CopyPasteTopicTag,ClickableTopicTag }  from '../pages/TagGenerator/TopicTag'
 
 const ShowTopicTags = () => {
   return (

src/pages/Donation/index.js src/pages/Donate/index.jssrc/pages/Donation/index.js renamed to src/pages/Donate/index.js

@@ -6,9 +6,9 @@ import Typography from '@material-ui/core/Typography';
 import BottomCallToAction from '../../components/BottomCallToAction';
 import Link from '../../components/common/Link';
 import useStyles from './styles.js';
-import { GenericHeaderSection } from '../../components/';
+import { GenericHeaderSection } from '../../components';
 
-const Donation = () => {
+const Donate = () => {
   const classes = useStyles();
   const breadCrumbLinks = [
     { href: '/home', name: 'Home' },
@@ -70,4 +70,4 @@ const Donation = () => {
   );
 };
 
-export default Donation;
+export default Donate;

src/pages/Donation/styles.js src/pages/Donate/styles.jssrc/pages/Donation/styles.js renamed to src/pages/Donate/styles.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import Box from '@material-ui/core/Box';
 import Container from '@material-ui/core/Container';
-import Link from '@material-ui/core/Link';
+import { Link } from 'react-router-dom';
 import Typography from '@material-ui/core/Typography';
 import { makeStyles } from '@material-ui/core/styles';
 import GenericHeaderSection from '../../components/GenericHeaderSection';
@@ -23,6 +23,13 @@ const useStyles = makeStyles((theme) => ({
     margin: '1em auto',
     textAlign: 'justify',
     width: '66%',
+    '& a:link': {
+      color: theme.palette.text.secondary,
+      fontWeight:'400',
+    },
+    '& a:visited': {
+      color: theme.palette.text.secondary,
+    },
     [theme.breakpoints.down('md')]: {
       fontSize: '20px',
       margin: '0px auto 1em',
@@ -33,7 +40,6 @@ const useStyles = makeStyles((theme) => ({
     },
   },
   typoStyle: {
-    fontWeight: '400',
     textAlign: 'justify',
     '& a:visited': {
       color: theme.palette.secondary.main,
@@ -47,7 +53,7 @@ const useStyles = makeStyles((theme) => ({
   },
 }));
 
-const HowToUse = () => {
+const HowToAdd = () => {
   const clipboard = useClipboard();
   const classes = useStyles();
   const breadCrumbLinks = [
@@ -70,7 +76,8 @@ const HowToUse = () => {
             By adding the <b>&apos;civictechindex&apos; </b>
             topic tag to your project, we can create a continuously updated
             repository for all civic tech enthusiasts to find open source
-            projects to model, connect with, and learn from.
+            projects to model, connect with, and learn from. Need an overview of
+            what the CTI is? See our <Link to='/about'>About</Link> page.
           </Typography>
         </Container>
       </Box>
@@ -80,7 +87,7 @@ const HowToUse = () => {
             <Box>
               <Typography variant='body1' className={classes.typoStyle}>
                 1. Under your project’s repository, click <SettingsGearIcon />{' '}
-                to paste your tags.
+                to add topic tags.
               </Typography>
             </Box>
             <Box className={classes.boxPadding}>
@@ -112,6 +119,15 @@ const HowToUse = () => {
                 , paste the topic you want to add to your repository.{' '}
               </Typography>
             </Box>
+            <Box className={classes.boxPadding}>
+              <Typography variant='body1' className={classes.typoStyle}>
+                We recommend adding topic tags for your affiliated
+                organizations, e.g., Code-for-All, Code-for-Japan,
+                code-for-Tokyo topic tags that communicate what your project is
+                about, e.g., food-pantry, climate, etc. and don’t forget to use
+                the topic tag: civictechindex.
+              </Typography>
+            </Box>
             <ImageComponent src='/images/instructions-step2.png' alt='Step 2' />
             <Box>
               <Typography variant='body1' className={classes.typoStyle}>
@@ -129,4 +145,4 @@ const HowToUse = () => {
   );
 };
 
-export default HowToUse;
+export default HowToAdd;