mirror of
https://github.com/strapi/strapi.git
synced 2025-08-03 06:18:37 +00:00
Move Buttonmodal from ctb to helper plugin
This commit is contained in:
parent
4f1b2973fc
commit
bf73d73f8e
BIN
packages/strapi-helper-plugin/lib/src/assets/icons/icon_check.png
Executable file
BIN
packages/strapi-helper-plugin/lib/src/assets/icons/icon_check.png
Executable file
Binary file not shown.
After Width: | Height: | Size: 702 B |
@ -1,7 +1,7 @@
|
|||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
import { Button } from 'reactstrap';
|
import { Button } from 'reactstrap';
|
||||||
|
|
||||||
const StyledButtonModalSecondary = styled(Button)`
|
const StyledButtonSecondary = styled(Button)`
|
||||||
font-family: Lato;
|
font-family: Lato;
|
||||||
color: #f64d0a;
|
color: #f64d0a;
|
||||||
border: 0.1rem solid #f64d0a;
|
border: 0.1rem solid #f64d0a;
|
||||||
@ -22,4 +22,4 @@ const StyledButtonModalSecondary = styled(Button)`
|
|||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
export default StyledButtonModalSecondary;
|
export default StyledButtonSecondary;
|
@ -2,8 +2,7 @@ import styled from 'styled-components';
|
|||||||
import { Button } from 'reactstrap';
|
import { Button } from 'reactstrap';
|
||||||
|
|
||||||
import img from '../../assets/icons/icon_check.png';
|
import img from '../../assets/icons/icon_check.png';
|
||||||
|
import colors from '../../assets/styles/colors';
|
||||||
import { colors } from 'strapi-helper-plugin';
|
|
||||||
|
|
||||||
const StyledButtonModalSuccess = styled(Button)`
|
const StyledButtonModalSuccess = styled(Button)`
|
||||||
position: relative;
|
position: relative;
|
@ -0,0 +1,37 @@
|
|||||||
|
/**
|
||||||
|
*
|
||||||
|
* ButtonModalSecondary
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
import React, { memo } from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import { FormattedMessage } from 'react-intl';
|
||||||
|
|
||||||
|
import ButtonSecondary from './StyledButtonSecondary';
|
||||||
|
import ButtonSuccess from './StyledButtonSuccess';
|
||||||
|
|
||||||
|
function ButtonModal({ message, onClick, type, isSecondary }) {
|
||||||
|
const Component = isSecondary ? ButtonSecondary : ButtonSuccess;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Component onClick={onClick} type={type}>
|
||||||
|
<FormattedMessage id={message} />
|
||||||
|
</Component>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
ButtonModal.defaultProps = {
|
||||||
|
isSecondary: false,
|
||||||
|
type: 'button',
|
||||||
|
};
|
||||||
|
|
||||||
|
ButtonModal.propTypes = {
|
||||||
|
isSecondary: PropTypes.bool,
|
||||||
|
message: PropTypes.string.isRequired,
|
||||||
|
onClick: PropTypes.func.isRequired,
|
||||||
|
type: PropTypes.string,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default memo(ButtonModal);
|
||||||
|
export { ButtonModal };
|
@ -9,6 +9,7 @@ export { default as routerPropTypes } from './commonPropTypes/router';
|
|||||||
export { default as BackHeader } from './components/BackHeader';
|
export { default as BackHeader } from './components/BackHeader';
|
||||||
export { default as BlockerComponent } from './components/BlockerComponent';
|
export { default as BlockerComponent } from './components/BlockerComponent';
|
||||||
export { default as Button } from './components/Button';
|
export { default as Button } from './components/Button';
|
||||||
|
export { default as ButtonModal } from './components/ButtonModal';
|
||||||
export { default as ContainerFluid } from './components/ContainerFluid';
|
export { default as ContainerFluid } from './components/ContainerFluid';
|
||||||
export {
|
export {
|
||||||
default as EmptyAttributesBlock,
|
default as EmptyAttributesBlock,
|
||||||
|
@ -1,32 +0,0 @@
|
|||||||
/**
|
|
||||||
*
|
|
||||||
* ButtonModalSecondary
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
import React, { memo } from 'react';
|
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import { FormattedMessage } from 'react-intl';
|
|
||||||
|
|
||||||
import StyledButtonModalSecondary from './StyledButtonModalSecondary';
|
|
||||||
|
|
||||||
function ButtonModalSecondary({ message, onClick, type }) {
|
|
||||||
return (
|
|
||||||
<StyledButtonModalSecondary onClick={onClick} type={type}>
|
|
||||||
<FormattedMessage id={message} />
|
|
||||||
</StyledButtonModalSecondary>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
ButtonModalSecondary.defaultProps = {
|
|
||||||
type: 'button',
|
|
||||||
};
|
|
||||||
|
|
||||||
ButtonModalSecondary.propTypes = {
|
|
||||||
message: PropTypes.string.isRequired,
|
|
||||||
onClick: PropTypes.func.isRequired,
|
|
||||||
type: PropTypes.string,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default memo(ButtonModalSecondary);
|
|
||||||
export { ButtonModalSecondary };
|
|
@ -1,20 +0,0 @@
|
|||||||
.buttonModalSecondary {
|
|
||||||
font-family: Lato;
|
|
||||||
color: #f64d0a;
|
|
||||||
border: 0.1rem solid #f64d0a;
|
|
||||||
padding-left: 1.5rem;
|
|
||||||
padding-right: 1.5rem;
|
|
||||||
cursor: pointer;
|
|
||||||
background-color: transparent;
|
|
||||||
&:hover,
|
|
||||||
&:active {
|
|
||||||
color: #f64d0a;
|
|
||||||
background-color: white;
|
|
||||||
border: 0.1rem solid #f64d0a;
|
|
||||||
}
|
|
||||||
height: 3rem;
|
|
||||||
color: #f64d0a;
|
|
||||||
border: 0.1rem solid #f64d0a;
|
|
||||||
position: relative;
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
|
@ -1,15 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { shallow } from 'enzyme';
|
|
||||||
|
|
||||||
import { ButtonModalSecondary } from '../index';
|
|
||||||
|
|
||||||
describe('<ButtonModalSecondary />', () => {
|
|
||||||
it('should not crash', () => {
|
|
||||||
shallow(
|
|
||||||
<ButtonModalSecondary
|
|
||||||
onClick={jest.fn()}
|
|
||||||
message="app.utils.defaultMessage"
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
});
|
|
||||||
});
|
|
@ -1,33 +0,0 @@
|
|||||||
/**
|
|
||||||
*
|
|
||||||
* ButtonModalSecondary
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
import React, { memo } from 'react';
|
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import { FormattedMessage } from 'react-intl';
|
|
||||||
|
|
||||||
import StyledButtonModalSuccess from './StyledButtonModalSuccess';
|
|
||||||
|
|
||||||
function ButtonModalSuccess({ message, onClick, type }) {
|
|
||||||
return (
|
|
||||||
<StyledButtonModalSuccess onClick={onClick} type={type}>
|
|
||||||
<FormattedMessage id={message} />
|
|
||||||
</StyledButtonModalSuccess>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
ButtonModalSuccess.defaultProps = {
|
|
||||||
onClick: () => {},
|
|
||||||
type: 'button',
|
|
||||||
};
|
|
||||||
|
|
||||||
ButtonModalSuccess.propTypes = {
|
|
||||||
message: PropTypes.string.isRequired,
|
|
||||||
onClick: PropTypes.func,
|
|
||||||
type: PropTypes.string,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default memo(ButtonModalSuccess);
|
|
||||||
export { ButtonModalSuccess };
|
|
@ -1,10 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { shallow } from 'enzyme';
|
|
||||||
|
|
||||||
import { ButtonModalSuccess } from '../index';
|
|
||||||
|
|
||||||
describe('<ButtonModalSuccess />', () => {
|
|
||||||
it('should not crash', () => {
|
|
||||||
shallow(<ButtonModalSuccess onClick={jest.fn()} message="" />);
|
|
||||||
});
|
|
||||||
});
|
|
@ -9,14 +9,12 @@ import PropTypes from 'prop-types';
|
|||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
import { get, isEmpty } from 'lodash';
|
import { get, isEmpty } from 'lodash';
|
||||||
|
|
||||||
import { InputsIndex as Input } from 'strapi-helper-plugin';
|
import { ButtonModal, InputsIndex as Input } from 'strapi-helper-plugin';
|
||||||
|
|
||||||
import pluginId from '../../pluginId';
|
import pluginId from '../../pluginId';
|
||||||
|
|
||||||
import BodyModal from '../../components/BodyModal';
|
import BodyModal from '../../components/BodyModal';
|
||||||
import ButtonModalPrimary from '../../components/ButtonModalPrimary';
|
import ButtonModalPrimary from '../../components/ButtonModalPrimary';
|
||||||
import ButtonModalSecondary from '../../components/ButtonModalSecondary';
|
|
||||||
import ButtonModalSuccess from '../../components/ButtonModalSuccess';
|
|
||||||
import CustomCheckbox from '../../components/CustomCheckbox';
|
import CustomCheckbox from '../../components/CustomCheckbox';
|
||||||
import FooterModal from '../../components/FooterModal';
|
import FooterModal from '../../components/FooterModal';
|
||||||
import FormModal from '../../components/FormModal';
|
import FormModal from '../../components/FormModal';
|
||||||
@ -370,11 +368,12 @@ class AttributeForm extends React.Component {
|
|||||||
/>
|
/>
|
||||||
</section>
|
</section>
|
||||||
<section>
|
<section>
|
||||||
<ButtonModalSecondary
|
<ButtonModal
|
||||||
message={`${pluginId}.form.button.cancel`}
|
message={`${pluginId}.form.button.cancel`}
|
||||||
onClick={this.handleCancel}
|
onClick={this.handleCancel}
|
||||||
|
isSecondary
|
||||||
/>
|
/>
|
||||||
<ButtonModalSuccess
|
<ButtonModal
|
||||||
message={`${pluginId}.form.button.done`}
|
message={`${pluginId}.form.button.done`}
|
||||||
type="button"
|
type="button"
|
||||||
onClick={this.handleSubmit}
|
onClick={this.handleSubmit}
|
||||||
|
@ -9,13 +9,11 @@ import PropTypes from 'prop-types';
|
|||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
import { get, isEmpty, upperFirst } from 'lodash';
|
import { get, isEmpty, upperFirst } from 'lodash';
|
||||||
|
|
||||||
import { InputsIndex as Input } from 'strapi-helper-plugin';
|
import { ButtonModal, InputsIndex as Input } from 'strapi-helper-plugin';
|
||||||
|
|
||||||
import pluginId from '../../pluginId';
|
import pluginId from '../../pluginId';
|
||||||
|
|
||||||
import BodyModal from '../../components/BodyModal';
|
import BodyModal from '../../components/BodyModal';
|
||||||
import ButtonModalSecondary from '../../components/ButtonModalSecondary';
|
|
||||||
import ButtonModalSuccess from '../../components/ButtonModalSuccess';
|
|
||||||
import FooterModal from '../../components/FooterModal';
|
import FooterModal from '../../components/FooterModal';
|
||||||
import HeaderModal from '../../components/HeaderModal';
|
import HeaderModal from '../../components/HeaderModal';
|
||||||
import HeaderModalTitle from '../../components/HeaderModalTitle';
|
import HeaderModalTitle from '../../components/HeaderModalTitle';
|
||||||
@ -266,11 +264,12 @@ class ModelForm extends React.Component {
|
|||||||
<BodyModal>{currentForm.items.map(this.renderInput)}</BodyModal>
|
<BodyModal>{currentForm.items.map(this.renderInput)}</BodyModal>
|
||||||
<FooterModal>
|
<FooterModal>
|
||||||
<section>
|
<section>
|
||||||
<ButtonModalSecondary
|
<ButtonModal
|
||||||
|
isSecondary
|
||||||
message={`${pluginId}.form.button.cancel`}
|
message={`${pluginId}.form.button.cancel`}
|
||||||
onClick={this.handleCancel}
|
onClick={this.handleCancel}
|
||||||
/>
|
/>
|
||||||
<ButtonModalSuccess
|
<ButtonModal
|
||||||
message={`${pluginId}.form.button.done`}
|
message={`${pluginId}.form.button.done`}
|
||||||
type="submit"
|
type="submit"
|
||||||
/>
|
/>
|
||||||
|
@ -9,14 +9,12 @@ import PropTypes from 'prop-types';
|
|||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
import { get, isEmpty } from 'lodash';
|
import { get, isEmpty } from 'lodash';
|
||||||
|
|
||||||
import { InputsIndex as Input } from 'strapi-helper-plugin';
|
import { ButtonModal, InputsIndex as Input } from 'strapi-helper-plugin';
|
||||||
|
|
||||||
import pluginId from '../../pluginId';
|
import pluginId from '../../pluginId';
|
||||||
|
|
||||||
import BodyModal from '../../components/BodyModal';
|
import BodyModal from '../../components/BodyModal';
|
||||||
import ButtonModalPrimary from '../../components/ButtonModalPrimary';
|
import ButtonModalPrimary from '../../components/ButtonModalPrimary';
|
||||||
import ButtonModalSecondary from '../../components/ButtonModalSecondary';
|
|
||||||
import ButtonModalSuccess from '../../components/ButtonModalSuccess';
|
|
||||||
import FooterModal from '../../components/FooterModal';
|
import FooterModal from '../../components/FooterModal';
|
||||||
import FormModal from '../../components/FormModal';
|
import FormModal from '../../components/FormModal';
|
||||||
import HeaderModal from '../../components/HeaderModal';
|
import HeaderModal from '../../components/HeaderModal';
|
||||||
@ -337,11 +335,12 @@ class RelationForm extends React.Component {
|
|||||||
/>
|
/>
|
||||||
</section>
|
</section>
|
||||||
<section>
|
<section>
|
||||||
<ButtonModalSecondary
|
<ButtonModal
|
||||||
|
isSecondary
|
||||||
message={`${pluginId}.form.button.cancel`}
|
message={`${pluginId}.form.button.cancel`}
|
||||||
onClick={this.handleCancel}
|
onClick={this.handleCancel}
|
||||||
/>
|
/>
|
||||||
<ButtonModalSuccess
|
<ButtonModal
|
||||||
message={`${pluginId}.form.button.done`}
|
message={`${pluginId}.form.button.done`}
|
||||||
type="button"
|
type="button"
|
||||||
onClick={this.handleSubmit}
|
onClick={this.handleSubmit}
|
||||||
|
@ -9,14 +9,12 @@ import PropTypes from 'prop-types';
|
|||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
import { get, isEmpty } from 'lodash';
|
import { get, isEmpty } from 'lodash';
|
||||||
|
|
||||||
import { InputsIndex as Input } from 'strapi-helper-plugin';
|
import { ButtonModal, InputsIndex as Input } from 'strapi-helper-plugin';
|
||||||
|
|
||||||
import pluginId from '../../pluginId';
|
import pluginId from '../../pluginId';
|
||||||
|
|
||||||
import BodyModal from '../../components/BodyModal';
|
import BodyModal from '../../components/BodyModal';
|
||||||
import ButtonModalPrimary from '../../components/ButtonModalPrimary';
|
import ButtonModalPrimary from '../../components/ButtonModalPrimary';
|
||||||
import ButtonModalSecondary from '../../components/ButtonModalSecondary';
|
|
||||||
import ButtonModalSuccess from '../../components/ButtonModalSuccess';
|
|
||||||
import FooterModal from '../../components/FooterModal';
|
import FooterModal from '../../components/FooterModal';
|
||||||
import FormModal from '../../components/FormModal';
|
import FormModal from '../../components/FormModal';
|
||||||
import HeaderModal from '../../components/HeaderModal';
|
import HeaderModal from '../../components/HeaderModal';
|
||||||
@ -347,11 +345,12 @@ class RelationFormGroup extends React.Component {
|
|||||||
/>
|
/>
|
||||||
</section>
|
</section>
|
||||||
<section>
|
<section>
|
||||||
<ButtonModalSecondary
|
<ButtonModal
|
||||||
|
isSecondary
|
||||||
message={`${pluginId}.form.button.cancel`}
|
message={`${pluginId}.form.button.cancel`}
|
||||||
onClick={this.handleCancel}
|
onClick={this.handleCancel}
|
||||||
/>
|
/>
|
||||||
<ButtonModalSuccess
|
<ButtonModal
|
||||||
message={`${pluginId}.form.button.done`}
|
message={`${pluginId}.form.button.done`}
|
||||||
type="button"
|
type="button"
|
||||||
onClick={this.handleSubmit}
|
onClick={this.handleSubmit}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user