Files
edx-platform/lms/static/js/learner_analytics_dashboard/DueDates.jsx
Syed Ali Abbas Zaidi d7053a6783 fix: eslint autofixable issues (#32181)
* fix: eslint operator-linebreak issue

* fix: eslint quotes issue

* fix: react jsx indent and props issues

* fix: eslint trailing spaces issues

* fix: eslint line around directives issue

* fix: eslint semi rule

* fix: eslint newline per chain rule

* fix: eslint space infix ops rule

* fix: eslint space-in-parens issue

* fix: eslint space before function paren issue

* fix: eslint space before blocks issue

* fix: eslint arrow body style issue

* fix: eslint dot-location issue

* fix: eslint quotes issue

* fix: eslint quote props issue

* fix: eslint operator assignment issue

* fix: eslint new line after import issue

* fix: indent issues

* fix: operator assignment issue

* fix: all autofixable eslint issues

* fix: all react related fixable issues

* fix: autofixable eslint issues

* chore: remove all template literals

* fix: remaining autofixable issues

* fix: failing js test
2023-05-18 11:03:59 +05:00

77 lines
2.0 KiB
JavaScript

import React from 'react';
import classNames from 'classnames';
import PropTypes from 'prop-types';
const days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
class DueDates extends React.Component {
constructor(props) {
super(props);
}
getDate(str) {
const date = new Date(str);
const day = days[date.getDay()];
const month = months[date.getMonth()];
const number = date.getDate();
const year = date.getFullYear();
return `${day} ${month} ${number}, ${year}`;
}
getLabel(type) {
const {assignmentCounts} = this.props;
if (assignmentCounts[type] < 2) {
return type;
} else {
this.renderLabels[type] += 1;
return type + ' ' + this.renderLabels[type];
}
}
getList() {
const {dates, assignmentCounts} = this.props;
this.renderLabels = this.initLabelTracker(assignmentCounts);
return dates.sort((a, b) => new Date(a.due) > new Date(b.due))
.map(({format, due}, index) => (
<li className="date-item" key={index}>
<div className="label">{this.getLabel(format)}</div>
<div className="data">{this.getDate(due)}</div>
</li>
));
}
initLabelTracker(list) {
let labels = Object.keys(list);
return labels.reduce((accumulator, key) => {
accumulator[key] = 0;
return accumulator;
}, {});
}
renderList() {
return (
<ul className="date-list">
{this.getList()}
</ul>
);
}
render() {
return (
<div className="due-dates">
{this.renderList()}
</div>
);
}
}
DueDates.propTypes = {
dates: PropTypes.array.isRequired
};
export default DueDates;