<commit_before>import * as React from 'react';
import {get} from 'lodash';
import {IEditorComponentProps, IArticle} from 'superdesk-api';
import {IPredefinedFieldConfig, IExtensionConfigurationOptions} from './interfaces';
import {Select, Option, Icon} from 'superdesk-ui-framework/react';

import {superdesk} from './superdesk';

const {Editor3Html} = superdesk.components;
const {gettext} = superdesk.localization;

type IProps = IEditorComponentProps<string, IPredefinedFieldConfig>;

interface IState {
    freeText: boolean;
}

function applyPlaceholders(definition: string, article: IArticle): string {
    const extensionConfig: IExtensionConfigurationOptions = superdesk.getExtensionConfig();

    let result = definition;

    for (let [placeholderName, pathToValue] of Object.entries(extensionConfig.placeholderMapping ?? {})) {
        result = result.replace(`{{${placeholderName}}}`, get(article, pathToValue, ''));
    }

    return result;
}

export class PredefinedFieldEditor extends React.PureComponent<IProps, IState> {
    constructor(props: IProps) {
        super(props);

        this.state = {
            freeText: false,
        };
    }

    render() {
        const selectedValue = this.props.value ?? '';
        const options = this.props.config.options ?? [];
        const allowSwitchingToFreeText = this.props.config.allowSwitchingToFreeText ?? false;

        const selectedOption = options.find(({definition}) =>
            applyPlaceholders(definition, this.props.item) === this.props.value);

        const fieldReadOnly = this.props.readOnly;

        return (
            <div>
                <Select
                    value={selectedOption?.title ?? ''}
                    onChange={(title) => {
                        if (title === '') {
                            this.props.setValue('');
                        } else {
                            const selected = options.find((option) => option.title === title);

                            if (selected != null) {
                                this.setState({freeText: false});
                                this.props.setValue(applyPlaceholders(selected.definition, this.props.item));
                            }
                        }
                    }}
                    disabled={fieldReadOnly}
                >
                    <Option value="" />

                    {
                        options.map((option, i) => (
                            <Option key={i} value={option.title}>{option.title}</Option><commit_msg>[SDFID-632] fix: Add hidden label to select input<commit_after>import * as React from 'react';
import {get} from 'lodash';
import {IEditorComponentProps, IArticle} from 'superdesk-api';
import {IPredefinedFieldConfig, IExtensionConfigurationOptions} from './interfaces';
import {Select, Option, Icon} from 'superdesk-ui-framework/react';

import {superdesk} from './superdesk';

const {Editor3Html} = superdesk.components;
const {gettext} = superdesk.localization;

type IProps = IEditorComponentProps<string, IPredefinedFieldConfig>;

interface IState {
    freeText: boolean;
}

function applyPlaceholders(definition: string, article: IArticle): string {
    const extensionConfig: IExtensionConfigurationOptions = superdesk.getExtensionConfig();

    let result = definition;

    for (let [placeholderName, pathToValue] of Object.entries(extensionConfig.placeholderMapping ?? {})) {
        result = result.replace(`{{${placeholderName}}}`, get(article, pathToValue, ''));
    }

    return result;
}

export class PredefinedFieldEditor extends React.PureComponent<IProps, IState> {
    constructor(props: IProps) {
        super(props);

        this.state = {
            freeText: false,
        };
    }

    render() {
        const selectedValue = this.props.value ?? '';
        const options = this.props.config.options ?? [];
        const allowSwitchingToFreeText = this.props.config.allowSwitchingToFreeText ?? false;

        const selectedOption = options.find(({definition}) =>
            applyPlaceholders(definition, this.props.item) === this.props.value);

        const fieldReadOnly = this.props.readOnly;

        return (
            <div>
                <Select
                    label={gettext('Predefined Text Options')}
                    labelHidden={true}
                    inlineLabel={true}
                    value={selectedOption?.title ?? ''}
                    onChange={(title) => {
                        if (title === '') {
                            this.props.setValue('');
                        } else {
                            const selected = options.find((option) => option.title === title);

                            if (selected != null) {
                                this.setState({freeText: false});
                                this.props.setValue(applyPlaceholders(selected.definition, this.props.item));
                            }
                        }
                    }}
                    disabled={fieldReadOnly}
                >
                    <Option value="" />

                    {
                        options.map((option, i) => (
                            <Option key={i} value={option.title}>{option.title}</Option>
{'fraction_non_alphanumeric': 0.11641113003975014, 'fraction_numerical': 0.0009464319515426841, 'mean_word_length': 1.9685393258426966, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2555416', 'n_tokens_mistral': 1328, 'n_tokens_neox': 1279, 'n_words': 269}