Skip to content

Commit

Permalink
Merge branch 'main' into ui-designs
Browse files Browse the repository at this point in the history
  • Loading branch information
paritshivani authored Apr 4, 2024
2 parents 9f33922 + 4472f03 commit 928aedf
Show file tree
Hide file tree
Showing 3 changed files with 122 additions and 45 deletions.
18 changes: 13 additions & 5 deletions packages/nulp_elite/src/components/filter.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,23 @@ import React from "react";
import Autocomplete from "@mui/material/Autocomplete";
import TextField from "@mui/material/TextField";

export default function Filter({}) {
const Filter = ({ options, label, onChange }) => {
const handleFilterChange = (event, selectedValues) => {
onChange(selectedValues);
};

return (
<Autocomplete
multiple
disablePortal
id="combo-box-demo"
options={options}
sx={{ width: "100%", background: "#fff" }}
renderInput={(params) => (
<TextField {...params} label="Filter by Designation" />
)}
onChange={handleFilterChange}
renderInput={(params) => <TextField {...params} label={label} />}
/>
);
}
};

export default Filter;

144 changes: 105 additions & 39 deletions packages/nulp_elite/src/pages/search/ContentList.js
Original file line number Diff line number Diff line change
@@ -1,21 +1,17 @@
// Profile.js

import React, { useState, useEffect } from "react";
import URLSConfig from "../../configs/urlConfig.json";
import { Link, useParams,useNavigate,useLocation } from "react-router-dom";
import { Link, useParams, useNavigate, useLocation } from "react-router-dom";
import BoxCard from "components/Card";
import Box from '@mui/material/Box';
import Box from "@mui/material/Box";
import Search from "components/search";
import Filter from "components/filter";
import contentData from "../../assets/contentSerach.json"
import Grid from '@mui/material/Grid';
import Footer from "components/Footer";
import Header from "components/header";
import Container from '@mui/material/Container';
import Filter from "components/filter";
import contentData from "../../assets/contentSerach.json";
import Grid from "@mui/material/Grid";
import Footer from "components/Footer";
import Header from "components/header";
import Container from "@mui/material/Container";
import { contentService } from "@shiksha/common-lib";



const ContentList = (props) => {
const [search, setSearch] = React.useState(true);
const [searchState, setSearchState] = React.useState(false);
Expand All @@ -27,20 +23,27 @@ const ContentList = (props) => {
const [filters, setFilters] = useState({});
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState(null);
const [gradeLevels, setGradeLevels] = useState([]);
const navigate = useNavigate();
const location = useLocation();
const { domain } = location.state || {};

// Example of API Call
useEffect(() => {
// Example of API Call
useEffect(() => {
fetchData();
fetchGradeLevels(); // Fetch grade levels when component mounts
}, [filters]);

const handleFilterChange = (selectedOptions) => {
const selectedValues = selectedOptions.map((option) => option.value);
setFilters({ ...filters, se_gradeleverl: selectedValues });
};

const fetchData = async () => {
setIsLoading(true);
setError(null);
// Filters for API
let data = JSON.stringify({
let requestData = {
request: {
filters: {
status: ["Live"],
Expand All @@ -58,14 +61,18 @@ const ContentList = (props) => {
"eTextBook",
"TVLesson",
],
se_boards: [domain]
se_boards: [domain],
se_gradeLevels: filters.se_gradeleverl, // Access selected grade levels from filters state
},
offset: null,
sort_by: {
lastUpdatedOn: "desc",
},
},
});
};

// Convert request data to JSON string
let data = JSON.stringify(requestData);

// Headers
const headers = {
Expand All @@ -74,53 +81,112 @@ const ContentList = (props) => {

const url = `http://localhost:3000/content/${URLSConfig.URLS.CONTENT.SEARCH}?orgdetails=orgName,email`;
try {
const response = await contentService.getAllContents(
url,
data,
headers
);
const response = await contentService.getAllContents(url, data, headers);
console.log(response.data.result);
setData(response.data.result);
} catch (error) {
console.log("error---",error);

console.log("error---", error);
setError(error.message);
} finally {
console.log("finally---");
setIsLoading(false);
}
};

const fetchGradeLevels = async () => {
try {
const response = await fetch(
"http://localhost:3000/api/framework/v1/read/nulp?categories=gradeLevel"
);
const data = await response.json();
if (
data.result &&
data.result.framework &&
data.result.framework.categories
) {
const gradeLevelCategory = data.result.framework.categories.find(
(category) => category.identifier === "nulp_gradelevel"
);
if (gradeLevelCategory && gradeLevelCategory.terms) {
const gradeLevelsOptions = gradeLevelCategory.terms.map((term) => ({
value: term.code,
label: term.name,
}));
setGradeLevels(gradeLevelsOptions);
}
}
} catch (error) {
console.error("Error fetching grade levels:", error);
}
};

return (
<div>
<Header/>
<Box sx={{background:'#2D2D2D',padding:'20px'}}>
<p style={{fontSize:'20px',fontWeight:'700',color:'#fff',paddingBottom:'5px',margin:'0'}}>Explore content related to your domain.Learn from well curated courses and content.</p>
<p style={{fontSize:'16px',fontWeight:'700',color:'#C1C1C1',margin:'0',paddingBottom:'30px'}}>Learn from well curated courses and content.</p>
<Header />
<Box sx={{ background: "#2D2D2D", padding: "20px" }}>
<p
style={{
fontSize: "20px",
fontWeight: "700",
color: "#fff",
paddingBottom: "5px",
margin: "0",
}}
>
Explore content related to your domain.
Learn from well curated
courses and content.
</p>
<p
style={{
fontSize: "16px",
fontWeight: "700",
color: "#C1C1C1",
margin: "0",
paddingBottom: "30px",
}}
>
Learn from well curated courses and content.
</p>
<Search></Search>
</Box>

<Container maxWidth="xxl" role="main" className="container-pb">
<domainCarousel></domainCarousel>
<Box style={{margin:'20px 0'}}>
<Filter/>
<Box style={{ margin: "20px 0" }}>
<domainCarousel></domainCarousel>
<Filter
options={gradeLevels}
label="Filter by Grade Level"
onChange={handleFilterChange}
/>
</Box>

<Box textAlign="center" padding="10">
<Box sx={{paddingTop:'30px'}}>
<Grid container spacing={2} style={{margin:'20px 0', marginBottom:'10px'}}>
{data && data.content && data.content.map((items) => (
<Grid item xs={12} md={6} lg={3} style={{marginBottom:'10px'}}>
<BoxCard items ={items}></BoxCard>
</Grid>
))}
<Box sx={{ paddingTop: "30px" }}>
<Grid
container
spacing={2}
style={{ margin: "20px 0", marginBottom: "10px" }}
>
{data &&
data.content &&
data.content.map((items) => (
<Grid
item
xs={12}
md={6}
lg={3}
style={{ marginBottom: "10px" }}
>
<BoxCard items={items}></BoxCard>
</Grid>
))}
</Grid>
</Box>
</Box>
</Container>
<Footer/>
<Footer />
</div>
);
};
export default ContentList;

5 changes: 4 additions & 1 deletion packages/nulp_elite/src/services/contentService.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ export const getAllContents = async (url, filters = {}, header = {}) => {
};
// Get one content

export const getOne = async (url, header = {}) => {
const getOne = async (url, header = {}) => {
const result = await get(url, {
header,
});
Expand All @@ -34,3 +34,6 @@ export const update = async (data = {}, headers = {}) => {
return {};
}
};

export default update;

0 comments on commit 928aedf

Please sign in to comment.