Requests and Responses updated

Author: stricklandrbls

src/dataEditor/dataEditorClient.ts

@@ -133,7 +133,7 @@ export class DataEditorClient implements vscode.Disposable {
     fileToEdit: string = '',
     private panel: DataEditorUI
   ) {
-    this.panel.onDidReceiveMessage(this.msgReceiver, this)
+    this.panel.onDidReceiveMessage(this.msgReceiver)
 
     this.disposables = [
       this.panel,
@@ -187,6 +187,8 @@ export class DataEditorClient implements vscode.Disposable {
 
     await editor.initialize()
 
+    ui.reveal()
+
     ui.onDidDispose(async () => {
       const pathKey = path.resolve(editor.fileToEdit).toLowerCase()
       OPEN_EDITORS.delete(pathKey)
@@ -373,7 +375,12 @@ export class DataEditorClient implements vscode.Disposable {
       vscode.window.showErrorMessage(msg)
     }
 
-    this.panel.postMessage
+    this.panel.postMessage('fileInfo', {
+      bom: data.byteOrderMark,
+      contentType: data.type,
+      filename: this.fileToEdit,
+      language: data.language,
+    })
     // send the initial file info to the webview
     // await this.panel.postMessage({
     //   command: MessageCommand.fileInfo,

src/dataEditor/ui/svelteWebviewInitializer.ts

@@ -19,58 +19,63 @@ import * as vscode from 'vscode'
 import * as fs from 'fs'
 import {
   DataEditorMessageResponses,
-  ExtensionMessageResponses,
-  MessageCommandMap,
+  MessageRequestMap,
+  MessageResponseMap,
   PostMessageArgs,
 } from 'ext_types'
 import { DisplayState } from './displayState'
+import { randomUUID } from 'crypto'
 
 export interface DataEditorUI extends vscode.Disposable {
   readonly displayState: DisplayState
   dispose(): void
   setTitle(title: string): void
-  postMessage<K extends keyof MessageCommandMap>(
-    ...payload: PostMessageArgs<MessageCommandMap, K>
+  getMsgId(): string
+  postMessage<K extends keyof MessageResponseMap>(
+    ...payload: PostMessageArgs<MessageResponseMap, K>
   ): void
   reveal: vscode.WebviewPanel['reveal']
-  onDidReceiveMessage: vscode.Webview['onDidReceiveMessage']
-  onDidDispose: vscode.WebviewPanel['onDidDispose']
+  onDidReceiveMessage(listener: (e: any) => void): void
+  onDidDispose(listener: (e: any) => void): void
 }
 class SvelteUIWebviewPanel implements DataEditorUI {
   static readonly uiViewId: string = 'dataEditor'
   readonly displayState: DisplayState = new DisplayState()
+  private messengerId: string = ''
 
   constructor(private vscodePanel: vscode.WebviewPanel) {}
   dispose() {
     this.vscodePanel.dispose()
   }
-
+  getMsgId() {
+    return this.messengerId
+  }
   setTitle(title: string) {
     this.vscodePanel.title = title
   }
 
-  postMessage<K extends keyof MessageCommandMap>(
-    ...payload: PostMessageArgs<MessageCommandMap, K>
-  ) {}
-  postEditorResponse<K extends keyof DataEditorMessageResponses>(
-    type: K,
-    message: DataEditorMessageResponses[K]
+  postMessage<K extends keyof MessageResponseMap>(
+    ...msg: PostMessageArgs<MessageResponseMap, K>
   ) {
-    this.vscodePanel.webview.postMessage({ command: type, data: message })
-  }
-  postExtensionResponse<K extends keyof ExtensionMessageResponses>(
-    type: K,
-    message: ExtensionMessageResponses[K]
-  ) {
-    this.vscodePanel.webview.postMessage({ command: type, data: message })
+    const [type, payload] = msg as [K, MessageResponseMap[K]]
+    this.vscodePanel.webview.postMessage({
+      command: type,
+      id: this.messengerId,
+      data: { ...payload },
+    })
   }
 
-  public readonly onDidReceiveMessage =
-    this.vscodePanel.webview.onDidReceiveMessage
+  public onDidReceiveMessage(listener: (e: any) => void) {
+    this.vscodePanel.webview.onDidReceiveMessage(listener)
+  }
 
-  public readonly reveal = this.vscodePanel.reveal
+  public readonly reveal = () => {
+    this.vscodePanel.reveal()
+  }
 
-  public readonly onDidDispose = this.vscodePanel.onDidDispose
+  public onDidDispose(listener: (e: any) => void) {
+    this.vscodePanel.onDidDispose(listener)
+  }
 }
 
 export type SveltePanelArgs = {
@@ -104,7 +109,6 @@ const ValidInitializerState: SvelteInitializerState = {
 }
 class SvelteWebviewInitializer {
   static state: SvelteInitializerState = InvalidInitializerState
-
   constructor() {}
 
   createSveltePanel(args: SveltePanelArgs): SvelteUIWebviewPanel {
@@ -114,13 +118,14 @@ class SvelteWebviewInitializer {
       args.column
     )
     this.setWebviewOptions(ret)
-    this.setHtmlContent(ret)
+    const uiMsgId = randomUUID()
+    this.setHtmlContent(ret, uiMsgId)
 
     return new SvelteUIWebviewPanel(ret)
   }
 
   // get the HTML content for the webview
-  private setHtmlContent(vsPanel: vscode.WebviewPanel): string {
+  private setHtmlContent(vsPanel: vscode.WebviewPanel, msgId: string) {
     let vsWebview = vsPanel.webview
     const nonce = this.getNonce()
 
@@ -142,7 +147,9 @@ class SvelteWebviewInitializer {
       .replace(/src="\.\/index.js"/, `src="${scriptUri.toString()}"`)
       .replace(/href="\.\/style.css"/, `href="${stylesUri.toString()}"`)
       .replaceAll(/nonce="__nonce__"/g, `nonce="${nonce}""`)
-    return indexHTML
+      .replace('__extension_msg_id__', msgId)
+
+    vsWebview.html = indexHTML
   }
   private injectNonce(
     html: string,

src/ext_types/messageContent.ts

@@ -1,3 +1,4 @@
+import { IServerHeartbeat } from '@omega-edit/client'
 import {
   EditorMessageId,
   EditorMessageIds,
@@ -50,7 +51,10 @@ type MessageCommands =
   | 'undoChange'
   | 'viewportRefresh'
 
-export interface MessageCommandMap {
+type CommandMap = {
+  [K in MessageCommands]: any
+}
+export interface MessageRequestMap extends CommandMap {
   counts: never
   clearChanges: never
   applyChanges: ApplyChangesRequest
@@ -73,19 +77,46 @@ export interface MessageCommandMap {
   setUITheme: SetUIThemeRequest
 }
 
+export interface MessageResponseMap extends CommandMap {
+  clearChanges: void
+  applyChanges: ChangesInfoResponse
+  editorOnChange: EditorOnChangeResponse
+  fileInfo: FileInfoResponse
+  counts: CountResponse
+  profile: ProfileResponse
+  redoChange: void
+  replaceResults: ReplaceResponse
+  requestEditedData: EditedDataResponse
+  save: void
+  saveAs: SaveAsResponse
+  saveSegment: void
+  scrollViewport: void
+  search: SearchResponse
+  replace: ReplaceResponse
+  undoChange: void
+  viewportRefresh: ViewportRefreshResponse
+  showMessage: undefined
+  setUITheme: void
+  heartbeat: IServerHeartbeat & { port: number }
+}
+
 export type ExtensionMessageKeys =
   | 'showMessage'
   | 'setUITheme'
   | 'editorOnChange'
+
 export type DataEditorMessageKeys = Exclude<
   MessageCommands,
   ExtensionMessageKeys
 >
 export type DataEditorMessageRequests = Pick<
-  MessageCommandMap,
+  MessageRequestMap,
+  DataEditorMessageKeys
+>
+export type DataEditorMessageResponses = Pick<
+  MessageResponseMap,
   DataEditorMessageKeys
 >
-
 /**
  * Key indexable interface to templated type inference of available messages sent between
  * the components of the DFDL VSCode extension.
@@ -112,36 +143,33 @@ export type DataEditorMessageRequests = Pick<
 //   viewportRefresh: never
 // }
 export type ExtensionMessageRequests = Pick<
-  MessageCommandMap,
+  MessageRequestMap,
   ExtensionMessageKeys
 >
 
-export interface ExtensionMessageResponses {
-  showMessage: undefined
-  setUITheme: void
-}
+// export type ExtensionMessageResponses = Pick<
 
-export interface DataEditorMessageResponses
-  extends Record<keyof DataEditorMessageRequests, unknown> {
-  clearChanges: void
-  applyChanges: ChangesInfoResponse
-  editorOnChange: EditorOnChangeResponse
-  fileInfo: FileInfoResponse
-  counts: CountResponse
-  // heartbeat: IServerHeartbeat & { port: number } // service
-  profile: ProfileResponse
-  redoChange: void
-  replaceResults: ReplaceResponse
-  requestEditedData: EditedDataResponse
-  save: void
-  saveAs: SaveAsResponse
-  saveSegment: void
-  scrollViewport: void
-  search: SearchResponse
-  replace: ReplaceResponse
-  undoChange: void
-  viewportRefresh: ViewportRefreshResponse
-}
+// export interface DataEditorMessageResponses
+//   extends Record<keyof DataEditorMessageRequests, unknown> {
+//   clearChanges: void
+//   applyChanges: ChangesInfoResponse
+//   editorOnChange: EditorOnChangeResponse
+//   fileInfo: FileInfoResponse
+//   counts: CountResponse
+//   // heartbeat: IServerHeartbeat & { port: number } // service
+//   profile: ProfileResponse
+//   redoChange: void
+//   replaceResults: ReplaceResponse
+//   requestEditedData: EditedDataResponse
+//   save: void
+//   saveAs: SaveAsResponse
+//   saveSegment: void
+//   scrollViewport: void
+//   search: SearchResponse
+//   replace: ReplaceResponse
+//   undoChange: void
+//   viewportRefresh: ViewportRefreshResponse
+// }
 
 export type VSEditorMessagePackage<K extends keyof DataEditorMessageRequests> =
   {

src/ext_types/messages.ts

@@ -15,10 +15,6 @@
  * limitations under the License.
  */
 
-import {
-  DataEditorMessageResponses,
-  ExtensionMessageResponses,
-} from 'ext_types'
 import { EditByteModes } from './formattypes'
 
 /**

src/svelte/index.html

@@ -23,7 +23,7 @@
     <title>Vite + Svelte + TS</title>
   </head>
   <body>
-    <div id="app"></div>
+    <div id="app" extension_msg_id="__extension_msg_id__"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>
 </html>

src/svelte/src/App.svelte

@@ -59,12 +59,14 @@ limitations under the License.
   import { byte_count_divisible_offset } from './utilities/display'
   import Help from './components/layouts/Help.svelte'
   import { EditByteModes, type BytesPerRow } from 'ext_types'
-  import { VIEWPORT_SCROLL_INCREMENT } from 'stores/configuration'
-  
+  import { VIEWPORT_SCROLL_INCREMENT } from './stores/configuration'
+  import { getUIMsgId, setUIMsgId } from 'stores/states.svelte'
+  setUIMsgId( document.getElementById('app')?.attributes['extension_msg_id'].value )
+    console.log("Svelte UI Messenger Id: ", getUIMsgId())
   function requestEditedData() {
     if ($requestable) {
       
-      vscode.postEditorMessage('requestEditedData', {
+      vscode.postMessage('test','requestEditedData', {
           selectionToFileOffset: $selectionDataStore.startOffset,
           editedContent: $editorSelection,
           viewport: $focusedViewportId,
@@ -153,7 +155,7 @@ limitations under the License.
       $bytesPerRow,
       fetchOffset
     )
-    vscode.postMessage('scrollViewport', {
+    vscode.postMessage('test','scrollViewport', {
         startOffset: fetchOffset,
         bytesPerRow: $bytesPerRow,
         numLinesDisplayed: $dataDislayLineAmount,
@@ -169,7 +171,7 @@ limitations under the License.
     const navigationData = navigationEvent.detail
     $dataFeedAwaitRefresh = true
 
-    vscode.postMessage('scrollViewport', {
+    vscode.postMessage('test','scrollViewport', {
         startOffset: navigationData.nextViewportOffset,
         bytesPerRow: $bytesPerRow
     })
@@ -217,32 +219,27 @@ limitations under the License.
         editedData = new Uint8Array(0)
         break
     }
-    vscode.postEditorMessage('applyChanges', {
-        offset: editedOffset,
-        original_segment: originalData as Uint8Array,
-        edited_segment: editedData,
-
-    })
-    vscode.postMessage('applyChanges', {
+    vscode.postMessage('test','applyChanges', {
         offset: editedOffset,
         original_segment: originalData as Uint8Array,
         edited_segment: editedData,
 
     })
+    
     clearDataDisplays()
     clearQueryableData()
   }
 
   function undo() {
-    vscode.postMessage("undoChange")
+    vscode.postMessage('test',"undoChange")
   }
 
   function redo() {
-    vscode.postMessage("redoChange")
+    vscode.postMessage('test',"redoChange")
   }
 
   function clearChangeStack() {
-    vscode.postMessage('clearChanges')
+    vscode.postMessage('test','clearChanges')
   }
 
   function clearDataDisplays() {