@iobroker/json-config 6.17.12 → 6.17.14

package/src/JsonConfigComponent/ConfigIP.jsx

@@ -1,96 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@mui/styles';
-
-import {
-    InputLabel,
-    TextField,
-    FormHelperText,
-    MenuItem,
-    FormControl,
-    Select,
-} from '@mui/material';
-
-import { I18n } from '@iobroker/adapter-react-v5';
-
-import ConfigGeneric from './ConfigGeneric';
-
-const styles = () => ({
-    fullWidth: {
-        width: '100%',
-    },
-});
-
-class ConfigIP extends ConfigGeneric {
-    componentDidMount() {
-        super.componentDidMount();
-        this.props.socket.getHostByIp(this.props.common.host)
-            .then(ips => {
-                // [{name, address, family}]
-                if (!this.props.schema.listenOnAllPorts) {
-                    ips = ips.filter(item => item.address !== '0.0.0.0' && item.address !== '::');
-                }
-                if (this.props.schema.onlyIp4) {
-                    ips = ips.filter(item => item.family === 'ipv4');
-                } else if (this.props.schema.onlyIp6) {
-                    ips = ips.filter(item => item.family === 'ipv6');
-                }
-                if (this.props.schema.noInternal) {
-                    ips = ips.filter(item => !item.internal);
-                }
-                ips.forEach(item => {
-                    if (item.address === '0.0.0.0') {
-                        item.name = `[IPv4] 0.0.0.0 - ${I18n.t('ra_Listen on all IPs')}`;
-                    } else if (item.address === '::') {
-                        item.name = `[IPv6] :: - ${I18n.t('ra_Listen on all IPs')}`;
-                    }
-                });
-                this.setState({ ips });
-            });
-    }
-
-    renderItem(error, disabled /* , defaultValue */) {
-        const value = ConfigGeneric.getValue(this.props.data, this.props.attr);
-        const item = this.state.ips?.find(it => it.address === value);
-
-        return <FormControl className={this.props.classes.fullWidth} variant="standard">
-            {this.state.ips && this.props.schema.label ? <InputLabel>{this.getText(this.props.schema.label)}</InputLabel> : null}
-            {!this.state.ips ?
-                <TextField
-                    fullWidth
-                    variant="standard"
-                    error={!!error}
-                    disabled={!!disabled}
-                    value={value}
-                    onChange={e => this.onChange(this.props.attr, e.target.value)}
-                    label={this.getText(this.props.schema.label)}
-                /> :
-                <Select
-                    variant="standard"
-                    error={!!error}
-                    disabled={!!disabled}
-                    value={value}
-                    renderValue={val => item?.name || val}
-                    onChange={e => this.onChange(this.props.attr, e.target.value)}
-                >
-                    {this.state.ips?.map((it, i) =>
-                        <MenuItem key={i} value={it.address}>{it.name}</MenuItem>)}
-                </Select>}
-            {this.props.schema.help ? <FormHelperText>{this.renderHelp(this.props.schema.help, this.props.schema.helpLink, this.props.schema.noTranslation)}</FormHelperText> : null}
-        </FormControl>;
-    }
-}
-
-ConfigIP.propTypes = {
-    socket: PropTypes.object.isRequired,
-    themeType: PropTypes.string,
-    themeName: PropTypes.string,
-    style: PropTypes.object,
-    className: PropTypes.string,
-    data: PropTypes.object.isRequired,
-    schema: PropTypes.object,
-    onError: PropTypes.func,
-    onChange: PropTypes.func,
-};
-
-export default withStyles(styles)(ConfigIP);

package/src/JsonConfigComponent/ConfigImageSendTo.jsx

@@ -1,79 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@mui/styles';
-
-import ConfigGeneric from './ConfigGeneric';
-
-const styles = () => ({
-    fullWidth: {
-        width: '100%',
-    },
-});
-
-class ConfigImageSendTo extends ConfigGeneric {
-    componentDidMount() {
-        super.componentDidMount();
-
-        this.askInstance();
-    }
-
-    askInstance() {
-        if (this.props.alive) {
-            let data = this.props.schema.data;
-            if (data === undefined && this.props.schema.jsonData) {
-                data = this.getPattern(this.props.schema.jsonData);
-                try {
-                    data = JSON.parse(data);
-                } catch (e) {
-                    console.error(`Cannot parse json data: ${data}`);
-                }
-            }
-
-            if (data === undefined) {
-                data = null;
-            }
-
-            this.props.socket.sendTo(`${this.props.adapterName}.${this.props.instance}`, this.props.schema.command || 'send', data)
-                .then(image => this.setState({ image: image || '', context: this.getContext() }));
-        }
-    }
-
-    getContext() {
-        const context = {};
-        if (Array.isArray(this.props.schema.alsoDependsOn)) {
-            this.props.schema.alsoDependsOn.forEach(attr =>
-                context[attr] = ConfigGeneric.getValue(this.props.data, attr));
-        }
-        return JSON.stringify(context);
-    }
-
-    renderItem(/* error, disabled, defaultValue */) {
-        if (this.state.image === undefined) {
-            return null;
-        }
-
-        if (this.props.alive) {
-            const context = this.getContext();
-            if (context !== this.state.context) {
-                setTimeout(() => this.askInstance(), 300);
-            }
-        }
-
-        return <img
-            className={this.props.classes.fullWidth}
-            alt="dynamic content"
-            src={this.state.image}
-            style={{ width: this.props.schema.width, height: this.props.schema.height }}
-        />;
-    }
-}
-
-ConfigImageSendTo.propTypes = {
-    socket: PropTypes.object.isRequired,
-    data: PropTypes.object.isRequired,
-    schema: PropTypes.object,
-    adapterName: PropTypes.string,
-    instance: PropTypes.number,
-};
-
-export default withStyles(styles)(ConfigImageSendTo);

package/src/JsonConfigComponent/ConfigImageUpload.jsx

@@ -1,114 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@mui/styles';
-
-import {
-    InputLabel,
-    FormHelperText,
-    FormControl,
-} from '@mui/material';
-
-import { UploadImage, I18n } from '@iobroker/adapter-react-v5';
-
-import ConfigGeneric from './ConfigGeneric';
-
-const styles = () => ({
-    fullWidth: {
-        width: '100%',
-    },
-    image: {
-        width: 100,
-    },
-});
-
-class ConfigImageUpload extends ConfigGeneric {
-    constructor(props) {
-        super(props);
-        this.index = Date.now();
-    }
-
-    async componentDidMount() {
-        super.componentDidMount();
-
-        if (this.props.schema.base64) {
-            const value = ConfigGeneric.getValue(this.props.data, this.props.attr);
-            this.setState({ value });
-        } else {
-            this.props.socket.fileExists(`${this.props.adapterName}.${this.props.instance}`, this.props.attr)
-                .then(exist => exist && this.loadImage());
-        }
-    }
-
-    _getUrl(update) {
-        if (update) {
-            this.index = Date.now();
-        }
-        let url = `files/${this.props.adapterName}.${this.props.instance}/${this.props.attr}?t=${this.index}`;
-        if (window.location.port === '3000') {
-            url = `${window.location.protocol}//${window.location.hostname}:8081/${url}`;
-        }
-
-        return url;
-    }
-
-    loadImage() {
-        fetch(this._getUrl())
-            .then(res => res.blob())
-            .then(blob => {
-                const reader = new FileReader();
-                reader.onload = () => {
-                    this.setState({ value: reader.result });
-                };
-                reader.readAsDataURL(blob);
-            })
-            .catch(e => console.error(e));
-    }
-
-    renderItem(error, disabled /* , defaultValue */) {
-        // eslint-disable-next-line
-        return <FormControl className={this.props.classes.fullWidth} variant="standard">
-            {this.props.schema.label ? <InputLabel shrink>{this.getText(this.props.schema.label)}</InputLabel> : null}
-            <UploadImage
-                error={!!error}
-                disabled={disabled}
-                accept={this.props.schema.accept}
-                crop={this.props.schema.crop}
-                maxSize={this.props.schema.maxSize || 256 * 1024}
-                icon={this.state.value || undefined}
-                removeIconFunc={() => this.setState({ value: null }, () => {
-                    if (this.props.schema.base64) {
-                        this.onChange(this.props.attr, this.state.value);
-                    } else {
-                        // delete file to /instance/attr
-                        this.props.socket.deleteFile(`${this.props.adapterName}.${this.props.instance}`, this.props.attr);
-                    }
-                })}
-                onChange={base64 => this.setState({ value: base64 }, () => {
-                    if (this.props.schema.base64) {
-                        this.onChange(this.props.attr, this.state.value);
-                    } else if (base64.startsWith('data')) {
-                        base64 = base64.split(',')[1];
-                    }
-                    // upload file to /instance/attr
-                    this.props.socket.writeFile64(`${this.props.adapterName}.${this.props.instance}`, this.props.attr, base64);
-                })}
-                t={I18n.t}
-            />
-            {this.props.schema.help ? <FormHelperText>{this.renderHelp(this.props.schema.help, this.props.schema.helpLink, this.props.schema.noTranslation)}</FormHelperText> : null}
-        </FormControl>;
-    }
-}
-
-ConfigImageUpload.propTypes = {
-    socket: PropTypes.object.isRequired,
-    themeType: PropTypes.string,
-    themeName: PropTypes.string,
-    style: PropTypes.object,
-    className: PropTypes.string,
-    data: PropTypes.object.isRequired,
-    schema: PropTypes.object,
-    onError: PropTypes.func,
-    onChange: PropTypes.func,
-};
-
-export default withStyles(styles)(ConfigImageUpload);

package/src/JsonConfigComponent/ConfigInstanceSelect.jsx

@@ -1,172 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@mui/styles';
-
-import {
-    InputLabel,
-    MenuItem,
-    FormHelperText,
-    FormControl,
-    Select,
-} from '@mui/material';
-
-import { I18n } from '@iobroker/adapter-react-v5';
-import ConfigGeneric from './ConfigGeneric';
-
-const styles = () => ({
-    fullWidth: {
-        width: '100%',
-    },
-    icon: {
-        width: 20,
-        height: 20,
-        marginRight: 4,
-    },
-});
-
-class ConfigInstanceSelect extends ConfigGeneric {
-    async componentDidMount() {
-        super.componentDidMount();
-        const value = ConfigGeneric.getValue(this.props.data, this.props.attr);
-
-        let adapter = this.props.schema.adapter;
-        if (adapter === '_dataSources') {
-            adapter = undefined;
-        }
-
-        this.props.socket.getAdapterInstances(adapter, true)
-            .then(async instances => {
-                if (this.props.schema.adapter === '_dataSources') {
-                    // get only "data-sources", like history, sql, influx
-                    instances = instances.filter(instance => instance?.common?.getHistory);
-                } else if (this.props.schema.adapter) {
-                    instances = instances.filter(instance => instance?._id.startsWith(`system.adapter.${this.props.schema.adapter}.`));
-                } else if (this.props.schema.adapters && Array.isArray(this.props.schema.adapters)) {
-                    instances = instances.filter(instance => this.props.schema.adapters.includes(instance?.common?.name));
-                }
-
-                if (this.props.schema.onlyEnabled) {
-                    instances = instances.filter(instance => instance?.common?.enabled);
-                }
-
-                const selectOptions = instances.map(instance => ({
-                    value: this.props.schema.long ? instance._id :
-                        (this.props.schema.short ? instance._id.split('.').pop() : instance._id.replace(/^system\.adapter\./, '')),
-                    label: `${instance.common.name} [${instance._id.replace(/^system\.adapter\./, '')}]`,
-                    icon: `adapter/${instance.common.name}/${instance.common.icon}`,
-                }));
-
-                selectOptions.sort((a, b) => {
-                    if (a.value > b.value) {
-                        return 1;
-                    } if (a.value < b.value) {
-                        return -1;
-                    }
-                    return 0;
-                });
-
-                if (this.props.schema.allowDeactivate !== false) {
-                    selectOptions.unshift({ label: I18n.t(ConfigGeneric.NONE_LABEL), value: ConfigGeneric.NONE_VALUE });
-                }
-                if (this.props.schema.all) {
-                    selectOptions.unshift({ label: I18n.t('sch_all'), value: '*' });
-                }
-
-                this.setState({ value: value || '', selectOptions });
-
-                await this.props.socket.subscribeObject(`system.adapter.${adapter ? `${adapter}.` : ''}*`, this.onInstancesUpdate);
-            });
-    }
-
-    componentWillUnmount() {
-        this.props.socket.unsubscribeObject('system.adapter.*', this.onInstancesUpdate)
-            .then(() => {});
-        super.componentWillUnmount();
-    }
-
-    onInstancesUpdate = (id, obj) => {
-        if (!id.match(/^system\.adapter\.[-_a-z\d]+\.\d+$/)) {
-            return;
-        }
-        const _id = this.props.schema.long ? id : (this.props.schema.short ? id.split('.').pop() : id.replace(/^system\.adapter\./, ''));
-        const index = this.state.selectOptions.findIndex(item => item.value === _id);
-        if (!obj) {
-            // deleted
-            if (index !== -1) {
-                const selectOptions = JSON.parse(JSON.stringify(this.state.selectOptions));
-
-                const newState = {};
-                if (this.state.value === selectOptions[index].value) {
-                    newState.value = ConfigGeneric.NONE_VALUE;
-                }
-                selectOptions.splice(index, 1);
-                newState.selectOptions = selectOptions;
-
-                this.setState(newState);
-            }
-        } else {
-            if (this.props.schema.adapter === '_dataSources' && (!obj.common || !obj.common.getHistory)) {
-                return;
-            }
-
-            if (index === -1) {
-                const selectOptions = JSON.parse(JSON.stringify(this.state.selectOptions));
-                selectOptions.push({
-                    value: this.props.schema.long ? obj._id :
-                        (this.props.schema.short ? obj._id.split('.').pop() : obj._id.replace(/^system\.adapter\./, '')),
-                    label: `${obj.common.name} [${obj._id.replace(/^system\.adapter\./, '')}]`,
-                    icon: `adapter/${obj.common.name}/${obj.common.icon}`,
-                });
-                selectOptions.sort((a, b) => (a.label > b.label ? 1 : (a.label < b.label ? -1 : 0)));
-                this.setState({ selectOptions });
-            }
-        }
-    };
-
-    renderItem(error, disabled /* , defaultValue */) {
-        if (!this.state.selectOptions) {
-            return null;
-        }
-
-        const item = this.state.selectOptions?.find(it => it.value === this.state.value);
-
-        return <FormControl className={this.props.classes.fullWidth} key={this.props.attr} variant="standard">
-            {this.props.schema.label ? <InputLabel shrink>{this.getText(this.props.schema.label)}</InputLabel> : null }
-            <Select
-                variant="standard"
-                error={!!error}
-                displayEmpty
-                disabled={!!disabled}
-                value={this.state.value}
-                renderValue={() => <span style={{ display: 'flex' }}>
-                    {item?.icon ? <img src={`./${item.icon}`} alt={item.value} className={this.props.classes.icon} /> : null}
-                    {this.getText(item?.label, true)}
-                </span>}
-                onChange={e =>
-                    this.setState({ value: e.target.value }, () =>
-                        this.onChange(this.props.attr, this.state.value))}
-            >
-                {this.state.selectOptions.map(it =>
-                    <MenuItem key={it.value} value={it.value} style={it.value === ConfigGeneric.NONE_VALUE ? { opacity: 0.5 } : {}}>
-                        {it.icon ? <img src={`./${it.icon}`} alt={it.value} className={this.props.classes.icon} /> : null}
-                        {this.getText(it.label, true)}
-                    </MenuItem>)}
-            </Select>
-            {this.props.schema.help ? <FormHelperText>{this.renderHelp(this.props.schema.help, this.props.schema.helpLink, this.props.schema.noTranslation)}</FormHelperText> : null}
-        </FormControl>;
-    }
-}
-
-ConfigInstanceSelect.propTypes = {
-    socket: PropTypes.object.isRequired,
-    themeType: PropTypes.string,
-    themeName: PropTypes.string,
-    style: PropTypes.object,
-    className: PropTypes.string,
-    data: PropTypes.object.isRequired,
-    schema: PropTypes.object,
-    onError: PropTypes.func,
-    onChange: PropTypes.func,
-};
-
-export default withStyles(styles)(ConfigInstanceSelect);

package/src/JsonConfigComponent/ConfigInterface.jsx

@@ -1,112 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@mui/styles';
-
-import {
-    InputLabel,
-    TextField,
-    FormHelperText,
-    MenuItem,
-    FormControl,
-    Select,
-} from '@mui/material';
-
-import ConfigGeneric from './ConfigGeneric';
-
-const styles = () => ({
-    fullWidth: {
-        width: '100%',
-    },
-    address: {
-        fontSize: 'smaller',
-        opacity: 0.5,
-        marginLeft: 8,
-    },
-});
-
-class ConfigInterface extends ConfigGeneric {
-    componentDidMount() {
-        super.componentDidMount();
-        this.props.socket.getObject(`system.host.${this.props.common.host}`)
-            .then(obj => {
-                const interfaces = [];
-                if (obj?.native?.hardware?.networkInterfaces) {
-                    const list = obj.native.hardware.networkInterfaces;
-                    Object.keys(list).forEach(inter => {
-                        if (this.props.schema.ignoreInternal && !list[inter].find(_ip => !_ip.internal)) {
-                            return;
-                        }
-                        if (this.props.schema.ignoreLoopback && list[inter].find(_ip => _ip.address === '127.0.0.1' || _ip.address === '::1')) {
-                            return;
-                        }
-
-                        // find ipv4 address
-                        let ip = list[inter].find(_ip => _ip.family === 'IPv4');
-                        ip = ip || list[inter].find(_ip => _ip.family === 'IPv6');
-                        interfaces.push({ value: inter, address: ip.address });
-                    });
-                }
-
-                this.setState({ interfaces });
-            })
-            .catch(e => window.alert(`Cannot read interfaces: ${e}`));
-    }
-
-    renderItem(error, disabled /* , defaultValue */) {
-        const value = ConfigGeneric.getValue(this.props.data, this.props.attr);
-        const item = this.state.interfaces?.find(it => it.value === value);
-
-        return <FormControl className={this.props.classes.fullWidth} variant="standard">
-            {this.state.interfaces?.length && this.props.schema.label ? <InputLabel>{this.getText(this.props.schema.label)}</InputLabel> : null}
-            {!this.state.interfaces?.length ?
-                <TextField
-                    fullWidth
-                    variant="standard"
-                    error={!!error}
-                    disabled={!!disabled}
-                    value={value}
-                    onChange={e => this.onChange(this.props.attr, e.target.value)}
-                    label={this.getText(this.props.schema.label)}
-                /> :
-                <Select
-                    variant="standard"
-                    error={!!error}
-                    disabled={!!disabled}
-                    value={value}
-                    renderValue={val => {
-                        if (item) {
-                            return <span>
-                                {item.value}
-                                <span className={this.props.classes.address}>{item.address}</span>
-                            </span>;
-                        }
-                        return val;
-                    }}
-                    onChange={e => this.onChange(this.props.attr, e.target.value)}
-                >
-                    {this.state.interfaces.map((it, i) =>
-                        <MenuItem key={i} value={it.value}>
-                            <span>
-                                {it.value}
-                                <span className={this.props.classes.address}>{it.address}</span>
-                            </span>
-                        </MenuItem>)}
-                </Select>}
-            {this.props.schema.help ? <FormHelperText>{this.renderHelp(this.props.schema.help, this.props.schema.helpLink, this.props.schema.noTranslation)}</FormHelperText> : null}
-        </FormControl>;
-    }
-}
-
-ConfigInterface.propTypes = {
-    socket: PropTypes.object.isRequired,
-    themeType: PropTypes.string,
-    themeName: PropTypes.string,
-    style: PropTypes.object,
-    className: PropTypes.string,
-    data: PropTypes.object.isRequired,
-    schema: PropTypes.object,
-    onError: PropTypes.func,
-    onChange: PropTypes.func,
-};
-
-export default withStyles(styles)(ConfigInterface);

package/src/JsonConfigComponent/ConfigJsonEditor.jsx

@@ -1,103 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { withStyles } from '@mui/styles';
-
-import {
-    FormHelperText,
-    FormControl,
-    Button,
-} from '@mui/material';
-
-import { I18n } from '@iobroker/adapter-react-v5';
-import ConfigGeneric from './ConfigGeneric';
-import CustomModal from './wrapper/Components/CustomModal';
-import Editor from './wrapper/Components/Editor';
-
-const styles = () => ({
-    fullWidth: {
-        width: '100%',
-    },
-    flex: {
-        display: 'flex',
-    },
-    button: {
-        height: 48,
-        // marginLeft: 4,
-        minWidth: 48,
-    },
-    wrapper: {
-        width: 'calc(100vw - 40px)',
-        height: 'calc(100vh - 188px)',
-    },
-});
-
-class ConfigJsonEditor extends ConfigGeneric {
-    async componentDidMount() {
-        super.componentDidMount();
-        const { data, attr } = this.props;
-        const value = ConfigGeneric.getValue(data, attr) || {};
-        this.setState({ value, initialized: true });
-    }
-
-    renderItem(/* error, disabled, defaultValue */) {
-        if (!this.state.initialized) {
-            return null;
-        }
-
-        const {
-            classes, schema, data, attr,
-        } = this.props;
-        const { value, showSelectId } = this.state;
-
-        return <FormControl className={classes.fullWidth} variant="standard">
-            <div className={classes.flex}>
-                <Button
-                    color="grey"
-                    className={classes.button}
-                    size="small"
-                    variant="outlined"
-                    onClick={() => this.setState({ showSelectId: true })}
-                >
-                    {I18n.t('ra_JSON editor')}
-                </Button>
-            </div>
-            {showSelectId ? <CustomModal
-                title={this.getText(schema.label)}
-                open={showSelectId}
-                overflowHidden
-                onClose={() =>
-                    this.setState({ showSelectId: false, value: ConfigGeneric.getValue(data, attr) || {} })}
-                onApply={() => this.setState({ showSelectId: false }, () => this.onChange(attr, value))}
-            >
-                <div className={classes.wrapper}>
-                    <Editor
-                        value={typeof value === 'object' ? JSON.stringify(value) : value}
-                        onChange={newValue => this.setState({ value: newValue })}
-                        name="ConfigJsonEditor"
-                        themeType={this.props.themeType}
-                    />
-                </div>
-            </CustomModal> : null}
-            {schema.help ? <FormHelperText>
-                {this.renderHelp(
-                    this.props.schema.help,
-                    this.props.schema.helpLink,
-                    this.props.schema.noTranslation,
-                )}
-            </FormHelperText> : null}
-        </FormControl>;
-    }
-}
-
-ConfigJsonEditor.propTypes = {
-    socket: PropTypes.object.isRequired,
-    themeType: PropTypes.string,
-    style: PropTypes.object,
-    className: PropTypes.string,
-    data: PropTypes.object.isRequired,
-    schema: PropTypes.object,
-    onError: PropTypes.func,
-    onChange: PropTypes.func,
-};
-
-export default withStyles(styles)(ConfigJsonEditor);