/*
* Copyright 2019-2023 SURF.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
*/
import React from 'react';
import { FieldProps, connectField, filterDOMProps } from 'uniforms';
import { EuiFlexItem, EuiFormRow, EuiText } from '@elastic/eui';
import { getStyles } from '@/components/WfoForms/formFields/SummaryFieldStyling';
import { getCommonFormFieldStyles } from '@/components/WfoForms/formFields/commonStyles';
import { useWithOrchestratorTheme } from '@/hooks';
export type SummaryFieldProps = FieldProps<
null,
{
description?: string;
data?: { headers: string[]; labels: string[]; columns: string[][] };
}
>;
// onChange not used on purpose
function Summary({
id,
label,
description,
data,
...props
}: SummaryFieldProps) {
const { summaryFieldStyle } = useWithOrchestratorTheme(getStyles);
const { formRowStyle } = useWithOrchestratorTheme(getCommonFormFieldStyles);
if (!data) {
return null;
}
const { headers, labels, columns } = data;
const extraColumnsData = columns.filter((_, index) => index !== 0);
const rows = columns[0].map((row, index) => (
{labels && | {labels[index]} | }
{typeof row === 'string' && row.includes('') ? (
) : (
row
)}
|
{extraColumnsData &&
extraColumnsData.map((_, idx) => (
{extraColumnsData[idx][index]}
|
))}
));
const tableHeader =
!headers || headers.length === 0 ? null : (
{labels && | }
{headers.map((header, idx) => (
{header} |
))}
);
return (
{description}}
id={id}
fullWidth
>
);
}
export const SummaryField = connectField(Summary, { kind: 'leaf' });