feat: добавить управление окружениями и Playwright для E2E

src/App.tsx

@@ -22,6 +22,11 @@ class AppState {
     this.config = cfg;
   }
 
+  public addEnv(env: Env): number {
+    this.envs.push(env);
+    return this.envs.length - 1;
+  }
+
   public async saveEnv(env: Env): Promise<number> {
 
     // Create a promise that resolves after 1 second
@@ -43,11 +48,37 @@ function App() {
   const [selectedEnv, setSelectedEnv] = useState(0);
   const [config, setConfig] = useState(AppState.Instance.config);
 
+  // Ensure selectedEnv is always valid
+  const validSelectedEnv = Math.min(selectedEnv, Math.max(0, envs.length - 1));
+  const currentEnv = envs[validSelectedEnv];
+
   async function handleEnvChanged(env: Env) {
-    let idx = await AppState.Instance.saveEnv(env);
+    // Synchronously update the env in the array
+    let idx = AppState.Instance.envs.findIndex(x => x.id === env.id);
     if (idx > -1) {
+      AppState.Instance.envs[idx] = env;
+      setEnvs([...AppState.Instance.envs]);
+    }
+
+    // Then do the async save (for consistency with existing behavior)
+    await AppState.Instance.saveEnv(env);
+  }
+
+  function handleEnvSelected(idx: number) {
+    setSelectedEnv(idx);
+  }
+
+  function handleEnvAdded(env: Env): number {
+    const idx = AppState.Instance.addEnv(env);
+    setEnvs([...AppState.Instance.envs]);
+    return idx;
+  }
+
+  function handleEnvRemoved(envId: number) {
+    const idx = AppState.Instance.envs.findIndex(x => x.id === envId);
+    if (idx > -1) {
+      AppState.Instance.envs.splice(idx, 1);
       setEnvs([...AppState.Instance.envs]);
-      setSelectedEnv(idx);
     }
   }
 
@@ -67,10 +98,12 @@ function App() {
               <Environment
                 envs={envs}
                 onChanged={async (e) => await handleEnvChanged(e)}
-                onSelected={x => setSelectedEnv(x)} />
+                onSelected={handleEnvSelected}
+                onAdd={handleEnvAdded}
+                onRemove={handleEnvRemoved} />
             </section>
             <section id="content" className="col-8 col-xl-7 border-start ms-1">
-              <Content env={envs[selectedEnv]} config={config} />
+              <Content env={currentEnv} config={config} />
             </section>
           </div>)
           :