refactor: replace moment with dayjs
This commit is contained in:
committed by
Jordan Knott
parent
a288e06123
commit
92493deedf
@ -5,7 +5,6 @@ import { TaskMetaFilters, TaskMeta, TaskMetaMatch, DueDateFilterType } from 'sha
|
||||
import Input from 'shared/components/ControlledInput';
|
||||
import { Popup, usePopup } from 'shared/components/PopupMenu';
|
||||
import produce from 'immer';
|
||||
import moment from 'moment';
|
||||
import { mixin } from 'shared/utils/styles';
|
||||
import Member from 'shared/components/Member';
|
||||
|
||||
|
@ -8,15 +8,28 @@ import { HttpLink } from 'apollo-link-http';
|
||||
import { onError } from 'apollo-link-error';
|
||||
import { enableMapSet } from 'immer';
|
||||
import { ApolloLink, Observable, fromPromise } from 'apollo-link';
|
||||
import moment from 'moment';
|
||||
import dayjs from 'dayjs';
|
||||
import updateLocale from 'dayjs/plugin/updateLocale';
|
||||
import isSameOrAfter from 'dayjs/plugin/isSameOrAfter';
|
||||
import customParseFormat from 'dayjs/plugin/customParseFormat';
|
||||
import isBetween from 'dayjs/plugin/isBetween';
|
||||
import weekday from 'dayjs/plugin/weekday';
|
||||
import { getAccessToken, getNewToken, setAccessToken } from 'shared/utils/accessToken';
|
||||
import cache from './App/cache';
|
||||
import App from './App';
|
||||
|
||||
// https://able.bio/AnasT/apollo-graphql-async-access-token-refresh--470t1c8
|
||||
|
||||
dayjs.extend(isSameOrAfter);
|
||||
|
||||
dayjs.extend(weekday);
|
||||
dayjs.extend(isBetween);
|
||||
dayjs.extend(customParseFormat);
|
||||
enableMapSet();
|
||||
|
||||
moment.updateLocale('en', {
|
||||
dayjs.extend(updateLocale);
|
||||
|
||||
dayjs.updateLocale('en', {
|
||||
week: {
|
||||
dow: 1, // First day of week is Monday
|
||||
doy: 7, // First week of year must contain 1 January (7 + 1 - 1)
|
||||
|
@ -1,5 +1,5 @@
|
||||
import React, { useState, useEffect, forwardRef } from 'react';
|
||||
import moment from 'moment';
|
||||
import dayjs from 'dayjs';
|
||||
import styled from 'styled-components';
|
||||
import DatePicker from 'react-datepicker';
|
||||
import _ from 'lodash';
|
||||
@ -110,12 +110,12 @@ const HeaderActions = styled.div`
|
||||
`;
|
||||
|
||||
const DueDateManager: React.FC<DueDateManagerProps> = ({ task, onDueDateChange, onRemoveDueDate, onCancel }) => {
|
||||
const now = moment();
|
||||
const now = dayjs();
|
||||
const { register, handleSubmit, errors, setValue, setError, formState, control } = useForm<DueDateFormData>();
|
||||
const [startDate, setStartDate] = useState(new Date());
|
||||
|
||||
useEffect(() => {
|
||||
const newDate = moment(startDate).format('YYYY-MM-DD');
|
||||
const newDate = dayjs(startDate).format('YYYY-MM-DD');
|
||||
setValue('endDate', newDate);
|
||||
}, [startDate]);
|
||||
|
||||
@ -135,7 +135,7 @@ const DueDateManager: React.FC<DueDateManagerProps> = ({ task, onDueDateChange,
|
||||
'December',
|
||||
];
|
||||
const saveDueDate = (data: any) => {
|
||||
const newDate = moment(`${data.endDate} ${moment(data.endTime).format('h:mm A')}`, 'YYYY-MM-DD h:mm A');
|
||||
const newDate = dayjs(`${data.endDate} ${dayjs(data.endTime).format('h:mm A')}`, 'YYYY-MM-DD h:mm A');
|
||||
if (newDate.isValid()) {
|
||||
onDueDateChange(task, newDate.toDate());
|
||||
}
|
||||
|
@ -10,7 +10,7 @@ import {
|
||||
getNewDraggablePosition,
|
||||
getAfterDropDraggableList,
|
||||
} from 'shared/utils/draggables';
|
||||
import moment from 'moment';
|
||||
import dayjs from 'dayjs';
|
||||
import { TaskSorting, TaskSortingType, TaskSortingDirection, sortTasks } from 'shared/utils/sorting';
|
||||
|
||||
import { Container, BoardContainer, BoardWrapper } from './Styles';
|
||||
@ -51,7 +51,7 @@ export type TaskStatusFilter = {
|
||||
|
||||
export interface TaskMetaFilterName {
|
||||
meta: TaskMeta;
|
||||
value?: string | moment.Moment | null;
|
||||
value?: string | dayjs.Dayjs | null;
|
||||
id?: string | null;
|
||||
}
|
||||
|
||||
@ -104,30 +104,30 @@ function shouldStatusFilter(task: Task, filter: TaskStatusFilter) {
|
||||
return true;
|
||||
}
|
||||
if (filter.status === TaskStatus.COMPLETE && task.completedAt && task.complete === true) {
|
||||
const completedAt = moment(task.completedAt);
|
||||
const REFERENCE = moment(); // fixed just for testing, use moment();
|
||||
const completedAt = dayjs(task.completedAt);
|
||||
const REFERENCE = dayjs();
|
||||
switch (filter.since) {
|
||||
case TaskSince.TODAY:
|
||||
const TODAY = REFERENCE.clone().startOf('day');
|
||||
return completedAt.isSame(TODAY, 'd');
|
||||
case TaskSince.YESTERDAY:
|
||||
const YESTERDAY = REFERENCE.clone()
|
||||
.subtract(1, 'days')
|
||||
.subtract(1, 'day')
|
||||
.startOf('day');
|
||||
return completedAt.isSameOrAfter(YESTERDAY, 'd');
|
||||
case TaskSince.ONE_WEEK:
|
||||
const ONE_WEEK = REFERENCE.clone()
|
||||
.subtract(7, 'days')
|
||||
.subtract(7, 'day')
|
||||
.startOf('day');
|
||||
return completedAt.isSameOrAfter(ONE_WEEK, 'd');
|
||||
case TaskSince.TWO_WEEKS:
|
||||
const TWO_WEEKS = REFERENCE.clone()
|
||||
.subtract(14, 'days')
|
||||
.subtract(14, 'day')
|
||||
.startOf('day');
|
||||
return completedAt.isSameOrAfter(TWO_WEEKS, 'd');
|
||||
case TaskSince.THREE_WEEKS:
|
||||
const THREE_WEEKS = REFERENCE.clone()
|
||||
.subtract(21, 'days')
|
||||
.subtract(21, 'day')
|
||||
.startOf('day');
|
||||
return completedAt.isSameOrAfter(THREE_WEEKS, 'd');
|
||||
default:
|
||||
@ -353,7 +353,7 @@ const SimpleLists: React.FC<SimpleProps> = ({
|
||||
task.dueDate
|
||||
? {
|
||||
isPastDue: false,
|
||||
formattedDate: moment(task.dueDate).format('MMM D, YYYY'),
|
||||
formattedDate: dayjs(task.dueDate).format('MMM D, YYYY'),
|
||||
}
|
||||
: undefined
|
||||
}
|
||||
|
@ -1,5 +1,5 @@
|
||||
import { TaskMetaFilters, DueDateFilterType } from 'shared/components/Lists';
|
||||
import moment from 'moment';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
enum ShouldFilter {
|
||||
NO_FILTER,
|
||||
@ -24,8 +24,8 @@ export default function shouldMetaFilter(task: Task, filters: TaskMetaFilters) {
|
||||
isFiltered = shouldFilter(!(task.dueDate && task.dueDate !== null));
|
||||
}
|
||||
if (task.dueDate) {
|
||||
const taskDueDate = moment(task.dueDate);
|
||||
const today = moment();
|
||||
const taskDueDate = dayjs(task.dueDate);
|
||||
const today = dayjs();
|
||||
let start;
|
||||
let end;
|
||||
switch (filters.dueDate.type) {
|
||||
@ -40,7 +40,7 @@ export default function shouldMetaFilter(task: Task, filters: TaskMetaFilters) {
|
||||
taskDueDate.isBefore(
|
||||
today
|
||||
.clone()
|
||||
.add(1, 'days')
|
||||
.add(1, 'day')
|
||||
.endOf('day'),
|
||||
),
|
||||
);
|
||||
@ -60,12 +60,12 @@ export default function shouldMetaFilter(task: Task, filters: TaskMetaFilters) {
|
||||
start = today
|
||||
.clone()
|
||||
.weekday(0)
|
||||
.add(7, 'days')
|
||||
.add(7, 'day')
|
||||
.startOf('day');
|
||||
end = today
|
||||
.clone()
|
||||
.weekday(6)
|
||||
.add(7, 'days')
|
||||
.add(7, 'day')
|
||||
.endOf('day');
|
||||
isFiltered = shouldFilter(taskDueDate.isBetween(start, end));
|
||||
break;
|
||||
@ -73,7 +73,7 @@ export default function shouldMetaFilter(task: Task, filters: TaskMetaFilters) {
|
||||
start = today.clone().startOf('day');
|
||||
end = today
|
||||
.clone()
|
||||
.add(7, 'days')
|
||||
.add(7, 'day')
|
||||
.endOf('day');
|
||||
isFiltered = shouldFilter(taskDueDate.isBetween(start, end));
|
||||
break;
|
||||
@ -81,7 +81,7 @@ export default function shouldMetaFilter(task: Task, filters: TaskMetaFilters) {
|
||||
start = today.clone().startOf('day');
|
||||
end = today
|
||||
.clone()
|
||||
.add(14, 'days')
|
||||
.add(14, 'day')
|
||||
.endOf('day');
|
||||
isFiltered = shouldFilter(taskDueDate.isBetween(start, end));
|
||||
break;
|
||||
@ -89,7 +89,7 @@ export default function shouldMetaFilter(task: Task, filters: TaskMetaFilters) {
|
||||
start = today.clone().startOf('day');
|
||||
end = today
|
||||
.clone()
|
||||
.add(21, 'days')
|
||||
.add(21, 'day')
|
||||
.endOf('day');
|
||||
isFiltered = shouldFilter(taskDueDate.isBetween(start, end));
|
||||
break;
|
||||
|
@ -17,7 +17,7 @@ import dark from 'shared/utils/editorTheme';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
|
||||
import moment from 'moment';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import Task from 'shared/icons/Task';
|
||||
import {
|
||||
@ -182,7 +182,7 @@ const TaskDetails: React.FC<TaskDetailsProps> = ({
|
||||
}}
|
||||
>
|
||||
{task.dueDate ? (
|
||||
<SidebarButtonText>{moment(task.dueDate).format('MMM D [at] h:mm A')}</SidebarButtonText>
|
||||
<SidebarButtonText>{dayjs(task.dueDate).format('MMM D [at] h:mm A')}</SidebarButtonText>
|
||||
) : (
|
||||
<SidebarButtonText>No due date</SidebarButtonText>
|
||||
)}
|
||||
|
@ -1,4 +1,4 @@
|
||||
import moment from 'moment';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
export enum TaskSortingType {
|
||||
NONE,
|
||||
@ -46,7 +46,7 @@ export function sortTasks(a: Task, b: Task, taskSorting: TaskSorting) {
|
||||
if (b.dueDate && !a.dueDate) {
|
||||
return 1;
|
||||
}
|
||||
return moment(a.dueDate).diff(moment(b.dueDate));
|
||||
return dayjs(a.dueDate).diff(dayjs(b.dueDate));
|
||||
}
|
||||
if (taskSorting.type === TaskSortingType.COMPLETE) {
|
||||
if (a.complete && !b.complete) {
|
||||
|
Reference in New Issue
Block a user