Skip to content

Commit

Permalink
Merge pull request #102 from UrbanOS-Public/1208-home-navigation
Browse files Browse the repository at this point in the history
1208 home navigation
  • Loading branch information
ian-j-abbott-accenture authored Jun 1, 2023
2 parents b132760 + 65e45c5 commit c37a9c1
Show file tree
Hide file tree
Showing 5 changed files with 28 additions and 16 deletions.
2 changes: 1 addition & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "discovery_ui",
"version": "2.1.42",
"version": "2.1.43",
"description": "UI for dataset discovery",
"main": "./src/index.js",
"repository": {
Expand All @@ -22,6 +22,8 @@
"@fortawesome/free-brands-svg-icons": "^5.10.2",
"@fortawesome/react-fontawesome": "^0.1.4",
"@smartcitiesdata/react-discovery-ui": "2.1.39",
"@material-ui/core": "^4.12.4",
"@material-ui/icons": "^4.11.3",
"buffer": "^6.0.3",
"definitions": "0.0.2",
"immutable": "^3.8.2",
Expand Down
6 changes: 6 additions & 0 deletions src/components/header/header.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import './header.scss'
import React, { useState } from 'react'
import urbanosLogo from '../../assets/urbanos-logo.png'
import HomeIcon from '@material-ui/icons/Home'

const Header = () => {
const [imageLoadError, setImageLoadError] = useState(false)
Expand All @@ -27,6 +28,11 @@ const Header = () => {
</a>
</div>
<span className='title'>{`${window.HEADER_TITLE}`}</span>
<div className='home-icon-container' data-testid='home-icon-container'>
<a href={`${window.DISC_UI_URL}`}>
<HomeIcon className='home-icon' data-testid='home-icon'/>
</a>
</div>
</div>
</div>
)
Expand Down
25 changes: 11 additions & 14 deletions src/components/header/header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ header {
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
}

.title {
Expand Down Expand Up @@ -90,22 +91,22 @@ header {

}

// .nav-element:hover {
// background-color: black;
// color: white;
// border: black solid 5px;
// }

.highlighted {
background-color: white;
color: black;
border: black solid 5px;
}

// .highlighted:hover {
// background-color: black;
// color: white;
// }
.home-icon-container {
position: absolute;
bottom: 0;
right: 0;
padding-right: 10px;
}

.home-icon {
font-size: 2.5rem;
}

.pinned {
position: fixed;
Expand Down Expand Up @@ -158,10 +159,6 @@ header {
}
}

.title {
width: 90%;
}

.top-bar {
padding: 20px 20px 20px 10px;
}
Expand Down
7 changes: 7 additions & 0 deletions src/components/header/header.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,13 @@ describe('Header', () => {
expect(headerLogo).toHaveAttribute('alt', 'testHeaderTitle logo')
})

test('contains clickable home icon', () => {
render(<Header />)

expect(screen.getByTestId('home-icon')).toBeInTheDocument
expect(screen.getAllByRole('link')[1].href).toContain("/testBaseUrl")
})

test('uses backup logo when initial image src fails', () => {
render(<Header />)

Expand Down

0 comments on commit c37a9c1

Please sign in to comment.