github.com/replicatedhq/ship@v0.55.0/web/init/src/components/config_render/ConfigFileInput.jsx (about)

     1  import React from "react";
     2  import FileInput from "./FileInput";
     3  import ConfigItemTitle from "./ConfigItemTitle";
     4  
     5  export default class ConfigFileInput extends React.Component {
     6  
     7    handleOnChange = (value, data) => {
     8      if (this.props.handleChange) {
     9        if (this.props.multiple) {
    10          this.props.handleChange(this.props.name, data, value);
    11        } else {
    12          this.props.handleChange(
    13            this.props.name,
    14            data ? data[0] : "",
    15            value ? value[0] : "",
    16          );
    17        }
    18      }
    19    }
    20  
    21    getFilenamesText = () => {
    22      if (this.props.multiple) {
    23        if (this.props.multi_value && this.props.multi_value.length) {
    24          return this.props.multi_value.join(", ");
    25        }
    26      } else if (this.props.value) {
    27        return this.props.value.slice(0,5) + "....";
    28      }
    29      return this.props.default;
    30    }
    31  
    32    render() {
    33      var hidden = this.props.hidden || this.props.when === "false";
    34      
    35      return (
    36        <div className={`field field-type-file u-marginTop--15 ${hidden ? "hidden" : ""}`}>
    37          {this.props.title !== "" ?
    38            <ConfigItemTitle
    39              title={this.props.title}
    40              recommended={this.props.recommended}
    41              required={this.props.required}
    42              name={this.props.name}
    43              error={this.props.error}
    44            />
    45            : null}
    46          <div className="input input-type-file clearfix">
    47            <div>
    48              <span>
    49                <FileInput
    50                  ref={(file) => this.file = file}
    51                  name={this.props.name}
    52                  title={this.props.title}
    53                  value={this.props.value}
    54                  readOnly={this.props.readonly}
    55                  disabled={this.props.readonly}
    56                  multiple={this.props.multiple}
    57                  onChange={this.handleOnChange}
    58                  getFilenamesText={this.getFilenamesText()}/>
    59              </span>
    60            </div>
    61          </div>
    62        </div>
    63      );
    64    }
    65  }