72 lines
1.9 KiB
72 lines
1.9 KiB
import React from "react"; |
|
import Avatar from "@mui/material/Avatar"; |
|
import { Link } from "react-router-dom"; |
|
import { connect } from "react-redux"; |
|
import _ from "lodash"; |
|
|
|
function Course({ data, theme, setActiveBook }: any) { |
|
return ( |
|
<> |
|
<div |
|
className={_.join( |
|
[ |
|
"home-courses-course desktop flex-column", |
|
theme === "light" |
|
? "home-courses-course-light" |
|
: "home-courses-course-dark", |
|
], |
|
" " |
|
)} |
|
onClick={() => setActiveBook(data)} |
|
draggable={"false"} |
|
> |
|
<img |
|
src={`https://dnvn.ir/api/v1/file/${data.fileIds}`} |
|
alt={data.name} |
|
draggable={"false"} |
|
/> |
|
<footer className="d-flex"> |
|
<Avatar |
|
src={`https://dnvn.ir/api/v1/file/${data.fileIds}`} |
|
style={{ width: 40, height: 40 }} |
|
/> |
|
<div className="home-courses-course__info d-flex flex-column"> |
|
<h2>{data.name}</h2> |
|
</div> |
|
</footer> |
|
</div> |
|
<Link |
|
to={`/courses/${data.id}`} |
|
className={_.join( |
|
[ |
|
"home-courses-course mobile flex-column", |
|
theme === "light" |
|
? "home-courses-course-light" |
|
: "home-courses-course-dark", |
|
], |
|
" " |
|
)} |
|
draggable={"false"} |
|
> |
|
<img |
|
src={`https://dnvn.ir/api/v1/file/${data.fileIds}`} |
|
alt={data.name} |
|
draggable={"false"} |
|
/> |
|
<footer className="d-flex"> |
|
<Avatar |
|
src={`https://dnvn.ir/api/v1/file/${data.fileIds}`} |
|
style={{ width: 40, height: 40 }} |
|
/> |
|
<div className="home-courses-course__info d-flex flex-column"> |
|
<h2>{data.name}</h2> |
|
</div> |
|
</footer> |
|
</Link> |
|
</> |
|
); |
|
} |
|
|
|
export default connect((state: any) => ({ |
|
theme: state.publicApi.theme, |
|
}))(Course);
|
|
|