/** * Template File for nile-preview component */ import './nile-file-preview.css'; import { html, TemplateResult } from 'lit'; import { FilePreviewErrorMessages, RemoveFileDetail } from './types'; import { removeFile, cancelFileUpload } from './utils'; import { formatFileSize, truncateString, getFileType } from './utils/nile-file-preview.util'; import { NileFilePreview } from './nile-file-preview'; export function getHorizontalUploadingState( file: File, uploadStatus: number, nileFilePreview: NileFilePreview ): TemplateResult { return html`

Uploading File...

${uploadStatus}%

${file.name}

) => cancelFileUpload(file, e, nileFilePreview)} name="cancelIcon">
`; } export function getHorizontalPreviewState( url: string, file: File, originalUrl: string, showFileType: boolean ): TemplateResult { return html`
${file.name}

${file.name}

${getFileType(file, showFileType)} • ${formatFileSize(Number(file.size))}

) => removeFile(file, e, originalUrl)} name="cancel-icon">
`; } export function getHorizontalNoPreviewState( file: File, originalUrl: string, showFileType: boolean ): TemplateResult { return html`

${file.name}

${getFileType(file, showFileType)} • ${formatFileSize(Number(file.size))}

) => removeFile(file, e, originalUrl)} name="cancelIcon">
`; } export function getHorizontalErrorState( file: File, errorMessage: string, originalUrl: string, nileFilePreview: NileFilePreview ): TemplateResult { truncateString(nileFilePreview); return html`

${file.name}

${ nileFilePreview.isStringTruncated ? html` ${errorMessage} ` : html`${errorMessage}` }
) => removeFile(file, e, originalUrl)} name="cancelIcon">
`; } // vertical states export function getVerticalUploadingState( file: File, uploadStatus: number, nileFilePreview: NileFilePreview ): TemplateResult { return html`

Uploading...

${uploadStatus}%

${file.name}

) => cancelFileUpload(file, e, nileFilePreview)} name="cancelIcon">
`; } export function getVerticalPreviewState( url: string, file: File, originalUrl: string, showFileType: boolean ): TemplateResult { return html`
${file.name}

${file.name}

${getFileType(file, showFileType)} • ${formatFileSize(Number(file.size))}

) => removeFile(file, e, originalUrl)} name="cancelIcon">
`; } export function getVerticalNoPreviewState( file: File, originalUrl: string, showFileType: boolean ): TemplateResult { return html`

${file.name}

${getFileType(file, showFileType)} • ${formatFileSize(Number(file.size))}

) => removeFile(file, e, originalUrl)} name="cancelIcon">
`; } export function getVerticalErrorState( file: File, errorMessage: string, originalUrl: string, nileFilePreview: NileFilePreview ): TemplateResult { truncateString(nileFilePreview); return html`

${file.name}

${ nileFilePreview.isStringTruncated ? html` ${errorMessage} ` : html`${errorMessage}` }
) => removeFile(file, e, originalUrl)} name="cancelIcon">
`; }