Watch for file changes (#7)

* Watch for file changes

* Display error messages in the window

* Update changelog

Author: kamilturek

CHANGELOG.md

@@ -2,6 +2,11 @@
 
 ## [Unreleased]
 
+- Added file system watcher to monitor for changes to the current document.
+  This allows the preview to be automatically updated whenever the ZPL file is changed.
+- Improved error handling. If an error occurs, an error message is displayed to
+  the user.
+
 ## [0.1.0]
 
 - Included a GIF into README.md.

src/labelary.ts

@@ -9,6 +9,5 @@ export function zplToPng(zpl: string, dpmm: number): Promise<string | void> {
         responseType: 'arraybuffer',
       }
     )
-    .then((res) => Buffer.from(res.data).toString('base64'))
-    .catch((err) => console.log('err', err));
+    .then((res) => Buffer.from(res.data).toString('base64'));
 }

src/zplProvider.ts

@@ -25,6 +25,12 @@ export class ZPLEditorProvider implements vscode.CustomTextEditorProvider {
     webviewPanel: vscode.WebviewPanel,
     token: vscode.CancellationToken
   ): void | Thenable<void> {
+    vscode.workspace
+      .createFileSystemWatcher(document.uri.fsPath)
+      .onDidChange(() => {
+        this.updateWebview(document, webviewPanel);
+      });
+
     webviewPanel.webview.options = {
       enableScripts: true,
     };
@@ -126,15 +132,19 @@ export class ZPLEditorProvider implements vscode.CustomTextEditorProvider {
     document: vscode.TextDocument,
     webviewPanel: vscode.WebviewPanel
   ): Promise<void> {
-    return zplToPng(document.getText(), this.dpmm).then(
-      (label: string | void) => {
+    return zplToPng(document.getText(), this.dpmm)
+      .then((label: string | void) => {
         if (label) {
           webviewPanel.webview.html = this.getHtmlForWebview(
             webviewPanel.webview,
             label
           );
         }
-      }
-    );
+      })
+      .catch((err: Error) => {
+        vscode.window.showErrorMessage(
+          `Error rendering ZPL preview: ${err.message}`
+        );
+      });
   }
 }