project page API and other initial setup

src/APIs/getProject.js

@@ -0,0 +1,19 @@
+import {useQuery} from '@tanstack/react-query'
+
+export const getProjectList = async()=>{
+    const response = await fetch('http://localhost:8080/SonyMusicRights/project-list?searchBy=');
+    if (!response.ok) {
+        throw new Error('Failed to get project list data');
+    }
+    const projectListData = await response.json()
+    return projectListData;
+}
+
+export const useGetProjectData = () => {
+    return useQuery(
+        {
+            queryKey: ['Project-list'],
+            queryFn: getProjectList,
+        }
+    );
+}

src/APIs/getUnlinkedProjects.js

@@ -3,7 +3,7 @@ import { useQuery } from "@tanstack/react-query";
 export const getUnlinkedProjects = async () => {
     const response = await fetch('http://localhost:8080/SonyMusicRights/unlinked-project?searchBy=');
     if (!response.ok) {
-        throw new Error('Failed to get UploadStatus data');
+        throw new Error('Failed to get unlinkedProjects data');
     }
     const UnlinkedProjectsdata = await response.json();
     return UnlinkedProjectsdata;

src/App.js

@@ -7,6 +7,7 @@ import { Container } from '@mui/material';
 import { BrowserRouter as Router, Routes, Route, BrowserRouter} from 'react-router-dom'
 import Dashboard from 'components/Dashboard';
 import { Counter } from 'components/counterC';
+import Projects from 'components/projects/Projects';
 
 
 function App() {
@@ -20,7 +21,8 @@ function App() {
         {/* <Home/> */}
         <Routes>
           <Route path='/home' element={<Dashboard/>} />
-          <Route path='/' element={<Counter/>} />
+          <Route path='/projects' element={<Projects/>} />
+          {/* <Route path='/' element={<Counter/>} /> */}
         </Routes>
       </BrowserRouter>
       </div>

src/components/Dashboard.js

@@ -5,20 +5,23 @@ import { useQuery } from '@tanstack/react-query';
 import {Link} from 'react-router-dom';
 import { getLinkedProjects, useGetLinkedProjects } from "APIs/getLinkedProjects";
 import { useGetUnlinkedProjects } from "APIs/getUnlinkedProjects";
+import { useGetProjectData } from "APIs/getProject";
 
 export default function Dashboard(){
 
   const [linkedProjectData, setLinkedProjectData] = React.useState()
   const { data: getLinkedProjectList } = useGetLinkedProjects();
   const { data: getUnlinkedProjectList } = useGetUnlinkedProjects();
+  const { data: getProjectDataList } = useGetProjectData();
 
-  console.log('sdfsds',getLinkedProjectList,getUnlinkedProjectList)
+
+  console.log('sdfsds',getProjectDataList)
 
     return (
             <Paper sx={{bgcolor:'#1e1e1e', height:600, color:'white',margin:'0px !important'}}>
               <div className="home-page">
               <div className="navbar-margin stories" style={{minHeight : '500px'}}>
-                          <h1 className="mobile-heading">Home</h1>
+                          {/* <h1 className="mobile-heading">Home</h1> */}
                           <div style={{marginTop: '5%', marginLeft: '1%', marginRight: '1%', display: 'flex', flexDirection: 'row', justifyContent:'space-between'}}>
                               <Card style={{paddingTop: '5px', height: '170px', width: '49.5%', backgroundColor:'#181817'}}>
                                   {/* <Link to={{ pathname: `${process.env.PUBLIC_URL}/projects`, state: { type: 'unlinked'} }}> */}

src/components/Header.js

@@ -98,6 +98,10 @@ function Header() {
                   <Typography textAlign="center" component={Link}
                     to='/home'>HOME</Typography>
                 </MenuItem>
+                <MenuItem key='home' onClick={handleCloseNavMenu}>
+                  <Typography textAlign="center" component={Link}
+                    to='/projects'>PROJECTS</Typography>
+                </MenuItem>
             </Menu>
           </Box>
 
@@ -139,6 +143,15 @@ function Header() {
               >
                 HOME
               </Button>
+              <Button
+                key='home'
+                onClick={handleCloseNavMenu}
+                sx={{ my: 2, color: 'white', display: 'block' }}
+                component={Link}
+                    to='/projects'
+              >
+                PROJECTS
+              </Button>
           </Box>
 
           <Box sx={{ flexGrow: 0 }}>

src/components/projects/Projects.js

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function Projects(){
+    return(
+        <>
+        hi
+        </>
+    )
+}