Filter API calls and logic

This commit is contained in:
Sonika 2023-12-15 11:27:28 +05:30
parent c181c3e69d
commit fff24db214
7 changed files with 210 additions and 9 deletions

View File

@ -0,0 +1,13 @@
import { useQuery } from '@tanstack/react-query';
import axios from 'axios';
export const fetchPublishedProjects = (searchBy, config) => {
const fetchData = async () => {
const response = await axios.get(`${config.apiUrl}/autolinked-assets`, {
params: {
searchBy
}
});
return response.data;
};
};

View File

@ -0,0 +1,13 @@
import { useQuery } from '@tanstack/react-query';
import axios from 'axios';
export const fetchLinkedProjects = (searchBy, config) => {
const fetchData = async () => {
const response = await axios.get(`${config.apiUrl}/linked-project`, {
params: {
searchBy
}
});
return response.data;
};
};

View File

@ -0,0 +1,13 @@
import { useQuery } from '@tanstack/react-query';
import axios from 'axios';
export const fetchProjects = (searchBy, config) => {
const fetchData = async () => {
const response = await axios.get(`${config.apiUrl}/project-list`, {
params: {
searchBy
}
});
return response.data;
};
};

View File

@ -0,0 +1,13 @@
import { useQuery } from '@tanstack/react-query';
import axios from 'axios';
export const fetchPublishedProjects = (searchBy, config) => {
const fetchData = async () => {
const response = await axios.get(`${config.apiUrl}/published-project`, {
params: {
searchBy
}
});
return response.data;
};
};

View File

@ -0,0 +1,13 @@
import { useQuery } from '@tanstack/react-query';
import axios from 'axios';
export const fetchUnlinkedProjects = (searchBy, config) => {
const fetchData = async () => {
const response = await axios.get(`${config.apiUrl}/unlinked-project`, {
params: {
searchBy
}
});
return response.data;
};
};

View File

@ -5,7 +5,7 @@ export default function ProjectFilter(){
return(
<>
<Card style={{margin: '1%'}}>
<Card style={{margin: '1%', backgroundColor:'rgb(24 24 23)'}}>
<CardContent>
<FormControl className="select-field" variant="standard" style={{marginTop: '1%'}}>
<InputLabel htmlFor="contract-list" >Select Contract</InputLabel>
@ -28,6 +28,7 @@ export default function ProjectFilter(){
variant="standard"
label="Search By"
value={''}
sx={{input: { color: 'red' }}}
placeholder="Search By Title, Project Title, Contract No, Asset Title, Track Grid, ISRC"
// onChange={props.handleSearchByChange}
style={{marginLeft: '10%', width: '45%'}}
@ -38,9 +39,4 @@ export default function ProjectFilter(){
</>
)
}
/*
.select-field {
width : 35%;
} */
}

View File

@ -2,13 +2,153 @@ import React from "react";
import ProjectList from "./ProjectsList";
import { useGetProjectData } from "APIs/getProject";
import ProjectFilter from "./ProjectFilter";
import { useState } from "react";
import { useEffect } from "react";
import { Box, Card, CardContent, FormControl, Grid, InputLabel, MenuItem, Paper, Select, TextField } from "@mui/material";
export default function Projects(){
const { data: getProjectDataList } = useGetProjectData();
const [selectedContractFilter, setSelectedContractFilter] = useState('All');
const [searchBy, setSearchBy] = useState('');
// useEffect(() => {
// setSelectedContractFilter(props.location.state ? props.location.state.type : 'All');
// setSearchBy('');
// try {
// switch (props.location.state.type) {
// case 'linked':
// props.fetchLinkedProject(searchBy, props.config);
// break;
// case 'unlinked':
// props.fetchUnLinkedProject(searchBy, props.config);
// break;
// case 'published':
// props.fetchPublishedProject(searchBy, props.config);
// break;
// case 'autolinked':
// props.fetchAutoLinkedProjectAssets(searchBy, props.config);
// break;
// default:
// props.fetchProjects(searchBy, props.config);
// break;
// }
// } catch (e) {
// props.fetchProjects(searchBy, props.config);
// }
// }, [props.location.state, searchBy, props.config, props]);
// const handleContractFilterChange = (event) => {
// setSelectedContractFilter(event.target.value);
// setSearchBy('');
// try {
// switch (event.target.value) {
// case 'linked':
// props.fetchLinkedProject(searchBy, props.config);
// break;
// case 'unlinked':
// props.fetchUnLinkedProject(searchBy, props.config);
// break;
// case 'published':
// props.fetchPublishedProject(searchBy, props.config);
// break;
// case 'autolinked':
// props.fetchAutoLinkedProjectAssets(searchBy, props.config);
// break;
// default:
// props.fetchProjects(searchBy, props.config);
// break;
// }
// } catch (e) {
// props.fetchProjects(searchBy, props.config);
// }
// };
// const handleSearchByChange = (event) => {
// setSearchBy(event.target.value);
// try {
// switch (selectedContractFilter) {
// case 'linked':
// props.fetchLinkedProject(searchBy, props.config);
// break;
// case 'unlinked':
// props.fetchUnLinkedProject(searchBy, props.config);
// break;
// case 'published':
// props.fetchPublishedProject(searchBy, props.config);
// break;
// case 'autolinked':
// props.fetchAutoLinkedProjectAssets(searchBy, props.config);
// break;
// default:
// props.fetchProjects(searchBy, props.config);
// break;
// }
// } catch (e) {
// props.fetchProjects(searchBy, props.config);
// }
// };
// let projects = [];
// console.log("Console in Props List :", props);
// try {
// switch (selectedContractFilter) {
// case 'linked':
// projects = props.linkedProjects ? props.linkedProjects : [];
// break;
// case 'unlinked':
// projects = props.unLinkedProjects ? props.unLinkedProjects : [];
// break;
// case 'published':
// projects = props.publishedProjects ? props.publishedProjects : [];
// break;
// case 'autolinked':
// projects = props.autoLinkedProjects ? props.autoLinkedProjects : [];
// break;
// default:
// projects = props.projects ? props.projects : [];
// break;
// }
// } catch (e) {
// projects = props.projects ? props.projects : [];
// }
return(
<>
<ProjectFilter/>
<Card style={{margin: '1%', backgroundColor:'rgb(24 24 23)'}}>
<CardContent>
<FormControl className="select-field" variant="standard" style={{marginTop: '1%'}}>
<InputLabel htmlFor="contract-list" >Select Contract</InputLabel>
<Select
sx={{input: { color: 'white' }}}
value={''}
// onChange={props.handleContractFilterChange}
inputProps={{
name: 'contracts',
id: 'contract-type',
}}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="unlinked">Contract Pending</MenuItem>
<MenuItem value="linked">Contract Linked</MenuItem>
<MenuItem value="published">Contract Published</MenuItem>
</Select>
</FormControl>
<TextField
id="standard-name"
variant="standard"
label="Search By"
value={''}
sx={{input: { color: 'white' }}}
placeholder="Search By Title, Project Title, Contract No, Asset Title, Track Grid, ISRC"
// onChange={props.handleSearchByChange}
style={{marginLeft: '10%', width: '45%'}}
margin="normal"
/>
</CardContent>
</Card>
<ProjectList projectData={getProjectDataList}/>
</>
)