WIP: エクスプローラーのモデルとアイテムのモデルを統合

Author: neet

package.json

@@ -27,7 +27,7 @@
     "core-js": "^2.5.7",
     "mocha": "^5.2.0",
     "npm-run-all": "^4.1.3",
-    "qiita-js-2": "^1.3.0",
+    "qiita-js-2": "^1.3.1",
     "tslint": "^5.8.0",
     "typescript": "^3.0.3",
     "vscode": "^1.1.6",

src/commands/compose.ts

@@ -6,6 +6,7 @@ import { qiitaItemsProvider } from '../explorers/qiitaItems';
 import { tagQuickPickCreator, validateTagQuickPick } from '../quickpicks/tagQuickPick';
 import { titleInputBoxCreator, validateTitleInputBox } from '../quickpicks/titleInputBox';
 import { privateLabel, visibilityQuickPickCreator } from '../quickpicks/visibilityQuickPick';
+import { itemsStore } from '../stores/itemsStore';
 import { handleErrorMessage } from '../utils/errorHandler';
 import { getFilenameFromPath } from '../utils/getFilenameFromPath';
 
@@ -84,6 +85,7 @@ export async function compose (resource?: Uri) {
 
     try {
       const item = await client.createItem(options);
+      await itemsStore.refreshItems();
       qiitaItemsProvider.refresh();
 
       const openInBrowser = localize(

src/commands/deleteItem.ts

@@ -3,6 +3,7 @@ import { window } from 'vscode';
 import * as nls from 'vscode-nls';
 import { client } from '../client';
 import { qiitaItemsProvider } from '../explorers/qiitaItems';
+import { itemsStore } from '../stores/itemsStore';
 import { handleErrorMessage } from '../utils/errorHandler';
 
 const localize = nls.loadMessageBundle();
@@ -35,6 +36,7 @@ export async function deleteItem (resource: { item: Item }) {
 
   try {
     await client.deleteItem(resource.item.id);
+    await itemsStore.refreshItems();
     qiitaItemsProvider.refresh();
 
     return window.showInformationMessage(localize(

src/commands/editTags.ts

@@ -4,6 +4,7 @@ import * as nls from 'vscode-nls';
 import { client } from '../client';
 import { qiitaItemsProvider } from '../explorers/qiitaItems';
 import { makeQuickPickItemFromTag, tagQuickPickCreator, validateTagQuickPick } from '../quickpicks/tagQuickPick';
+import { itemsStore } from '../stores/itemsStore';
 import { handleErrorMessage } from '../utils/errorHandler';
 
 const localize = nls.loadMessageBundle();
@@ -48,6 +49,7 @@ export async function editTags (resource: { item: Item }) {
     try {
       quickPick.hide();
       await updater(item, quickPick.selectedItems);
+      await itemsStore.refreshItems();
       qiitaItemsProvider.refresh();
 
       return window.showInformationMessage(localize(

src/commands/expandItems.ts

@@ -2,8 +2,12 @@ import { qiitaItemsProvider } from '../explorers/qiitaItems';
 import { itemsStore } from '../stores/itemsStore';
 
 export async function expandItems () {
-  if (!itemsStore.done) {
-    await itemsStore.expandItems();
-    qiitaItemsProvider.refresh();
+  try {
+    if (!itemsStore.done) {
+      await itemsStore.expandItems();
+      qiitaItemsProvider.refresh();
+    }
+  } catch (e) {
+    console.error(e);
   }
 }

src/explorers/models/expandItemsNode.ts

@@ -0,0 +1,25 @@
+import { TreeItem, TreeItemCollapsibleState } from 'vscode';
+import * as nls from 'vscode-nls';
+
+const localize = nls.loadMessageBundle();
+
+export class ExpandItems extends TreeItem {
+  /**
+   * 「さらに読み込む」ボタンのためのアイテム
+   * @param collapsibleState アイテムが折り畳まれているかの状態
+   */
+  constructor (public readonly collapsibleState: TreeItemCollapsibleState) {
+    super(localize(
+      'commands.expandItems.title',
+      'さらに読み込む...',
+    ), collapsibleState);
+  }
+
+  public command = {
+    command:   'qiita.expandItems',
+    title:     localize('commands.expandItems.title', 'さらに読み込む...'),
+    arguments: [],
+  };
+
+  public contextValue = 'qiitaItems';
+}

src/explorers/models/qiitaItemsNode.ts

@@ -0,0 +1,21 @@
+import { Item } from 'qiita-js-2';
+import { Command, TreeItem, TreeItemCollapsibleState, Uri } from 'vscode';
+
+export class QiitaItem extends TreeItem {
+  /**
+   * "Qiitaの投稿" ビューに表示されるアイテム
+   * @param item Qiitaの投稿
+   * @param collapsibleState アイテムが折り畳まれているかの状態
+   * @param command クリック時に発火するコマンド
+   */
+  constructor (
+    public readonly item: Item,
+    public readonly collapsibleState: TreeItemCollapsibleState,
+    public readonly command: Command,
+  ) {
+    super(item.title, collapsibleState);
+  }
+
+  public resourceUri  = Uri.parse('file:///text.md'); // Hack: アイコンをMarkdownのものに
+  public contextValue = 'qiitaItems';
+}

src/explorers/qiitaItems.ts

@@ -1,70 +1,30 @@
 import { Item } from 'qiita-js-2';
-import {
-  Command,
-  Event,
-  EventEmitter,
-  TreeDataProvider,
-  TreeItem,
-  TreeItemCollapsibleState,
-  Uri,
-} from 'vscode';
+import { Event, EventEmitter, TreeDataProvider, TreeItem, TreeItemCollapsibleState } from 'vscode';
 import * as nls from 'vscode-nls';
-import { itemsStore } from '../stores/itemsStore';
+import { client } from '../client';
+import '../polyfills';
+import { ExpandItems } from './models/expandItemsNode';
+import { QiitaItem } from './models/qiitaItemsNode';
 
 const localize = nls.loadMessageBundle();
 
+class QiitaItemsProvider implements TreeDataProvider<TreeItem> {
+  private _onDidChangeTreeData: EventEmitter<TreeItem|undefined> = new EventEmitter<TreeItem|undefined>();
+  public readonly onDidChangeTreeData: Event<TreeItem|undefined> = this._onDidChangeTreeData.event;
 
-export class QiitaItem extends TreeItem {
-  /**
-   * "Qiitaの投稿" ビューに表示されるアイテム
-   * @param item Qiitaの投稿
-   * @param collapsibleState アイテムが折り畳まれているかの状態
-   * @param command クリック時に発火するコマンド
-   */
-  constructor (
-    public readonly item: Item,
-    public readonly collapsibleState: TreeItemCollapsibleState,
-    public readonly command: Command,
-  ) {
-    super(item.title, collapsibleState);
-  }
+  /** 取得した投稿 */
+  protected items: Item[] = [];
 
-  public resourceUri  = Uri.parse('file:///text.md'); // Hack: アイコンをMarkdownのものに
-  public contextValue = 'qiitaItems';
-}
+  /** 全件取得したかどうか */
+  protected done = false;
 
-
-export class ExpandItems extends TreeItem {
-  /**
-   * 「さらに読み込む」ボタンのためのアイテム
-   * @param collapsibleState アイテムが折り畳まれているかの状態
-   */
-  constructor (public readonly collapsibleState: TreeItemCollapsibleState) {
-    super(localize(
-      'commands.expandItems.title',
-      'さらに読み込む...',
-    ), collapsibleState);
-  }
-
-  public command = {
-    command: 'qiita.expandItems',
-    title:   localize('commands.expandItems.title', 'さらに読み込む...'),
-    arguments: [],
-  };
-
-  public contextValue = 'qiitaItems';
-}
-
-
-class QiitaItemsProvider implements TreeDataProvider<QiitaItem|ExpandItems> {
-  private _onDidChangeTreeData: EventEmitter<QiitaItem|ExpandItems|undefined> = new EventEmitter<QiitaItem|ExpandItems|undefined>();
-  public readonly onDidChangeTreeData: Event<QiitaItem|ExpandItems|undefined> = this._onDidChangeTreeData.event;
+  /** 自分の投稿の配列を返すイテラブル */
+  protected itemsIterable = client.fetchMyItems({ page: 1, per_page: 60 });
 
   /**
    * ツリーデータを更新
    */
   public async refresh () {
-    await itemsStore.refreshItems();
     this._onDidChangeTreeData.fire();
   }
 
@@ -82,7 +42,7 @@ class QiitaItemsProvider implements TreeDataProvider<QiitaItem|ExpandItems> {
    * @param element 取得するelement
    */
   public async getChildren (): Promise<(QiitaItem|ExpandItems)[]> {
-    if (itemsStore.items.size === 0) {
+    if (!itemsStore.items || !itemsStore.items.length) {
       await itemsStore.refreshItems();
     }
 
@@ -105,6 +65,24 @@ class QiitaItemsProvider implements TreeDataProvider<QiitaItem|ExpandItems> {
 
     return children;
   }
+
+  /**
+   * イテラブルを初期化して最初のページを再取得
+   */
+  public async refreshItems () {
+    const { value: items, done } = await this.itemsIterable.next('reset');
+    this.items = items;
+    this.done  = done;
+  }
+
+  /**
+   * イテラブルのnextを呼び出し
+   */
+  public async expandItems () {
+    const { value: items, done } = await this.itemsIterable.next();
+    this.items.concat(items);
+    this.done = done;
+  }
 }
 
 export const qiitaItemsProvider = new QiitaItemsProvider();

src/stores/itemsStore.ts

@@ -1618,9 +1618,9 @@ punycode@^1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
 
-qiita-js-2@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/qiita-js-2/-/qiita-js-2-1.3.0.tgz#b975b4599db894b697ad0432082ce54086a57688"
+qiita-js-2@^1.3.1:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/qiita-js-2/-/qiita-js-2-1.3.1.tgz#9d407cde3b5dd48c6f5ee1e9ccd1d841e6c45412"
   dependencies:
     axios "^0.18.0"
     http-link-header "^0.8.0"