From ce6f1e0b120a15b03da196b26d1e86534ce6a4d4 Mon Sep 17 00:00:00 2001
From: Kunal Aswani <Kunal.Aswani@lexisnexisrisk.com>
Date: Wed, 7 Feb 2024 12:08:12 -0500
Subject: [PATCH] HPCC-31202	File permission dialog fails to open

When checking file permissions for file scopes, dialog was not opening.
Dialog now opening for users to check permissions.

Signed-off-by: Kunal Aswani <Kunal.Aswani@lexisnexisrisk.com>
---
 esp/src/src-react/components/Permissions.tsx  |   5 +-
 .../components/forms/CheckPermissions.tsx     | 121 ++++++++++++++++++
 2 files changed, 125 insertions(+), 1 deletion(-)
 create mode 100644 esp/src/src-react/components/forms/CheckPermissions.tsx

diff --git a/esp/src/src-react/components/Permissions.tsx b/esp/src/src-react/components/Permissions.tsx
index 98c2f9039e6..33345e78233 100644
--- a/esp/src/src-react/components/Permissions.tsx
+++ b/esp/src/src-react/components/Permissions.tsx
@@ -9,6 +9,7 @@ import { useConfirm } from "../hooks/confirm";
 import { useBuildInfo } from "../hooks/platform";
 import { DojoGrid, selector, tree } from "./DojoGrid";
 import { AddPermissionForm } from "./forms/AddPermission";
+import { CheckPermissionsForm } from "./forms/CheckPermissions";
 import { HolyGrail } from "../layouts/HolyGrail";
 import { pushUrl } from "../util/history";
 
@@ -35,6 +36,7 @@ export const Permissions: React.FunctionComponent<PermissionsProps> = ({
     const [selection, setSelection] = React.useState([]);
 
     const [showAddPermission, setShowAddPermission] = React.useState(false);
+    const [showCheckFilePermissions, setShowCheckFilePermissions] = React.useState(false);
     const [scopeScansEnabled, setScopeScansEnabled] = React.useState(false);
     const [modulesDn, setModulesDn] = React.useState("");
     const [uiState, setUIState] = React.useState({ ...defaultUIState });
@@ -203,7 +205,7 @@ export const Permissions: React.FunctionComponent<PermissionsProps> = ({
                     { key: "fileScopeDefaults", text: nlsHPCC.FileScopeDefaultPermissions, onClick: (evt, item) => pushUrl(`/${opsCategory}/security/permissions/_/File%20Scopes`), disabled: !uiState.fileScope },
                     { key: "workunitScopeDefaults", text: nlsHPCC.WorkUnitScopeDefaultPermissions, onClick: (evt, item) => pushUrl(`/${opsCategory}/security/permissions/_/Workunit%20Scopes`), disabled: !uiState.workunitScope },
                     { key: "physicalFiles", text: nlsHPCC.PhysicalFiles, onClick: (evt, item) => pushUrl(`/${opsCategory}/security/permissions/file/File%20Scopes`), disabled: !uiState.fileScope },
-                    { key: "checkFilePermissions", text: nlsHPCC.CheckFilePermissions, disabled: !uiState.fileScope },
+                    { key: "checkFilePermissions", text: nlsHPCC.CheckFilePermissions, onClick: () => setShowCheckFilePermissions(true), disabled: !uiState.fileScope },
                     { key: "codeGenerator", text: nlsHPCC.CodeGenerator, onClick: (evt, item) => pushUrl(`/${opsCategory}/security/permissions/_/${modulesDn}`), disabled: !uiState.repositoryModule },
                 ],
             },
@@ -223,6 +225,7 @@ export const Permissions: React.FunctionComponent<PermissionsProps> = ({
         <ClearPermissionsConfirm />
         <EnableScopesConfirm />
         <DisableScopesConfirm />
+        <CheckPermissionsForm showForm={showCheckFilePermissions} setShowForm={setShowCheckFilePermissions} refreshGrid={() => refreshTable()} />
         <AddPermissionForm showForm={showAddPermission} setShowForm={setShowAddPermission} refreshGrid={refreshTable} />
     </>;
 
diff --git a/esp/src/src-react/components/forms/CheckPermissions.tsx b/esp/src/src-react/components/forms/CheckPermissions.tsx
new file mode 100644
index 00000000000..eb04268ebe8
--- /dev/null
+++ b/esp/src/src-react/components/forms/CheckPermissions.tsx
@@ -0,0 +1,121 @@
+import * as React from "react";
+import { DefaultButton, Dropdown, IDropdownOption, MessageBar, MessageBarType, PrimaryButton, TextField } from "@fluentui/react";
+import { scopedLogger } from "@hpcc-js/util";
+import { useForm, Controller } from "react-hook-form";
+import nlsHPCC from "src/nlsHPCC";
+import { MessageBox } from "../../layouts/MessageBox";
+//import { Users } from "../Users";
+//import { Groups } from "../Groups";
+import { FilePermission } from "src/ws_access";
+
+const logger = scopedLogger("src-react/components/forms/CheckPermissions.tsx");
+
+interface CheckPermissionsFormValues {
+    FileName: string;
+    SelectedValue: string;
+}
+
+const defaultValues: CheckPermissionsFormValues = {
+    FileName: "",
+    SelectedValue: "",
+};
+
+interface CheckPermissionsFormProps {
+    refreshGrid?: () => void;
+    showForm: boolean;
+    setShowForm: (_: boolean) => void;
+}
+
+export const CheckPermissionsForm: React.FunctionComponent<CheckPermissionsFormProps> = ({
+    refreshGrid,
+    showForm,
+    setShowForm
+}) => {
+
+    const { handleSubmit, control, reset, setValue, watch } = useForm<CheckPermissionsFormValues>({ defaultValues });
+
+    const [showError, setShowError] = React.useState(false);
+    const [errorMessage] = React.useState("");
+    const [userOptions, setUserOptions] = React.useState<IDropdownOption[]>([]);
+    const [groupOptions, setGroupOptions] = React.useState<IDropdownOption[]>([]);
+
+    React.useEffect(() => {
+        const fetchData = async () => {
+            try {
+                const { FilePermissionResponse } = await FilePermission({});
+                const { Users, Groups } = FilePermissionResponse;
+
+                setUserOptions(Users?.map(user => {
+                    return { key: user.username, text: user.username };
+                }) ?? []);
+
+                setGroupOptions(Groups?.map(group => {
+                    return { key: group.name, text: group.name };
+                }) ?? []);
+            } catch (error) {
+                logger.error("Error fetching users and groups:" + error);
+            }
+        };
+
+        fetchData();
+    }, []);
+
+    const closeForm = React.useCallback(() => {
+        setShowForm(false);
+    }, [setShowForm]);
+
+    const onSubmit = React.useCallback((data) => {
+        const { FileName, SelectedValue } = data;
+        logger.info(`Checking permissions for file ${FileName} for selected value: ${SelectedValue}`);
+    }, []);
+
+    return (
+        <MessageBox show={showForm} setShow={closeForm} title={nlsHPCC.CheckFilePermissions} minWidth={400}
+            footer={<>
+                <PrimaryButton text={nlsHPCC.Submit} onClick={handleSubmit(onSubmit)} />
+                <DefaultButton text={nlsHPCC.Cancel} onClick={() => { reset(defaultValues); closeForm(); }} />
+            </>}>
+            <Controller
+                control={control} name="FileName"
+                render={({
+                    field: { onChange, name: fieldName, value },
+                    fieldState: { error }
+                }) => <TextField
+                        name={fieldName}
+                        onChange={onChange}
+                        label={nlsHPCC.Name}
+                        value={value}
+                        errorMessage={error && error?.message}
+                    />}
+                rules={{
+                    required: nlsHPCC.ValidationErrorRequired
+                }}
+            />
+            <Dropdown
+                label={nlsHPCC.Users}
+                options={userOptions}
+                selectedKey={watch("SelectedValue")}
+                onChange={(ev, option) => {
+                    setValue("SelectedValue", option?.key.toString() || "");
+                }}
+            />
+            <Dropdown
+                label={nlsHPCC.Groups}
+                options={groupOptions}
+                selectedKey={watch("SelectedValue")}
+                onChange={(ev, option) => {
+                    setValue("SelectedValue", option?.key.toString() || "");
+                }}
+            />
+            {showError &&
+                <div style={{ marginTop: 16 }}>
+                    <MessageBar
+                        messageBarType={MessageBarType.error} isMultiline={true}
+                        onDismiss={() => setShowError(false)} dismissButtonAriaLabel="Close">
+                        {errorMessage}
+                    </MessageBar>
+                </div>
+            }
+        </MessageBox>
+    );
+};
\ No newline at end of file