From 3531b8af3897cb42682c7f36fef80091a401f261 Mon Sep 17 00:00:00 2001
From: c-bata <contact@c-bata.link>
Date: Fri, 1 Mar 2024 22:11:55 +0900
Subject: [PATCH] Fix the bug of code-server extension

---
 README.md                   |  3 ---
 docs/getting-started.rst    |  3 ---
 vscode/CHANGELOG.md         | 18 +++++++++++++++++-
 vscode/README.md            | 15 ---------------
 vscode/package-lock.json    |  4 ++--
 vscode/package.json         |  2 +-
 vscode/src/web/extension.ts | 30 ++++++++++++++++++++++++------
 7 files changed, 44 insertions(+), 31 deletions(-)

diff --git a/README.md b/README.md
index 2a2ee515..0df883e6 100644
--- a/README.md
+++ b/README.md
@@ -112,9 +112,6 @@ or install the code-server extension via [Open VSX](https://open-vsx.org/extensi
 Please right-click the SQLite3 files (`*.db` or `*.sqlite3`) in the VS Code file explorer and select the "Open in Optuna Dashboard" command from the dropdown menu.
 This extension leverages the browser-only version of Optuna Dashboard, so the same limitations apply.
 
-Please note that we have confirmed the behavior of the code-server extension can be unstable.
-When opening SQLite files, the dashboard may not appear on the first attempt, but it should be displayed upon a second try.
-
 ## Submitting patches
 
 If you want to contribute, please check [Developers Guide](./CONTRIBUTING.md).
diff --git a/docs/getting-started.rst b/docs/getting-started.rst
index 3179d3f5..3375c469 100644
--- a/docs/getting-started.rst
+++ b/docs/getting-started.rst
@@ -228,9 +228,6 @@ or install the code-server extension via `Open VSX <https://open-vsx.org/extensi
 To use, right-click the SQLite3 files (``*.db`` or ``*.sqlite3``) in the file explorer and select the "Open in Optuna Dashboard" from the dropdown menu.
 This extension leverages the browser-only version of Optuna Dashboard, so the same limitations apply.
 
-Please note that we have confirmed the behavior of the code-server extension can be unstable.
-When opening SQLite files, the dashboard may not appear on the first attempt, but it should be displayed upon a second try.
-
 Google Colaboratory
 -------------------
 
diff --git a/vscode/CHANGELOG.md b/vscode/CHANGELOG.md
index 704abbc4..0b2084bc 100644
--- a/vscode/CHANGELOG.md
+++ b/vscode/CHANGELOG.md
@@ -6,4 +6,20 @@ Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how
 
 ## [Unreleased]
 
-- Initial release
+## 0.2.1
+
+* Enable a "Open in Optuna Dashboard" menu for `.log` files.
+* Fix a bug that the extension cannot show studies on the first attempt.
+
+## 0.2.0
+
+* Added support for `JournalFileStorage`.
+* Added support for code-server.
+
+## 0.1.0
+
+* Added older database schemas support (Optuna 2.6.0 or later)
+
+## 0.0.1
+
+* Initial Release
diff --git a/vscode/README.md b/vscode/README.md
index aa519fda..b9f457c5 100644
--- a/vscode/README.md
+++ b/vscode/README.md
@@ -12,21 +12,6 @@ Please right-click on the SQLite3 file (`*.db` or `*.sqlite3`) in the file explo
 
 Nothing to configure.
 
-## Release Notes
-
-### 0.2.0
-
-* Added support for `JournalFileStorage`.
-* Added support for code-server.
-
-### 0.1.0
-
-Added older database schemas support (Optuna 2.6.0 or later)
-
-### 0.0.1
-
-Initial Release
-
 ---
 
 **Enjoy!**
diff --git a/vscode/package-lock.json b/vscode/package-lock.json
index ac6837b4..340a8bdb 100644
--- a/vscode/package-lock.json
+++ b/vscode/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "optuna-dashboard",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "optuna-dashboard",
-      "version": "0.2.0",
+      "version": "0.2.1",
       "license": "MIT",
       "devDependencies": {
         "@types/mocha": "^10.0.1",
diff --git a/vscode/package.json b/vscode/package.json
index e5ee047a..a3cb4a56 100644
--- a/vscode/package.json
+++ b/vscode/package.json
@@ -3,7 +3,7 @@
   "displayName": "Optuna Dashboard",
   "description": "Web Dashboard for Optuna",
   "publisher": "Optuna",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "license": "MIT",
   "icon": "images/optuna-logo.png",
   "engines": {
diff --git a/vscode/src/web/extension.ts b/vscode/src/web/extension.ts
index 096c2337..62dcaec8 100644
--- a/vscode/src/web/extension.ts
+++ b/vscode/src/web/extension.ts
@@ -30,12 +30,20 @@ export function activate(context: vscode.ExtensionContext) {
       const appPath = panel.webview.asWebviewUri(indexJsUri)
 
       panel.webview.html = getWebviewContent(appPath)
-
-      const storageContentBase64 = await readFileAsBase64(fileUri)
-      panel.webview.postMessage({
-        type: "optunaStorage",
-        content: storageContentBase64,
-      })
+      panel.webview.onDidReceiveMessage(
+        async (message: any) => {
+          switch (message.type) {
+            case 'webviewDidLoad':
+              console.log("[host] Receive a webviewDidLoad event.")
+              const storageContentBase64 = await readFileAsBase64(fileUri)
+              panel.webview.postMessage({
+                type: "optunaStorage",
+                content: storageContentBase64,
+              })
+              break
+          }
+        }
+      );
     }
   )
 
@@ -58,12 +66,22 @@ function uint8ArrayToBase64(uint8Array: Uint8Array): string {
 }
 
 function getWebviewContent(indexJsUri: vscode.Uri): string {
+  // https://code.visualstudio.com/api/extension-guides/webview#passing-messages-from-a-webview-to-an-extension
   return `<!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="utf-8" />
   <title>Optuna Dashboard (Wasm ver.)</title>
   <script type="module" crossorigin src="${indexJsUri}"></script>
+  <script>
+    (function() {
+      const vscodeApi = acquireVsCodeApi();
+      window.addEventListener('DOMContentLoaded', (event) => {
+        vscodeApi.postMessage({ type: 'webviewDidLoad' })
+        console.log("[webview] Post a webviewDidLoad event.")
+      })
+    }())
+  </script>
 </head>
 <body>
   <div id="root"></div>