feat(opsserver): add container workspace API and backend execution environment for services

ts_web/elements/ob-view-services.ts

@@ -2,6 +2,7 @@ import * as plugins from '../plugins.js';
 import * as shared from './shared/index.js';
 import * as appstate from '../appstate.js';
 import * as interfaces from '../../ts_interfaces/index.js';
+import { BackendExecutionEnvironment } from '../environments/backend-environment.js';
 import {
   DeesElement,
   customElement,
@@ -135,6 +136,9 @@ export class ObViewServices extends DeesElement {
   @state()
   accessor selectedPlatformType: string = '';
 
+  @state()
+  accessor workspaceOpen: boolean = false;
+
   constructor() {
     super();
 
@@ -186,6 +190,18 @@ export class ObViewServices extends DeesElement {
         width: 16px;
         height: 16px;
       }
+
+      :host(.workspace-mode) {
+        max-width: none;
+        padding: 0;
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+      }
+
+      :host(.workspace-mode) ob-sectionheading {
+        display: none;
+      }
     `,
   ];
 
@@ -347,6 +363,28 @@ export class ObViewServices extends DeesElement {
           this.currentView = 'list';
         }}
         @service-action=${(e: CustomEvent) => this.handleServiceAction(e)}
+        @request-workspace=${async (e: CustomEvent) => {
+          const name = e.detail?.service?.name || this.selectedServiceName;
+          const identity = appstate.loginStatePart.getState().identity;
+          if (!name || !identity) return;
+          try {
+            const env = new BackendExecutionEnvironment(name, identity);
+            await env.init();
+            const detailView = this.shadowRoot?.querySelector('sz-service-detail-view') as any;
+            if (detailView) {
+              detailView.workspaceEnvironment = env;
+            }
+            this.workspaceOpen = true;
+            this.classList.add('workspace-mode');
+          } catch (err) {
+            console.error('Failed to open workspace:', err);
+          }
+        }}
+        @back=${() => {
+          this.workspaceOpen = false;
+          this.classList.remove('workspace-mode');
+          this.currentView = 'list';
+        }}
       ></sz-service-detail-view>
     `;
   }