mirror of
https://github.com/pawelmalak/snippet-box.git
synced 2025-12-21 21:33:10 +01:00
Fixed date parsing bug. Small UI fixes.
This commit is contained in:
@@ -1,12 +1,15 @@
|
|||||||
|
import { ReactNode } from 'react';
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
title?: string;
|
title?: string;
|
||||||
children?: JSX.Element | JSX.Element[];
|
children?: ReactNode;
|
||||||
classes?: string;
|
classes?: string;
|
||||||
bodyClasses?: string;
|
bodyClasses?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const Card = (props: Props): JSX.Element => {
|
export const Card = (props: Props): JSX.Element => {
|
||||||
const { title, children, classes, bodyClasses } = props;
|
const { title, children, classes = '', bodyClasses = '' } = props;
|
||||||
|
|
||||||
const parentClasses = `card mb-3 ${classes}`;
|
const parentClasses = `card mb-3 ${classes}`;
|
||||||
const childClasses = `card-body ${bodyClasses}`;
|
const childClasses = `card-body ${bodyClasses}`;
|
||||||
|
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ interface Props {
|
|||||||
|
|
||||||
export const Layout = (props: Props): JSX.Element => {
|
export const Layout = (props: Props): JSX.Element => {
|
||||||
return (
|
return (
|
||||||
<div className='container-lg px-5'>
|
<div className='container-lg'>
|
||||||
<div className='row py-4'>{props.children}</div>
|
<div className='row py-4'>{props.children}</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -29,14 +29,13 @@ export const Snippet = (): JSX.Element => {
|
|||||||
) : (
|
) : (
|
||||||
<Fragment>
|
<Fragment>
|
||||||
<PageHeader title='' prevDest={from} />
|
<PageHeader title='' prevDest={from} />
|
||||||
<div className='row mt-3'>
|
<div className='col-12 col-md-7 col-lg-8 mt-3'>
|
||||||
<div className='col-12 col-md-7 col-lg-8'>
|
|
||||||
<SnippetCode
|
<SnippetCode
|
||||||
code={currentSnippet.code}
|
code={currentSnippet.code}
|
||||||
language={currentSnippet.language}
|
language={currentSnippet.language}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className='col-12 col-md-5 col-lg-4'>
|
<div className='col-12 col-md-5 col-lg-4 mt-md-3'>
|
||||||
<SnippetDetails snippet={currentSnippet} />
|
<SnippetDetails snippet={currentSnippet} />
|
||||||
</div>
|
</div>
|
||||||
{currentSnippet.docs && (
|
{currentSnippet.docs && (
|
||||||
@@ -47,7 +46,6 @@ export const Snippet = (): JSX.Element => {
|
|||||||
</Card>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
|
||||||
</Fragment>
|
</Fragment>
|
||||||
)}
|
)}
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import relativeTime from 'dayjs/plugin/relativeTime';
|
import relativeTime from 'dayjs/plugin/relativeTime';
|
||||||
|
import customParseFormat from 'dayjs/plugin/customParseFormat';
|
||||||
|
|
||||||
interface Return {
|
interface Return {
|
||||||
formatted: string;
|
formatted: string;
|
||||||
@@ -8,8 +9,16 @@ interface Return {
|
|||||||
|
|
||||||
export const dateParser = (date: Date): Return => {
|
export const dateParser = (date: Date): Return => {
|
||||||
dayjs.extend(relativeTime);
|
dayjs.extend(relativeTime);
|
||||||
|
dayjs.extend(customParseFormat);
|
||||||
|
|
||||||
const parsedDate = dayjs(date);
|
// test date format
|
||||||
|
const regex = /\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.|\+|-|Z)+/;
|
||||||
|
const dateFormat = regex.test(date.toString())
|
||||||
|
? 'YYYY-MM-DD[T]HH:mm:ss.SSSZ'
|
||||||
|
: 'YYYY-MM-DD HH:mm:ss.SSS Z';
|
||||||
|
|
||||||
|
// parse date
|
||||||
|
const parsedDate = dayjs(date, dateFormat);
|
||||||
const formatted = parsedDate.format('YYYY-MM-DD HH:mm');
|
const formatted = parsedDate.format('YYYY-MM-DD HH:mm');
|
||||||
const relative = parsedDate.fromNow();
|
const relative = parsedDate.fromNow();
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user