From e67b38072c9907b49501ecea21f74183f1cc229b Mon Sep 17 00:00:00 2001
From: Kunal Aswani <Kunal.Aswani@lexisnexisrisk.com>
Date: Mon, 24 Jul 2023 12:55:34 -0400
Subject: [PATCH] HPCC-28071 Add "Set" features to Dali Admin

Dali Admin functionality for setting logical file attributes,
value, protecting, and unprotecting files added to UI.

Signed-off-by: Kunal Aswani <Kunal.Aswani@lexisnexisrisk.com>
---
 esp/src/src-react/components/DaliAdmin.tsx    | 20 +++-
 .../components/SetLogicalFilePartAttr.tsx     | 94 +++++++++++++++++++
 esp/src/src-react/components/SetProtected.tsx | 84 +++++++++++++++++
 .../src-react/components/SetUnprotected.tsx   | 84 +++++++++++++++++
 esp/src/src-react/components/SetValue.tsx     | 84 +++++++++++++++++
 esp/src/src/nls/hpcc.ts                       |  5 +
 6 files changed, 369 insertions(+), 2 deletions(-)
 create mode 100644 esp/src/src-react/components/SetLogicalFilePartAttr.tsx
 create mode 100644 esp/src/src-react/components/SetProtected.tsx
 create mode 100644 esp/src/src-react/components/SetUnprotected.tsx
 create mode 100644 esp/src/src-react/components/SetValue.tsx

diff --git a/esp/src/src-react/components/DaliAdmin.tsx b/esp/src/src-react/components/DaliAdmin.tsx
index 09fd6a3abaa..ec3b6a23af0 100644
--- a/esp/src/src-react/components/DaliAdmin.tsx
+++ b/esp/src/src-react/components/DaliAdmin.tsx
@@ -13,6 +13,10 @@ import { GetLogicalFile } from "./GetLogicalFile";
 import { GetLogicalFilePart } from "./GetLogicalFilePart";
 import { GetProtectedList } from "./GetProtectedList";
 import { GetValue } from "./GetValue";
+import { SetLogicalFilePartAttr } from "./SetLogicalFilePartAttr";
+import { SetProtected } from "./SetProtected";
+import { SetUnprotected } from "./SetUnprotected";
+import { SetValue } from "./SetValue";
 import nlsHPCC from "src/nlsHPCC";
 
 interface DaliAdminProps {
@@ -25,7 +29,7 @@ export const DaliAdmin: React.FunctionComponent<DaliAdminProps> = ({
 
     return <>
     <SizeMe monitorHeight>{({ size }) =>
-        <Pivot overflowBehavior="menu" style={{ height: "100%" }} selectedKey={tab} onLinkClick={evt => pushUrl(`/daliadmin/${evt.props.itemKey}`)}>
+        <Pivot overflowBehavior="menu" style={{ height: "100%" }} selectedKey={tab} onLinkClick={evt => pushUrl(`/topology/daliadmin/${evt.props.itemKey}`)}>
             <PivotItem headerText={nlsHPCC.GetDFSCSV} itemKey="getdfscsv" style={pivotItemStyle(size)} >
                 <GetDFSCSV />
             </PivotItem>
@@ -54,7 +58,19 @@ export const DaliAdmin: React.FunctionComponent<DaliAdminProps> = ({
                 <GetProtectedList />
             </PivotItem>
             <PivotItem headerText={nlsHPCC.GetValue} itemKey="getvalue" style={pivotItemStyle(size)} >
-                <GetValue  />
+                <GetValue />
+            </PivotItem>
+            <PivotItem headerText={nlsHPCC.SetLogicalFileAttribute} itemKey="setlogicalfilepartattr" style={pivotItemStyle(size)} >
+                <SetLogicalFilePartAttr />
+            </PivotItem>
+            <PivotItem headerText={nlsHPCC.SetProtected} itemKey="setprotected" style={pivotItemStyle(size)} >
+                <SetProtected />
+            </PivotItem>
+            <PivotItem headerText={nlsHPCC.SetUnprotected} itemKey="setunprotected" style={pivotItemStyle(size)} >
+                <SetUnprotected />
+            </PivotItem>
+            <PivotItem headerText={nlsHPCC.SetValue} itemKey="setvalue" style={pivotItemStyle(size)} >
+                <SetValue />
             </PivotItem>
         </Pivot>
     }</SizeMe>;
diff --git a/esp/src/src-react/components/SetLogicalFilePartAttr.tsx b/esp/src/src-react/components/SetLogicalFilePartAttr.tsx
new file mode 100644
index 00000000000..fbbc0b62d0f
--- /dev/null
+++ b/esp/src/src-react/components/SetLogicalFilePartAttr.tsx
@@ -0,0 +1,94 @@
+import * as React from "react";
+import { DefaultButton, DetailsList, DetailsListLayoutMode, IColumn } from "@fluentui/react";
+import { SizeMe } from "react-sizeme";
+import { csvParse } from "d3-dsv";
+import { DaliService } from "@hpcc-js/comms";
+import { scopedLogger } from "@hpcc-js/util";
+import { TableGroup } from "./forms/Groups";
+import { useConfirm } from "../hooks/confirm";
+import nlsHPCC from "src/nlsHPCC";
+import { HolyGrail } from "../layouts/HolyGrail";
+
+const logger = scopedLogger("src-react/components/SetLogicalFilePartAttr.tsx");
+
+const myDaliService = new DaliService({ baseUrl: "" });
+
+interface SetLogicalFilePartAttrProps {
+}
+
+export const SetLogicalFilePartAttr: React.FunctionComponent<SetLogicalFilePartAttrProps> = ({
+
+}) => {
+
+    const [columns, setColumns] = React.useState<IColumn[]>([]);
+    const [items, setItems] = React.useState<any[]>([]);
+    const [fileName, setFileName] = React.useState<string>("");
+    const [partNumber, setPartNumber] = React.useState<number>(1);
+    const [attribute, setAttribute] = React.useState<string>("");
+    const [value, setValue] = React.useState<string>("");
+
+    const [DaliPromptConfirm, setDaliPromptConfirm] = useConfirm({
+        title: nlsHPCC.DaliAdmin,
+        message: nlsHPCC.DaliPromptConfirm,
+        onSubmit: React.useCallback(() => {
+            myDaliService.SetLogicalFilePartAttr({ FileName: fileName, PartNumber: partNumber, Attr: attribute, Value: value}).then(response => {
+                const data = csvParse(response.Result);
+                setColumns(data.columns.map((col, idx) => {
+                    return {
+                        key: col,
+                        name: col,
+                        fieldName: col,
+                        minWidth: 100
+                    };
+                }));
+                setItems(data);
+            }).catch(err => logger.error(err));
+        }, [fileName, partNumber, attribute, value])
+    });
+
+    const onSubmit = React.useCallback(() => {
+        setDaliPromptConfirm(true);
+    }, [fileName, partNumber, attribute, value, setDaliPromptConfirm]);
+
+    return <HolyGrail
+        header={<span><TableGroup fields={{
+            "FileName": { label: nlsHPCC.FileName, type: "string", value: fileName },
+            "PartNumber": { label: nlsHPCC.PartNumber, type: "number", value: partNumber },
+            "Attribute": { label: nlsHPCC.Attribute, type: "string", value: attribute },
+            "Value": { label: nlsHPCC.Value, type: "string", value: value },
+        }} onChange={(id, value) => {
+            switch (id) {
+                case "FileName":
+                    setFileName(value);
+                    break;
+                case "PartNumber":
+                    setPartNumber(value);
+                    break;
+                case "Attribute":
+                    setAttribute(value);
+                    break;
+                case "Value":
+                    setValue(value);
+                    break; 
+                default:
+                    logger.debug(`${id}: ${value}`);
+            }
+        }} /><DefaultButton onClick={onSubmit} text={nlsHPCC.Submit} /></span>}
+        main={<SizeMe monitorHeight>{({ size }) => {
+            const height = `${size.height}px`;
+            return <div style={{ position: "relative", width: "100%", height: "100%" }}>
+                <div style={{ position: "absolute", width: "100%", height: `${size.height}px` }}>
+                    <DetailsList compact={true}
+                        items={items}
+                        columns={columns}
+                        setKey="key"
+                        layoutMode={DetailsListLayoutMode.justified}
+                        selectionPreservedOnEmptyClick={true}
+                        styles={{ root: { height, minHeight: height, maxHeight: height } }}
+                    />
+                    <DaliPromptConfirm />
+                </div>
+            </div>;
+        }}</SizeMe>}
+    />;
+}; 
\ No newline at end of file
diff --git a/esp/src/src-react/components/SetProtected.tsx b/esp/src/src-react/components/SetProtected.tsx
new file mode 100644
index 00000000000..1c2ed4e4faa
--- /dev/null
+++ b/esp/src/src-react/components/SetProtected.tsx
@@ -0,0 +1,84 @@
+import * as React from "react";
+import { DefaultButton, DetailsList, DetailsListLayoutMode, IColumn } from "@fluentui/react";
+import { SizeMe } from "react-sizeme";
+import { csvParse } from "d3-dsv";
+import { DaliService } from "@hpcc-js/comms";
+import { scopedLogger } from "@hpcc-js/util";
+import { TableGroup } from "./forms/Groups";
+import { useConfirm } from "../hooks/confirm";
+import nlsHPCC from "src/nlsHPCC";
+import { HolyGrail } from "../layouts/HolyGrail";
+
+const logger = scopedLogger("src-react/components/SetProtected.tsx");
+
+const myDaliService = new DaliService({ baseUrl: "" });
+
+interface SetProtectedProps {
+}
+
+export const SetProtected: React.FunctionComponent<SetProtectedProps> = ({
+
+}) => {
+
+    const [columns, setColumns] = React.useState<IColumn[]>([]);
+    const [items, setItems] = React.useState<any[]>([]);
+    const [fileName, setFileName] = React.useState<string>("");
+    const [callerId, setCallerId] = React.useState<string>("");
+
+    const [DaliPromptConfirm, setDaliPromptConfirm] = useConfirm({
+        title: nlsHPCC.DaliAdmin,
+        message: nlsHPCC.DaliPromptConfirm,
+        onSubmit: React.useCallback(() => {
+            myDaliService.SetProtected({ FileName: fileName, CallerId: callerId }).then(response => {
+                const data = csvParse(response.Result);
+                setColumns(data.columns.map((col, idx) => {
+                    return {
+                        key: col,
+                        name: col,
+                        fieldName: col,
+                        minWidth: 100
+                    };
+                }));
+                setItems(data);
+            }).catch(err => logger.error(err));
+        }, [fileName, callerId])
+    });
+
+    const onSubmit = React.useCallback(() => {
+        setDaliPromptConfirm(true);
+    }, [fileName, callerId, setDaliPromptConfirm]);
+
+    return <HolyGrail
+        header={<span><TableGroup fields={{
+            "FileName": { label: nlsHPCC.FileName, type: "string", value: fileName },
+            "CallerId": { label: nlsHPCC.CallerID, type: "string", value: callerId },
+        }} onChange={(id, value) => {
+            switch (id) {
+                case "FileName":
+                    setFileName(value);
+                    break;
+                case "CallerId":
+                    setCallerId(value);
+                    break;
+                default:
+                    logger.debug(`${id}: ${value}`);
+            }
+        }} /><DefaultButton onClick={onSubmit} text={nlsHPCC.Submit} /></span>}
+        main={<SizeMe monitorHeight>{({ size }) => {
+            const height = `${size.height}px`;
+            return <div style={{ position: "relative", width: "100%", height: "100%" }}>
+                <div style={{ position: "absolute", width: "100%", height: `${size.height}px` }}>
+                    <DetailsList compact={true}
+                        items={items}
+                        columns={columns}
+                        setKey="key"
+                        layoutMode={DetailsListLayoutMode.justified}
+                        selectionPreservedOnEmptyClick={true}
+                        styles={{ root: { height, minHeight: height, maxHeight: height } }}
+                    />
+                    <DaliPromptConfirm />
+                </div>
+            </div>;
+        }}</SizeMe>}
+    />;
+}; 
\ No newline at end of file
diff --git a/esp/src/src-react/components/SetUnprotected.tsx b/esp/src/src-react/components/SetUnprotected.tsx
new file mode 100644
index 00000000000..a7b7ad6ba7e
--- /dev/null
+++ b/esp/src/src-react/components/SetUnprotected.tsx
@@ -0,0 +1,84 @@
+import * as React from "react";
+import { DefaultButton, DetailsList, DetailsListLayoutMode, IColumn } from "@fluentui/react";
+import { SizeMe } from "react-sizeme";
+import { csvParse } from "d3-dsv";
+import { DaliService } from "@hpcc-js/comms";
+import { scopedLogger } from "@hpcc-js/util";
+import { TableGroup } from "./forms/Groups";
+import { useConfirm } from "../hooks/confirm";
+import nlsHPCC from "src/nlsHPCC";
+import { HolyGrail } from "../layouts/HolyGrail";
+
+const logger = scopedLogger("src-react/components/SetUnprotected.tsx");
+
+const myDaliService = new DaliService({ baseUrl: "" });
+
+interface SetUnprotectedProps {
+}
+
+export const SetUnprotected: React.FunctionComponent<SetUnprotectedProps> = ({
+
+}) => {
+
+    const [columns, setColumns] = React.useState<IColumn[]>([]);
+    const [items, setItems] = React.useState<any[]>([]);
+    const [fileName, setFileName] = React.useState<string>("");
+    const [callerId, setCallerId] = React.useState<string>("");
+
+    const [DaliPromptConfirm, setDaliPromptConfirm] = useConfirm({
+        title: nlsHPCC.DaliAdmin,
+        message: nlsHPCC.DaliPromptConfirm,
+        onSubmit: React.useCallback(() => {
+            myDaliService.SetUnprotected({ FileName: fileName, CallerId: callerId }).then(response => {
+                const data = csvParse(response.Result);
+                setColumns(data.columns.map((col, idx) => {
+                    return {
+                        key: col,
+                        name: col,
+                        fieldName: col,
+                        minWidth: 100
+                    };
+                }));
+                setItems(data);
+            }).catch(err => logger.error(err));
+        }, [fileName, callerId])
+    });
+
+    const onSubmit = React.useCallback(() => {
+        setDaliPromptConfirm(true);
+    }, [fileName, callerId, setDaliPromptConfirm]);
+
+    return <HolyGrail
+        header={<span><TableGroup fields={{
+            "FileName": { label: nlsHPCC.FileName, type: "string", value: fileName },
+            "CallerId": { label: nlsHPCC.CallerID, type: "string", value: callerId },
+        }} onChange={(id, value) => {
+            switch (id) {
+                case "FileName":
+                    setFileName(value);
+                    break;
+                case "CallerId":
+                    setCallerId(value);
+                    break;
+                default:
+                    logger.debug(`${id}: ${value}`);
+            }
+        }} /><DefaultButton onClick={onSubmit} text={nlsHPCC.Submit} /></span>}
+        main={<SizeMe monitorHeight>{({ size }) => {
+            const height = `${size.height}px`;
+            return <div style={{ position: "relative", width: "100%", height: "100%" }}>
+                <div style={{ position: "absolute", width: "100%", height: `${size.height}px` }}>
+                    <DetailsList compact={true}
+                        items={items}
+                        columns={columns}
+                        setKey="key"
+                        layoutMode={DetailsListLayoutMode.justified}
+                        selectionPreservedOnEmptyClick={true}
+                        styles={{ root: { height, minHeight: height, maxHeight: height } }}
+                    />
+                    <DaliPromptConfirm />
+                </div>
+            </div>;
+        }}</SizeMe>}
+    />;
+}; 
\ No newline at end of file
diff --git a/esp/src/src-react/components/SetValue.tsx b/esp/src/src-react/components/SetValue.tsx
new file mode 100644
index 00000000000..3c1e987338a
--- /dev/null
+++ b/esp/src/src-react/components/SetValue.tsx
@@ -0,0 +1,84 @@
+import * as React from "react";
+import { DefaultButton, DetailsList, DetailsListLayoutMode, IColumn } from "@fluentui/react";
+import { SizeMe } from "react-sizeme";
+import { csvParse } from "d3-dsv";
+import { DaliService } from "@hpcc-js/comms";
+import { scopedLogger } from "@hpcc-js/util";
+import { TableGroup } from "./forms/Groups";
+import { useConfirm } from "../hooks/confirm";
+import nlsHPCC from "src/nlsHPCC";
+import { HolyGrail } from "../layouts/HolyGrail";
+
+const logger = scopedLogger("src-react/components/SetValue.tsx");
+
+const myDaliService = new DaliService({ baseUrl: "" });
+
+interface SetValueProps {
+}
+
+export const SetValue: React.FunctionComponent<SetValueProps> = ({
+
+}) => {
+
+    const [columns, setColumns] = React.useState<IColumn[]>([]);
+    const [items, setItems] = React.useState<any[]>([]);
+    const [path, setPath] = React.useState<string>("");
+    const [value, setValue] = React.useState<string>("");
+
+    const [DaliPromptConfirm, setDaliPromptConfirm] = useConfirm({
+        title: nlsHPCC.DaliAdmin,
+        message: nlsHPCC.DaliPromptConfirm,
+        onSubmit: React.useCallback(() => {
+            myDaliService.SetValue({ Path: path, Value: value }).then(response => {
+                const data = csvParse(response.Result);
+                setColumns(data.columns.map((col, idx) => {
+                    return {
+                        key: col,
+                        name: col,
+                        fieldName: col,
+                        minWidth: 100
+                    };
+                }));
+                setItems(data);
+            }).catch(err => logger.error(err));
+        }, [path, value])
+    }); 
+
+    const onSubmit = React.useCallback(() => {
+        setDaliPromptConfirm(true);
+    }, [path, value, setDaliPromptConfirm]);
+
+    return <HolyGrail
+        header={<span><TableGroup fields={{
+            "Path": { label: nlsHPCC.Path, type: "string", value: path },
+            "Value": { label: nlsHPCC.Value, type: "string", value: value },
+        }} onChange={(id, value) => {
+            switch (id) {
+                case "Path":
+                    setPath(value);
+                    break;
+                case "Value":
+                    setValue(value);
+                    break; 
+                default:
+                    logger.debug(`${id}: ${value}`);
+            }
+        }} /><DefaultButton onClick={onSubmit} text={nlsHPCC.Submit} /></span>}
+        main={<SizeMe monitorHeight>{({ size }) => {
+            const height = `${size.height}px`;
+            return <div style={{ position: "relative", width: "100%", height: "100%" }}>
+                <div style={{ position: "absolute", width: "100%", height: `${size.height}px` }}>
+                    <DetailsList compact={true}
+                        items={items}
+                        columns={columns}
+                        setKey="key"
+                        layoutMode={DetailsListLayoutMode.justified}
+                        selectionPreservedOnEmptyClick={true}
+                        styles={{ root: { height, minHeight: height, maxHeight: height } }}
+                    />
+                    <DaliPromptConfirm />                    
+                </div>
+            </div>;
+        }}</SizeMe>}
+    />;
+}; 
\ No newline at end of file
diff --git a/esp/src/src/nls/hpcc.ts b/esp/src/src/nls/hpcc.ts
index 3a616e15446..871dacd5944 100644
--- a/esp/src/src/nls/hpcc.ts
+++ b/esp/src/src/nls/hpcc.ts
@@ -175,6 +175,7 @@ export = {
         Dali: "Dali",
         DaliAdmin: " Dali Admin",
         DaliIP: "DaliIP",
+        DaliPromptConfirm: "Are you sure? Dali Admin submissions are permanent and cannot be undone.",
         Dashboard: "Dashboard",
         DataPatterns: "Data Patterns",
         DataPatternsDefnNotFound: "File Definition not found. Data Patterns cannot be started.",
@@ -805,10 +806,14 @@ export = {
         ServiceType: "Service Type",
         Server: "Server",
         SetBanner: "Set Banner",
+        SetLogicalFileAttribute: "Set Logical File Attribute",
+        SetProtected: "Set Protected",
         SetTextError: "Failed to display text (too large?).  Use &lsquo;helpers&rsquo; to download.",
         SetToFailed: "Set To Failed",
         SetToolbar: "Set Toolbar",
         SetToolbarColor: "Set Toolbar Color",
+        SetUnprotected: "Set Unprotected",
+        SetValue: "Set Value",
         Severity: "Severity",
         ShareWorkunit: "Share Workunit URL",
         Show: "Show",