How to use the @amalto/helpers.formatFileSize function in @amalto/helpers

To help you get started, we’ve selected a few @amalto/helpers examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github amalto / platform6-ui-components / components / file-input / components / FileWrapper.tsx View on Github external
{/* this div matches the number of cell of the previous table-row, it allows proper alignment of borders */}
                <div>&nbsp;</div>
            
        ) : null

        return (
            <li>
                {progressDisplay}
                <div>
                    <span data-original-title="{createdMessageText}" data-toggle="tooltip">{this.props.fileName}</span>
                    <span>{formatFileSize( this.props.fileSize )}</span>
                </div>
                {deleteBtn}
                {successIcon}
                {errorMessage}
            </li>
        )

    }
github amalto / platform6-ui-components / components / file-upload-input / index.tsx View on Github external
{label ? <label>{label}{help &amp;&amp; }</label> : null}

                <div>
                    <input disabled="{disabled}" type="file" name="{name}"> { this.setValue( e, { input, meta } ) }} /&gt;
                    <span>
                    {
                        !!filename &amp;&amp; !!filesize
                            ? <span>
                                <span>
                                    <span>{wordings.name}:</span> {filename}</span>, <span><span>{wordings.size}:</span> {formatFileSize( filesize )}</span>
                            </span>
                            : !fileUploaded ? <span>{wordings.noFileChosen}</span> : <span>{wordings.fileUploaded}</span>
                    }

                </span></div>

                {( meta.touched &amp;&amp; !!meta.error ) ? <p>{meta.error}</p> : ( collapseErrorSpace || this.state.loadingError ? null : <p>&nbsp;</p> )}

                {
                    ( input.value &amp;&amp; displayPreview &amp;&amp; fileContent ) ?
                        <div>
                            <em><small>{label &amp;&amp; <span>{label}</span>}{wordings.previewLowerCase}</small></em>
                            {
                                getAsDataUrl ? (
                                    <div><img src="{fileContent}" style="{{"></div>
                                ) : <pre>{fileContent}</pre></div>
github amalto / platform6-ui-components / components / file-upload-input / components / FileInput.tsx View on Github external
{label ? <label>{label}{help &amp;&amp; }</label> : null}

            <div>
                <input disabled="{disabled}" type="file" name="{name}"> { setValue( e, field.input, onFileLoaded, setFileContent, setLoadingError, setFilename, setFilesize ) }} /&gt;
                <span>
                {
                    !!filename &amp;&amp; !!filesize
                        ? <span>
                            <span>
                                <span>{wordings.name}:</span> {filename}</span>, <span><span>{wordings.size}:</span> {formatFileSize( filesize )}</span>
                        </span>
                        : !fileUploaded ? <span>{wordings.noFileChosen}</span> : <span>{wordings.fileUploaded}</span>
                }

            </span></div>

            {( meta.touched &amp;&amp; !!meta.error ) ? <p>{meta.error}</p> : ( collapseErrorSpace || loadingError ? null : <p>&nbsp;</p> )}

            {
                ( input.value &amp;&amp; displayPreview &amp;&amp; fileContent ) ?
                    <div>
                        <em><small>{label &amp;&amp; <span>{label}</span>}{wordings.previewLowerCase}</small></em>
                        <pre>{fileContent}</pre>
                    </div> : null
            }
github amalto / platform6-ui-components / components / file-importer / index.tsx View on Github external
<div>

                            <div>
                                <div>
                                    <h5>{wordings.selectedFile}</h5>

                                    <p>
                                        <span>{wordings.name.toLowerCase()}</span>
                                        <br>
                                        <em>{this.props.fileData.name}</em>
                                    </p>

                                    <p>
                                        <span>{wordings.size.toLowerCase()}</span>
                                        <br>
                                        <em>{formatFileSize( this.props.fileData.size )}</em>
                                    </p>
                                </div>
                            </div>

                            <div>

                                <div>
                                    <div>
                                        <label>{wordings.fileType}</label>
                                        <select value="{impFileType}" name="impFileType">
                                            <option value="CSV">CSV</option>
                                            <option value="EXCEL">Excel</option>
                                        </select>
                                    </div></div></div></div>
github amalto / platform6-ui-components / components / file-input / index.tsx View on Github external
let errors = this.state.invalidFiles.map( ( file, idx ) =&gt; {
            return (
                <div>
                    <span><strong>{file.name}</strong> - </span><em>{formatFileSize( file.size )}, {file.type || wordings.unknownFormat}</em>
                </div>
            )
        } )
github amalto / platform6-ui-components / components / file-input / index.tsx View on Github external
<div>
                        <div>
                            <ul style="{{">
                                {filesDisplay}
                            </ul>

                            {
                                this.state.invalidFiles.length ? (
                                    <div>
                                        <button type="button">×</button>
                                        <div>
                                            <strong>{wordings.invalidFile}</strong>
                                            <span data-target="#inputFormatInfo" data-toggle="collapse">
                                            <div style="{{" id="inputFormatInfo">
                                                {this.props.mimeTypeAccepted ? <div><strong>{wordings.contentType}</strong><span>{this.props.mimeTypeAccepted}</span></div> : null}
                                                {this.props.maxBytesSize ? <div><strong>{wordings.maxSize}</strong><span>{formatFileSize( this.props.maxBytesSize )}</span></div> : null}
                                            </div>
                                        </span></div>
                                        {errors}
                                    </div>
                                ) : null
                            }
                        </div>
                    </div>

                

                {cancelBtn}

            
        )