import React, { useCallback, useEffect, useRef } from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { FilePicker, Popup } from '../../../lib/custom-ui';
import styles from './EditBackgroundStep.module.css';
const EditBackgroundStep = React.memo(
({ defaultValue, isImageUpdating, onImageUpdate, onImageDelete, onBack }) => {
const [t] = useTranslation();
const field = useRef(null);
const handleFileSelect = useCallback(
(file) => {
onImageUpdate({
file,
});
},
[onImageUpdate],
);
useEffect(() => {
field.current.focus();
}, []);
return (
<>
{t('common.editBackground', {
context: 'title',
})}
{defaultValue && (
)}
>
);
},
);
EditBackgroundStep.propTypes = {
defaultValue: PropTypes.object, // eslint-disable-line react/forbid-prop-types
isImageUpdating: PropTypes.bool.isRequired,
// onUpdate: PropTypes.func.isRequired,
onImageUpdate: PropTypes.func.isRequired,
onImageDelete: PropTypes.func.isRequired,
onBack: PropTypes.func.isRequired,
};
EditBackgroundStep.defaultProps = {
defaultValue: undefined,
};
export default EditBackgroundStep;