From 097c13e629e01f3be45baecfefc6ca159407e0eb Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 20:14:40 -0500
Subject: [PATCH 01/36] feat: fetch logo url from api

---
 src/components/IconLogo.js | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index f0280e1b9..03d14d874 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,12 +1,24 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
+import { AppContext } from '../context/AppContext';
+import { React, useContext } from 'react';
 
 /*
  * Just a logo icon
  */
-import React from 'react';
 
 export default function IconLogo() {
+  const appContext = useContext(AppContext);
+  const { user } = appContext;
+
+  if (user) {
+    const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+    const orgID = user.policy.organization.id;
+    fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+      .then((response) => response.json())
+      .then((data) => console.log(data.stakeholders[0].logo_url));
+  }
+
   return (
     <Link to="/">
       <img

From 3ed7be0f62fbfe544c6df2d0669166e795b7e8f9 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 20:27:25 -0500
Subject: [PATCH 02/36] feat: implement logoURL state

---
 src/components/IconLogo.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 03d14d874..f3557319e 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,7 +1,7 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
 import { AppContext } from '../context/AppContext';
-import { React, useContext } from 'react';
+import { React, useContext, useState } from 'react';
 
 /*
  * Just a logo icon
@@ -10,6 +10,7 @@ import { React, useContext } from 'react';
 export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { user } = appContext;
+  const [logoURL, setLogoURL] = useState();
 
   if (user) {
     const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;

From d8e5bda3cc6d42ead3b34f07f4790c090ed4bf7e Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 20:33:28 -0500
Subject: [PATCH 03/36] feat: import and implement useEffect to fetch logo url

---
 src/components/IconLogo.js | 23 ++++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index f3557319e..a6920bf03 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,7 +1,7 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
 import { AppContext } from '../context/AppContext';
-import { React, useContext, useState } from 'react';
+import { React, useContext, useState, useEffect } from 'react';
 
 /*
  * Just a logo icon
@@ -10,15 +10,20 @@ import { React, useContext, useState } from 'react';
 export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { user } = appContext;
-  const [logoURL, setLogoURL] = useState();
+  const [logoURL, setLogoURL] = useState('');
 
-  if (user) {
-    const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
-    const orgID = user.policy.organization.id;
-    fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
-      .then((response) => response.json())
-      .then((data) => console.log(data.stakeholders[0].logo_url));
-  }
+  useEffect(() => {
+    if (user) {
+      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+      const orgID = user.policy.organization.id;
+      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+        .then((response) => response.json())
+        .then((data) => {
+          const orgLogo = data.stakeholders[0].logo_url;
+          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
+        });
+    } else setLogoURL(logo);
+  }, [user]);
 
   return (
     <Link to="/">

From 6866356c85ac953d21cecd83d45327b86722471d Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 21:09:06 -0500
Subject: [PATCH 04/36] feat: change logo alt to logo

---
 src/components/IconLogo.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index a6920bf03..76feb1720 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -33,8 +33,8 @@ export default function IconLogo() {
           maxHeight: 32,
           marginBottom: '-6px',
         }}
-        src={logo}
-        alt="Greenstand logo"
+        src={logoURL}
+        alt="logo"
       />
     </Link>
   );

From 8f4b35fd716168ca02e1e38e82a619ec03eefb19 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 17:41:14 -0500
Subject: [PATCH 05/36] feat: use ternary operator to change the logo alt
 attribute

---
 src/components/IconLogo.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 76feb1720..7e3ec45ce 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -10,7 +10,7 @@ import { React, useContext, useState, useEffect } from 'react';
 export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { user } = appContext;
-  const [logoURL, setLogoURL] = useState('');
+  const [logoURL, setLogoURL] = useState(logo);
 
   useEffect(() => {
     if (user) {
@@ -34,7 +34,7 @@ export default function IconLogo() {
           marginBottom: '-6px',
         }}
         src={logoURL}
-        alt="logo"
+        alt={logoURL === logo ? 'greenstand logo' : 'organization logo'}
       />
     </Link>
   );

From 707002296f988212d83f2c67d1555b9957976f4e Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 19:31:50 -0500
Subject: [PATCH 06/36] feat: make useEffect only run if user is logged in and
 has an organization

---
 src/components/IconLogo.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 7e3ec45ce..4315e15ce 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -13,7 +13,7 @@ export default function IconLogo() {
   const [logoURL, setLogoURL] = useState(logo);
 
   useEffect(() => {
-    if (user) {
+    if (user && user.policy.organization) {
       const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
       const orgID = user.policy.organization.id;
       fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)

From 892f8dfb9e7a1c75a961cbc7a88e9d8753c0ac74 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 19:43:27 -0500
Subject: [PATCH 07/36] feat: test that the greenstand logo shows when the user
 does not belong to an organization

---
 cypress/integration/IconLogo.spec.py.js | 26 +++++++++++++++++++++++++
 1 file changed, 26 insertions(+)
 create mode 100644 cypress/integration/IconLogo.spec.py.js

diff --git a/cypress/integration/IconLogo.spec.py.js b/cypress/integration/IconLogo.spec.py.js
new file mode 100644
index 000000000..6e7da11ae
--- /dev/null
+++ b/cypress/integration/IconLogo.spec.py.js
@@ -0,0 +1,26 @@
+describe('Icon Logo', () => {
+  Cypress.on('uncaught:exception', (err, runnable) => {
+    // returning false here prevents Cypress from
+    // failing the tests due to uncaught errors
+    return false;
+  });
+
+  it('Displays the organization logo when the user belongs to an organization', () => {
+    cy.visit('http://localhost:3001/login');
+    cy.get('#userName').type('test1');
+    cy.get('#password').type('EoCAyCPpW0');
+    cy.contains(/log/i).click();
+    cy.contains(/earnings/i).click();
+    cy.wait(100);
+    cy.get('img').should('have.attr', 'alt', 'organization logo');
+  });
+  it('Displays the Greenstand logo when the user does not belongs to an organization', () => {
+    cy.visit('http://localhost:3001/login');
+    cy.get('#userName').type('admin');
+    cy.get('#password').type('8pzPdcZAG6&Q');
+    cy.contains(/log/i).click();
+    cy.contains(/earnings/i).click();
+    cy.wait(100);
+    cy.get('img').should('have.attr', 'alt', 'greenstand logo');
+  });
+});

From d8850ff52d6490759102fa1734b7c76b61416a1b Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 21:02:04 -0500
Subject: [PATCH 08/36] feat: move logo URL state and useEffect from IconLogo
 component AppContext

---
 src/components/IconLogo.js | 18 ++----------------
 src/context/AppContext.js  | 17 +++++++++++++++++
 2 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 4315e15ce..decca2799 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,7 +1,7 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
 import { AppContext } from '../context/AppContext';
-import { React, useContext, useState, useEffect } from 'react';
+import { React, useContext } from 'react';
 
 /*
  * Just a logo icon
@@ -9,21 +9,7 @@ import { React, useContext, useState, useEffect } from 'react';
 
 export default function IconLogo() {
   const appContext = useContext(AppContext);
-  const { user } = appContext;
-  const [logoURL, setLogoURL] = useState(logo);
-
-  useEffect(() => {
-    if (user && user.policy.organization) {
-      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
-      const orgID = user.policy.organization.id;
-      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
-        .then((response) => response.json())
-        .then((data) => {
-          const orgLogo = data.stakeholders[0].logo_url;
-          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
-        });
-    } else setLogoURL(logo);
-  }, [user]);
+  const { logoURL } = appContext;
 
   return (
     <Link to="/">
diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 82cd44d6c..2704af90e 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -32,6 +32,7 @@ import CompareIcon from '@material-ui/icons/Compare';
 import CreditCardIcon from '@material-ui/icons/CreditCard';
 import InboxRounded from '@material-ui/icons/InboxRounded';
 import MapIcon from '@material-ui/icons/Map';
+import logo from '../components/images/logo.svg';
 import AccountTreeIcon from '@material-ui/icons/AccountTree';
 import { session, hasPermission, POLICIES } from '../models/auth';
 import api from '../api/treeTrackerApi';
@@ -220,6 +221,7 @@ export const AppProvider = (props) => {
   const [userHasOrg, setUserHasOrg] = useState(false);
   const [orgList, setOrgList] = useState([]);
   const [orgId, setOrgId] = useState(undefined);
+  const [logoURL, setLogoURL] = useState(logo);
 
   // TODO: The below `selectedFilters` state would be better placed under a
   // separate FilterContext in the future iterations when the need to share
@@ -241,6 +243,20 @@ export const AppProvider = (props) => {
     }
   }, [orgList]);
 
+  // Gets organization logo url from the API
+  useEffect(() => {
+    if (user && user.policy.organization) {
+      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+      const orgID = user.policy.organization.id;
+      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+        .then((response) => response.json())
+        .then((data) => {
+          const orgLogo = data.stakeholders[0].logo_url;
+          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
+        });
+    } else setLogoURL(logo);
+  }, [user]);
+
   function checkSession() {
     const localToken = JSON.parse(localStorage.getItem('token'));
     const localUser = JSON.parse(localStorage.getItem('user'));
@@ -339,6 +355,7 @@ export const AppProvider = (props) => {
     routes,
     orgId,
     orgList,
+    logoURL,
     userHasOrg,
     selectedFilters,
     updateSelectedFilter,

From a2ceb570941e99308cccc8254e41472e27b6e8d1 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 00:30:33 -0500
Subject: [PATCH 09/36] feat: rename logoURL state to logoPath

---
 src/context/AppContext.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 2704af90e..7d62cc42a 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -221,7 +221,7 @@ export const AppProvider = (props) => {
   const [userHasOrg, setUserHasOrg] = useState(false);
   const [orgList, setOrgList] = useState([]);
   const [orgId, setOrgId] = useState(undefined);
-  const [logoURL, setLogoURL] = useState(logo);
+  const [logoPath, setlogoPath] = useState('');
 
   // TODO: The below `selectedFilters` state would be better placed under a
   // separate FilterContext in the future iterations when the need to share
@@ -252,10 +252,10 @@ export const AppProvider = (props) => {
         .then((response) => response.json())
         .then((data) => {
           const orgLogo = data.stakeholders[0].logo_url;
-          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
+          orgLogo ? setlogoPath(orgLogo) : setlogoPath(logo);
         });
-    } else setLogoURL(logo);
-  }, [user]);
+    } else setlogoPath(logo);
+  }, [user, login]);
 
   function checkSession() {
     const localToken = JSON.parse(localStorage.getItem('token'));
@@ -355,7 +355,7 @@ export const AppProvider = (props) => {
     routes,
     orgId,
     orgList,
-    logoURL,
+    logoPath,
     userHasOrg,
     selectedFilters,
     updateSelectedFilter,

From 5d233be898b60206f97028397915e35f56d69961 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 19:42:22 -0500
Subject: [PATCH 10/36] feat: implement isVisible function that hides logo if
 URL is not available

---
 src/components/IconLogo.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index decca2799..01e2a6b84 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -9,7 +9,13 @@ import { React, useContext } from 'react';
 
 export default function IconLogo() {
   const appContext = useContext(AppContext);
-  const { logoURL } = appContext;
+  const { logoPath } = appContext;
+
+  function isVisible() {
+    if (logoPath === '') {
+      return 'hidden';
+    } else return 'visible';
+  }
 
   return (
     <Link to="/">
@@ -18,9 +24,10 @@ export default function IconLogo() {
           maxWidth: 149,
           maxHeight: 32,
           marginBottom: '-6px',
+          visibility: isVisible(),
         }}
-        src={logoURL}
-        alt={logoURL === logo ? 'greenstand logo' : 'organization logo'}
+        src={logoPath}
+        alt={logoPath === logo ? 'greenstand logo' : 'organization logo'}
       />
     </Link>
   );

From 5743b23e1f9e61fa7e9b9d2010a2587a299ac555 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 19:57:03 -0500
Subject: [PATCH 11/36] feat: refactor isVisible function to hide greenstand
 logo if user with an organization is logged in

---
 src/components/IconLogo.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 01e2a6b84..07fab935d 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -9,10 +9,13 @@ import { React, useContext } from 'react';
 
 export default function IconLogo() {
   const appContext = useContext(AppContext);
-  const { logoPath } = appContext;
+  const { logoPath, user } = appContext;
 
   function isVisible() {
-    if (logoPath === '') {
+    if (!user) {
+      return 'visible';
+    }
+    if (logoPath === '' || (logoPath === logo && user.policy.organization)) {
       return 'hidden';
     } else return 'visible';
   }

From 5204b0c59114b51ef3b5b123576c988e107b8401 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 20:15:16 -0500
Subject: [PATCH 12/36] feat: add comments

---
 src/components/IconLogo.js | 23 +++++++++++++++++------
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 07fab935d..b706ecd55 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -11,6 +11,8 @@ export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { logoPath, user } = appContext;
 
+  // Hide logo if the logo URL hasn't been loaded or if the Greenstand logo is loaded
+  // and the user has an organization
   function isVisible() {
     if (!user) {
       return 'visible';
@@ -20,15 +22,24 @@ export default function IconLogo() {
     } else return 'visible';
   }
 
+  // Logo styling objects for both org and Greenstand logos to be applied to img
+  const greenstandLogoStyle = {
+    maxWidth: 149,
+    maxHeight: 32,
+    marginBottom: '-6px',
+    visibility: isVisible(),
+  };
+
+  const orgLogoStyle = {
+    maxHeight: 50,
+    marginBottom: '-15px',
+    visibility: isVisible(),
+  };
+
   return (
     <Link to="/">
       <img
-        style={{
-          maxWidth: 149,
-          maxHeight: 32,
-          marginBottom: '-6px',
-          visibility: isVisible(),
-        }}
+        style={logoPath === logo ? greenstandLogoStyle : orgLogoStyle}
         src={logoPath}
         alt={logoPath === logo ? 'greenstand logo' : 'organization logo'}
       />

From 120e9c56aac859fda1e48db71f7e22fcd4fa7436 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 20:37:56 -0500
Subject: [PATCH 13/36] feat: refactor isInvisible function to not hide the
 greenstand logo if user has an organization

---
 src/components/IconLogo.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index b706ecd55..27f1f4962 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -17,7 +17,7 @@ export default function IconLogo() {
     if (!user) {
       return 'visible';
     }
-    if (logoPath === '' || (logoPath === logo && user.policy.organization)) {
+    if (logoPath === '') {
       return 'hidden';
     } else return 'visible';
   }

From f844cc6ff95f50e3dfef05114d03d08a216e3b00 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 20:14:40 -0500
Subject: [PATCH 14/36] feat: fetch logo url from api

---
 src/components/IconLogo.js | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index f0280e1b9..03d14d874 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,12 +1,24 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
+import { AppContext } from '../context/AppContext';
+import { React, useContext } from 'react';
 
 /*
  * Just a logo icon
  */
-import React from 'react';
 
 export default function IconLogo() {
+  const appContext = useContext(AppContext);
+  const { user } = appContext;
+
+  if (user) {
+    const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+    const orgID = user.policy.organization.id;
+    fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+      .then((response) => response.json())
+      .then((data) => console.log(data.stakeholders[0].logo_url));
+  }
+
   return (
     <Link to="/">
       <img

From 369b102a0283f5acbb75c92e9a5a406078313c15 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 20:27:25 -0500
Subject: [PATCH 15/36] feat: implement logoURL state

---
 src/components/IconLogo.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 03d14d874..f3557319e 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,7 +1,7 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
 import { AppContext } from '../context/AppContext';
-import { React, useContext } from 'react';
+import { React, useContext, useState } from 'react';
 
 /*
  * Just a logo icon
@@ -10,6 +10,7 @@ import { React, useContext } from 'react';
 export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { user } = appContext;
+  const [logoURL, setLogoURL] = useState();
 
   if (user) {
     const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;

From 3baf9258ea1538ef349024a3d4ab4a8a9cffb8c3 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 20:33:28 -0500
Subject: [PATCH 16/36] feat: import and implement useEffect to fetch logo url

---
 src/components/IconLogo.js | 23 ++++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index f3557319e..a6920bf03 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,7 +1,7 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
 import { AppContext } from '../context/AppContext';
-import { React, useContext, useState } from 'react';
+import { React, useContext, useState, useEffect } from 'react';
 
 /*
  * Just a logo icon
@@ -10,15 +10,20 @@ import { React, useContext, useState } from 'react';
 export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { user } = appContext;
-  const [logoURL, setLogoURL] = useState();
+  const [logoURL, setLogoURL] = useState('');
 
-  if (user) {
-    const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
-    const orgID = user.policy.organization.id;
-    fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
-      .then((response) => response.json())
-      .then((data) => console.log(data.stakeholders[0].logo_url));
-  }
+  useEffect(() => {
+    if (user) {
+      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+      const orgID = user.policy.organization.id;
+      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+        .then((response) => response.json())
+        .then((data) => {
+          const orgLogo = data.stakeholders[0].logo_url;
+          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
+        });
+    } else setLogoURL(logo);
+  }, [user]);
 
   return (
     <Link to="/">

From 917485a5c9124b93e231264fb66f8ffc8ba85396 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Tue, 28 Feb 2023 21:09:06 -0500
Subject: [PATCH 17/36] feat: change logo alt to logo

---
 src/components/IconLogo.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index a6920bf03..76feb1720 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -33,8 +33,8 @@ export default function IconLogo() {
           maxHeight: 32,
           marginBottom: '-6px',
         }}
-        src={logo}
-        alt="Greenstand logo"
+        src={logoURL}
+        alt="logo"
       />
     </Link>
   );

From 53fd8ffff2ba049b6d07598b745545704cbf1030 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 17:41:14 -0500
Subject: [PATCH 18/36] feat: use ternary operator to change the logo alt
 attribute

---
 src/components/IconLogo.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 76feb1720..7e3ec45ce 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -10,7 +10,7 @@ import { React, useContext, useState, useEffect } from 'react';
 export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { user } = appContext;
-  const [logoURL, setLogoURL] = useState('');
+  const [logoURL, setLogoURL] = useState(logo);
 
   useEffect(() => {
     if (user) {
@@ -34,7 +34,7 @@ export default function IconLogo() {
           marginBottom: '-6px',
         }}
         src={logoURL}
-        alt="logo"
+        alt={logoURL === logo ? 'greenstand logo' : 'organization logo'}
       />
     </Link>
   );

From f1c470a6991a30f23abf6550aed06463eef9a09e Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 19:31:50 -0500
Subject: [PATCH 19/36] feat: make useEffect only run if user is logged in and
 has an organization

---
 src/components/IconLogo.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 7e3ec45ce..4315e15ce 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -13,7 +13,7 @@ export default function IconLogo() {
   const [logoURL, setLogoURL] = useState(logo);
 
   useEffect(() => {
-    if (user) {
+    if (user && user.policy.organization) {
       const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
       const orgID = user.policy.organization.id;
       fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)

From 942bddd3480c92168cd6f0de1d725145950fd2b8 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 19:43:27 -0500
Subject: [PATCH 20/36] feat: test that the greenstand logo shows when the user
 does not belong to an organization

---
 cypress/integration/IconLogo.spec.py.js | 26 +++++++++++++++++++++++++
 1 file changed, 26 insertions(+)
 create mode 100644 cypress/integration/IconLogo.spec.py.js

diff --git a/cypress/integration/IconLogo.spec.py.js b/cypress/integration/IconLogo.spec.py.js
new file mode 100644
index 000000000..6e7da11ae
--- /dev/null
+++ b/cypress/integration/IconLogo.spec.py.js
@@ -0,0 +1,26 @@
+describe('Icon Logo', () => {
+  Cypress.on('uncaught:exception', (err, runnable) => {
+    // returning false here prevents Cypress from
+    // failing the tests due to uncaught errors
+    return false;
+  });
+
+  it('Displays the organization logo when the user belongs to an organization', () => {
+    cy.visit('http://localhost:3001/login');
+    cy.get('#userName').type('test1');
+    cy.get('#password').type('EoCAyCPpW0');
+    cy.contains(/log/i).click();
+    cy.contains(/earnings/i).click();
+    cy.wait(100);
+    cy.get('img').should('have.attr', 'alt', 'organization logo');
+  });
+  it('Displays the Greenstand logo when the user does not belongs to an organization', () => {
+    cy.visit('http://localhost:3001/login');
+    cy.get('#userName').type('admin');
+    cy.get('#password').type('8pzPdcZAG6&Q');
+    cy.contains(/log/i).click();
+    cy.contains(/earnings/i).click();
+    cy.wait(100);
+    cy.get('img').should('have.attr', 'alt', 'greenstand logo');
+  });
+});

From e6b0fd4ad8c3d5469ae83c0b0085ccd74ca7802d Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Wed, 1 Mar 2023 21:02:04 -0500
Subject: [PATCH 21/36] feat: move logo URL state and useEffect from IconLogo
 component AppContext

---
 src/components/IconLogo.js | 18 ++----------------
 src/context/AppContext.js  | 17 +++++++++++++++++
 2 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 4315e15ce..decca2799 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -1,7 +1,7 @@
 import { Link } from 'react-router-dom';
 import logo from './images/logo.svg';
 import { AppContext } from '../context/AppContext';
-import { React, useContext, useState, useEffect } from 'react';
+import { React, useContext } from 'react';
 
 /*
  * Just a logo icon
@@ -9,21 +9,7 @@ import { React, useContext, useState, useEffect } from 'react';
 
 export default function IconLogo() {
   const appContext = useContext(AppContext);
-  const { user } = appContext;
-  const [logoURL, setLogoURL] = useState(logo);
-
-  useEffect(() => {
-    if (user && user.policy.organization) {
-      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
-      const orgID = user.policy.organization.id;
-      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
-        .then((response) => response.json())
-        .then((data) => {
-          const orgLogo = data.stakeholders[0].logo_url;
-          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
-        });
-    } else setLogoURL(logo);
-  }, [user]);
+  const { logoURL } = appContext;
 
   return (
     <Link to="/">
diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 82cd44d6c..2704af90e 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -32,6 +32,7 @@ import CompareIcon from '@material-ui/icons/Compare';
 import CreditCardIcon from '@material-ui/icons/CreditCard';
 import InboxRounded from '@material-ui/icons/InboxRounded';
 import MapIcon from '@material-ui/icons/Map';
+import logo from '../components/images/logo.svg';
 import AccountTreeIcon from '@material-ui/icons/AccountTree';
 import { session, hasPermission, POLICIES } from '../models/auth';
 import api from '../api/treeTrackerApi';
@@ -220,6 +221,7 @@ export const AppProvider = (props) => {
   const [userHasOrg, setUserHasOrg] = useState(false);
   const [orgList, setOrgList] = useState([]);
   const [orgId, setOrgId] = useState(undefined);
+  const [logoURL, setLogoURL] = useState(logo);
 
   // TODO: The below `selectedFilters` state would be better placed under a
   // separate FilterContext in the future iterations when the need to share
@@ -241,6 +243,20 @@ export const AppProvider = (props) => {
     }
   }, [orgList]);
 
+  // Gets organization logo url from the API
+  useEffect(() => {
+    if (user && user.policy.organization) {
+      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+      const orgID = user.policy.organization.id;
+      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+        .then((response) => response.json())
+        .then((data) => {
+          const orgLogo = data.stakeholders[0].logo_url;
+          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
+        });
+    } else setLogoURL(logo);
+  }, [user]);
+
   function checkSession() {
     const localToken = JSON.parse(localStorage.getItem('token'));
     const localUser = JSON.parse(localStorage.getItem('user'));
@@ -339,6 +355,7 @@ export const AppProvider = (props) => {
     routes,
     orgId,
     orgList,
+    logoURL,
     userHasOrg,
     selectedFilters,
     updateSelectedFilter,

From 6bd16f9cd009b0e3ffac0d3c1f40d8fdbcb98232 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 00:30:33 -0500
Subject: [PATCH 22/36] feat: rename logoURL state to logoPath

---
 src/context/AppContext.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 2704af90e..7d62cc42a 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -221,7 +221,7 @@ export const AppProvider = (props) => {
   const [userHasOrg, setUserHasOrg] = useState(false);
   const [orgList, setOrgList] = useState([]);
   const [orgId, setOrgId] = useState(undefined);
-  const [logoURL, setLogoURL] = useState(logo);
+  const [logoPath, setlogoPath] = useState('');
 
   // TODO: The below `selectedFilters` state would be better placed under a
   // separate FilterContext in the future iterations when the need to share
@@ -252,10 +252,10 @@ export const AppProvider = (props) => {
         .then((response) => response.json())
         .then((data) => {
           const orgLogo = data.stakeholders[0].logo_url;
-          orgLogo ? setLogoURL(orgLogo) : setLogoURL(logo);
+          orgLogo ? setlogoPath(orgLogo) : setlogoPath(logo);
         });
-    } else setLogoURL(logo);
-  }, [user]);
+    } else setlogoPath(logo);
+  }, [user, login]);
 
   function checkSession() {
     const localToken = JSON.parse(localStorage.getItem('token'));
@@ -355,7 +355,7 @@ export const AppProvider = (props) => {
     routes,
     orgId,
     orgList,
-    logoURL,
+    logoPath,
     userHasOrg,
     selectedFilters,
     updateSelectedFilter,

From b51bb1a7fe80b500f1aef13a3ce97cbce1255e1c Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 19:42:22 -0500
Subject: [PATCH 23/36] feat: implement isVisible function that hides logo if
 URL is not available

---
 src/components/IconLogo.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index decca2799..01e2a6b84 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -9,7 +9,13 @@ import { React, useContext } from 'react';
 
 export default function IconLogo() {
   const appContext = useContext(AppContext);
-  const { logoURL } = appContext;
+  const { logoPath } = appContext;
+
+  function isVisible() {
+    if (logoPath === '') {
+      return 'hidden';
+    } else return 'visible';
+  }
 
   return (
     <Link to="/">
@@ -18,9 +24,10 @@ export default function IconLogo() {
           maxWidth: 149,
           maxHeight: 32,
           marginBottom: '-6px',
+          visibility: isVisible(),
         }}
-        src={logoURL}
-        alt={logoURL === logo ? 'greenstand logo' : 'organization logo'}
+        src={logoPath}
+        alt={logoPath === logo ? 'greenstand logo' : 'organization logo'}
       />
     </Link>
   );

From 0042adf5334b4430d2766f578ee01868a8bf2b58 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 19:57:03 -0500
Subject: [PATCH 24/36] feat: refactor isVisible function to hide greenstand
 logo if user with an organization is logged in

---
 src/components/IconLogo.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 01e2a6b84..07fab935d 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -9,10 +9,13 @@ import { React, useContext } from 'react';
 
 export default function IconLogo() {
   const appContext = useContext(AppContext);
-  const { logoPath } = appContext;
+  const { logoPath, user } = appContext;
 
   function isVisible() {
-    if (logoPath === '') {
+    if (!user) {
+      return 'visible';
+    }
+    if (logoPath === '' || (logoPath === logo && user.policy.organization)) {
       return 'hidden';
     } else return 'visible';
   }

From c4d03acab2da38b192b6276b2ee033500cb500fa Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 20:15:16 -0500
Subject: [PATCH 25/36] feat: add comments

---
 src/components/IconLogo.js | 23 +++++++++++++++++------
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index 07fab935d..b706ecd55 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -11,6 +11,8 @@ export default function IconLogo() {
   const appContext = useContext(AppContext);
   const { logoPath, user } = appContext;
 
+  // Hide logo if the logo URL hasn't been loaded or if the Greenstand logo is loaded
+  // and the user has an organization
   function isVisible() {
     if (!user) {
       return 'visible';
@@ -20,15 +22,24 @@ export default function IconLogo() {
     } else return 'visible';
   }
 
+  // Logo styling objects for both org and Greenstand logos to be applied to img
+  const greenstandLogoStyle = {
+    maxWidth: 149,
+    maxHeight: 32,
+    marginBottom: '-6px',
+    visibility: isVisible(),
+  };
+
+  const orgLogoStyle = {
+    maxHeight: 50,
+    marginBottom: '-15px',
+    visibility: isVisible(),
+  };
+
   return (
     <Link to="/">
       <img
-        style={{
-          maxWidth: 149,
-          maxHeight: 32,
-          marginBottom: '-6px',
-          visibility: isVisible(),
-        }}
+        style={logoPath === logo ? greenstandLogoStyle : orgLogoStyle}
         src={logoPath}
         alt={logoPath === logo ? 'greenstand logo' : 'organization logo'}
       />

From 72655e25b2bb72b087645e6a3a1af4f9a80257de Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Thu, 2 Mar 2023 20:37:56 -0500
Subject: [PATCH 26/36] feat: refactor isInvisible function to not hide the
 greenstand logo if user has an organization

---
 src/components/IconLogo.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/IconLogo.js b/src/components/IconLogo.js
index b706ecd55..27f1f4962 100644
--- a/src/components/IconLogo.js
+++ b/src/components/IconLogo.js
@@ -17,7 +17,7 @@ export default function IconLogo() {
     if (!user) {
       return 'visible';
     }
-    if (logoPath === '' || (logoPath === logo && user.policy.organization)) {
+    if (logoPath === '') {
       return 'hidden';
     } else return 'visible';
   }

From c6f95fdece0ec12295b3bc03ca899a3235349f67 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sat, 4 Mar 2023 13:14:57 -0500
Subject: [PATCH 27/36] feat: fix setLogoPath name typo

---
 src/context/AppContext.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 7d62cc42a..6f8a1e456 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -221,7 +221,7 @@ export const AppProvider = (props) => {
   const [userHasOrg, setUserHasOrg] = useState(false);
   const [orgList, setOrgList] = useState([]);
   const [orgId, setOrgId] = useState(undefined);
-  const [logoPath, setlogoPath] = useState('');
+  const [logoPath, setLogoPath] = useState('');
 
   // TODO: The below `selectedFilters` state would be better placed under a
   // separate FilterContext in the future iterations when the need to share
@@ -252,9 +252,9 @@ export const AppProvider = (props) => {
         .then((response) => response.json())
         .then((data) => {
           const orgLogo = data.stakeholders[0].logo_url;
-          orgLogo ? setlogoPath(orgLogo) : setlogoPath(logo);
+          orgLogo ? setLogoPath(orgLogo) : setLogoPath(logo);
         });
-    } else setlogoPath(logo);
+    } else setLogoPath(logo);
   }, [user, login]);
 
   function checkSession() {
@@ -356,6 +356,7 @@ export const AppProvider = (props) => {
     orgId,
     orgList,
     logoPath,
+    setLogoPath,
     userHasOrg,
     selectedFilters,
     updateSelectedFilter,

From 6fef96f4cec48d7d614073febed196a02a52b00b Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sat, 4 Mar 2023 13:21:56 -0500
Subject: [PATCH 28/36] feat: implement get request for logo url at login if
 user belongs to organization

---
 src/components/Login.js | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/src/components/Login.js b/src/components/Login.js
index 21ac609f4..d340fed55 100644
--- a/src/components/Login.js
+++ b/src/components/Login.js
@@ -142,7 +142,25 @@ const Login = (props) => {
           if (res.status === 200) {
             const token = res.data.token;
             const user = res.data.user;
-            appContext.login(user, token, isRemember);
+            // GET logo URL from API if user belongs to an organization
+            // and apply it to logoPath state before completing login
+            if (user.policy.organization) {
+              const STAKEHOLDER_API =
+                process.env.REACT_APP_STAKEHOLDER_API_ROOT;
+              const orgID = user.policy.organization.id;
+              try {
+                await axios
+                  .get(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
+                  .then((response) => {
+                    const orgLogo = response.data.stakeholders[0].logo_url;
+                    orgLogo && appContext.setLogoPath(orgLogo);
+                  });
+              } catch (e) {
+                console.error('Undefined User error:', e);
+              } finally {
+                appContext.login(user, token, isRemember);
+              }
+            } else appContext.login(user, token, isRemember);
           } else {
             setErrorMessage('Invalid username or password');
             setLoading(false);

From 0f73aee8ebd93a638947b68a9c03845376a80820 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sat, 4 Mar 2023 13:26:37 -0500
Subject: [PATCH 29/36] feat: use axios instead of fetch to retrieve the logo
 URL

---
 src/context/AppContext.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 6f8a1e456..0d5a11076 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -248,12 +248,15 @@ export const AppProvider = (props) => {
     if (user && user.policy.organization) {
       const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
       const orgID = user.policy.organization.id;
-      fetch(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
-        .then((response) => response.json())
-        .then((data) => {
+      try {
+        axios.get(`${STAKEHOLDER_API}/stakeholders/${orgID}`).then((data) => {
           const orgLogo = data.stakeholders[0].logo_url;
           orgLogo ? setLogoPath(orgLogo) : setLogoPath(logo);
         });
+      } catch (e) {
+        console.error('Undefined User error:', e);
+        setLogoPath(logo);
+      }
     } else setLogoPath(logo);
   }, [user, login]);
 

From b62a88117d271beac173dd852a3bf3364196a8dd Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sat, 4 Mar 2023 13:52:34 -0500
Subject: [PATCH 30/36] feat: remove login from logo url useEffect dependency

---
 src/context/AppContext.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index fd20f4ad8..15734c756 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -258,7 +258,7 @@ export const AppProvider = (props) => {
         setLogoPath(logo);
       }
     } else setLogoPath(logo);
-  }, [user, login]);
+  }, [user]);
 
   function checkSession() {
     const localToken = JSON.parse(localStorage.getItem('token'));

From ff3400abaf0d83ed63007fb5d99d2af13858370c Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sun, 5 Mar 2023 10:37:45 -0500
Subject: [PATCH 31/36] feat: remove IconLogo component from login page and use
 the svg file directly

---
 src/components/Login.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/Login.js b/src/components/Login.js
index d340fed55..9c8af127b 100644
--- a/src/components/Login.js
+++ b/src/components/Login.js
@@ -11,7 +11,7 @@ import {
   Container,
   CircularProgress,
 } from '@material-ui/core';
-import IconLogo from './IconLogo';
+import logo from './images/logo.svg';
 import { withStyles } from '@material-ui/core/styles';
 import { AppContext } from '../context/AppContext';
 import classNames from 'classnames';
@@ -185,7 +185,15 @@ const Login = (props) => {
     <Container component="main" maxWidth="xs">
       <CssBaseline />
       <div className={classes.paper}>
-        <IconLogo />
+        <img
+          style={{
+            maxWidth: 149,
+            maxHeight: 32,
+            marginBottom: '-6px',
+          }}
+          src={logo}
+          alt="Greenstand logo"
+        />
         <Box m={2} />
         <Typography variant="h2">Admin Panel</Typography>
         <form className={classes.form} onSubmit={handleSubmit} noValidate>

From 63f709e1f233e5c8b0e9f1e26f293c2d0f2bdb6a Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sun, 5 Mar 2023 12:17:46 -0500
Subject: [PATCH 32/36] feat: implement getStakeholder(id) function

---
 src/api/stakeholders.js | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/api/stakeholders.js b/src/api/stakeholders.js
index ea146706f..28e6d765c 100644
--- a/src/api/stakeholders.js
+++ b/src/api/stakeholders.js
@@ -54,6 +54,24 @@ export default {
     }
   },
 
+  // Returns a single stakeholder data
+  getStakeholder(id) {
+    try {
+      const query = `${STAKEHOLDER_API}/stakeholders/${id}`;
+
+      const options = {
+        method: 'GET',
+        headers: {
+          'content-type': 'application/json',
+        },
+      };
+
+      return fetchJSON(query, options);
+    } catch (e) {
+      log.error('getStakeholder', e);
+    }
+  },
+
   deleteStakeholder(id, stakeholderData) {
     try {
       const orgId = id || getOrganizationId();

From c148f1d8d8b970285ae69e248ea338b44999820b Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sun, 5 Mar 2023 12:20:30 -0500
Subject: [PATCH 33/36] feat: call getStakeholder(id) api function to retrieve
 logo url

---
 src/components/Login.js   | 13 +++++--------
 src/context/AppContext.js |  8 ++++----
 2 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/components/Login.js b/src/components/Login.js
index 9c8af127b..05a80c34e 100644
--- a/src/components/Login.js
+++ b/src/components/Login.js
@@ -15,6 +15,7 @@ import logo from './images/logo.svg';
 import { withStyles } from '@material-ui/core/styles';
 import { AppContext } from '../context/AppContext';
 import classNames from 'classnames';
+import api from '../api/stakeholders';
 import { useHistory, useLocation } from 'react-router-dom';
 import axios from 'axios';
 // import Copyright from 'components/Copyright'
@@ -145,16 +146,12 @@ const Login = (props) => {
             // GET logo URL from API if user belongs to an organization
             // and apply it to logoPath state before completing login
             if (user.policy.organization) {
-              const STAKEHOLDER_API =
-                process.env.REACT_APP_STAKEHOLDER_API_ROOT;
               const orgID = user.policy.organization.id;
               try {
-                await axios
-                  .get(`${STAKEHOLDER_API}/stakeholders/${orgID}`)
-                  .then((response) => {
-                    const orgLogo = response.data.stakeholders[0].logo_url;
-                    orgLogo && appContext.setLogoPath(orgLogo);
-                  });
+                await api.getStakeholder(orgID).then((response) => {
+                  const orgLogo = response.stakeholders[0].logo_url;
+                  orgLogo && appContext.setLogoPath(orgLogo);
+                });
               } catch (e) {
                 console.error('Undefined User error:', e);
               } finally {
diff --git a/src/context/AppContext.js b/src/context/AppContext.js
index 15734c756..8f0b24f20 100644
--- a/src/context/AppContext.js
+++ b/src/context/AppContext.js
@@ -36,6 +36,7 @@ import logo from '../components/images/logo.svg';
 import AccountTreeIcon from '@material-ui/icons/AccountTree';
 import { session, hasPermission, POLICIES } from '../models/auth';
 import api from '../api/treeTrackerApi';
+import stakeholdersAPI from '../api/stakeholders';
 import RegionsView from 'views/RegionsView';
 import log from 'loglevel';
 
@@ -246,12 +247,11 @@ export const AppProvider = (props) => {
   // Gets organization logo url from the API
   useEffect(() => {
     if (user && user.policy.organization) {
-      const STAKEHOLDER_API = process.env.REACT_APP_STAKEHOLDER_API_ROOT;
       const orgID = user.policy.organization.id;
       try {
-        axios.get(`${STAKEHOLDER_API}/stakeholders/${orgID}`).then((res) => {
-          const orgLogo = res.data.stakeholders[0].logo_url;
-          orgLogo ? setLogoPath(orgLogo) : setLogoPath(logo);
+        stakeholdersAPI.getStakeholder(orgID).then((response) => {
+          const orgLogo = response.stakeholders[0].logo_url;
+          orgLogo && setLogoPath(orgLogo);
         });
       } catch (e) {
         console.error('Undefined User error:', e);

From 8fd570095d0235a222a8125c47340f2dc3fc80bc Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sun, 5 Mar 2023 16:30:32 -0500
Subject: [PATCH 34/36] feat: add cypress.env.json

---
 .gitignore | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.gitignore b/.gitignore
index ab434eef3..c90ef2e4e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,6 +5,7 @@
 
 # testing
 /coverage
+/cypress.env.json
 /cypress/videos
 /cypress/screenshots
 /cypress/fixtures/login.json

From 3c80d22c9047217c9addad6820dd678526bc7827 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sun, 5 Mar 2023 16:31:16 -0500
Subject: [PATCH 35/36] feat: create cypress.env file to store credentials to
 be used in integrations tests

---
 cypress.env.json.example | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 cypress.env.json.example

diff --git a/cypress.env.json.example b/cypress.env.json.example
new file mode 100644
index 000000000..08fba94ca
--- /dev/null
+++ b/cypress.env.json.example
@@ -0,0 +1,6 @@
+{
+  "admin_username": "",
+  "admin_password": "",
+  "test_username": "",
+  "test_password": ""
+}
\ No newline at end of file

From 81cd029837a49f255539e0e672427b6ad6fa3e18 Mon Sep 17 00:00:00 2001
From: Marcos Spomberg <marcosspomberg@gmail.com>
Date: Sun, 5 Mar 2023 16:32:03 -0500
Subject: [PATCH 36/36] test: remove credentials and use cypress.env instead

---
 cypress/integration/IconLogo.spec.py.js   | 14 ++++----------
 cypress/integration/messaging2.spec.py.js |  8 ++++----
 2 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/cypress/integration/IconLogo.spec.py.js b/cypress/integration/IconLogo.spec.py.js
index 6e7da11ae..16897783b 100644
--- a/cypress/integration/IconLogo.spec.py.js
+++ b/cypress/integration/IconLogo.spec.py.js
@@ -1,14 +1,8 @@
 describe('Icon Logo', () => {
-  Cypress.on('uncaught:exception', (err, runnable) => {
-    // returning false here prevents Cypress from
-    // failing the tests due to uncaught errors
-    return false;
-  });
-
   it('Displays the organization logo when the user belongs to an organization', () => {
     cy.visit('http://localhost:3001/login');
-    cy.get('#userName').type('test1');
-    cy.get('#password').type('EoCAyCPpW0');
+    cy.get('#userName').type(Cypress.env('test_username'));
+    cy.get('#password').type(Cypress.env('test_password'));
     cy.contains(/log/i).click();
     cy.contains(/earnings/i).click();
     cy.wait(100);
@@ -16,8 +10,8 @@ describe('Icon Logo', () => {
   });
   it('Displays the Greenstand logo when the user does not belongs to an organization', () => {
     cy.visit('http://localhost:3001/login');
-    cy.get('#userName').type('admin');
-    cy.get('#password').type('8pzPdcZAG6&Q');
+    cy.get('#userName').type(Cypress.env('admin_username'));
+    cy.get('#password').type(Cypress.env('admin_password'));
     cy.contains(/log/i).click();
     cy.contains(/earnings/i).click();
     cy.wait(100);
diff --git a/cypress/integration/messaging2.spec.py.js b/cypress/integration/messaging2.spec.py.js
index 02a5bd004..0e013c12b 100644
--- a/cypress/integration/messaging2.spec.py.js
+++ b/cypress/integration/messaging2.spec.py.js
@@ -459,8 +459,8 @@ describe('Messaging', () => {
     );
 
     cy.visit('http://localhost:3001/login');
-    cy.get('#userName').type('admin');
-    cy.get('#password').type('8pzPdcZAG6&Q');
+    cy.get('#userName').type(Cypress.env('admin_username'));
+    cy.get('#password').type(Cypress.env('admin_password'));
     cy.contains(/log/i).click();
     cy.contains(/inbox/i).click();
     cy.contains(
@@ -470,8 +470,8 @@ describe('Messaging', () => {
   });
   it('Returns an error message if the user is not registered for messaging', () => {
     cy.visit('http://localhost:3001/login');
-    cy.get('#userName').type('test1');
-    cy.get('#password').type('EoCAyCPpW0');
+    cy.get('#userName').type(Cypress.env('test_username'));
+    cy.get('#password').type(Cypress.env('test_password'));
     cy.contains(/log/i).click();
     cy.contains(/inbox/i).click();
     cy.contains(