Client - update date-fns from 1.3.0 to 2.0.1

This commit is contained in:
Sam
2019-08-28 14:38:15 +02:00
parent 318418bd55
commit c0d38094d9
13 changed files with 102 additions and 77 deletions

View File

@ -1,5 +1,3 @@
import { parse } from 'date-fns'
import FitTrackeeGenericApi from '../fitTrackeeApi'
import { history } from '../index'
import { formatChartData } from '../utils/activities'
@ -177,13 +175,6 @@ export const getMonthActivities = (from, to) => dispatch =>
.getData('activities', { from, to, order: 'asc', per_page: 100 })
.then(ret => {
if (ret.status === 'success') {
if (ret.data.activities.length > 0) {
for (let i = 0; i < ret.data.activities.length; i++) {
ret.data.activities[i].activity_date = parse(
ret.data.activities[i].activity_date
)
}
}
dispatch(updateCalendar(ret.data.activities))
} else {
dispatch(setError(`activities: ${ret.message}`))

View File

@ -43,7 +43,7 @@ export default class ActivitiesList extends React.PureComponent {
<td>
{format(
getDateWithTZ(activity.activity_date, user.timezone),
'DD/MM/YYYY HH:mm'
'dd/MM/yyyy HH:mm'
)}
</td>
<td className="text-right">

View File

@ -13,7 +13,7 @@ function FormWithoutGpx (props) {
if (activity) {
const activityDateTime = formatActivityDate(
activity.activity_date,
'YYYY-MM-DD'
'yyyy-MM-dd'
)
activityDate = activityDateTime.activity_date
activityTime = activityDateTime.activity_time

View File

@ -49,7 +49,7 @@ export default connect(
}),
dispatch => ({
loadActivities: (userId, data) => {
const dateFormat = 'YYYY-MM-DD'
const dateFormat = 'yyyy-MM-dd'
const params = {
from: format(data.start, dateFormat),
to: format(data.end, dateFormat),

View File

@ -15,7 +15,7 @@ export default function ActivityCard (props) {
.map(sport => sport.label)} -{' '}
{format(
getDateWithTZ(activity.activity_date, user.timezone),
'DD/MM/YYYY HH:mm'
'dd/MM/yyyy HH:mm'
)}
</Link>
</div>

View File

@ -1,6 +1,9 @@
// eslint-disable-next-line max-len
// source: https://blog.flowandform.agency/create-a-custom-calendar-in-react-3df1bfd0b728
import dateFns from 'date-fns'
import {
addDays, addMonths, endOfMonth, endOfWeek, format, isSameDay, isSameMonth,
startOfMonth, startOfWeek, subMonths
} from 'date-fns'
import React, { Fragment } from 'react'
import { connect } from 'react-redux'
import { Link } from 'react-router-dom'
@ -10,11 +13,11 @@ import { getDateWithTZ } from '../../utils'
import { recordsLabels } from '../../utils/activities'
const getStartAndEndMonth = date => {
const monthStart = dateFns.startOfMonth(date)
const monthEnd = dateFns.endOfMonth(date)
const monthStart = startOfMonth(date)
const monthEnd = endOfMonth(date)
return {
start: dateFns.startOfWeek(monthStart),
end: dateFns.endOfWeek(monthEnd),
start: startOfWeek(monthStart),
end: endOfWeek(monthEnd),
}
}
@ -35,7 +38,7 @@ class Calendar extends React.Component {
}
renderHeader() {
const dateFormat = 'MMM YYYY'
const dateFormat = 'MMM yyyy'
return (
<div className="header row flex-middle">
<div className="col col-start" onClick={() => this.handlePrevMonth()}>
@ -46,7 +49,7 @@ class Calendar extends React.Component {
</div>
<div className="col col-center">
<span>
{dateFns.format(this.state.currentMonth, dateFormat)}
{format(this.state.currentMonth, dateFormat)}
</span>
</div>
<div className="col col-end" onClick={() => this.handleNextMonth()}>
@ -67,7 +70,7 @@ class Calendar extends React.Component {
for (let i = 0; i < 7; i++) {
days.push(
<div className="col col-center" key={i}>
{dateFns.format(dateFns.addDays(startDate, i), dateFormat)}
{format(addDays(startDate, i), dateFormat)}
</div>
)
}
@ -78,7 +81,7 @@ class Calendar extends React.Component {
const { activities, user } = this.props
if (activities) {
return activities
.filter(act => dateFns.isSameDay(
.filter(act => isSameDay(
getDateWithTZ(act.activity_date, user.timezone),
day
))
@ -90,7 +93,7 @@ class Calendar extends React.Component {
const { currentMonth, startDate, endDate } = this.state
const { sports } = this.props
const dateFormat = 'D'
const dateFormat = 'd'
const rows = []
let days = []
@ -99,9 +102,9 @@ class Calendar extends React.Component {
while (day <= endDate) {
for (let i = 0; i < 7; i++) {
formattedDate = dateFns.format(day, dateFormat)
formattedDate = format(day, dateFormat)
const dayActivities = this.filterActivities(day)
const isDisabled = dateFns.isSameMonth(day, currentMonth)
const isDisabled = isSameMonth(day, currentMonth)
? ''
: 'disabled'
days.push(
@ -139,7 +142,7 @@ class Calendar extends React.Component {
))}
</div>
)
day = dateFns.addDays(day, 1)
day = addDays(day, 1)
}
rows.push(
<div className="row" key={day}>
@ -162,12 +165,12 @@ class Calendar extends React.Component {
}
handleNextMonth() {
const calendarDate = dateFns.addMonths(this.state.currentMonth, 1)
const calendarDate = addMonths(this.state.currentMonth, 1)
this.updateStateDate(calendarDate)
}
handlePrevMonth() {
const calendarDate = dateFns.subMonths(this.state.currentMonth, 1)
const calendarDate = subMonths(this.state.currentMonth, 1)
this.updateStateDate(calendarDate)
}
@ -192,10 +195,10 @@ export default connect(
}),
dispatch => ({
loadMonthActivities: (start, end) => {
const dateFormat = 'YYYY-MM-DD'
const dateFormat = 'yyyy-MM-dd'
dispatch(getMonthActivities(
dateFns.format(start, dateFormat),
dateFns.format(end, dateFormat),
format(start, dateFormat),
format(end, dateFormat),
))
},
})

View File

@ -36,13 +36,13 @@ function Profile ({ message, onDeletePicture, onUploadPicture, user }) {
<div className="col-md-8">
<p>Email: {user.email}</p>
<p>Registration Date: {
format(new Date(user.created_at), 'DD/MM/YYYY HH:mm')
format(new Date(user.created_at), 'dd/MM/yyyy HH:mm')
}
</p>
<p>First Name: {user.first_name}</p>
<p>Last Name: {user.last_name}</p>
<p>Birth Date: {user.birth_date
? format(new Date(user.birth_date), 'DD/MM/YYYY')
? format(new Date(user.birth_date), 'dd/MM/yyyy')
: ''
}
</p>

View File

@ -32,7 +32,7 @@ class ProfileEdit extends React.Component {
Object.keys(user).map(k => user[k] === null
? formData[k] = ''
: k === 'birth_date'
? formData[k] = format(new Date(user[k]), 'YYYY-MM-DD')
? formData[k] = format(new Date(user[k]), 'yyyy-MM-DD')
: formData[k] = user[k])
this.setState({ formData })
}

View File

@ -35,7 +35,7 @@ export const formatActivityDate = (
timeFormat = null,
) => {
if (!dateFormat) {
dateFormat = 'DD/MM/YYYY'
dateFormat = 'yyyy/MM/dd'
}
if (!timeFormat) {
timeFormat = 'HH:mm'

View File

@ -56,6 +56,8 @@ export const getDateWithTZ = (date, tz) => {
if (!date) {
return ''
}
const dt = DateTime.fromISO(format(date)).setZone(tz)
return parse(dt.toFormat('yyyy-MM-dd HH:mm:ss'))
const dt = DateTime.fromISO(
format(new Date(date), "yyyy-MM-dd'T'HH:mm:ss.SSSxxx")).setZone(tz)
return parse(
dt.toFormat('yyyy-MM-dd HH:mm:ss'), 'yyyy-MM-dd HH:mm:ss', new Date())
}

View File

@ -8,9 +8,9 @@ import {
const xAxisFormats = [
{ duration: 'week', dateFormat: 'YYYY-MM-DD', xAxis: 'DD/MM' },
{ duration: 'month', dateFormat: 'YYYY-MM', xAxis: 'MM/YYYY' },
{ duration: 'year', dateFormat: 'YYYY', xAxis: 'YYYY' },
{ duration: 'week', dateFormat: 'yyyy-MM-dd', xAxis: 'dd/MM' },
{ duration: 'month', dateFormat: 'yyyy-MM', xAxis: 'MM/yyyy' },
{ duration: 'year', dateFormat: 'yyyy', xAxis: 'yyyy' },
]
export const formatDuration = (totalSeconds, formatWithDay = false) => {