@orchestrator-ui/orchestrator-ui-components 6.8.0 → 7.0.0

package/src/components/WfoForms/formFields/ListSelectField.tsx

@@ -1,95 +0,0 @@
-/*
- * 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.
- *
- */
-
-/* NOTE: This component is only needed to avoid the circular import that started to be a problem
-after the upgrade to react-script 5.0. The original SelectField would import itself to handle the list:
-that seems to be impossible with the new webpack.
- */
-import React from 'react';
-
-import { get } from 'lodash';
-import { joinName, useField, useForm } from 'uniforms';
-
-import { ListField, ListFieldProps } from './ListField';
-import { ListItemField } from './ListItemField';
-// Avoid circular deps
-import { UnconnectedSelectField } from './SelectField';
-import { FieldProps } from './types';
-
-export type ListSelectFieldProps = FieldProps<
-    string | string[],
-    { allowedValues?: string[]; transform?(value: string): string }
->;
-
-export function ListSelectField({
-    allowedValues = [],
-    fieldType,
-    name,
-    transform,
-    ...props
-}: ListSelectFieldProps) {
-    const nameArray = joinName(null, name);
-    let parentName = joinName(nameArray.slice(0, -1));
-
-    // We can't call useField conditionally so we call it for ourselves if there is no parent
-    if (parentName === '') {
-        parentName = name;
-    }
-    const parent = useField(parentName, {}, { absoluteName: true })[0];
-    const { model } = useForm();
-
-    if (parentName !== name) {
-        if (
-            parent.fieldType === Array &&
-            (parent as ListFieldProps).uniqueItems
-        ) {
-            const allValues: string[] = get(model, parentName, []);
-            const chosenValues = allValues.filter(
-                (_item, index) =>
-                    index.toString() !== nameArray[nameArray.length - 1],
-            );
-
-            allowedValues = allowedValues.filter(
-                (value) => !chosenValues.includes(value),
-            );
-        }
-    }
-
-    if (fieldType === Array) {
-        return (
-            <ListField name={name}>
-                <ListItemField name="$">
-                    <UnconnectedSelectField
-                        name=""
-                        transform={transform}
-                        allowedValues={allowedValues}
-                        fieldType={fieldType}
-                        {...props}
-                    />
-                </ListItemField>
-            </ListField>
-        );
-    } else {
-        return (
-            <UnconnectedSelectField
-                name=""
-                transform={transform}
-                allowedValues={allowedValues}
-                fieldType={fieldType}
-                {...props}
-            />
-        );
-    }
-}

package/src/components/WfoForms/formFields/LocationCodeField.tsx

@@ -1,60 +0,0 @@
-/*
- * 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, { useEffect, useState } from 'react';
-
-import { useTranslations } from 'next-intl';
-import { connectField, filterDOMProps } from 'uniforms';
-
-import { SelectFieldProps, UnconnectedSelectField } from '@/components';
-import { useLocationCodesQuery } from '@/rtk/endpoints/formFields';
-
-export type LocationCodeFieldProps = { locationCodes?: string[] } & Omit<
-    SelectFieldProps,
-    'placeholder' | 'allowedValues'
->;
-
-declare module 'uniforms' {
-    interface FilterDOMProps {
-        locationCodes: never;
-    }
-}
-
-filterDOMProps.register('locationCodes');
-
-function LocationCode({ locationCodes, ...props }: LocationCodeFieldProps) {
-    const t = useTranslations('pydanticForms');
-    const [codes, setCodes] = useState<string[]>(locationCodes ?? []);
-    const { data, error } = useLocationCodesQuery();
-
-    useEffect(() => {
-        if (data) {
-            setCodes(data);
-        }
-        if (error) {
-            console.error(error);
-            setCodes([]);
-        }
-    }, [data, error]);
-
-    return (
-        <UnconnectedSelectField
-            {...props}
-            allowedValues={codes}
-            placeholder={t('widgets.locationCode.placeholder')}
-        />
-    );
-}
-
-export const LocationCodeField = connectField(LocationCode, { kind: 'leaf' });

package/src/components/WfoForms/formFields/LongTextField.tsx

@@ -1,68 +0,0 @@
-/*
- * 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 { connectField, filterDOMProps } from 'uniforms';
-
-import { EuiFormRow, EuiText, EuiTextArea } from '@elastic/eui';
-
-import { FieldProps } from '@/components';
-
-export type LongTextFieldProps = FieldProps<
-    string,
-    object,
-    HTMLTextAreaElement
->;
-
-function LongText({
-    disabled,
-    id,
-    label,
-    description,
-    name,
-    onChange,
-    placeholder,
-    readOnly,
-    value,
-    error,
-    errorMessage,
-    ...props
-}: LongTextFieldProps) {
-    return (
-        <section {...filterDOMProps(props)}>
-            <EuiFormRow
-                label={label}
-                labelAppend={<EuiText size="m">{description}</EuiText>}
-                error={errorMessage}
-                isInvalid={error}
-                id={id}
-                fullWidth
-            >
-                <EuiTextArea
-                    disabled={disabled}
-                    name={name}
-                    isInvalid={error}
-                    onChange={(event) => onChange(event.target.value)}
-                    placeholder={placeholder}
-                    readOnly={readOnly}
-                    value={value ?? ''}
-                    fullWidth
-                />
-            </EuiFormRow>
-        </section>
-    );
-}
-
-export const LongTextField = connectField(LongText, { kind: 'leaf' });

package/src/components/WfoForms/formFields/NestField.tsx

@@ -1,107 +0,0 @@
-/*
- * 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 { connectField, filterDOMProps, joinName } from 'uniforms';
-import { AutoField } from 'uniforms-unstyled';
-
-import {
-    EuiDescribedFormGroup,
-    EuiFlexGroup,
-    EuiFlexItem,
-    EuiText,
-} from '@elastic/eui';
-
-import { FieldProps } from './types';
-
-export type NestFieldProps = FieldProps<
-    null,
-    { fields?: unknown[]; itemProps?: object }
->;
-
-declare module 'uniforms' {
-    interface FilterDOMProps {
-        properties: never;
-        wrap: never;
-        ref: never;
-    }
-}
-filterDOMProps.register('properties', 'wrap');
-
-function Nest({
-    children,
-    fields,
-    itemProps,
-    label,
-    description,
-    name,
-    className = '',
-    ...props
-}: NestFieldProps) {
-    const nameArray = joinName(null, name);
-    const lastNamePart = nameArray[nameArray.length - 1];
-    const isInList = !isNaN(parseInt(lastNamePart));
-    const itemIndex = isInList ? parseInt(lastNamePart) : 0;
-
-    if (isInList) {
-        return (
-            <EuiFlexGroup
-                {...filterDOMProps(props)}
-                className={`${className} nest-field`}
-            >
-                {label && (
-                    <>
-                        <label className="euiFormLabel euiFormRow__label">
-                            {label}
-                        </label>
-                        <EuiText size="m">{description}</EuiText>
-                    </>
-                )}
-
-                {children ||
-                    fields?.map((field) => (
-                        <EuiFlexItem key={field}>
-                            <AutoField
-                                name={field}
-                                {...itemProps}
-                                label={itemIndex === 0 ? undefined : false}
-                            />
-                        </EuiFlexItem>
-                    ))}
-            </EuiFlexGroup>
-        );
-    } else {
-        return (
-            <EuiDescribedFormGroup
-                {...filterDOMProps(props)}
-                title={<span>{label}</span>}
-                description={description}
-                className={`${className} nest-field`}
-            >
-                {children ||
-                    fields?.map((field) => (
-                        <AutoField
-                            key={field}
-                            name={field}
-                            {...itemProps}
-                            label={itemIndex === 0 ? undefined : false}
-                        />
-                    ))}
-            </EuiDescribedFormGroup>
-        );
-    }
-}
-
-export const NestField = connectField(Nest);

package/src/components/WfoForms/formFields/NumField.tsx

@@ -1,85 +0,0 @@
-/*
- * 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 { connectField, filterDOMProps } from 'uniforms';
-
-import { EuiFieldNumber, EuiFormRow, EuiText } from '@elastic/eui';
-
-import { FieldProps } from '@/components';
-import { getCommonFormFieldStyles } from '@/components/WfoForms/formFields/commonStyles';
-import { useWithOrchestratorTheme } from '@/hooks';
-import { getFormFieldsBaseStyle } from '@/theme';
-
-export type NumFieldProps = FieldProps<
-    number,
-    { max?: number; min?: number; precision?: number; step?: number }
-    // Todo: not sure what this did
-    // NumericInput
->;
-
-function Num({
-    disabled,
-    id,
-    label,
-    description,
-    max,
-    min,
-    name,
-    onChange,
-    placeholder,
-    readOnly,
-    step,
-    value,
-    error,
-    showInlineError,
-    errorMessage,
-    ...props
-}: NumFieldProps) {
-    const { formRowStyle } = useWithOrchestratorTheme(getCommonFormFieldStyles);
-    const { formFieldBaseStyle } = useWithOrchestratorTheme(
-        getFormFieldsBaseStyle,
-    );
-
-    return (
-        <div {...filterDOMProps(props)}>
-            <EuiFormRow
-                css={formRowStyle}
-                label={label}
-                labelAppend={<EuiText size="m">{description}</EuiText>}
-                error={showInlineError ? errorMessage : false}
-                isInvalid={error}
-                id={id}
-                fullWidth
-            >
-                <EuiFieldNumber
-                    css={formFieldBaseStyle}
-                    name={name}
-                    isInvalid={error}
-                    placeholder={placeholder}
-                    readOnly={readOnly}
-                    onChange={(event) => onChange(parseInt(event.target.value))}
-                    min={min}
-                    max={max}
-                    step={step ?? 1}
-                    value={value ?? ''}
-                    disabled={disabled}
-                />
-            </EuiFormRow>
-        </div>
-    );
-}
-
-export const NumField = connectField(Num, { kind: 'leaf' });

package/src/components/WfoForms/formFields/OptGroupField.tsx

@@ -1,74 +0,0 @@
-/*
- * 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 { useTranslations } from 'next-intl';
-import { connectField, filterDOMProps, useField } from 'uniforms';
-import { AutoField } from 'uniforms-unstyled';
-
-import { EuiDescribedFormGroup, EuiFlexItem, EuiFormRow } from '@elastic/eui';
-
-import { BoolField } from './BoolField';
-import { FieldProps } from './types';
-
-export type OptGroupFieldProps = FieldProps<
-    null,
-    { fields?: unknown[]; itemProps?: object }
->;
-
-filterDOMProps.register('properties');
-
-function OptGroup({
-    fields,
-    itemProps,
-    name,
-    readOnly,
-    className = '',
-    ...props
-}: OptGroupFieldProps) {
-    const t = useTranslations('pydanticForms.backendTranslations');
-    const enabled = useField('enabled', {})[0].value;
-
-    return (
-        <EuiDescribedFormGroup
-            {...filterDOMProps(props)}
-            title={<span>{t(`${name}.title`)}</span>}
-            description={t(`${name}.description`)}
-            className={`${className} optgroup-field`}
-        >
-            <>
-                <EuiFlexItem>
-                    <EuiFormRow
-                        error={false}
-                        isInvalid={false}
-                        id={name} // Not sure if this is always unique...
-                    >
-                        <BoolField name="enabled" readOnly={readOnly} />
-                    </EuiFormRow>
-                </EuiFlexItem>
-                {enabled &&
-                    fields
-                        ?.filter((field) => field !== 'enabled')
-                        .map((field) => (
-                            <EuiFlexItem key={field}>
-                                <AutoField name={field} {...itemProps} />
-                            </EuiFlexItem>
-                        ))}
-            </>
-        </EuiDescribedFormGroup>
-    );
-}
-
-export const OptGroupField = connectField(OptGroup);

package/src/components/WfoForms/formFields/RadioField.tsx

@@ -1,87 +0,0 @@
-/*
- * 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 { omit } from 'lodash';
-import { connectField, filterDOMProps } from 'uniforms';
-
-import { EuiFormRow, EuiRadio, EuiText } from '@elastic/eui';
-
-import { FieldProps } from '@/components';
-
-const base64 =
-    typeof btoa !== 'undefined'
-        ? btoa
-        : (x: string) => Buffer.from(x).toString('base64');
-const escape = (x: string) => base64(encodeURIComponent(x)).replace(/=+$/, '');
-
-export type RadioFieldProps = FieldProps<
-    string,
-    {
-        allowedValues?: string[];
-        checkboxes?: boolean;
-        transform?(value: string): string;
-    }
->;
-
-function Radio({
-    allowedValues,
-    disabled,
-    id,
-    label,
-    description,
-    name,
-    onChange,
-    readOnly,
-    transform,
-    value,
-    error,
-    showInlineError,
-    errorMessage,
-    ...props
-}: RadioFieldProps) {
-    return (
-        <div {...omit(filterDOMProps(props), ['checkboxes'])}>
-            <EuiFormRow
-                label={label}
-                labelAppend={<EuiText size="m">{description}</EuiText>}
-                error={showInlineError ? errorMessage : false}
-                isInvalid={error}
-                id={id}
-                fullWidth
-            >
-                <>
-                    {allowedValues?.map((item) => (
-                        <EuiRadio
-                            key={item}
-                            id={`${id}-${escape(item)}`}
-                            label={transform ? transform(item) : item}
-                            disabled={disabled}
-                            name={name}
-                            checked={item === value}
-                            onChange={() => {
-                                if (!readOnly) {
-                                    onChange(item);
-                                }
-                            }}
-                        />
-                    ))}
-                </>
-            </EuiFormRow>
-        </div>
-    );
-}
-
-export const RadioField = connectField(Radio, { kind: 'leaf' });