Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/candidate-9.6.x' into candidate-…
Browse files Browse the repository at this point in the history 
…9.8.x

Signed-off-by: Gordon Smith <[email protected]>
  • Loading branch information
@GordonSmith
GordonSmith committed Jan 30, 2025
2 parents dd0dd41 + c65e2c3 commit 84d86b3
Show file tree
Hide file tree
Showing 2 changed files with 86 additions and 25 deletions.
109 changes: 84 additions & 25 deletions esp/src/src-react/components/forms/ZAPDialog.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import * as React from "react";
import { Checkbox, DefaultButton, Dropdown, Icon, IDropdownProps, IOnRenderComboBoxLabelProps, IStackTokens, ITextFieldProps, mergeStyleSets, PrimaryButton, Spinner, Stack, TextField, TooltipHost } from "@fluentui/react";
import { Checkbox, DefaultButton, Dropdown, Icon, IDropdownProps, IOnRenderComboBoxLabelProps, IStackTokens, ITextFieldProps, Label, mergeStyleSets, PrimaryButton, Spinner, Stack, TextField, TooltipHost } from "@fluentui/react";
import { useForm, Controller } from "react-hook-form";
import { LogType } from "@hpcc-js/comms";
import { scopedLogger } from "@hpcc-js/util";
import * as WsWorkunits from "src/WsWorkunits";
import { useBuildInfo } from "../../hooks/platform";
import { useBuildInfo, useLogAccessInfo } from "../../hooks/platform";
import { MessageBox } from "../../layouts/MessageBox";
import { CloudContainerNameField } from "../forms/Fields";
import nlsHPCC from "src/nlsHPCC";
Expand Down Expand Up @@ -36,7 +36,7 @@ type CustomLabelProps = ITextFieldProps & IDropdownProps & IOnRenderComboBoxLabe

const CustomLabel = (props: CustomLabelProps): JSX.Element => {
return <Stack horizontal verticalAlign="center" tokens={stackTokens}>
<label htmlFor={props.name} id={props.id} style={{ fontWeight: 600, display: "block", padding: "5px 0" }}>{props.label}</label>
<Label htmlFor={props.name} disabled={props.disabled} id={props.id} style={{ fontWeight: 600, display: "block", padding: "5px 0" }}>{props.label}</Label>
<TooltipHost content={props.tooltip}>
<Icon iconName="Info" style={{ cursor: "default" }} />
</TooltipHost>
Expand Down Expand Up @@ -159,6 +159,10 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
textOverflow: "ellipsis",
outline: 0
},
disabled: {
background: theme.semanticColors.disabledBackground,
border: `1px solid ${theme.semanticColors.disabledBackground}`
},
"errorMessage": {
fontSize: 12,
margin: 0,
Expand All @@ -177,6 +181,20 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({

const [, { isContainer }] = useBuildInfo();

const [logFiltersUnavailable, setLogFiltersUnavailable] = React.useState(false);
const { logsEnabled, logsStatusMessage } = useLogAccessInfo();

const logFiltersUnavailableMessage = React.useMemo(() => {
let retVal = "";
if (!isContainer) {
retVal = nlsHPCC.UnavailableInBareMetal;
}
if (logsStatusMessage !== "") {
retVal = logsStatusMessage;
}
return retVal;
}, [isContainer, logsStatusMessage]);

const closeForm = React.useCallback(() => {
setShowForm(false);
}, [setShowForm]);
Expand All @@ -191,22 +209,29 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
setSubmitDisabled(true);
setSpinnerHidden(false);

for (const key in data) {
formData.append(key, data[key]);
}
for (const key in logFilter) {
if (key === "AbsoluteTimeRange") {
const startDate = logFilter.AbsoluteTimeRange.StartDate ? new Date(logFilter.AbsoluteTimeRange.StartDate) : null;
let endDate = logFilter.AbsoluteTimeRange.EndDate ? new Date(logFilter.AbsoluteTimeRange.EndDate) : null;
if (startDate) {
endDate = endDate === null ? new Date(startDate.getTime() + (8 * 3600 * 1000)) : endDate;
formData.append("LogFilter_AbsoluteTimeRange_StartDate", startDate.toISOString());
formData.append("LogFilter_AbsoluteTimeRange_EndDate", endDate.toISOString());
delete logFilter.RelativeTimeRangeBuffer;
if (logsEnabled) {
for (const key in logFilter) {
if (key === "AbsoluteTimeRange") {
const startDate = logFilter.AbsoluteTimeRange.StartDate ? new Date(logFilter.AbsoluteTimeRange.StartDate) : null;
let endDate = logFilter.AbsoluteTimeRange.EndDate ? new Date(logFilter.AbsoluteTimeRange.EndDate) : null;
if (startDate) {
endDate = endDate === null ? new Date(startDate.getTime() + (8 * 3600 * 1000)) : endDate;
formData.append("LogFilter_AbsoluteTimeRange_StartDate", startDate.toISOString());
formData.append("LogFilter_AbsoluteTimeRange_EndDate", endDate.toISOString());
delete logFilter.RelativeTimeRangeBuffer;
}
} else {
formData.append(`LogFilter_${key}`, logFilter[key]);
}
} else {
formData.append(`LogFilter_${key}`, logFilter[key]);
}
} else {
data.IncludePerComponentLogs = false;
data.IncludeRelatedLogs = false;
data.IncludeThorSlaveLog = false;
}

for (const key in data) {
formData.append(key, data[key]);
}

fetch("/WsWorkunits/WUCreateAndDownloadZAPInfo", {
Expand Down Expand Up @@ -246,7 +271,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
},
logger.info
)();
}, [closeForm, handleSubmit, logAccessorMessage]);
}, [closeForm, handleSubmit, logAccessorMessage, logsEnabled]);

React.useEffect(() => {
WsWorkunits.WUGetZAPInfo({ request: { WUID: wuid } }).then(response => {
Expand All @@ -263,6 +288,11 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
}).catch(err => logger.error(err));
}, [wuid, reset]);

React.useEffect(() => {
if (!logsEnabled) { setLogFiltersUnavailable(true); }
else { setLogFiltersUnavailable(false); }
}, [logsEnabled]);

return <MessageBox title={nlsHPCC.ZippedAnalysisPackage} minWidth={440} show={showForm} setShow={closeForm}
footer={<>
<Spinner label={nlsHPCC.LoadingData} labelPosition="right" style={{ display: spinnerHidden ? "none" : "inherit" }} />
Expand Down Expand Up @@ -401,15 +431,15 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
control={control} name="IncludeRelatedLogs"
render={({
field: { onChange, name: fieldName, value }
}) => <Checkbox name={fieldName} checked={value} onChange={onChange} label={nlsHPCC.IncludeRelatedLogs} />}
}) => <Checkbox name={fieldName} checked={value} disabled={!logsEnabled} onChange={onChange} label={nlsHPCC.IncludeRelatedLogs} />}
/>
</div>
<div>
<Controller
control={control} name="IncludePerComponentLogs"
render={({
field: { onChange, name: fieldName, value }
}) => <Checkbox name={fieldName} checked={value} onChange={onChange} label={nlsHPCC.IncludePerComponentLogs} />}
}) => <Checkbox name={fieldName} checked={value} disabled={!logsEnabled} onChange={onChange} label={nlsHPCC.IncludePerComponentLogs} />}
/>
</div>
</div>
Expand Down Expand Up @@ -469,15 +499,22 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
/>}
/>
<fieldset style={{ marginTop: 8 }}>
<legend>{nlsHPCC.LogFilters}</legend>
<legend>
<span>{nlsHPCC.LogFilters}</span>
{logFiltersUnavailable &&
<TooltipHost content={logFiltersUnavailable ? `${nlsHPCC.LogFiltersUnavailable}: ${logFiltersUnavailableMessage}` : ""}>
<Icon iconName="Info" style={{ cursor: "default", margin: "0 1px 0 4px" }} />
</TooltipHost>
}
</legend>
<Controller
control={control} name="LogFilter.AbsoluteTimeRange.StartDate"
render={({
field: { onChange, name: fieldName, value },
fieldState: { error }
}) => <div>
<Stack horizontal verticalAlign="center" tokens={stackTokens}>
<label htmlFor={fieldName} className={formClasses.label}>{nlsHPCC.FromDate}</label>
<Label htmlFor={fieldName} disabled={logFiltersUnavailable} className={formClasses.label}>{nlsHPCC.FromDate}</Label>
<TooltipHost content={nlsHPCC.LogFilterStartDateTooltip}>
<Icon iconName="Info" style={{ cursor: "default" }} />
</TooltipHost>
Expand All @@ -487,7 +524,8 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
key={fieldName}
type="datetime-local"
name={fieldName}
className={formClasses.input}
disabled={logFiltersUnavailable}
className={[formClasses.input, logFiltersUnavailable ? formClasses.disabled : ""].join(" ")}
defaultValue={value}
onChange={onChange}
/>
Expand All @@ -513,7 +551,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
fieldState: { error }
}) => <div>
<Stack horizontal verticalAlign="center" tokens={stackTokens}>
<label htmlFor={fieldName} className={formClasses.label}>{nlsHPCC.ToDate}</label>
<Label htmlFor={fieldName} disabled={logFiltersUnavailable} className={formClasses.label}>{nlsHPCC.ToDate}</Label>
<TooltipHost content={nlsHPCC.LogFilterEndDateTooltip}>
<Icon iconName="Info" style={{ cursor: "default" }} />
</TooltipHost>
Expand All @@ -522,7 +560,8 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
key={fieldName}
type="datetime-local"
name={fieldName}
className={formClasses.input}
disabled={logFiltersUnavailable}
className={[formClasses.input, logFiltersUnavailable ? formClasses.disabled : ""].join(" ")}
defaultValue={value}
onChange={onChange}
/>
Expand All @@ -538,8 +577,10 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
name={fieldName}
onChange={onChange}
label={nlsHPCC.RelativeTimeRange}
disabled={logFiltersUnavailable}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterRelativeTimeRangeTooltip}
{...props}
/>}
Expand Down Expand Up @@ -567,8 +608,10 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
name={fieldName}
onChange={onChange}
label={nlsHPCC.LogLineLimit}
disabled={logFiltersUnavailable}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterLineLimitTooltip}
{...props}
/>}
Expand All @@ -584,8 +627,10 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
name={fieldName}
onChange={onChange}
label={nlsHPCC.LogLineStartFrom}
disabled={logFiltersUnavailable}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterLineStartFromTooltip}
{...props}
/>}
Expand All @@ -600,6 +645,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
}) => <Dropdown
key={fieldName}
label={nlsHPCC.ColumnMode}
disabled={logFiltersUnavailable}
options={[
{ key: ColumnMode.MIN, text: "MIN" },
{ key: ColumnMode.DEFAULT, text: "DEFAULT" },
Expand All @@ -609,6 +655,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
selectedKey={value}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterSelectColumnModeTooltip}
{...props}
/>}
Expand All @@ -628,8 +675,10 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
name={fieldName}
onChange={onChange}
label={nlsHPCC.CustomLogColumns}
disabled={logFiltersUnavailable}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterCustomColumnsTooltip}
{...props}
/>}
Expand All @@ -646,6 +695,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
}) => <CloudContainerNameField
name={fieldName}
selectedKey={value}
disabled={logFiltersUnavailable}
onChange={(_evt, option, _idx, _value) => {
const selectedKeys = value ? [...value] : [];
const selected = option?.key ?? _value;
Expand All @@ -662,6 +712,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
label={nlsHPCC.ContainerName}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterComponentsFilterTooltip}
{...props}
/>}
Expand All @@ -675,6 +726,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
}) => <Dropdown
key={fieldName}
label={nlsHPCC.LogFormat}
disabled={logFiltersUnavailable}
options={[
{ key: LogFormat.CSV, text: "CSV" },
{ key: LogFormat.JSON, text: "JSON" },
Expand All @@ -683,6 +735,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
selectedKey={value}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterFormatTooltip}
{...props}
/>}
Expand All @@ -700,8 +753,10 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
name={fieldName}
onChange={onChange}
label={nlsHPCC.WildcardFilter}
disabled={logFiltersUnavailable}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterWildcardFilterTooltip}
{...props}
/>}
Expand All @@ -716,6 +771,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
}) => <Dropdown
key={fieldName}
label={`${nlsHPCC.Sort} (${nlsHPCC.TimeStamp})`}
disabled={logFiltersUnavailable}
options={[
{ key: "0", text: "ASC" },
{ key: "1", text: "DESC" },
Expand All @@ -724,6 +780,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
selectedKey={value}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterSortByTooltip}
{...props}
/>}
Expand All @@ -740,6 +797,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
}) => <Dropdown
key={fieldName}
label={nlsHPCC.LogEventType}
disabled={logFiltersUnavailable}
options={[
{ key: "ALL", text: "All" },
{ key: LogType.Disaster, text: "Disaster" },
Expand All @@ -752,6 +810,7 @@ export const ZAPDialog: React.FunctionComponent<ZAPDialogProps> = ({
selectedKey={value}
onRenderLabel={(props: CustomLabelProps) => <CustomLabel
id={`${fieldName}_Label`}
disabled={logFiltersUnavailable}
tooltip={nlsHPCC.LogFilterEventTypeTooltip}
{...props}
/>}
Expand Down
2 changes: 2 additions & 0 deletions esp/src/src/nls/hpcc.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -515,6 +515,7 @@ export = {
LogFilterStartDateTooltip: "Include log lines from time range start",
LogFilterTimeRequired: "Choose either \"From and To Date\" or \"Relative Log Time Buffer\"",
LogFilterWildcardFilterTooltip: "A string of text upon which to filter log messages",
LogFiltersUnavailable: "Log Filters are unavailable",
LogFormat: "Log Format",
LogLineLimit: "Log Line Limit",
LogLineStartFrom: "Log Line Start From",
Expand Down Expand Up @@ -1087,6 +1088,7 @@ export = {
Text: "Text",
Tree: "Tree",
Type: "Type",
UnavailableInBareMetal: "This is unavailable in a non-containerized environment.",
UnavailableInContainerized: "This is unavailable in a containerized environment.",
Unbound: "unbound",
undefined: "undefined",
Expand Down

0 comments on commit 84d86b3

Please sign in to comment.