1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 | 1x 1x 1x 1x 1x 56x 88x 1x 1x | import React from 'react'; import PropTypes from 'prop-types'; import { borderWidth } from '@bufferapp/components/style/border'; import { mystic, geyser, } from '@bufferapp/components/style/color'; import ScheduleTableHeader from '../ScheduleTableHeader'; import ScheduleTableCell from '../ScheduleTableCell'; const columnHeight = '8rem'; const columnStyle = { width: 0, minHeight: columnHeight, textAlign: 'center', borderRight: `${borderWidth} solid ${mystic}`, flexGrow: 1, }; const columnNoTimesStyle = { width: 0, minHeight: columnHeight, color: geyser, textAlign: 'center', borderRight: `${borderWidth} solid ${mystic}`, flexGrow: 1, }; const columnWrapperStyle = { paddingTop: '0.5rem', paddingBottom: '0.5rem', }; const ScheduleTableColumn = ({ dayName, disabled, select24Hours, times, onPauseToggleClick, paused, profileId, }) => ( <div style={(times.length === 0) ? columnNoTimesStyle : columnStyle}> <ScheduleTableHeader dayName={dayName} postingTimesTotal={times.length} paused={paused} onPauseToggleClick={onPauseToggleClick} profileId={profileId} disabled={disabled} /> <div style={columnWrapperStyle}> { times.map((time, index) => <ScheduleTableCell disabled={disabled} key={index} select24Hours={select24Hours} time={time} />, ) } </div> </div> ); ScheduleTableColumn.defaultProps = { disabled: false, select24Hours: false, paused: false, }; ScheduleTableColumn.propTypes = { dayName: PropTypes.string.isRequired, disabled: PropTypes.bool.isRequired, select24Hours: PropTypes.bool.isRequired, paused: PropTypes.bool, times: PropTypes.arrayOf( PropTypes.shape({ value: PropTypes.oneOfType([ PropTypes.shape({ hours: PropTypes.number.isRequired, minutes: PropTypes.number.isRequired, }), PropTypes.string, ]), onChange: PropTypes.func.isRequired, onRemoveTimeClick: PropTypes.func.isRequired, }).isRequired, ).isRequired, onPauseToggleClick: PropTypes.func.isRequired, profileId: PropTypes.string.isRequired, }; export default ScheduleTableColumn; |