Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
11 changes: 8 additions & 3 deletions src/navigation/Navigation.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
import PropTypes from 'prop-types'
import React from 'react'

//step 1 import the menu library
import { Menu, MenuItem } from '@dhis2/ui'
// @TODO: Import the `Menu` and `MenuItem` components
import { useNavigate, useMatch } from 'react-router-dom'

Expand All @@ -17,7 +20,8 @@ const NavigationItem = ({ path, label }) => {
const onClick = () => navigate(path)

// @TODO: Use the `MenuItem` component instead of the `div`
return <div>{label}</div>
//step 2 activate the menu bar
return <MenuItem label={label} target={path} active={isActive} onClick={onClick}/>
}

NavigationItem.propTypes = {
Expand All @@ -27,7 +31,8 @@ NavigationItem.propTypes = {

export const Navigation = () => (
// @TODO: Use the `Menu` components instead of the `div`
<div>
//step 3 convert div int menu
<Menu>
<NavigationItem
// Menu item for the home page
label="Home"
Expand All @@ -45,5 +50,5 @@ export const Navigation = () => (
label="Form"
path="/form"
/>
</div>
</Menu>
)
2 changes: 1 addition & 1 deletion src/views/Home.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,6 @@ export const Home = () => (
<div>
<h1>Home</h1>

<p>DHIS2 Web App Academy 2024</p>
<p>DHIS2 Web App Academy 2024 ( Mohamad change )</p>
</div>
)