ref: Creating popups with hook, fix translation keys passing

This commit is contained in:
Maksim Eltyshev
2023-01-24 18:53:13 +01:00
parent 6fd42e3b62
commit d975b2d07a
69 changed files with 309 additions and 332 deletions

View File

@@ -1,19 +1,28 @@
import React from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react';
import { Popup } from '../../lib/custom-ui';
import styles from './DeleteStep.module.scss';
const DeleteStep = React.memo(({ title, content, buttonContent, onConfirm, onBack }) => (
<>
<Popup.Header onBack={onBack}>{title}</Popup.Header>
<Popup.Content>
<div className={styles.content}>{content}</div>
<Button fluid negative content={buttonContent} onClick={onConfirm} />
</Popup.Content>
</>
));
const DeleteStep = React.memo(({ title, content, buttonContent, onConfirm, onBack }) => {
const [t] = useTranslation();
return (
<>
<Popup.Header onBack={onBack}>
{t(title, {
context: 'title',
})}
</Popup.Header>
<Popup.Content>
<div className={styles.content}>{t(content)}</div>
<Button fluid negative content={t(buttonContent)} onClick={onConfirm} />
</Popup.Content>
</>
);
});
DeleteStep.propTypes = {
title: PropTypes.string.isRequired,