adam/vscode-front-matter
1
0
Fork 0
mirror of https://github.com/estruyf/vscode-front-matter.git synced 2026-07-04 00:41:00 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' of github.com:estruyf/vscode-front-matter into dev

Browse Source
This commit is contained in:
Elio Struyf
2021-10-13 08:27:48 +02:00
parent 76b5e99a08 7d5505d421
commit 5cc83526ad
10 changed files with 103 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CHANGELOG.md
+1
View File
@@ -13,6 +13,7 @@
- [#142](https://github.com/estruyf/vscode-front-matter/issues/142): Fix for unknown tags where it throws an error
- [#143](https://github.com/estruyf/vscode-front-matter/issues/143): Fix for duplicate values in the file list
- [#144](https://github.com/estruyf/vscode-front-matter/issues/144): Fix for `toISOString` does not exist on object
- [#146](https://github.com/estruyf/vscode-front-matter/issues/146): Date parsing logic added with fallbacks
## [5.0.0] - 2021-10-07 - [Release Notes](https://beta.frontmatter.codes/updates/v5.0.0)
src/commands/Dashboard.ts
+6 -4
View File
@@ -14,7 +14,6 @@ import { Template } from './Template';
import { Notifications } from '../helpers/Notifications';
import { Settings } from '../dashboardWebView/models/Settings';
import { Extension } from '../helpers/Extension';
import { parseJSON } from 'date-fns';
import { ViewType } from '../dashboardWebView/state';
import { EditorHelper, WebviewHelper } from '@estruyf/vscode';
import { MediaInfo, MediaPaths } from './../models/MediaPaths';
@@ -24,6 +23,7 @@ import { ExplorerView } from '../explorerView/ExplorerView';
import { MediaLibrary } from '../helpers/MediaLibrary';
import imageSize from 'image-size';
import { parseWinPath } from '../helpers/parseWinPath';
import { DateHelper } from '../helpers/DateHelper';
export class Dashboard {
private static webview: WebviewPanel | null = null;
@@ -447,7 +447,7 @@ export class Dashboard {
fmFilePath: file.filePath,
fmFileName: file.fileName,
fmDraft: article?.data.draft ? "Draft" : "Published",
fmYear: article?.data[dateField] ? parseJSON(article?.data[dateField]).getFullYear() : null,
fmYear: article?.data[dateField] ? DateHelper.tryParse(article?.data[dateField])?.getFullYear() : null,
// Make sure these are always set
title: article?.data.title,
slug: article?.data.slug,
@@ -622,7 +622,9 @@ export class Dashboard {
const nonce = WebviewHelper.getNonce();
const version = Extension.getInstance().getVersion();
const ext = Extension.getInstance();
const version = ext.getVersion();
const isBeta = ext.isBetaVersion();
return `
<!DOCTYPE html>
@@ -634,7 +636,7 @@ export class Dashboard {
<title>Front Matter Dashboard</title>
</head>
<body style="width:100%;height:100%;margin:0;padding:0;overflow:hidden" class="bg-gray-100 text-vulcan-500 dark:bg-vulcan-500 dark:text-whisper-500">
<div id="app" style="width:100%;height:100%;margin:0;padding:0;" ${version.usedVersion ? "" : `data-showWelcome="true"`}></div>
<div id="app" data-environment="${isBeta ? "BETA" : "main"}" data-version="${version.usedVersion}" style="width:100%;height:100%;margin:0;padding:0;" ${version.usedVersion ? "" : `data-showWelcome="true"`}></div>
<img style="display:none" src="https://api.visitorbadge.io/api/combined?user=estruyf&repo=frontmatter-usage&countColor=%23263759&slug=${`dashboard-${version.installedVersion}`}" alt="Daily usage" />
src/dashboardWebView/components/DateField.tsx
+5 -4
View File
@@ -1,5 +1,6 @@
import { format, parseJSON } from 'date-fns';
import { format } from 'date-fns';
import * as React from 'react';
import { DateHelper } from '../../helpers/DateHelper';
export interface IDateFieldProps {
value: Date | string;
@@ -10,9 +11,9 @@ export const DateField: React.FunctionComponent<IDateFieldProps> = ({value}: Rea
React.useEffect(() => {
try {
const parsedValue = typeof value === 'string' ? parseJSON(value) : value;
const dateString = format(parsedValue, 'yyyy-MM-dd');
setDateValue(dateString);
const parsedValue = typeof value === 'string' ? DateHelper.tryParse(value) : value;
const dateString = parsedValue ? format(parsedValue, 'yyyy-MM-dd') : parsedValue;
setDateValue(dateString || "");
} catch (e) {
// Date is invalid
}
src/dashboardWebView/index.tsx
+7 -3
View File
@@ -7,10 +7,17 @@ import { Integrations } from "@sentry/tracing";
import { SENTRY_LINK } from "../constants";
import './styles.css';
const elm = document.querySelector("#app");
const welcome = elm?.getAttribute("data-showWelcome");
const version = elm?.getAttribute("data-version");
const environment = elm?.getAttribute("data-environment");
Sentry.init({
dsn: SENTRY_LINK,
integrations: [new Integrations.BrowserTracing()],
tracesSampleRate: 0, // No performance tracing required
release: version || "",
environment: environment || ""
});
declare const acquireVsCodeApi: <T = unknown>() => {
@@ -18,7 +25,4 @@ declare const acquireVsCodeApi: <T = unknown>() => {
setState: (data: T) => void;
postMessage: (msg: unknown) => void;
};
const elm = document.querySelector("#app");
const welcome = elm?.getAttribute("data-showWelcome");
render(<RecoilRoot><Dashboard showWelcome={!!welcome} /></RecoilRoot>, elm);
src/dashboardWebView/models/Page.ts
+1 -1
View File
@@ -6,7 +6,7 @@ export interface Page {
fmFileName: string;
fmModified: number;
fmDraft: "Draft" | "Published",
fmYear: number | null;
fmYear: number | null | undefined;
title: string;
slug: string;
src/explorerView/ExplorerView.ts
+4 -2
View File
@@ -633,7 +633,9 @@ export class ExplorerView implements WebviewViewProvider, Disposable {
const nonce = WebviewHelper.getNonce();
const version = Extension.getInstance().getVersion();
const ext = Extension.getInstance();
const version = ext.getVersion();
const isBeta = ext.isBetaVersion();
return `
<!DOCTYPE html>
@@ -648,7 +650,7 @@ export class ExplorerView implements WebviewViewProvider, Disposable {
<title>Front Matter</title>
</head>
<body>
<div id="app"></div>
<div id="app" data-environment="${isBeta ? "BETA" : "main"}" data-version="${version.usedVersion}" ></div>
<img style="display:none" src="https://api.visitorbadge.io/api/combined?user=estruyf&repo=frontmatter-usage&countColor=%23263759&slug=${`panel-${version.installedVersion}`}" alt="Daily usage" />
src/helpers/DateHelper.ts
+64
View File
@@ -0,0 +1,64 @@
import { parse, parseISO, parseJSON } from "date-fns";
export class DateHelper {
public static tryParse(date: any, format?: string): Date | null {
if (!date) {
return null;
}
if (date instanceof Date) {
return date;
}
if (typeof date === 'string') {
const jsonParsed = DateHelper.tryParseJson(date);
if (DateHelper.isValid(jsonParsed)) {
return jsonParsed;
}
const isoParsed = DateHelper.tryParseIso(date);
if (DateHelper.isValid(isoParsed)) {
return isoParsed;
}
if (format) {
const formatParsed = DateHelper.tryFormatParse(date, format);
if (DateHelper.isValid(formatParsed)) {
return formatParsed;
}
}
}
return null;
}
public static isValid(date: any): boolean {
return !isNaN(date.getTime());
}
public static tryFormatParse(date: string, format: string): Date | null {
try {
return parse(date, format, new Date());
} catch (err) {
return null;
}
}
public static tryParseJson(date: string): Date | null {
try {
return parseJSON(date);
} catch (err) {
return null;
}
}
public static tryParseIso(date: string): Date | null {
try {
return parseISO(date);
} catch (err) {
return null;
}
}
}
src/panelWebView/components/Fields/DateTimeField.tsx
+5 -4
View File
@@ -3,6 +3,7 @@ import { VsLabel } from '../VscodeComponents';
import { ClockIcon } from '@heroicons/react/outline';
import DatePicker from 'react-datepicker';
import { forwardRef } from 'react';
import { DateHelper } from '../../../helpers/DateHelper';
export interface IDateTimeFieldProps {
label: string;
@@ -22,7 +23,7 @@ const CustomInput = forwardRef<HTMLInputElement, InputProps>(({ value, onClick }
});
export const DateTimeField: React.FunctionComponent<IDateTimeFieldProps> = ({label, date, format, onChange}: React.PropsWithChildren<IDateTimeFieldProps>) => {
const [ dateValue, setDateValue ] = React.useState<Date | null>(date);
const [ dateValue, setDateValue ] = React.useState<Date | null>(null);
const onDateChange = (date: Date) => {
setDateValue(date);
@@ -30,10 +31,10 @@ export const DateTimeField: React.FunctionComponent<IDateTimeFieldProps> = ({lab
};
React.useEffect(() => {
const crntValue = typeof date?.toISOString === 'function' ? date.toISOString() : date;
const stateValue = typeof dateValue?.toISOString === 'function' ? dateValue.toISOString() : dateValue;
const crntValue = DateHelper.tryParse(date, format);
const stateValue = DateHelper.tryParse(dateValue, format);
if (crntValue !== stateValue) {
if (crntValue?.toISOString() !== stateValue?.toISOString()) {
setDateValue(date);
}
}, [ date ]);
src/panelWebView/components/Metadata.tsx
+4 -6
View File
@@ -8,7 +8,6 @@ import { Toggle } from './Fields/Toggle';
import { SymbolKeywordIcon } from './Icons/SymbolKeywordIcon';
import { TagIcon } from './Icons/TagIcon';
import { TagPicker } from './TagPicker';
import { parseJSON } from 'date-fns';
import { DateTimeField } from './Fields/DateTimeField';
import { TextField } from './Fields/TextField';
import "react-datepicker/dist/react-datepicker.css";
@@ -17,6 +16,7 @@ import { ListUnorderedIcon } from './Icons/ListUnorderedIcon';
import { NumberField } from './Fields/NumberField';
import { ChoiceField } from './Fields/ChoiceField';
import useContentType from '../../hooks/useContentType';
import { DateHelper } from '../../helpers/DateHelper';
export interface IMetadataProps {
settings: PanelSettings | undefined;
@@ -39,11 +39,9 @@ export const Metadata: React.FunctionComponent<IMetadataProps> = ({settings, met
});
};
const getDate = (date: string | Date) => {
if (typeof date === 'string') {
return parseJSON(date);
}
return date;
const getDate = (date: string | Date): Date | null => {
const parsedDate = DateHelper.tryParse(date, settings?.date?.format);
return parsedDate || date as Date | null;
}
if (!settings) {
src/panelWebView/index.tsx
+6 -1
View File
@@ -17,10 +17,16 @@ import '@bendera/vscode-webview-elements/dist/vscode-label';
import '@vscode/webview-ui-toolkit/dist/esm/checkbox';
const elm = document.querySelector("#app");
const version = elm?.getAttribute("data-version");
const environment = elm?.getAttribute("data-environment");
Sentry.init({
dsn: SENTRY_LINK,
integrations: [new Integrations.BrowserTracing()],
tracesSampleRate: 0, // No performance tracing required
release: version || "",
environment: environment || ""
});
declare const acquireVsCodeApi: <T = unknown>() => {
@@ -29,5 +35,4 @@ declare const acquireVsCodeApi: <T = unknown>() => {
postMessage: (msg: unknown) => void;
};
const elm = document.querySelector("#app");
render(<ViewPanel />, elm);