Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Change logos to OpenSTL and hide Hack for LA footer #3

Open
wants to merge 7 commits into
base: development-0.4
Choose a base branch
from
Open

Change logos to OpenSTL and hide Hack for LA footer #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
c67c18b
add constants to manage brigade references used in app
staceymck Aug 19, 2021
4dcd0bc
only display 'VRMS developed by' footer if brigade is Hack for LA
staceymck Aug 19, 2021
79712e3
display logo in header of brigade named in theme config file
staceymck Aug 19, 2021
085f086
only run footer test if brigade is Hack for LA
staceymck Aug 19, 2021
ec16a45
add stl versions of standard logo sizes
staceymck Aug 19, 2021
64a3e99
add prefix to existing logos to identify as Hack for LA assets
staceymck Aug 19, 2021
6f05aed
utilize stl logos instead of Hack for LA assets
staceymck Aug 19, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions client/public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,18 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="favicon.ico" />
<link rel="icon" href="stl-favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Volunteer Relationship Management System"
/>
<link rel="apple-touch-icon" sizes="180x180" href="logo180.png" />
<link rel="apple-touch-icon" sizes="192x192" href="logo192.png" />
<link rel="apple-touch-icon" sizes="310x310" href="logo310.png" />
<link rel="icon" type="image/png" sizes="512x512" href="logo512.png" />
<link rel="icon" type="image/png" sizes="192x192" href="logo192.png" />
<link rel="apple-touch-icon" sizes="180x180" href="stl-logo180.png" />
<link rel="apple-touch-icon" sizes="192x192" href="stl-logo192.png" />
<link rel="apple-touch-icon" sizes="310x310" href="stl-logo310.png" />
<link rel="icon" type="image/png" sizes="512x512" href="stl-logo512.png" />
<link rel="icon" type="image/png" sizes="192x192" href="stl-logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
Expand Down
0 client/public/favicon.ico → client/public/la-favicon.ico
View file
Open in desktop
File renamed without changes.
0 client/public/logo.png → client/public/la-logo.png
View file
Open in desktop
File renamed without changes
0 client/public/logo180.png → client/public/la-logo180.png
View file
Open in desktop
File renamed without changes
0 client/public/logo192.png → client/public/la-logo192.png
View file
Open in desktop
File renamed without changes
0 client/public/logo310.png → client/public/la-logo310.png
View file
Open in desktop
File renamed without changes
0 client/public/logo512.png → client/public/la-logo512.png
View file
Open in desktop
File renamed without changes
10 changes: 5 additions & 5 deletions client/public/manifest.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,27 +3,27 @@
"name": "Volunteer Relationship Management System",
"icons": [
{
"src": "favicon.ico",
"src": "stl-favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo180.png",
"src": "stl-logo180.png",
"type": "image/png",
"sizes": "180x180"
},
{
"src": "logo192.png",
"src": "stl-logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo310.png",
"src": "stl-logo310.png",
"type": "image/png",
"sizes": "310x310"
},
{
"src": "logo512.png",
"src": "stl-logo512.png",
"type": "image/png",
"sizes": "512x512"
}
Expand Down
Binary file added client/public/stl-favicon.ico
View file
Open in desktop
Binary file not shown.
Binary file added client/public/stl-logo180.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/public/stl-logo192.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/public/stl-logo310.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/public/stl-logo512.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
15 changes: 9 additions & 6 deletions client/src/App.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React from 'react';
import App from './App';
import { render, screen, cleanup } from '@testing-library/react';
import { BRIGADE_NAME } from '../src/utils/themes/themes.js';

beforeEach(() => {
render(<App />);
Expand Down Expand Up @@ -29,10 +30,12 @@ describe('App', () => {
expect(screen.getByText('Create account')).toBeInTheDocument();
});

test('Should render with footer', () => {
expect(screen.getByTestId('footer')).toBeInTheDocument();
expect(
screen.getByText('was developed by Hack for LA')
).toBeInTheDocument();
});
if (BRIGADE_NAME === "Hack for LA") {
test('Should render with footer', () => {
expect(screen.getByTestId('footer')).toBeInTheDocument();
expect(
screen.getByText('was developed by Hack for LA')
).toBeInTheDocument();
});
}
});
0 client/src/assets/images/logo.svg → client/src/assets/images/la-logo.svg
View file
Open in desktop
File renamed without changes
12 changes: 12 additions & 0 deletions client/src/assets/images/stl-logo.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 2 additions & 0 deletions client/src/components/common/footer/footer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React from 'react';
import './footer.scss';
import RedirectLink from '../link/link';
import { BRIGADE_NAME } from '../../../utils/themes/themes';
import { useSelector } from 'react-redux';

const Footer = () => {
Expand All @@ -12,6 +13,7 @@ const Footer = () => {
<div className="text-block">Logged in as {user.email}</div>
</footer>
) : (
BRIGADE_NAME === "Hack for LA" &&
<footer data-testid="footer" className="app-footer">
<div className="text-block">
<span>VRMS</span> was developed by Hack for LA
Expand Down
10 changes: 7 additions & 3 deletions client/src/components/common/footer/footer.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import 'react-redux';
import Footer from './footer';
import { screen, fireEvent } from '@testing-library/react';
import { useSelector } from 'react-redux';
import { BRIGADE_NAME } from '../../../utils/themes/themes';
import {
authDefaultState,
userAuthSuccessMockState,
Expand All @@ -19,6 +20,7 @@ jest.mock('react-redux', () => ({
useSelector: jest.fn(),
}));

if (BRIGADE_NAME === "Hack for LA") {
describe('Should display main Footer for not authorized users', () => {
beforeEach(() => {
useSelector.mockImplementation((callback) => {
Expand All @@ -39,14 +41,12 @@ describe('Should display main Footer for not authorized users', () => {
screen.getByText('was developed by Hack for LA')
).toBeInTheDocument();
expect(screen.getByTestId('footer')).toBeInTheDocument();
});

})
test('Should exist the tooltip', () => {
expect(screen.getByTestId('tooltip')).toBeInTheDocument();
expect(screen.getByTestId('link')).toBeInTheDocument();
expect(screen.getByTestId('link')).toHaveAttribute('href', '/page');
});

test('Should navigate to dummy page after clicking on the link', () => {
expect(screen.getByTestId('link')).toBeInTheDocument();
fireEvent.click(screen.getByTestId('link'));
Expand All @@ -57,6 +57,7 @@ describe('Should display main Footer for not authorized users', () => {
expect(screen.queryByTestId('footer-logged-in')).toBeFalsy();
});
});
}

describe('Should display Footer for authorized users', () => {
beforeEach(() => {
Expand Down Expand Up @@ -84,6 +85,7 @@ describe('Should display Footer for authorized users', () => {
});
});

if (BRIGADE_NAME === "Hack for LA") {
describe('Should display the main Footer if authorization fails', () => {
beforeEach(() => {
useSelector.mockImplementation((callback) => {
Expand All @@ -98,6 +100,7 @@ describe('Should display the main Footer if authorization fails', () => {
useSelector.mockClear();
});


test('Should render main Footer with text content', () => {
expect(screen.getByTestId('footer')).toBeInTheDocument();
expect(
Expand All @@ -110,3 +113,4 @@ describe('Should display the main Footer if authorization fails', () => {
expect(screen.queryByTestId('footer-logged-in')).toBeFalsy();
});
});
};
10 changes: 9 additions & 1 deletion client/src/components/common/header/header.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,15 +1,23 @@
import React from 'react';
import './header.scss';
import logo from '../../../assets/images/logo.svg';
import laLogo from '../../../assets/images/la-logo.svg';
import stlLogo from '../../../assets/images/stl-logo.svg'
import RedirectLink from '../link/link';
import { useSelector, useDispatch } from 'react-redux';
import allActions from '../../../store/actions';
import { BRIGADE_NAME } from '../../../utils/themes/themes';
import { useState, useEffect } from 'react';

const Header = () => {
const isMenuOpen = useSelector((state) => state.dashboard.isMenuOpen);
const loggedIn = useSelector((state) => state.auth.loggedIn);
const user = useSelector((state) => state.auth.user);
const dispatch = useDispatch();
const [logo, setLogo] = useState();

useEffect(() => {
BRIGADE_NAME === "Hack for LA" ? setLogo(laLogo) : setLogo(stlLogo)
}, []);

function toggleMenu() {
if (!isMenuOpen) {
Expand Down
7 changes: 7 additions & 0 deletions client/src/utils/themes/themes.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
// Brigade Details
export const BRIGADE_NAME = "Open STL";
export const BRIGADE_EMAIL = "[email protected]";
export const BRIGADE_SITE_URL = "https://openstl.org/";
export const BRIGADE_SITE_NAME = "openstl.org";
export const BRIGADE_VRMS_REPO = "https://github.com/OpenSTL/VRMS";
export const BRIGADE_SLACK = "https://openstl.slack.com";