From fc00cd9a0d290beea990e50c584a00a6039c4d2e Mon Sep 17 00:00:00 2001 From: Yusuke Nemoto Date: Sun, 5 Jan 2025 12:25:10 +0900 Subject: [PATCH 1/5] Create header menu to navigate between pages Add a header menu for navigation between pages `/`, `/statistics`, and `/details`. * **Header Component**: Create a new `Header` component in `webapp/src/components/Header.tsx` with navigation links to `/`, `/statistics`, and `/details`, and a GitHub icon linking to the repository. * **Main Application**: Import and include the `Header` component in `webapp/src/main.tsx` above the `Routes` component. * **Index HTML**: Remove the GitHub icon link from `webapp/index.html`. --- For more details, open the [Copilot Workspace session](https://copilot-workspace.githubnext.com/kaakaa/ai-agent-statistics?shareId=XXXX-XXXX-XXXX-XXXX). --- webapp/index.html | 3 --- webapp/src/components/Header.tsx | 28 ++++++++++++++++++++++++++++ webapp/src/main.tsx | 2 ++ 3 files changed, 30 insertions(+), 3 deletions(-) create mode 100644 webapp/src/components/Header.tsx diff --git a/webapp/index.html b/webapp/index.html index fdd06d0..837effd 100644 --- a/webapp/index.html +++ b/webapp/index.html @@ -13,9 +13,6 @@ - - GitHub -
diff --git a/webapp/src/components/Header.tsx b/webapp/src/components/Header.tsx new file mode 100644 index 0000000..b9eac36 --- /dev/null +++ b/webapp/src/components/Header.tsx @@ -0,0 +1,28 @@ +import React from 'react'; +import { Link } from 'react-router-dom'; +import GitHubIcon from '@mui/icons-material/GitHub'; + +const Header: React.FC = () => { + return ( + + ); +}; + +export default Header; diff --git a/webapp/src/main.tsx b/webapp/src/main.tsx index 3236805..e415c14 100644 --- a/webapp/src/main.tsx +++ b/webapp/src/main.tsx @@ -5,12 +5,14 @@ import './index.css' import PullRequestsTable from './components/PullRequests.tsx' import StatisticsPage from './components/Statistics.tsx'; import SummaryPage from './components/Summary.tsx'; +import Header from './components/Header.tsx'; const base = import.meta.env.BASE_URL createRoot(document.getElementById('root')!).render( +
} /> } /> From 32be785178330e510664a04d1e8bbe8204a946ba Mon Sep 17 00:00:00 2001 From: Yusuke Nemoto Date: Sun, 5 Jan 2025 12:25:58 +0900 Subject: [PATCH 2/5] Add a new `Header` component with a navigation bar * Import `Link` from `react-router` instead of `react-router-dom` * Include a GitHub icon in the navigation bar --- webapp/src/components/Header.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/components/Header.tsx b/webapp/src/components/Header.tsx index b9eac36..4bb4ff2 100644 --- a/webapp/src/components/Header.tsx +++ b/webapp/src/components/Header.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Link } from 'react-router-dom'; +import { Link } from 'react-router'; import GitHubIcon from '@mui/icons-material/GitHub'; const Header: React.FC = () => { From a978787a0877beb777cc35cfa50782fb9d5b1052 Mon Sep 17 00:00:00 2001 From: Yusuke Nemoto Date: Sun, 5 Jan 2025 12:28:36 +0900 Subject: [PATCH 3/5] Add a new `Header` component with a navigation bar * Create a `Header` component with links to `/`, `/statistics`, and `/details` * Include a GitHub icon that links to the GitHub repository * Set the style for the header as a header line in a row on the top-right corner of the page * Refactor styles for the header to ensure consistency and responsiveness --- webapp/src/components/Header.tsx | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/webapp/src/components/Header.tsx b/webapp/src/components/Header.tsx index 4bb4ff2..0f5023e 100644 --- a/webapp/src/components/Header.tsx +++ b/webapp/src/components/Header.tsx @@ -4,19 +4,19 @@ import GitHubIcon from '@mui/icons-material/GitHub'; const Header: React.FC = () => { return ( -