API 개발

<TimeTable>
                {_.range(9, 19).map((hour, index, array) => {
                  const firstHalfChecked = checkedDateTime.some(
                    datetime => datetime.format('H:mm') === `${hour}:00`,
                  );
                  const secondHalfChecked = checkedDateTime.some(
                    datetime => datetime.format('H:mm') === `${hour}:30`,
                  );
                  const firstHalfDateTime = moment(selectedDateTime)
                    .set('hours', hour)
                    .set('minutes', 0);
                  const secondHalfDateTime = moment(selectedDateTime)
                    .set('hours', hour)
                    .set('minutes', 30);
                  const firstHalfReserved = reservations
                    .filter(r => r.roomId === roomId)
                    .some(
                      r =>
                        firstHalfDateTime.isSame(r.start) ||
                        firstHalfDateTime.isBetween(
                          moment(r.start),
                          moment(r.end),
                        ),
                    );
                  const secondHalfReserved = reservations
                    .filter(r => r.roomId === roomId)
                    .some(
                      r =>
                        secondHalfDateTime.isSame(r.start) ||
                        secondHalfDateTime.isBetween(
                          moment(r.start),
                          moment(r.end),
                        ),
                    );

                  return (
                    <Fragment key={hour}>
                      <Time
                        active={firstHalfChecked}
                        disabled={firstHalfReserved}
                      >
                        <input
                          type={'checkbox'}
                          value={`${hour}:00`}
                          checked={firstHalfChecked}
                          disabled={firstHalfReserved}
                          onChange={toggleSelectTime}
                        />
                        <span className={'time'}>{`${numberFormatting(
                          hour,
                        )}:00 ~ ${numberFormatting(hour)}:30`}</span>
                        <span className={'name'}>회의명</span>
                      </Time>
                      {index + 1 !== array.length && (
                        <Time
                          active={secondHalfChecked}
                          disabled={secondHalfReserved}
                        >
                          <input
                            type={'checkbox'}
                            value={`${hour}:30`}
                            checked={secondHalfChecked}
                            disabled={firstHalfReserved}
                            onChange={toggleSelectTime}
                          />
                          <span className={'time'}>{`${numberFormatting(
                            hour,
                          )}:30 ~ ${numberFormatting(hour + 1)}:00`}</span>
                          <span className={'name'}>회의명</span>
                        </Time>
                      )}
                    </Fragment>
                  );
                })}
              </TimeTable>