re-refactored code for BlackFeather97

// https://www.reddit.com/r/badcode/comments/dl1zd8

import React, { Component } from 'react';

import SubjectCell from './SubjectCell';
import "../style/SubjectSelectionTable.css";

import { dayNames, periodNames } from "../objects/Period";

export default class SubjectSelectionTable extends Component {

    render() {
        return this.renderSubjectTable({
            dayNames: dayNames,
            periodNames: periodNames,
            subjects: this.props.subjects,
            selectedSubject: this.props.selectedSubject,
        });
    }

    renderSubjectTable({dayNames, periodNames, subjects, selectedSubject}) {
        return <div classname="subjectTable">
            {dayNames
                .map((name, index) => ({
                    dayName: name,
                    dayNum: index,
                    daySubjects: subjects.filter(s => s.period.day = dayNum),
                    periodNames: periodNames,
                    selectedSubject: selectedSubject,
                }))
                .filter(t => t.daySubjects.length > 0)
                .map(t => this.renderDay(t))}
        </div>
    }

    renderDay({dayName, dayNum, daySubjects, periodNames, selectedSubject}) {
        return <React.Fragment key={dayNum}>
            <div className="dayName scheduleRow">{dayName}</div>
            {periodNames
                .map((periodName, periodNum) => ({
                    periodName: periodName,
                    periodSubjects: daySubjects
                        .filter(subject => subject.period.period = periodNum),
                    selectedSubject: selectedSubject,
                }))
                .filter(t => t.periodSubjects.length > 0)
                .map(t => this.renderPeriod(t))}
        </React.Fragment>
    }

    renderPeriod({periodName, periodSubjects, selectedSubject}) {
        return <div key={period} className="subjectsRow scheduleRow">
            <div className="periodName">{periodName}</div>
            <div className="subjectsSubRow">
                {periodSubjects.map(subject =>
                    <SubjectCell
                        subject={subject}
                        bold={subject.id === selectedSubject}
                        key={subject.id}
                    />
                )}
            </div>
        </div>
    }
}