HPCC-31258 Initial File structure and page layout creation

This is to create the initial design of Sasha in Cloud.
Feature availability to come as it is created.

Signed-off-by: Kunal Aswani <[email protected]>

esp/src/src-react/components/Menu.tsx

@@ -162,6 +162,7 @@ const subMenuItems: SubMenuItems = {
         { headerText: nlsHPCC.Security + " (L)", itemKey: "/topology/security" },
         { headerText: nlsHPCC.DESDL + " (L)", itemKey: "/topology/desdl" },
         { headerText: nlsHPCC.DaliAdmin, itemKey: "/topology/daliadmin" },
+        { headerText: nlsHPCC.Sasha, itemKey: "/topology/sasha" },
     ],
     "operations": [
         { headerText: nlsHPCC.Topology + " (L)", itemKey: "/operations" },

esp/src/src-react/components/Sasha.tsx

@@ -0,0 +1,88 @@
+import React, { useState } from "react";
+
+interface SashaProps {}
+
+export const Sasha: React.FunctionComponent<SashaProps> = ({ }) => {
+  const [selectedOption, setSelectedOption] = useState("");
+  const [wuid, setWuid] = useState("");
+  const [result, setResult] = useState("");
+
+  const handleOptionChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    setSelectedOption(e.target.value);
+  };
+
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    // Perform action based on selected option
+    switch (selectedOption) {
+      case "getVersion": 
+        // Implement getVersion function call
+        break;
+      case "getLastServerMessage":
+        // Implement getLastServerMessage function call
+        break;
+      case "restoreECLWorkUnit":
+        // Implement restoreECLWorkUnit function call
+        break;
+      case "restoreDFUWorkUnit":
+        // Implement restoreDFUWorkUnit function call
+        break;
+      case "archiveECLWorkUnit":
+        // Implement archiveECLWorkUnit function call
+        break;
+      case "archiveDFUWorkUnit":
+        // Implement archiveDFUWorkUnit function call
+        break;
+      case "backupECLWorkUnit":
+        // Implement backupECLWorkUnit function call
+        break;
+      case "backupDFUWorkUnit":
+        // Implement backupDFUWorkUnit function call
+        break;
+      default:
+        console.log("Invalid option selected");
+    }
+    // Reset form
+    setSelectedOption("");
+    setWuid("");
+    setResult("");
+  };
+
+  // Conditional rendering for default value
+  const defaultValue = result ? null : <div>No data available</div>;
+
+  return (
+    <div>
+      <form onSubmit={handleSubmit}>
+        <select value={selectedOption} onChange={handleOptionChange}>
+          <option value="">Select an option</option>
+          <option value="getVersion">Get Version</option>
+          <option value="getLastServerMessage">Get Last Server Message</option>
+          <option value="restoreECLWorkUnit">Restore ECL Workunit</option>
+          <option value="restoreDFUWorkUnit">Restore DFU Workunit</option>
+          <option value="archiveECLWorkUnit">Archive ECL Workunit</option>
+          <option value="archiveDFUWorkUnit">Archive DFU Workunit</option>
+          <option value="backupECLWorkUnit">Backup ECL Workunit</option>
+          <option value="backupDFUWorkUnit">Backup DFU Workunit</option>
+        </select>
+        {["restoreECLWorkUnit", "restoreDFUWorkUnit", "archiveECLWorkUnit", "archiveDFUWorkUnit", "backupECLWorkUnit", "backupDFUWorkUnit"].includes(selectedOption) && (
+          <div>
+            <label>Work Unit ID:</label>
+            <input
+              type="text"
+              value={wuid}
+              onChange={(e) => setWuid(e.target.value)}
+            />
+          </div>
+        )}
+        <button type="submit">Submit</button>
+        {/* Render defaultValue when result is empty */}
+        {defaultValue}
+        {/* Render result when available */}
+        {result && <div>Result: {result}</div>}
+      </form>
+    </div>
+  );
+};
+
+export default Sasha;

esp/src/src-react/routes.tsx

@@ -390,6 +390,11 @@ export const routes: RoutesEx = [
                     },
                 ]
             },
+            {
+                path: "/sasha", action: (ctx, params) => import("./components/Sasha").then(_ => {
+                    return <_.Sasha />;
+                })
+            },
         ]
     },
     {

esp/src/src/nls/hpcc.ts

@@ -820,6 +820,7 @@ export = {
         Sample: "Sample",
         SampleRequest: "Sample Request",
         SampleResponse: "Sample Response",
+        Sasha: "Sasha",
         Save: "Save",
         Scope: "Scope",
         SearchResults: "Search Results",