vmario/wisemapping-frontend
1
0
Fork 0
mirror of https://bitbucket.org/wisemapping/wisemapping-frontend.git synced 2024-11-10 17:33:24 +01:00
Code Issues Packages Projects Releases Wiki Activity

Replace moment library

Browse Source
This commit is contained in:
Paulo Gustavo Veiga 2021-02-16 13:07:54 -08:00
parent ea04199c14
commit ea80fc5315
7 changed files with 32 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/webapp/package.json
View File

@ -47,7 +47,7 @@
"@material-ui/lab": "^4.0.0-alpha.57",
"@reduxjs/toolkit": "^1.5.0",
"axios": "^0.14.0",
"moment": "^2.29.1",
"dayjs": "^1.10.4",
"react": "^17.0.0",
"react-dom": "^17.0.0",
"react-google-recaptcha": "^2.1.0",

15
packages/webapp/src/@types/typings.d.ts vendored
View File

@ -3,4 +3,17 @@ declare module '*.jpg';
declare module '*.jpeg';
declare module '*.png';
declare module '*.svg';
declare module '*.json';
declare module '*.json';
import { Dayjs } from 'dayjs'
type DateType = string | number | Date | Dayjs
// @Todo: review if there is a better support for this.
declare module 'dayjs' {
interface Dayjs {
fromNow(withoutSuffix?: boolean): string
from(compared: DateType, withoutSuffix?: boolean): string
toNow(withoutSuffix?: boolean): string
to(compared: DateType, withoutSuffix?: boolean): string
}
}

3
packages/webapp/src/classes/app-i18n/index.ts
View File

@ -1,4 +1,7 @@
import { fetchAccount } from './../../redux/clientSlice';
import 'dayjs/locale/fr';
import 'dayjs/locale/en';
import 'dayjs/locale/es';
export class Locale {
code: LocaleCode;

7
packages/webapp/src/components/maps-page/action-dispatcher/history-dialog/index.tsx
View File

@ -6,7 +6,7 @@ import Client, { ChangeHistory } from "../../../../classes/client";
import { activeInstance } from '../../../../redux/clientSlice';
import { SimpleDialogProps } from "..";
import BaseDialog from "../base-dialog";
import moment from "moment";
import dayjs from "dayjs";
import TableContainer from "@material-ui/core/TableContainer";
import Table from "@material-ui/core/Table";
@ -40,7 +40,6 @@ const HistoryDialog = ({ mapId, onClose }: SimpleDialogProps) => {
})
};
return (
<div>
<BaseDialog
@ -70,8 +69,8 @@ const HistoryDialog = ({ mapId, onClose }: SimpleDialogProps) => {
<TableRow key={row.id}>
<TableCell align="left">{row.lastModificationBy}</TableCell>
<TableCell align="left">
<Tooltip title={moment(row.lastModificationTime).format("lll")} placement="bottom-start">
<span>{moment(row.lastModificationTime).fromNow()}</span>
<Tooltip title={dayjs(row.lastModificationTime).format("lll")} placement="bottom-start">
<span>{dayjs(row.lastModificationTime).fromNow()}</span>
</Tooltip>
</TableCell>
<TableCell align="left"><Link href={`c/maps/${mapId}/${row.id}/view`} target="history"><FormattedMessage id="maps.view" defaultMessage="View" /></Link></TableCell>

6
packages/webapp/src/components/maps-page/action-dispatcher/info-dialog/index.tsx
View File

@ -5,7 +5,7 @@ import { ErrorInfo } from '../../../../classes/client';
import BaseDialog from '../base-dialog';
import { SimpleDialogProps } from '..';
import { useStyles } from './style';
import moment from 'moment';
import dayjs from 'dayjs';
import { fetchMapById } from '../../../../redux/clientSlice';
import Paper from '@material-ui/core/Paper';
import Card from '@material-ui/core/Card';
@ -73,7 +73,7 @@ const InfoDialog = ({ mapId, onClose }: SimpleDialogProps) => {
<FormattedMessage id="info.creation-time" defaultMessage="Creation Date" />:
</Typography>
<Typography variant="body2">
{moment(map?.creationTime).format("lll")}
{dayjs(map?.creationTime).format("lll")}
</Typography>
</ListItem>
@ -92,7 +92,7 @@ const InfoDialog = ({ mapId, onClose }: SimpleDialogProps) => {
<FormattedMessage id="info.modified-time" defaultMessage="Last Modified Date" />:
</Typography>
<Typography variant="body2">
{moment(map?.lastModificationTime).format("lll")}
{dayjs(map?.lastModificationTime).format("lll")}
</Typography>
</ListItem>

11
packages/webapp/src/components/maps-page/maps-list/index.tsx
View File

@ -7,7 +7,7 @@ import { useMutation, useQuery, useQueryClient } from 'react-query';
import Client, { ErrorInfo, MapInfo } from '../../../classes/client';
import ActionChooser, { ActionType } from '../action-chooser';
import ActionDispatcher from '../action-dispatcher';
import moment from 'moment'
import dayjs from 'dayjs';
import { Filter, LabelFilter } from '..';
import { FormattedMessage, useIntl } from 'react-intl';
@ -210,7 +210,7 @@ export const MapsList = (props: MapsListProps) => {
// Configure locale ...
const account = fetchAccount();
if (account) {
moment.locale(account.locale.code);
dayjs.locale(account.locale.code);
}
useEffect(() => {
@ -331,6 +331,9 @@ export const MapsList = (props: MapsListProps) => {
});
}
const relativeTime = require('dayjs/plugin/relativeTime')
dayjs.extend(relativeTime);
const isSelected = (id: number) => selected.indexOf(id) !== -1;
return (
<div className={classes.root}>
@ -476,9 +479,9 @@ export const MapsList = (props: MapsListProps) => {
<TableCell className={classes.bodyCell}>
<Tooltip title={
`Modified by ${row.lastModificationBy} on ${moment(row.lastModificationTime).format("lll")}`
`Modified by ${row.lastModificationBy} on ${dayjs(row.lastModificationTime).format("lll")}`
} placement="bottom-start">
<span>{moment(row.lastModificationTime).fromNow()}</span>
<span>{dayjs(row.lastModificationTime).fromNow()}</span>
</Tooltip>
</TableCell>

7
packages/webapp/webpack.common.js
View File

@ -64,10 +64,5 @@ module.exports = {
]
}
}]
}),
// Ignore all locale files of moment.js
new webpack.ContextReplacementPlugin(
/moment[\/\\]locale$/,
/de$|es$|fr$/
)]
})]
}