#652 - start/stop server enhancements

CHANGELOG.md

@@ -11,6 +11,7 @@
 - [#570](https://github.com/estruyf/vscode-front-matter/issues/570): Clear empty values on content creation and editing
 - [#645](https://github.com/estruyf/vscode-front-matter/issues/645): French localization added (thanks to [Clément Barbaza](https://github.com/cba85))
 - [#649](https://github.com/estruyf/vscode-front-matter/issues/649): Parse optional variables from snippets
+- [#652](https://github.com/estruyf/vscode-front-matter/issues/652): Show the start/stop server buttons depending on the local terminal session
 
 ### ⚡️ Optimizations
 

src/listeners/panel/DataListener.ts

@@ -57,6 +57,9 @@ export class DataListener extends BaseListener {
       case CommandToCode.stopServer:
         this.stopServer();
         break;
+      case CommandToCode.isServerStarted:
+        this.isServerStarted(msg.command, msg?.requestId);
+        break;
       case CommandToCode.updatePlaceholder:
         this.updatePlaceholder(msg?.payload?.field, msg?.payload?.value, msg?.payload?.title);
         break;
@@ -523,6 +526,8 @@ export class DataListener extends BaseListener {
         localServerTerminal.sendText(command);
         localServerTerminal.show(false);
       }
+
+      this.sendMsg(Command.serverStarted, true);
     }
   }
 
@@ -534,6 +539,20 @@ export class DataListener extends BaseListener {
     if (localServerTerminal) {
       localServerTerminal.dispose();
     }
+
+    this.sendMsg(Command.serverStarted, false);
+  }
+
+  /**
+   * Checks if the server is started
+   */
+  private static isServerStarted(command: string, requestId?: string) {
+    if (!command || !requestId) {
+      return;
+    }
+
+    const localServerTerminal = DataListener.findServerTerminal();
+    this.sendRequest(command, requestId, !!localServerTerminal);
   }
 
   /**

src/panelWebView/Command.ts

@@ -10,5 +10,6 @@ export enum Command {
   sendMediaUrl = 'sendMediaUrl',
   updatePlaceholder = 'updatePlaceholder',
   dataFileEntries = 'dataFileEntries',
-  updatedSlug = 'updatedSlug'
+  updatedSlug = 'updatedSlug',
+  serverStarted = 'server-started'
 }

src/panelWebView/CommandToCode.ts

@@ -43,5 +43,6 @@ export enum CommandToCode {
   aiSuggestTaxonomy = 'ai-suggest-taxonomy',
   aiSuggestDescription = 'ai-suggest-description',
   searchByType = 'search-by-type',
-  processMediaData = 'process-media-data'
+  processMediaData = 'process-media-data',
+  isServerStarted = 'is-server-started'
 }

src/panelWebView/components/StartServerButton.tsx

@@ -1,10 +1,12 @@
-import { Messenger } from '@estruyf/vscode/dist/client';
+import { Messenger, messageHandler } from '@estruyf/vscode/dist/client';
 import * as React from 'react';
 import { PanelSettings } from '../../models';
 import { CommandToCode } from '../CommandToCode';
 import useStartCommand from '../hooks/useStartCommand';
 import { LocalizationKey } from '../../localization';
 import * as l10n from "@vscode/l10n"
+import { EventData } from '@estruyf/vscode/dist/models';
+import { Command } from '../Command';
 
 export interface IStartServerButtonProps {
   settings: PanelSettings | undefined;
@@ -13,6 +15,7 @@ export interface IStartServerButtonProps {
 export const StartServerButton: React.FunctionComponent<IStartServerButtonProps> = ({
   settings
 }: React.PropsWithChildren<IStartServerButtonProps>) => {
+  const [isStarted, setIsStarted] = React.useState(false);
   const { startCommand } = useStartCommand(settings);
 
   const startLocalServer = (command: string) => {
@@ -23,20 +26,44 @@ export const StartServerButton: React.FunctionComponent<IStartServerButtonProps>
     Messenger.send(CommandToCode.stopServer);
   };
 
+  const messageListener = (message: MessageEvent<EventData<any>>) => {
+    const { command, payload } = message.data;
+
+    if (command === Command.serverStarted) {
+      setIsStarted(payload);
+    }
+  };
+
+  React.useEffect(() => {
+    Messenger.listen(messageListener);
+
+    messageHandler.request<boolean>(CommandToCode.isServerStarted).then((isStarted) => {
+      setIsStarted(isStarted);
+    });
+
+    return () => {
+      Messenger.unlisten(messageListener);
+    };
+  }, []);
+
   return startCommand ? (
     <>
-      <button
-        title={l10n.t(LocalizationKey.panelStartServerbuttonStart)}
-        type={`button`}
-        onClick={() => startLocalServer(startCommand)}>
-        {l10n.t(LocalizationKey.panelStartServerbuttonStart)}
-      </button>
-      <button
-        title={l10n.t(LocalizationKey.panelStartServerbuttonStop)}
-        type={`button`}
-        onClick={() => stopLocalServer()}>
-        {l10n.t(LocalizationKey.panelStartServerbuttonStop)}
-      </button>
+      {
+        !isStarted ? (
+          <button
+            title={l10n.t(LocalizationKey.panelStartServerbuttonStart)}
+            type={`button`}
+            onClick={() => startLocalServer(startCommand)}>
+            {l10n.t(LocalizationKey.panelStartServerbuttonStart)}
+          </button>
+        ) : (
+          <button
+            title={l10n.t(LocalizationKey.panelStartServerbuttonStop)}
+            type={`button`}
+            onClick={() => stopLocalServer()}>
+            {l10n.t(LocalizationKey.panelStartServerbuttonStop)}
+          </button>
+        )}
     </>
   ) : null;
 };