Page Menu
Home
c4science
Search
Configure Global Search
Log In
Files
F71283814
TermCard.js
No One
Temporary
Actions
Download File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Subscribers
None
File Metadata
Details
File Info
Storage
Attached
Created
Wed, Jul 10, 19:41
Size
7 KB
Mime Type
text/html
Expires
Fri, Jul 12, 19:41 (2 d)
Engine
blob
Format
Raw Data
Handle
18931654
Attached To
rOACCT Open Access Compliance Check Tool (OACCT)
TermCard.js
View Options
import React, {useContext} from "react"
import { Card } from 'react-bootstrap';
import { makeStyles } from '@material-ui/core/styles';
import Chip from '@material-ui/core/Chip';
import DoneIcon from '@material-ui/icons/Done';
import HighlightOffIcon from '@material-ui/icons/HighlightOff';
import Accordion from '@material-ui/core/Accordion';
import AccordionSummary from '@material-ui/core/AccordionSummary';
import AccordionDetails from '@material-ui/core/AccordionDetails';
import Typography from '@material-ui/core/Typography';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import DateRangeIcon from '@material-ui/icons/DateRange';
import InfoIcon from '@material-ui/icons/Info';
import DescriptionIcon from '@material-ui/icons/Description';
import Grid from '@material-ui/core/Grid';
import { FaCoins } from 'react-icons/fa';
import { RiFilePaper2Line } from 'react-icons/ri';
import {Context} from "../Context"
import "./termcard.css"
const useStyles = makeStyles((theme) =>({
card: {
width: '100%',
marginTop: "1rem",
},
root: {
flexGrow: 1,
},
chip: {
margin: 0.5,
},
heading: {
fontSize: theme.typography.pxToRem(15),
fontWeight: theme.typography.fontWeightRegular,
},
}))
function TermCard({term}) {
const classes = useStyles();
const { institName, journalName } = useContext(Context)
console.log(term)
const licenceDetail = term.licence.map(i=>(
<div key={i.id}>
<h4>Licence Details</h4>
{i.name}
{i.name_or_abbrev}
<br />
<a href={i.website} target="_blank" rel="noopener noreferrer">{i.website}</a>
</div>
))
function licence (){
const lockstatus = term.licence.map(i=>(
i.name_or_abbrev
))
if (lockstatus[0] === "CC-BY") {
return (
<Chip
size="small"
avatar={ <RiFilePaper2Line />}
label={lockstatus}
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
className={classes.chip}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
)
}
else {
return(
<Chip
size="small"
avatar={ <RiFilePaper2Line />}
label={lockstatus}
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
className={classes.chip}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
)
}
}
function version() {
const vers = term.version.map(i => (
i.description
))
const id = term.version.map(i => (
i.id
))
// console.log(vers[0])
if (vers[0] === "Submitted") {
return (
<Chip
key={id[0]}
avatar={ <DescriptionIcon />}
label="Submitted Version"
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
className={classes.chip}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
)
}
else if (vers[0] === "Accepted") {
return (
<Chip
key={id[0]}
avatar={ <DescriptionIcon />}
label="Accepted Version"
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
className={classes.chip}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
)
}
else if (vers[0] === "Published") {
return (
<Chip
key={id[0]}
avatar={ <DescriptionIcon />}
label="Published Version"
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
className={classes.chip}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
)
}
}
function cost() {
const price = term.cost_factor.map(i => (
i.amount
))
const price_symbol = term.cost_factor.map(j => (
j.symbol
))
const cost_name = term.cost_factor.map(k => (
k.cost_factor_type[0].name
))
const id = term.cost_factor.map(k => (
k.cost_factor_type[0].id
))
return (
<Chip
key={id[0]}
size="small"
avatar={ <FaCoins />}
label={cost_name[0] + " : " + price[0] + " " + price_symbol}
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
className={classes.chip}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
)
}
const termArchive = term.ir_archiving ? (
<Chip
size="small"
avatar={<DoneIcon />}
label={"IR Archiving"}
// variant="outlined"
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
): (
<Chip
size="small"
avatar={<HighlightOffIcon />}
label="IR Archiving"
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
style={{ background: "#f50057"}}
title="This is more information"
/>
)
const embargo = term.ir_archiving ? (
<Chip
size="small"
avatar={<DateRangeIcon />}
label={"Embargo: " + term.embargo_months + " Month(s)"}
// variant="outlined"
// clickable={handleClick}
// color="secondary"
// onDelete={handleDelete}
style={{ background: "#FFFFFF"}}
title="This is more information"
/>
):
(<a />)
return (
<div className={classes.root}>
<Accordion key={term.id}>
<AccordionSummary
expandIcon={<ExpandMoreIcon />}
aria-controls="panel1a-content"
id="panel1a-header"
>
<Typography className={classes.heading}>
{version()} |
{cost()}
{licence()}
{termArchive}
{embargo}
| {term.comment}
<Card.Link href={term.source} target="blank" rel="noopener noreferrer"> <InfoIcon style={{ color: "white" }} href={term.source} /></Card.Link>
</Typography>
</AccordionSummary>
<AccordionDetails>
<Typography>
{licenceDetail}
</Typography>
</AccordionDetails>
</Accordion>
</div>
)
}
export default TermCard
Event Timeline
Log In to Comment