mirror of
https://github.com/estruyf/vscode-front-matter.git
synced 2026-07-06 18:01:24 +02:00
Optimizations
This commit is contained in:
@@ -1,23 +0,0 @@
|
||||
import * as path from 'path';
|
||||
|
||||
import { runTests } from 'vscode-test';
|
||||
|
||||
async function main() {
|
||||
try {
|
||||
// The folder containing the Extension Manifest package.json
|
||||
// Passed to `--extensionDevelopmentPath`
|
||||
const extensionDevelopmentPath = path.resolve(__dirname, '../../');
|
||||
|
||||
// The path to test runner
|
||||
// Passed to --extensionTestsPath
|
||||
const extensionTestsPath = path.resolve(__dirname, './suite/index');
|
||||
|
||||
// Download VS Code, unzip it and run the integration test
|
||||
await runTests({ extensionDevelopmentPath, extensionTestsPath });
|
||||
} catch (err) {
|
||||
console.error('Failed to run tests');
|
||||
process.exit(1);
|
||||
}
|
||||
}
|
||||
|
||||
main();
|
||||
@@ -1,18 +0,0 @@
|
||||
import * as assert from 'assert';
|
||||
import { before } from 'mocha';
|
||||
|
||||
// You can import and use all API from the 'vscode' module
|
||||
// as well as import your extension to test it
|
||||
import * as vscode from 'vscode';
|
||||
// import * as myExtension from '../extension';
|
||||
|
||||
suite('Extension Test Suite', () => {
|
||||
before(() => {
|
||||
vscode.window.showInformationMessage('Start all tests.');
|
||||
});
|
||||
|
||||
test('Sample test', () => {
|
||||
assert.equal(-1, [1, 2, 3].indexOf(5));
|
||||
assert.equal(-1, [1, 2, 3].indexOf(0));
|
||||
});
|
||||
});
|
||||
@@ -1,37 +0,0 @@
|
||||
import * as path from 'path';
|
||||
import * as Mocha from 'mocha';
|
||||
import * as glob from 'glob';
|
||||
|
||||
export function run(): Promise<void> {
|
||||
// Create the mocha test
|
||||
const mocha = new Mocha({
|
||||
ui: 'tdd',
|
||||
});
|
||||
mocha.useColors(true);
|
||||
|
||||
const testsRoot = path.resolve(__dirname, '..');
|
||||
|
||||
return new Promise((c, e) => {
|
||||
glob('**/**.test.js', { cwd: testsRoot }, (err, files) => {
|
||||
if (err) {
|
||||
return e(err);
|
||||
}
|
||||
|
||||
// Add files to the test suite
|
||||
files.forEach(f => mocha.addFile(path.resolve(testsRoot, f)));
|
||||
|
||||
try {
|
||||
// Run the mocha test
|
||||
mocha.run(failures => {
|
||||
if (failures > 0) {
|
||||
e(new Error(`${failures} tests failed.`));
|
||||
} else {
|
||||
c();
|
||||
}
|
||||
});
|
||||
} catch (err) {
|
||||
e(err);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
@@ -2,15 +2,14 @@
|
||||
|
||||
import * as React from 'react';
|
||||
import { CommandToCode } from '../CommandToCode';
|
||||
import useMessages from '../hooks/useMessages';
|
||||
import { MessageHelper } from '../helper/MessageHelper';
|
||||
|
||||
export interface IDateActionProps {}
|
||||
|
||||
export const DateAction: React.FunctionComponent<IDateActionProps> = (props: React.PropsWithChildren<IDateActionProps>) => {
|
||||
const { sendMessage } = useMessages();
|
||||
|
||||
const setDate = () => {
|
||||
sendMessage(CommandToCode.updateDate);
|
||||
MessageHelper.sendMessage(CommandToCode.updateDate);
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -2,18 +2,17 @@
|
||||
|
||||
import * as React from 'react';
|
||||
import { CommandToCode } from '../CommandToCode';
|
||||
import useMessages from '../hooks/useMessages';
|
||||
import { MessageHelper } from '../helper/MessageHelper';
|
||||
|
||||
export interface IPublishActionProps {
|
||||
draft: boolean;
|
||||
}
|
||||
|
||||
export const PublishAction: React.FunctionComponent<IPublishActionProps> = (props: React.PropsWithChildren<IPublishActionProps>) => {
|
||||
const { sendMessage } = useMessages();
|
||||
const { draft } = props;
|
||||
|
||||
const publish = () => {
|
||||
sendMessage(CommandToCode.publish);
|
||||
MessageHelper.sendMessage(CommandToCode.publish);
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -2,7 +2,7 @@ import * as React from 'react';
|
||||
import { SlugHelper } from '../../helpers/SlugHelper';
|
||||
import { Slug } from '../../models/PanelSettings';
|
||||
import { CommandToCode } from '../CommandToCode';
|
||||
import useMessages from '../hooks/useMessages';
|
||||
import { MessageHelper } from '../helper/MessageHelper';
|
||||
|
||||
export interface ISlugActionProps {
|
||||
value: string;
|
||||
@@ -12,13 +12,12 @@ export interface ISlugActionProps {
|
||||
|
||||
export const SlugAction: React.FunctionComponent<ISlugActionProps> = (props: React.PropsWithChildren<ISlugActionProps>) => {
|
||||
const { value, crntValue, slugOpts } = props;
|
||||
const { sendMessage } = useMessages();
|
||||
|
||||
let slug = SlugHelper.createSlug(value);
|
||||
slug = `${slugOpts.prefix}${slug}${slugOpts.suffix}`;
|
||||
|
||||
const optimize = () => {
|
||||
sendMessage(CommandToCode.updateSlug);
|
||||
MessageHelper.sendMessage(CommandToCode.updateSlug);
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
import * as React from 'react';
|
||||
import useAutocomplete from '@material-ui/lab/useAutocomplete';
|
||||
import { makeStyles, createStyles } from '@material-ui/core/styles';
|
||||
import { Tags } from './Tags';
|
||||
import { usePrevious } from '../hooks/usePrevious';
|
||||
import useMessages from '../hooks/useMessages';
|
||||
import { CommandToCode } from '../CommandToCode';
|
||||
import { TagType } from '../TagType';
|
||||
import { MessageHelper } from '../helper/MessageHelper';
|
||||
|
||||
export interface ITagPickerProps {
|
||||
type: string;
|
||||
@@ -13,35 +12,11 @@ export interface ITagPickerProps {
|
||||
options: string[];
|
||||
}
|
||||
|
||||
const useStyles = makeStyles(() =>
|
||||
createStyles({
|
||||
label: {
|
||||
display: 'block',
|
||||
},
|
||||
input: {
|
||||
width: 200,
|
||||
},
|
||||
listbox: {
|
||||
width: 200,
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
zIndex: 1,
|
||||
position: 'absolute',
|
||||
listStyle: 'none',
|
||||
overflow: 'auto',
|
||||
maxHeight: 200,
|
||||
border: '1px solid rgba(0,0,0,.8)'
|
||||
},
|
||||
}),
|
||||
);
|
||||
|
||||
export const TagPicker: React.FunctionComponent<ITagPickerProps> = (props: React.PropsWithChildren<ITagPickerProps>) => {
|
||||
const { type, crntSelected, options } = props;
|
||||
const [ selected, setSelected ] = React.useState<string[]>([]);
|
||||
const prevSelected = usePrevious(crntSelected);
|
||||
const { sendMessage } = useMessages();
|
||||
|
||||
const classes = useStyles();
|
||||
const { getRootProps, getInputProps, getListboxProps, getOptionProps, groupedOptions } = useAutocomplete({
|
||||
id: 'use-autocomplete',
|
||||
options: options,
|
||||
@@ -64,7 +39,7 @@ export const TagPicker: React.FunctionComponent<ITagPickerProps> = (props: React
|
||||
|
||||
const sendUpdate = (values: string[]) => {
|
||||
const cmdType = type === TagType.tags ? CommandToCode.updateTags : CommandToCode.updateCategories;
|
||||
sendMessage(cmdType, values);
|
||||
MessageHelper.sendMessage(cmdType, values);
|
||||
};
|
||||
|
||||
React.useEffect(() => {
|
||||
@@ -78,12 +53,12 @@ export const TagPicker: React.FunctionComponent<ITagPickerProps> = (props: React
|
||||
<h3>{type}</h3>
|
||||
|
||||
<div {...getRootProps()}>
|
||||
<input className={classes.input} {...getInputProps()} placeholder={`Pick your ${type.toLowerCase()}`}/>
|
||||
<input {...getInputProps()} placeholder={`Pick your ${type.toLowerCase()}`} />
|
||||
</div>
|
||||
|
||||
{
|
||||
groupedOptions.length > 0 ? (
|
||||
<ul className={classes.listbox} {...getListboxProps()}>
|
||||
<ul className={`article__tags__dropbox`} {...getListboxProps()}>
|
||||
{groupedOptions.map((option, index) => (
|
||||
<li key={index} {...getOptionProps({ option, index })}>{option}</li>
|
||||
))}
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
import { CommandToCode } from "../CommandToCode";
|
||||
|
||||
interface ClientVsCode<T> {
|
||||
getState: () => T;
|
||||
setState: (data: T) => void;
|
||||
postMessage: (msg: unknown) => void;
|
||||
}
|
||||
|
||||
declare const acquireVsCodeApi: <T = unknown>() => ClientVsCode<T>;
|
||||
|
||||
export class MessageHelper {
|
||||
private static vscode: ClientVsCode<any>;
|
||||
|
||||
public static getVsCodeAPI() {
|
||||
MessageHelper.vscode = acquireVsCodeApi();
|
||||
return MessageHelper.vscode;
|
||||
}
|
||||
|
||||
public static sendMessage = (command: CommandToCode, data?: any) => {
|
||||
if (data) {
|
||||
MessageHelper.vscode.postMessage({ command, data });
|
||||
} else {
|
||||
MessageHelper.vscode.postMessage({ command });
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -2,14 +2,9 @@ import { useState, useEffect } from 'react';
|
||||
import { PanelSettings } from '../../models/PanelSettings';
|
||||
import { Command } from '../Command';
|
||||
import { CommandToCode } from '../CommandToCode';
|
||||
import { MessageHelper } from '../helper/MessageHelper';
|
||||
|
||||
declare const acquireVsCodeApi: <T = unknown>() => {
|
||||
getState: () => T;
|
||||
setState: (data: T) => void;
|
||||
postMessage: (msg: unknown) => void;
|
||||
};
|
||||
|
||||
const vscode = acquireVsCodeApi();
|
||||
const vscode = MessageHelper.getVsCodeAPI();
|
||||
|
||||
export default function useMessages() {
|
||||
const [metadata, setMetadata] = useState<any>({});
|
||||
@@ -42,13 +37,6 @@ export default function useMessages() {
|
||||
return {
|
||||
metadata,
|
||||
settings,
|
||||
loading,
|
||||
sendMessage: (command: CommandToCode, data?: any) => {
|
||||
if (data) {
|
||||
vscode.postMessage({ command, data });
|
||||
} else {
|
||||
vscode.postMessage({ command });
|
||||
}
|
||||
}
|
||||
loading
|
||||
};
|
||||
}
|
||||
@@ -2,5 +2,11 @@ import * as React from "react";
|
||||
import { render } from "react-dom";
|
||||
import { ViewPanel } from "./ViewPanel";
|
||||
|
||||
declare const acquireVsCodeApi: <T = unknown>() => {
|
||||
getState: () => T;
|
||||
setState: (data: T) => void;
|
||||
postMessage: (msg: unknown) => void;
|
||||
};
|
||||
|
||||
const elm = document.querySelector("#app");
|
||||
render(<ViewPanel />, elm);
|
||||
@@ -8,7 +8,6 @@ import { Article } from '../commands';
|
||||
import { TagType } from '../viewpanel/TagType';
|
||||
|
||||
|
||||
|
||||
export class ExplorerView implements WebviewViewProvider, Disposable {
|
||||
public static readonly viewType = "frontMatter.explorer";
|
||||
private static instance: ExplorerView;
|
||||
@@ -66,7 +65,6 @@ export class ExplorerView implements WebviewViewProvider, Disposable {
|
||||
|
||||
this.disposable = Disposable.from(
|
||||
webviewView.onDidDispose(() => { webviewView.webview.html = ""; }, this),
|
||||
// window.onDidChangeWindowState(() => { console.log(`onDidChangeWindowState visible`, this.visible); }, this)
|
||||
);
|
||||
|
||||
webviewView.webview.onDidReceiveMessage(msg => {
|
||||
@@ -95,7 +93,7 @@ export class ExplorerView implements WebviewViewProvider, Disposable {
|
||||
|
||||
webviewView.onDidChangeVisibility(() => {
|
||||
if (this.visible) {
|
||||
this.getFileData();
|
||||
// this.getFileData();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user