Merge pull request #91 from zenn-dev/canary

release v0.1.2

Author: uttk-dev

.github/PULL_REQUEST_TEMPLATE.md

@@ -4,7 +4,7 @@
 
 Resolves #<issue-url>
 
-### :clipboard: Tasks
+## :clipboard: Tasks
 
 プルリクエストを作成いただく際、お手数ですが以下の内容についてご確認をお願いします。
 

README.md

@@ -70,7 +70,11 @@ settings.json に以下の設定を追加してください。
 
 ```json
     "[markdown]":  {
-        "editor.quickSuggestions": true
+        "editor.quickSuggestions": {
+            "comments": true,
+            "strings": true,
+            "other": true
+        }
     }
 ```
 

examples/articles/local-image-test.md

@@ -50,3 +50,14 @@ published: true
 ![1st](/images/example-images/zenn-editor.png)
 
 ![2nd](/images/example-images/zenn-editor.png)
+
+## 不同画像の連続表示
+
+```md
+![1st](/images/example-images/zenn-editor.png)
+![2nd](/images/example-images/zenn-icon.png)
+```
+
+![1st](/images/example-images/zenn-editor.png)
+
+![2nd](/images/example-images/zenn-icon.png)

examples/images/example-images/zenn-icon.png

@@ -4,12 +4,13 @@
   "displayName": "Zenn Preview for github.dev",
   "description": "Zenn のコンテンツを github.dev でプレビューできるようにする VSCode 拡張",
   "icon": "public/assets/zenn-icon.png",
+  "homepage": "https://marketplace.visualstudio.com/items?itemName=zenn.zenn-preview",
   "repository": {
     "type": "git",
     "url": "https://github.com/zenn-dev/zenn-vscode-extension.git"
   },
   "license": "MIT",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "pricing": "Free",
   "engines": {
     "vscode": "^1.72.0"
@@ -157,7 +158,7 @@
       "editor/title": [
         {
           "command": "zenn-preview.preview-zenn",
-          "when": "resourceLangId == markdown",
+          "when": "resourceLangId == markdown && zenn-preview.active-document-can-preview",
           "group": "navigation"
         }
       ]

package.json

@@ -23,7 +23,7 @@ const generateArticleTemplate = () =>
  * 記事の新規作成コマンドの実装
  */
 export const newArticleCommand = (context?: AppContext) => {
-  const generator = async (): Promise<boolean> => {
+  const generator = async (): Promise<vscode.Uri | null> => {
     if (!context) throw new Error("コマンドを実行できません");
 
     const aritcleSlug = await vscode.window.showInputBox({
@@ -46,7 +46,7 @@ export const newArticleCommand = (context?: AppContext) => {
       },
     });
 
-    if (!aritcleSlug) return false;
+    if (!aritcleSlug) return null;
 
     const { articlesFolderUri } = context;
     const text = new TextEncoder().encode(generateArticleTemplate());
@@ -57,14 +57,15 @@ export const newArticleCommand = (context?: AppContext) => {
 
     await vscode.workspace.fs.writeFile(fileUri, text);
 
-    return true;
+    return fileUri;
   };
 
   return () => {
     generator()
-      .then((isCreated) => {
-        if (isCreated) {
+      .then((fileUri) => {
+        if (fileUri) {
           vscode.window.showInformationMessage("記事を作成しました");
+          vscode.window.showTextDocument(fileUri);
         }
       })
       .catch(() => {

src/commands/newArticle.ts

@@ -30,29 +30,36 @@ const generateBookConfigTemplate = () =>
 /**
  * 本の設定ファイルを生成する
  */
-const createBookConfigFile = async (bookUri: vscode.Uri) => {
+const createBookConfigFile = async (
+  bookUri: vscode.Uri
+): Promise<vscode.Uri> => {
   const configText = new TextEncoder().encode(generateBookConfigTemplate());
   const configUri = vscode.Uri.joinPath(bookUri, "config.yaml");
 
   await vscode.workspace.fs.writeFile(configUri, configText);
+
+  return configUri;
 };
 
 /**
  * 本の作成に基づいてチャプターファイルを作成する
  */
-const createBookChapterFiles = async (bookUri: vscode.Uri) => {
-  await Promise.all(
+const createBookChapterFiles = async (
+  bookUri: vscode.Uri
+): Promise<vscode.Uri[]> => {
+  const bookChapterFileUris = await Promise.all(
     TEMPLATE_CHAPTERS.map((fileName) =>
       createBookChapterFile(fileName, bookUri)
     )
   );
+  return bookChapterFileUris;
 };
 
 /**
  * 本の新規作成コマンドの実装
  */
 export const newBookCommand = (context?: AppContext) => {
-  const generator = async (): Promise<boolean> => {
+  const generator = async (): Promise<vscode.Uri | null> => {
     if (!context) throw new Error("コマンドを実行できません");
 
     const bookSlug = await vscode.window.showInputBox({
@@ -72,24 +79,25 @@ export const newBookCommand = (context?: AppContext) => {
       },
     });
 
-    if (!bookSlug) return false;
+    if (!bookSlug) return null;
 
     const bookUri = vscode.Uri.joinPath(context.booksFolderUri, bookSlug);
 
     await vscode.workspace.fs.createDirectory(bookUri);
-    await Promise.all([
+    const [configFileUri] = await Promise.all([
       createBookConfigFile(bookUri),
       createBookChapterFiles(bookUri),
     ]);
 
-    return true;
+    return configFileUri;
   };
 
   return () => {
     generator()
-      .then((isCreated) => {
-        if (isCreated) {
+      .then((configFileUri) => {
+        if (configFileUri) {
           vscode.window.showInformationMessage("本を作成しました");
+          vscode.window.showTextDocument(configFileUri);
         }
       })
       .catch(() => {

src/commands/newBook.ts

@@ -18,19 +18,23 @@ export const generateBookChapterTemplate = () =>
 export const createBookChapterFile = async (
   filename: string,
   bookUri: vscode.Uri
-): Promise<void> => {
+): Promise<vscode.Uri> => {
   const templateText = generateBookChapterTemplate();
   const chapterText = new TextEncoder().encode(templateText);
   const chapterUri = vscode.Uri.joinPath(bookUri, `${filename}.md`);
 
   await vscode.workspace.fs.writeFile(chapterUri, chapterText);
+
+  return chapterUri;
 };
 
 /**
  * チャプターの新規作成コマンドの実装
  */
 export const newChapterCommand = (context?: AppContext) => {
-  const generator = async (treeItem?: BookTreeItem): Promise<boolean> => {
+  const generator = async (
+    treeItem?: BookTreeItem
+  ): Promise<vscode.Uri | null> => {
     if (!context) throw new Error("コマンドを実行できません");
 
     const selectedBookFolder = treeItem?.contentUri
@@ -49,7 +53,7 @@ export const newChapterCommand = (context?: AppContext) => {
             });
           });
 
-    if (!selectedBookFolder) return false;
+    if (!selectedBookFolder) return null;
 
     // チャプタースラグの作成
     const chapterSlug = await vscode.window.showInputBox({
@@ -73,24 +77,25 @@ export const newChapterCommand = (context?: AppContext) => {
     });
 
     // チャプタースラグが不正やすでに存在している場合は失敗
-    if (!chapterSlug) return false;
+    if (!chapterSlug) return null;
 
     const bookUri = vscode.Uri.joinPath(
       context.booksFolderUri,
       selectedBookFolder
     );
 
     // ファイルを作成する
-    await createBookChapterFile(chapterSlug, bookUri);
+    const fileUri = await createBookChapterFile(chapterSlug, bookUri);
 
-    return true;
+    return fileUri;
   };
 
   return (treeItem?: BookTreeItem) => {
     generator(treeItem)
-      .then((isCreated) => {
-        if (isCreated) {
+      .then((fileUri) => {
+        if (fileUri) {
           vscode.window.showInformationMessage("チャプターを作成しました");
+          vscode.window.showTextDocument(fileUri);
         }
       })
       .catch(() => {

src/commands/newChapter.ts

@@ -6,6 +6,7 @@ import { initializeBookChapterEditor } from "./bookChapter";
 import { initializeBookConfigEditor } from "./bookConfig";
 import { initializeBookCoverImageEditor } from "./bookCoverImage";
 
+import { checkUriCanPreview } from "../../schemas/previewPanel";
 import { AppContext } from "../app";
 
 /**
@@ -44,7 +45,17 @@ export const initializeEditor = (context: AppContext): vscode.Disposable[] => {
     vscode.window.onDidChangeActiveTextEditor((event) => {
       if (!event || !event.viewColumn) return;
 
-      const key = cache.createKey("previewPanel", event.document.uri);
+      const activeDocumentUri = event.document.uri;
+
+      // 現在のドキュメントのUriがプレビュー可能なものならエディタタイトル上にプレビューボタンを表示
+      const canPreview = checkUriCanPreview(context, activeDocumentUri);
+      vscode.commands.executeCommand(
+        "setContext",
+        "zenn-preview.active-document-can-preview",
+        canPreview
+      );
+
+      const key = cache.createKey("previewPanel", activeDocumentUri);
       const panel = cache.getCache(key)?.panel;
 
       if (!panel) return;

src/context/editor/index.ts

@@ -57,7 +57,10 @@ export const createPreviewPanel = (
 /**
  * プレビュー可能な Uri か判別する
  */
-const checkUriCanPreview = (context: AppContext, uri: vscode.Uri): boolean => {
+export const checkUriCanPreview = (
+  context: AppContext,
+  uri: vscode.Uri
+): boolean => {
   const type = context.getContentsType(uri);
   const canPreviewContentsType: ContentsType[] = [
     "article",