diff --git a/packages/strapi-helper-plugin/lib/src/index.js b/packages/strapi-helper-plugin/lib/src/index.js index 0c7419a1bc..738395c2bf 100644 --- a/packages/strapi-helper-plugin/lib/src/index.js +++ b/packages/strapi-helper-plugin/lib/src/index.js @@ -1,3 +1,7 @@ +// // Assets +export { default as colors } from './assets/styles/colors'; +export { default as sizes } from './assets/styles/sizes'; + // // CommonPropTypes export { default as routerPropTypes } from './commonPropTypes/router'; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/assets/styles/colors.js b/packages/strapi-plugin-content-type-builder/admin/src/assets/styles/colors.js deleted file mode 100644 index d7ef0d3b1b..0000000000 --- a/packages/strapi-plugin-content-type-builder/admin/src/assets/styles/colors.js +++ /dev/null @@ -1,10 +0,0 @@ -const colors = { - beige: '#eff3f6', - black: '#3b3b3b', - brightGrey: '#f0f3f8', - green: '#27b70f', - greyOpacity: 'rgba(14, 22, 34, 0.02)', - lightGrey: '#fafafa', -}; - -export default colors; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/assets/styles/sizes.js b/packages/strapi-plugin-content-type-builder/admin/src/assets/styles/sizes.js deleted file mode 100644 index 5ab5207ce5..0000000000 --- a/packages/strapi-plugin-content-type-builder/admin/src/assets/styles/sizes.js +++ /dev/null @@ -1,13 +0,0 @@ -const sizes = { - header: { - height: '6rem', - }, - margin: 10, - modal: { - footer: { - height: '6rem', - }, - }, -}; - -export default sizes; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/index.js index e0c3474174..210bc83982 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/index.js @@ -7,21 +7,17 @@ import React from 'react'; import PropTypes from 'prop-types'; import { FormattedMessage } from 'react-intl'; -import { Button } from 'reactstrap'; -import styles from './styles.scss'; +import StyledButtonModalPrimary from './StyledButtonModalPrimary'; function ButtonModalPrimary({ add, message, onClick, type }) { - /* istanbul ignore next */ - // Ignoring the style condition is intended... - const className = add - ? styles.buttonModalPrimaryAdd - : styles.buttonModalPrimary; + const icon = add ? : null; return ( - + ); } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/styles.scss b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/styles.scss deleted file mode 100644 index f74f0184f6..0000000000 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalPrimary/styles.scss +++ /dev/null @@ -1,32 +0,0 @@ -.buttonModalPrimary, -.buttonModalPrimaryAdd { - height: 3rem; - min-width: 11rem; - background: linear-gradient(315deg, #0097f6 0%, #005eea 100%); - padding: 0 15px; - -webkit-font-smoothing: antialiased; - cursor: pointer; - border-radius: 3px; - color: white; - border: none; - font-family: Lato; - font-weight: 600; - outline: 0; - &:hover, - &:active { - border: none; - background: linear-gradient(315deg, #0097f6 0%, #005eea 100%); - box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.15); - color: white; - } -} - -.buttonModalPrimaryAdd { - &:before { - content: '\F067'; - font-family: 'FontAwesome'; - font-weight: 600; - font-size: 1.3rem; - margin-right: 13px; - } -} diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/index.js index 5a1369b14d..e845816495 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/index.js @@ -1,25 +1,20 @@ /** -* -* ButtonModalSecondary -* -*/ + * + * ButtonModalSecondary + * + */ import React from 'react'; import PropTypes from 'prop-types'; import { FormattedMessage } from 'react-intl'; -import { Button } from 'reactstrap'; -import styles from './styles.scss'; +import StyledButtonModalSecondary from './StyledButtonModalSecondary'; function ButtonModalSecondary({ message, onClick, type }) { return ( - + ); } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/tests/index.test.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/tests/index.test.js index 4f031a45c7..5ae4de683c 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/tests/index.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSecondary/tests/index.test.js @@ -5,6 +5,11 @@ import ButtonModalSecondary from '../index'; describe('', () => { it('should not crash', () => { - shallow(); + shallow( + + ); }); }); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSuccess/StyledButtonModalSuccess.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSuccess/StyledButtonModalSuccess.js index 2e3b003271..7a3b8861da 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSuccess/StyledButtonModalSuccess.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ButtonModalSuccess/StyledButtonModalSuccess.js @@ -2,7 +2,8 @@ import styled from 'styled-components'; import { Button } from 'reactstrap'; import img from '../../assets/icons/icon_check.png'; -import colors from '../../assets/styles/colors'; + +import { colors } from 'strapi-helper-plugin'; const StyledButtonModalSuccess = styled(Button)` position: relative; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/FooterModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/FooterModal/index.js index 99ce986dc5..557468d430 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/FooterModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/FooterModal/index.js @@ -6,8 +6,7 @@ import styled from 'styled-components'; -import colors from '../../assets/styles/colors'; -import sizes from '../../assets/styles/sizes'; +import { colors, sizes } from 'strapi-helper-plugin'; const FooterModal = styled.div` padding-top: ${sizes.margin * 0.9}px; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/HeaderModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/HeaderModal/index.js index 3e1e200b4c..851b0c6231 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/HeaderModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/HeaderModal/index.js @@ -6,8 +6,7 @@ import styled from 'styled-components'; -import colors from '../../assets/styles/colors'; -import sizes from '../../assets/styles/sizes'; +import { colors, sizes } from 'strapi-helper-plugin'; const HeaderModal = styled.div` color: ${colors.black}; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/tests/actions.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/tests/actions.test.js index cb2a956657..561b01ec30 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/App/tests/actions.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/App/tests/actions.test.js @@ -246,7 +246,7 @@ describe('Content Type Builder Action utils', () => { }); describe('BuildGroupAttributes', () => { - it('should generate an array of object with an object', () => { + it('should generate an array of attribute objects given an object', () => { const attributes = { name: { type: 'string', diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/StyledLeftMenu.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/StyledLeftMenu.js index c88954352b..247b6fa43a 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/StyledLeftMenu.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/StyledLeftMenu.js @@ -6,20 +6,12 @@ import styled from 'styled-components'; -import sizes from '../../assets/styles/sizes'; - -// Specific colors for left menu -const colors = { - black: '#2D3138', - grey: '#666B74', - mediumGrey: '#f2f3f4', - lightGrey: '#E9EAEB', -}; +import { colors, sizes } from 'strapi-helper-plugin'; const StyledLeftMenu = styled.div` width: 100%; min-height: calc(100vh - ${sizes.header.height}); - background-color: ${colors.mediumGrey}; + background-color: ${colors.leftMenu.mediumGrey}; padding-top: 0.5rem; padding-left: 2rem; padding-right: 2rem; @@ -79,7 +71,7 @@ const StyledLeftMenu = styled.div` display: block; text-decoration: none; p { - color: ${colors.black}; + color: ${colors.leftMenu.black}; } i { font-size: 11px; @@ -87,10 +79,10 @@ const StyledLeftMenu = styled.div` color: ${colors.grey}; } &.active { - background-color: ${colors.lightGrey}; + background-color: ${colors.leftMenu.lightGrey}; font-weight: 700; i { - color: ${colors.black}; + color: ${colors.leftMenu.black}; } } } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/tests/index.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/tests/index.test.js index 40c7cac51a..db1b5d8b77 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/tests/index.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/tests/index.test.js @@ -1,4 +1,5 @@ import React from 'react'; +import { shallow } from 'enzyme'; import formatMessagesWithPluginId from 'testUtils/formatMessages'; import pluginTradsEn from '../../../translations/en.json'; import { BrowserRouter } from 'react-router-dom'; @@ -119,17 +120,25 @@ describe('CTB ', () => { it('Should not crash', () => { renderCompo(context); }); + describe(' lifecycle', () => { + let topCompo; + afterEach(() => { + topCompo.unmount(); + }); - describe('CTB render', () => { - it('should render 5 links in the menu', () => { - const wrapper = renderComponent(); - const links = wrapper.find(LeftMenuLink); + describe('Render links', () => { + it('should render 5 links in the menu', () => { + topCompo = renderComponent(); + const links = topCompo.find(LeftMenuLink); - expect(links).toHaveLength(5); + expect(links).toHaveLength(5); + }); }); }); - it('should return a plural string for the user', () => { - expect(getSectionTitle('model', [])).toContain('singular'); + describe('Retrieve section title', () => { + it('should return a plural string for the user', () => { + expect(getSectionTitle('model', [])).toContain('singular'); + }); }); }); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/StyledViewContainer.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/StyledViewContainer.js index 53f8e9eaad..b894d61efe 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/StyledViewContainer.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/StyledViewContainer.js @@ -6,8 +6,7 @@ import styled from 'styled-components'; -import colors from '../../assets/styles/colors'; -import sizes from '../../assets/styles/sizes'; +import { colors, sizes } from 'strapi-helper-plugin'; const StyledViewContainer = styled.div` min-height: calc(100vh - ${sizes.header.height}); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/tests/index.test.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/tests/index.test.js index edbf2b0cb0..8903e6b3ef 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/tests/index.test.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ViewContainer/tests/index.test.js @@ -10,7 +10,6 @@ const renderCompo = (props = {}) => { const defaultProps = { children: null, featureType: 'group', - handleClickIcon: jest.fn(), headerTitle: 'Ingredients', headerDescription: 'description', match: { @@ -18,6 +17,7 @@ const defaultProps = { groupName: 'ingredients', }, }, + onClickIcon: jest.fn(), pluginHeaderActions: [], };