META-INF.resources.js.ImageInput.es.js Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of com.liferay.journal.web

Liferay Journal Web

There is a newer version: 5.0.181

/**
 * SPDX-FileCopyrightText: (c) 2000 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */

import ClayButton from '@clayui/button';
import ClayForm, {ClayInput} from '@clayui/form';
import ClayIcon from '@clayui/icon';
import {sub} from 'frontend-js-web';
import React, {useRef, useState} from 'react';

export default function ImageInput({name, portletNamespace, previewURL}) {
	const [fileName, setFileName] = useState(previewURL || '');
	const imageTitleId = `${portletNamespace}${name}`;
	const inputRef = useRef();

	return (
		
			{previewURL ? (
				
					
				
			) : null}

			{name ? (
				
					
						{Liferay.Language.get('image')}
					

					
						
							
									setFileName(
										event.target.files?.[0]?.name || ''
									)
								}
								ref={inputRef}
								type="file"
							/>

							 inputRef.current?.click()}
								placeholder={Liferay.Language.get(
									'select-image'
								)}
								readOnly
								sizing="sm"
								value={fileName}
							/>
						

						
							 inputRef.current?.click()}
								size="sm"
								title={sub(
									fileName
										? Liferay.Language.get('change-x')
										: Liferay.Language.get('select-x'),
									Liferay.Language.get('image')
								)}
							>
								
							
						
					
				
			) : null}
		
	);
}