Skip to content

Commit

Permalink
Remove unneeded parameters
Browse files Browse the repository at this point in the history 
Many methods receive arguments related to object state, which they
can access. This might create confusion and inconsistency about the
source of truth. So I removed unnecessary parameters.
  • Loading branch information
@onlined
onlined committed Sep 21, 2020
1 parent 3258157 commit d445003
Show file tree
Hide file tree
Showing 5 changed files with 168 additions and 155 deletions.
97 changes: 51 additions & 46 deletions src/datetime/DateTime.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,15 +81,15 @@ export default class Datetime extends React.Component {

constructor( props ) {
super( props );
this.state = this.getInitialState( props );
this.state = this.getInitialState();
}

render() {
return (
<ClickableWrapper className={ this.getClassName() } onClickOut={ this._handleClickOutside }>
{ this.renderInput() }
<div className="rdtPicker">
{ this.renderView( this.state.currentView, this._renderCalendar ) }
{ this.renderView() }
</div>
</ClickableWrapper>
);
Expand Down Expand Up @@ -121,14 +121,14 @@ export default class Datetime extends React.Component {
);
}

renderView( currentView, renderer ) {
renderView() {
if ( this.props.renderView ) {
return this.props.renderView( currentView, () => renderer(currentView) );
return this.props.renderView( this.state.currentView, () => this._renderCalendar() );
}
return renderer( this.state.currentView );
return this._renderCalendar();
}

_renderCalendar = currentView => {
_renderCalendar = () => {
const props = this.props;
const state = this.state;

Expand All @@ -144,7 +144,7 @@ export default class Datetime extends React.Component {

// Probably updateOn, updateSelectedDate and setDate can be merged in the same method
// that would update viewDate or selectedDate depending on the view and the dateFormat
switch ( currentView ) {
switch ( state.currentView ) {
case viewModes.YEARS:
// Used viewProps
// { viewDate, selectedDate, renderYear, isValidDate, navigate, showView, updateDate }
Expand Down Expand Up @@ -172,31 +172,32 @@ export default class Datetime extends React.Component {
}
}

getInitialState( p ) {
let props = p || this.props;
getInitialState() {
let props = this.props;
let inputFormat = this.getFormat('datetime');
let selectedDate = this.parseDate( props.value || props.initialValue, inputFormat );

this.checkTZ( props );
this.checkTZ();

return {
open: !props.input,
currentView: props.initialViewMode || this.getInitialView( this.getFormat('date') ),
viewDate: this.getInitialViewDate( props.initialViewDate, selectedDate, inputFormat ),
currentView: props.initialViewMode || this.getInitialView(),
viewDate: this.getInitialViewDate( selectedDate ),
selectedDate: selectedDate && selectedDate.isValid() ? selectedDate : undefined,
inputValue: this.getInitialInputValue( props, selectedDate, inputFormat )
inputValue: this.getInitialInputValue( selectedDate )
};
}

getInitialViewDate( propDate, selectedDate, format ) {
getInitialViewDate( selectedDate ) {
const propDate = this.props.initialViewDate;
let viewDate;
if ( propDate ) {
viewDate = this.parseDate( propDate, format );
viewDate = this.parseDate( propDate, this.getFormat('datetime') );
if ( viewDate && viewDate.isValid() ) {
return viewDate;
}
else {
this.log('The initialViewDated given "' + propDate + '" is not valid. Using current date instead.');
log('The initialViewDated given "' + propDate + '" is not valid. Using current date instead.');
}
}
else if ( selectedDate && selectedDate.isValid() ) {
Expand All @@ -211,9 +212,9 @@ export default class Datetime extends React.Component {
return m;
}

getInitialView( dateFormat ) {
if ( !dateFormat ) return viewModes.TIME;
return this.getUpdateOn( dateFormat );
getInitialView() {
const dateFormat = this.getFormat( 'date' );
return dateFormat ? this.getUpdateOn( dateFormat ) : viewModes.TIME;
}

parseDate(date, dateFormat) {
Expand Down Expand Up @@ -276,19 +277,21 @@ export default class Datetime extends React.Component {
return viewModes.DAYS;
}

getLocaleData( props ) {
let p = props || this.props;
getLocaleData() {
let p = this.props;
return this.localMoment( p.value || p.defaultValue || new Date() ).localeData();
}

getDateFormat( locale ) {
getDateFormat() {
const locale = this.getLocaleData();
let format = this.props.dateFormat;
if ( format === true ) return locale.longDateFormat('L');
if ( format ) return format;
return '';
}

getTimeFormat( locale ) {
getTimeFormat() {
const locale = this.getLocaleData();
let format = this.props.timeFormat;
if ( format === true ) {
return locale.longDateFormat('LT');
Expand All @@ -298,15 +301,14 @@ export default class Datetime extends React.Component {

getFormat( type ) {
if ( type === 'date' ) {
return this.getDateFormat( this.getLocaleData() );
return this.getDateFormat();
}
else if ( type === 'time' ) {
return this.getTimeFormat( this.getLocaleData() );
return this.getTimeFormat();
}

let locale = this.getLocaleData();
let dateFormat = this.getDateFormat( locale );
let timeFormat = this.getTimeFormat( locale );
let dateFormat = this.getDateFormat();
let timeFormat = this.getTimeFormat();
return dateFormat && timeFormat ? dateFormat + ' ' + timeFormat : (dateFormat || timeFormat );
}

Expand Down Expand Up @@ -436,10 +438,11 @@ export default class Datetime extends React.Component {
return m;
}

checkTZ( props ) {
if ( props.displayTimeZone && !this.tzWarning && !moment.tz ) {
checkTZ() {
const { displayTimeZone } = this.props;
if ( displayTimeZone && !this.tzWarning && !moment.tz ) {
this.tzWarning = true;
this.log('displayTimeZone prop with value "' + props.displayTimeZone + '" is used but moment.js timezone is not loaded.', 'error');
log('displayTimeZone prop with value "' + displayTimeZone + '" is used but moment.js timezone is not loaded.', 'error');
}
}

Expand All @@ -454,17 +457,18 @@ export default class Datetime extends React.Component {
});

if ( needsUpdate ) {
this.regenerateDates( this.props );
this.regenerateDates();
}

if ( thisProps.value && thisProps.value !== prevProps.value ) {
this.setViewDate( thisProps.value );
}

this.checkTZ( this.props );
this.checkTZ();
}

regenerateDates(props) {
regenerateDates() {
const props = this.props;
let viewDate = this.state.viewDate.clone();
let selectedDate = this.state.selectedDate && this.state.selectedDate.clone();

Expand Down Expand Up @@ -499,12 +503,13 @@ export default class Datetime extends React.Component {
return selectedDate && selectedDate.isValid() ? selectedDate : false;
}

getInitialInputValue( props, selectedDate, inputFormat ) {
getInitialInputValue( selectedDate ) {
const props = this.props;
if ( props.inputProps.value )
return props.inputProps.value;

if ( selectedDate && selectedDate.isValid() )
return selectedDate.format( inputFormat );
return selectedDate.format( this.getFormat('datetime') );

if ( props.value && typeof props.value === 'string' )
return props.value;
Expand Down Expand Up @@ -554,16 +559,6 @@ export default class Datetime extends React.Component {
this._showView( mode );
}

log( message, method ) {
let con = typeof window !== 'undefined' && window.console;
if ( !con ) return;

if ( !method ) {
method = 'warn';
}
con[ method ]( '***react-datetime:' + message );
}

_onInputFocus = e => {
if ( !this.callHandler( this.props.inputProps.onFocus, e ) ) return;
this._openCalendar();
Expand Down Expand Up @@ -603,6 +598,16 @@ export default class Datetime extends React.Component {
}
}

function log( message, method ) {
let con = typeof window !== 'undefined' && window.console;
if ( !con ) return;

if ( !method ) {
method = 'warn';
}
con[ method ]( '***react-datetime:' + message );
}

class ClickOutBase extends React.Component {
container = React.createRef();

Expand Down
76 changes: 39 additions & 37 deletions src/datetime/DaysView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,29 +7,25 @@ export default class DaysView extends React.Component {
}

render() {
const date = this.props.viewDate;
const locale = date.localeData();

let startOfMonth = date.clone().startOf('month');
let endOfMonth = date.clone().endOf('month');

return (
<div className="rdtDays">
<table>
<thead>
{ this.renderNavigation( date, locale ) }
{ this.renderDayHeaders( locale ) }
{ this.renderNavigation() }
{ this.renderDayHeaders() }
</thead>
<tbody>
{ this.renderDays( date, startOfMonth, endOfMonth ) }
{ this.renderDays() }
</tbody>
{ this.renderFooter( date ) }
{ this.renderFooter() }
</table>
</div>
);
}

renderNavigation( date, locale ) {
renderNavigation() {
const date = this.props.viewDate;
const locale = date.localeData();
return (
<ViewNavigation
onClickPrev={ () => this.props.navigate( -1, 'months' ) }
Expand All @@ -42,8 +38,9 @@ export default class DaysView extends React.Component {
);
}

renderDayHeaders( locale ) {
let dayItems = this.getDaysOfWeek( locale ).map( (day, index) => (
renderDayHeaders() {
const locale = this.props.viewDate.localeData();
let dayItems = getDaysOfWeek( locale ).map( (day, index) => (
<th key={ day + index } className="dow">{ day }</th>
));

Expand All @@ -54,7 +51,9 @@ export default class DaysView extends React.Component {
);
}

renderDays( date, startOfMonth, endOfMonth ) {
renderDays() {
const date = this.props.viewDate;

// We need 42 days in 6 rows
// starting in the last week of the previous month
let rows = [[], [], [], [], [], []];
Expand All @@ -66,8 +65,8 @@ export default class DaysView extends React.Component {
let i = 0;

while ( startDate.isBefore( endDate ) ) {
let row = this.getRow( rows, i++ );
row.push( this.renderDay( startDate, startOfMonth, endOfMonth ) );
let row = getRow( rows, i++ );
row.push( this.renderDay( startDate ) );
startDate.add( 1, 'd' );
}

Expand All @@ -76,7 +75,9 @@ export default class DaysView extends React.Component {
));
}

renderDay( date, startOfMonth, endOfMonth ) {
renderDay( date ) {
const startOfMonth = this.props.viewDate.clone().startOf('month');
const endOfMonth = this.props.viewDate.clone().endOf('month');
let selectedDate = this.props.selectedDate;

let dayProps = {
Expand Down Expand Up @@ -120,9 +121,10 @@ export default class DaysView extends React.Component {
);
}

renderFooter( date ) {
renderFooter() {
if ( !this.props.timeFormat ) return;

const date = this.props.viewDate;
return (
<tfoot>
<tr>
Expand All @@ -139,25 +141,25 @@ export default class DaysView extends React.Component {
_setDate = e => {
this.props.updateDate( e );
}
}

/**
* Get a list of the days of the week
* depending on the current locale
* @return {array} A list with the shortname of the days
*/
getDaysOfWeek(locale) {
const first = locale.firstDayOfWeek();
let dow = [];
let i = 0;

locale._weekdaysMin.forEach(function (day) {
dow[(7 + (i++) - first) % 7] = day;
});

return dow;
}
function getRow( rows, day ) {
return rows[ Math.floor( day / 7 ) ];
}

getRow( rows, day ) {
return rows[ Math.floor( day / 7 ) ];
}
/**
* Get a list of the days of the week
* depending on the current locale
* @return {array} A list with the shortname of the days
*/
function getDaysOfWeek( locale ) {
const first = locale.firstDayOfWeek();
let dow = [];
let i = 0;

locale._weekdaysMin.forEach(function (day) {
dow[(7 + (i++) - first) % 7] = day;
});

return dow;
}
Loading

0 comments on commit d445003

Please sign in to comment.