it( 'it should handle when not multi day', () => {
action.payload.multiDay = false;
const moments = { start: 1, end: 2 };
const gen = sagas.handleMultiDay( action );
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( moments ).value ).toEqual(
call( momentUtil.replaceDate, moments.end, moments.start )
);
expect( gen.next( 3 ).value ).toEqual(
call( momentUtil.adjustStart, moments.start, 3 )
);
expect( gen.next( moments ).value ).toEqual(
all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} )
);
expect( gen.next( moments ).value ).toEqual(
all( [
put( actions.setStartDateTime( moments.start ) ),
put( actions.setEndDateTime( moments.end ) ),
] )
);
} );
it( 'it should set all day', () => {
const gen = sagas.setAllDay();
const moments = { start: 1, end: 2 };
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( moments ).value ).toEqual(
all( {
start: call( momentUtil.setTimeInSeconds, moments.start, 0 ),
end: call( momentUtil.setTimeInSeconds, moments.end, 86399 ),
} )
);
expect( gen.next().value ).toEqual(
all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} )
);
expect( gen.next( moments ).value ).toEqual(
all( [
put( actions.setStartDateTime( moments.start ) ),
put( actions.setEndDateTime( moments.end ) ),
put( actions.setAllDay( true ) ),
] )
);
} );
export function* handleMultiDay( action ) {
const isMultiDay = action.payload.multiDay;
const { start, end } = yield call( deriveMomentsFromDates );
if ( isMultiDay ) {
const RANGE_DAYS = yield call( applyFilters, 'tec.datetime.defaultRange', 3 );
// NOTE: Mutation
yield call( [ end, 'add' ], RANGE_DAYS, 'days' );
const endDate = yield call( momentUtil.toDateTime, end );
yield put( actions.setEndDateTime( endDate ) );
} else {
const newEnd = yield call( momentUtil.replaceDate, end, start );
const result = yield call( momentUtil.adjustStart, start, newEnd );
const dates = yield all( {
start: call( momentUtil.toDateTime, result.start ),
end: call( momentUtil.toDateTime, result.end ),
} );
yield all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
] );
}
}
export function* handleDateRangeChange( action ) {
const { to, from } = action.payload;
const moments = yield call( deriveMomentsFromDates );
const rangeMoments = yield all( {
from: call( momentUtil.toMoment, from ),
to: call( momentUtil.toMoment, to || from ),
} );
// NOTE: Mutation
yield all( {
start: call( momentUtil.replaceDate, moments.start, rangeMoments.from ),
end: call( momentUtil.replaceDate, moments.end, rangeMoments.to ),
} );
const result = yield call( momentUtil.adjustStart, moments.start, moments.end );
const dates = yield all( {
start: call( momentUtil.toDateTime, result.start ),
end: call( momentUtil.toDateTime, result.end ),
} );
yield all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
] );
}
export function* onHumanReadableChange() {
const label = yield select( selectors.getNaturalLanguageLabel );
const { start, end } = yield call( dateUtil.labelToDate, label );
if ( start === null && end === null ) {
yield call( resetNaturalLanguageLabel );
} else {
const moments = yield all( {
start: call( momentUtil.toMoment, start ),
end: call( momentUtil.toMoment, end || start ),
} );
const result = yield call( momentUtil.adjustStart, moments.start, moments.end );
const isMultiDay = ! ( yield call( momentUtil.isSameDay, result.start, result.end ) );
const isAllDay = ! isMultiDay && ( '00:00' === moments.start.format( 'HH:mm' ) && '23:59' === moments.end.format( 'HH:mm' ) );
const dates = yield all( {
start: call( momentUtil.toDateTime, result.start ),
end: call( momentUtil.toDateTime, result.end ),
} );
yield all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
put( actions.setMultiDay( isMultiDay ) ),
put( actions.setAllDay( isAllDay ) ),
] );
}
}
test( 'On change handler when dates are set', () => {
const gen = sagas.onHumanReadableChange();
const label = { start: '12-25-1995', end: '12-25-1995' };
const dates = {
start: moment( '12-25-1995', 'MM-DD-YYYY' ),
end: moment( '12-25-1995', 'MM-DD-YYYY' ),
};
expect( gen.next().value ).toEqual(
select( selectors.getNaturalLanguageLabel )
);
expect( gen.next( label ).value ).toEqual(
call( dateUtil.labelToDate, label )
);
expect( gen.next( label ).value ).toEqual(
all( {
start: call( momentUtil.toMoment, label.start ),
end: call( momentUtil.toMoment, label.end || label.start ),
} )
);
expect( gen.next( dates ).value ).toEqual(
call( momentUtil.adjustStart, dates.start, dates.end )
);
expect( gen.next( dates ).value ).toEqual(
call( momentUtil.isSameDay, dates.start, dates.end )
);
expect( gen.next( true ).value ).toEqual(
all( {
start: call( momentUtil.toDateTime, dates.start ),
end: call( momentUtil.toDateTime, dates.end ),
} )
);
expect( gen.next( dates ).value ).toEqual(
all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
put( actions.setMultiDay( false ) ),
] )
);
expect( gen.next().done ).toEqual( true );
} );
export function* handleEndTimeChange( action ) {
if ( action.payload.end === 'all-day' ) {
yield call( setAllDay );
} else {
// Set All day to false in case they're editing.
yield put( actions.setAllDay( false ) );
const { end } = yield call( deriveMomentsFromDates );
// NOTE: Mutation
yield call( momentUtil.setTimeInSeconds, end, action.payload.end );
const endDate = yield call( momentUtil.toDateTime, end );
yield put( actions.setEndDateTime( endDate ) );
}
}
export function* handleStartTimeChange( action ) {
if ( action.payload.start === 'all-day' ) {
yield call( setAllDay );
} else {
// Set All day to false in case they're editing.
yield put( actions.setAllDay( false ) );
const { start } = yield call( deriveMomentsFromDates );
// NOTE: Mutation
yield call( momentUtil.setTimeInSeconds, start, action.payload.start );
const startDate = yield call( momentUtil.toDateTime, start );
yield put( actions.setStartDateTime( startDate ) );
}
}
export function* preventEndTimeBeforeStartTime( action ) {
const isMultiDay = yield select( selectors.getMultiDay );
// Do not proceed when multi-day
if ( isMultiDay ) {
return;
}
const seconds = yield call( deriveSecondsFromDates );
// Prevent only date changes from using payload
if ( [ types.SET_END_TIME, types.SET_START_TIME ].includes( action.type ) ) {
// Update seconds to use payload
// NOTE: Mutation
yield call( [ Object, 'assign' ], seconds, action.payload );
}
// If end time is earlier than start time, fix time
if ( seconds.end <= seconds.start ) {
// If there is less than half an hour left in the day, roll back one hour
if ( seconds.start + HALF_HOUR_IN_SECONDS >= DAY_IN_SECONDS ) {
seconds.start -= HOUR_IN_SECONDS;
}
seconds.end = seconds.start + HALF_HOUR_IN_SECONDS;
const moments = yield call( deriveMomentsFromDates );
// NOTE: Mutation
yield all( {
start: call( momentUtil.setTimeInSeconds, moments.start, seconds.start ),
end: call( momentUtil.setTimeInSeconds, moments.end, seconds.end ),
} );
const dates = yield all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} );
yield all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
] );
}
}
it( 'should update date range', () => {
const payload = { from: '2015-01-01', to: '2015-01-10' };
const action = { payload };
const moments = {
from: moment( payload.from, 'MM-DD-YYYY' ),
to: moment( payload.to, 'MM-DD-YYYY' ),
};
const gen = sagas.handleDateRangeChange( action );
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( moments ).value ).toEqual(
all( {
from: call( momentUtil.toMoment, payload.from ),
to: call( momentUtil.toMoment, payload.to || payload.from ),
} )
);
expect( gen.next( moments ).value ).toMatchSnapshot();
expect( gen.next().value ).toEqual(
call( momentUtil.adjustStart, moments.start, moments.end )
);
expect( gen.next( { start: 1, end: 2 } ).value ).toEqual(
all( {
start: call( momentUtil.toDateTime, 1 ),
end: call( momentUtil.toDateTime, 2 ),
} )
);
expect( gen.next( { start: 1, end: 2 } ).value ).toEqual(
all( [
put( actions.setStartDateTime( 1 ) ),
put( actions.setEndDateTime( 2 ) ),
] )
);
expect( gen.next().done ).toEqual( true );
} );
export function* setAllDay() {
const moments = yield call( deriveMomentsFromDates );
// NOTE: Mutation
yield all( {
start: call( momentUtil.setTimeInSeconds, moments.start, 0 ),
end: call( momentUtil.setTimeInSeconds, moments.end, timeUtil.DAY_IN_SECONDS - 1 ),
} );
const dates = yield all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} );
yield all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
put( actions.setAllDay( true ) ),
] );
}
it( 'should roll back start time when exceeds day time', () => {
action.payload.start = seconds.start = seconds.end = 86400;
const gen = sagas.preventEndTimeBeforeStartTime( action );
expect( gen.next().value ).toEqual(
select( selectors.getMultiDay )
);
expect( gen.next().value ).toEqual(
call( sagas.deriveSecondsFromDates )
);
expect( gen.next( seconds ).value ).toEqual(
call( [ Object, 'assign' ], seconds, action.payload )
);
expect( gen.next( seconds ).value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
const moments = { start: 1, end: 2 };
expect( gen.next( moments ).value ).toEqual(
all( {
start: call( momentUtil.setTimeInSeconds, moments.start, seconds.start ),
end: call( momentUtil.setTimeInSeconds, moments.end, seconds.end ),
} )
);
expect( gen.next( moments ).value ).toEqual(
all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} )
);
expect( gen.next( moments ).value ).toEqual(
all( [
put( actions.setStartDateTime( moments.start ) ),
put( actions.setEndDateTime( moments.end ) ),
] )
);
expect( gen.next().done ).toEqual( true );
} );
export function* setHumanReadableLabel( dates = {} ) {
const currentLabel = yield select( selectors.getNaturalLanguageLabel );
if ( currentLabel === '' ) {
return;
}
const updatedLabel = yield call( dateUtil.rangeToNaturalLanguage, dates.start, dates.end );
if ( currentLabel !== updatedLabel ) {
yield put( actions.setNaturalLanguageLabel( updatedLabel ) );
}
}
export function* preventStartTimeAfterEndTime( action ) {
const isMultiDay = yield select( selectors.getMultiDay );
// Do not proceed when multi-day
if ( isMultiDay ) {
return;
}
const seconds = yield call( deriveSecondsFromDates );
// Prevent only date changes from using payload
if ( [ types.SET_END_TIME, types.SET_START_TIME ].includes( action.type ) ) {
// Update seconds to use payload
// NOTE: Mutation
yield call( [ Object, 'assign' ], seconds, action.payload );
}
if ( seconds.start >= seconds.end ) {
seconds.start = Math.max( seconds.end - HALF_HOUR_IN_SECONDS, 0 );
seconds.end = Math.max( seconds.start + MINUTE_IN_SECONDS, seconds.end );
const moments = yield call( deriveMomentsFromDates );
// NOTE: Mutation
yield all( {
start: call( momentUtil.setTimeInSeconds, moments.start, seconds.start ),
end: call( momentUtil.setTimeInSeconds, moments.end, seconds.end ),
} );
const dates = yield all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} );
yield all( [
put( actions.setStartDateTime( dates.start ) ),
put( actions.setEndDateTime( dates.end ) ),
] );
}
}
test( 'When called from end date', () => {
const formated = toDateTime( moment( '12-25-2018', 'MM-DD-YYYY' ) );
const gen = sagas.setHumanReadableFromDate( actions.setEndDateTime( formated ) );
expect( gen.next().value ).toEqual(
select( selectors.getStart )
);
expect( gen.next().value ).toEqual(
select( selectors.getEnd ),
);
expect( gen.next().value ).toEqual(
call( sagas.setHumanReadableLabel, { start: undefined, end: '2018-12-25 00:00:00' } )
);
expect( gen.next().done ).toBe( true );
} );
it( 'should handle when start time would be on previous day', () => {
const gen = sagas.preventStartTimeAfterEndTime( action );
expect( gen.next().value ).toEqual(
select( selectors.getMultiDay )
);
expect( gen.next().value ).toEqual(
call( sagas.deriveSecondsFromDates )
);
expect( gen.next( seconds ).value ).toEqual(
call( [ Object, 'assign' ], seconds, action.payload )
);
expect( gen.next( seconds ).value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
const moments = { start: 1, end: 2 };
expect( gen.next( moments ).value ).toEqual(
all( {
start: call( momentUtil.setTimeInSeconds, moments.start, seconds.start ),
end: call( momentUtil.setTimeInSeconds, moments.end, seconds.end ),
} )
);
expect( gen.next( moments ).value ).toEqual(
all( {
start: call( momentUtil.toDateTime, moments.start ),
end: call( momentUtil.toDateTime, moments.end ),
} )
);
expect( gen.next( moments ).value ).toEqual(
all( [
put( actions.setStartDateTime( moments.start ) ),
put( actions.setEndDateTime( moments.end ) ),
] )
);
expect( gen.next().done ).toEqual( true );
} );
it( 'should set end time input', () => {
const end = 'January 1, 2018';
const gen = sagas.setEndTimeInput();
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( { end } ).value ).toEqual(
call( momentUtil.toTime, end )
);
expect( gen.next( end ).value ).toEqual(
put( actions.setEndTimeInput( end ) )
);
expect( gen.next().done ).toEqual( true );
} );
it( 'should set start time input', () => {
const start = 'January 1, 2018';
const gen = sagas.setStartTimeInput();
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( { start } ).value ).toEqual(
call( momentUtil.toTime, start )
);
expect( gen.next( start ).value ).toEqual(
put( actions.setStartTimeInput( start ) )
);
expect( gen.next().done ).toEqual( true );
} );
test( 'Set timezone label on timezone change', () => {
const action = {
payload: {
timeZone: 'America/Los_Angeles',
},
};
const gen = sagas.onTimeZoneChange( action );
expect( gen.next().value ).toEqual(
put( actions.setTimeZoneLabel( action.payload.timeZone ) )
);
expect( gen.next().done ).toEqual( true );
} );
it( 'it should handle multi day', () => {
const moments = { start: 1, end: { add: jest.fn() } };
const gen = sagas.handleMultiDay( action );
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( moments ).value ).toEqual(
call( applyFilters, 'tec.datetime.defaultRange', 3 )
);
expect( gen.next( 3 ).value ).toEqual(
call( [ moments.end, 'add' ], 3, 'days' )
);
expect( gen.next().value ).toEqual(
call( momentUtil.toDateTime, moments.end )
);
expect( gen.next( 5 ).value ).toEqual(
put( actions.setEndDateTime( 5 ) )
);
} );
it( 'should handle end time change', () => {
const action = {
payload: {
end: 50000,
},
};
const gen = sagas.handleEndTimeChange( action );
expect( gen.next().value ).toEqual(
call( sagas.deriveMomentsFromDates )
);
expect( gen.next( { end: 55000 } ).value ).toEqual(
call( momentUtil.setTimeInSeconds, 55000, action.payload.end )
);
expect( gen.next().value ).toEqual(
call( momentUtil.toDateTime, 55000 )
);
expect( gen.next( '2017-01-01' ).value ).toEqual(
put( actions.setEndDateTime( '2017-01-01' ) )
);
expect( gen.next().done ).toEqual( true );
} );
test( 'Custom data is provided', () => {
const dates = {
start: moment( '12-25-2017', 'MM-DD-YYYY' ),
end: moment( '12-25-2018', 'MM-DD-YYYY' ),
};
const gen = sagas.setHumanReadableLabel( dates );
expect( gen.next().value ).toEqual(
select( selectors.getNaturalLanguageLabel ),
);
expect( gen.next().value ).toEqual(
call( dateUtil.rangeToNaturalLanguage, dates.start, dates.end ),
);
const expected = 'December 25 2017 at 12:00 am - December 25 2018 at 12:00 am';
expect( gen.next( expected ).value ).toEqual(
put( actions.setNaturalLanguageLabel( expected ) ),
);
expect( gen.next().done ).toEqual( true );
} );
it( 'Should set the editability', () => {
expect( reducer( DEFAULT_STATE, actions.allowEdits() ) ).toMatchSnapshot();
expect( reducer( DEFAULT_STATE, actions.disableEdits() ) ).toMatchSnapshot();
} );
it( 'Should set the date input visibility', () => {
expect( reducer( DEFAULT_STATE, actions.setDateInputVisibility( true ) ) ).toMatchSnapshot();
expect( reducer( DEFAULT_STATE, actions.setDateInputVisibility( false ) ) ).toMatchSnapshot();
} );
it( 'Should set the natural language label', () => {
expect( reducer( DEFAULT_STATE, actions.setNaturalLanguageLabel( '2 weeks from now' ) ) )
.toMatchSnapshot();
} );
it( 'Should set the multi day', () => {
expect( reducer( DEFAULT_STATE, actions.setMultiDay( true ) ) ).toMatchSnapshot();
expect( reducer( DEFAULT_STATE, actions.setMultiDay( false ) ) ).toMatchSnapshot();
} );
it( 'Should set the visibility of the timezone', () => {
expect( reducer( DEFAULT_STATE, actions.setTimeZoneVisibility( true ) ) ).toMatchSnapshot();
expect( reducer( DEFAULT_STATE, actions.setTimeZoneVisibility( false ) ) ).toMatchSnapshot();
} );
it( 'Should set the timezone label', () => {
expect( reducer( DEFAULT_STATE, actions.setTimeZoneLabel( 'Modern Tribe' ) ) )
.toMatchSnapshot();
} );
it( 'Should set the timezone', () => {
expect( reducer( DEFAULT_STATE, actions.setTimeZone( 'UTC' ) ) ).toMatchSnapshot();
} );
it( 'Should set the separator date', () => {
expect( reducer( DEFAULT_STATE, actions.setSeparatorDate( ' > ' ) ) ).toMatchSnapshot();
} );