diff --git a/docs/src/js/blocks/HeadlineBlockExample.js b/docs/src/js/blocks/HeadlineBlockExample.js index 4f0bd8df94..f76073fdc6 100644 --- a/docs/src/js/blocks/HeadlineBlockExample.js +++ b/docs/src/js/blocks/HeadlineBlockExample.js @@ -1,5 +1,5 @@ import React from 'react'; -import { HeadlineBlock } from 'telus-thorium-enriched/blocks'; +import { Headline } from 'telus-thorium-enriched/blocks'; const HeadlineBlockExample = () => { const props = { @@ -8,7 +8,7 @@ const HeadlineBlockExample = () => { }; return ( - + ); }; diff --git a/docs/src/js/blocks/OverviewBlockExample.js b/docs/src/js/blocks/OverviewBlockExample.js index ab2c49bb21..58dc1366b5 100644 --- a/docs/src/js/blocks/OverviewBlockExample.js +++ b/docs/src/js/blocks/OverviewBlockExample.js @@ -1,5 +1,5 @@ import React from 'react'; -import { OverviewBlock } from 'telus-thorium-enriched/blocks'; +import { Overview } from 'telus-thorium-enriched/blocks'; const OverviewBlockExample = () => { const props = { @@ -18,7 +18,7 @@ const OverviewBlockExample = () => { }; return ( - + ); }; diff --git a/docs/src/js/blocks/TitledTextBlockExample.js b/docs/src/js/blocks/TitledTextBlockExample.js index 5899cd9ffd..5275b34ee8 100644 --- a/docs/src/js/blocks/TitledTextBlockExample.js +++ b/docs/src/js/blocks/TitledTextBlockExample.js @@ -1,5 +1,5 @@ import React from 'react'; -import { TitledTextBlock } from 'telus-thorium-enriched/blocks'; +import { TitledText } from 'telus-thorium-enriched/blocks'; const TitledTextBlockExample = () => { const props = { @@ -17,7 +17,7 @@ const TitledTextBlockExample = () => { }; return ( - + ); }; diff --git a/docs/src/js/blocks/VideoBlockExample.js b/docs/src/js/blocks/VideoBlockExample.js index 842dd68c9c..767c387271 100644 --- a/docs/src/js/blocks/VideoBlockExample.js +++ b/docs/src/js/blocks/VideoBlockExample.js @@ -1,5 +1,5 @@ import React from 'react'; -import { VideoBlock } from 'telus-thorium-enriched/blocks'; +import { Video } from 'telus-thorium-enriched/blocks'; const VideoBlockExample = () => { const props = { @@ -9,7 +9,7 @@ const VideoBlockExample = () => { }; return ( - + `; diff --git a/enriched/src/blocks/HeadlineBlock/wave_header_default.png b/enriched/src/blocks/Headline/wave_header_default.png similarity index 100% rename from enriched/src/blocks/HeadlineBlock/wave_header_default.png rename to enriched/src/blocks/Headline/wave_header_default.png diff --git a/enriched/src/blocks/OverviewBlock/index.jsx b/enriched/src/blocks/Overview/Overview.jsx similarity index 90% rename from enriched/src/blocks/OverviewBlock/index.jsx rename to enriched/src/blocks/Overview/Overview.jsx index 5cf7a2fd28..5c6736a26f 100644 --- a/enriched/src/blocks/OverviewBlock/index.jsx +++ b/enriched/src/blocks/Overview/Overview.jsx @@ -4,7 +4,7 @@ import cx from 'classnames'; import CheckList from '../components/CheckList'; import TextTitleBodyButton from '../components/TextTitleBodyButton'; -const OverviewBlock = (props) => { +const Overview = (props) => { const { className, ctaLink, overviewTitle, overviewDescription, sideContent } = props; const cls = cx(className); const bodyContent = { @@ -26,7 +26,7 @@ const OverviewBlock = (props) => { ); }; -OverviewBlock.propTypes = { +Overview.propTypes = { className: PropTypes.string, overviewTitle: PropTypes.string, overviewDescription: PropTypes.string, @@ -34,7 +34,7 @@ OverviewBlock.propTypes = { sideContent: PropTypes.object }; -OverviewBlock.defaultProps = { +Overview.defaultProps = { className: '', overviewTitle: '', overviewDescription: '', @@ -49,4 +49,4 @@ OverviewBlock.defaultProps = { } }; -export default OverviewBlock; +export default Overview; diff --git a/enriched/src/blocks/Overview/__tests__/Overview.spec.jsx b/enriched/src/blocks/Overview/__tests__/Overview.spec.jsx new file mode 100644 index 0000000000..96e6a82174 --- /dev/null +++ b/enriched/src/blocks/Overview/__tests__/Overview.spec.jsx @@ -0,0 +1,38 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import Overview from '../Overview'; + +describe('', () => { + const props = { + className: 'class', + overviewTitle: 'title', + overviewDescription: 'description', + ctaLink: { + target: 'target', + href: 'href', + text: 'text' + }, + sideContent: { + listTitle: 'title', + listItems: ['one', 'two'] + } + }; + + const overview = shallow(); + + it('sets the classes from the className prop', () => { + expect(overview.hasClass('class')).toBeTruthy(); + }); + + it('renders a textTitleBodyButton Component', () => { + expect(overview.find('TextTitleBodyButton')).toBeDefined(); + expect(overview.find('TextTitleBodyButton').props().caption).toBe('title'); + expect(overview.find('TextTitleBodyButton').props().description).toEqual('description'); + }); + + it('renders a checklist Component', () => { + expect(overview.find('CheckList')).toBeDefined(); + expect(overview.find('CheckList').props().listTitle).toBe('title'); + expect(overview.find('CheckList').props().listItems).toEqual(['one', 'two']); + }); +}); diff --git a/enriched/src/blocks/OverviewBlock/__tests__/OverviewBlock.spec.jsx b/enriched/src/blocks/OverviewBlock/__tests__/OverviewBlock.spec.jsx deleted file mode 100644 index fccf5ee463..0000000000 --- a/enriched/src/blocks/OverviewBlock/__tests__/OverviewBlock.spec.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; -import { shallow } from 'enzyme'; -import OverviewBlock from '../'; - -describe('', () => { - const props = { - className: 'class', - overviewTitle: 'title', - overviewDescription: 'description', - ctaLink: { - target: 'target', - href: 'href', - text: 'text' - }, - sideContent: { - listTitle: 'title', - listItems: ['one', 'two'] - } - }; - - const overviewBlock = shallow(); - - it('sets the classes from the className prop', () => { - expect(overviewBlock.hasClass('class')).toBeTruthy(); - }); - - it('renders a textTitleBodyButton Component', () => { - expect(overviewBlock.find('TextTitleBodyButton')).toBeDefined(); - expect(overviewBlock.find('TextTitleBodyButton').props().caption).toBe('title'); - expect(overviewBlock.find('TextTitleBodyButton').props().description).toEqual('description'); - }); - - it('renders a checklist Component', () => { - expect(overviewBlock.find('CheckList')).toBeDefined(); - expect(overviewBlock.find('CheckList').props().listTitle).toBe('title'); - expect(overviewBlock.find('CheckList').props().listItems).toEqual(['one', 'two']); - }); -}); diff --git a/enriched/src/blocks/TitledTextBlock/index.jsx b/enriched/src/blocks/TitledText/TitledText.jsx similarity index 83% rename from enriched/src/blocks/TitledTextBlock/index.jsx rename to enriched/src/blocks/TitledText/TitledText.jsx index 984b336047..cbcf1e5bd7 100644 --- a/enriched/src/blocks/TitledTextBlock/index.jsx +++ b/enriched/src/blocks/TitledText/TitledText.jsx @@ -1,11 +1,9 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -if (process.env.BROWSER) { - require('./titledTextBlock.scss'); -} +import './TitledText.scss'; -class TitledTextBlock extends Component { +class TitledText extends Component { render() { const { title, content, titleHeadingClass } = this.props; @@ -32,7 +30,7 @@ class TitledTextBlock extends Component { } } -TitledTextBlock.propTypes = { +TitledText.propTypes = { title: PropTypes.string.isRequired, content: PropTypes.arrayOf(PropTypes.shape({ title: PropTypes.string.isRequired, @@ -41,8 +39,8 @@ TitledTextBlock.propTypes = { titleHeadingClass: PropTypes.string }; -TitledTextBlock.defaultProps = { +TitledText.defaultProps = { titleHeadingClass: 'heading-1' }; -export default TitledTextBlock; +export default TitledText; diff --git a/enriched/src/blocks/TitledTextBlock/titledTextBlock.scss b/enriched/src/blocks/TitledText/TitledText.scss similarity index 100% rename from enriched/src/blocks/TitledTextBlock/titledTextBlock.scss rename to enriched/src/blocks/TitledText/TitledText.scss diff --git a/enriched/src/blocks/TitledTextBlock/__tests__/titledTextBlock.spec.jsx b/enriched/src/blocks/TitledText/__tests__/TitledText.spec.jsx similarity index 73% rename from enriched/src/blocks/TitledTextBlock/__tests__/titledTextBlock.spec.jsx rename to enriched/src/blocks/TitledText/__tests__/TitledText.spec.jsx index 77000c01a7..3fbbcc723f 100644 --- a/enriched/src/blocks/TitledTextBlock/__tests__/titledTextBlock.spec.jsx +++ b/enriched/src/blocks/TitledText/__tests__/TitledText.spec.jsx @@ -1,9 +1,9 @@ import React from 'react'; import { mount } from 'enzyme'; import { mountToJson } from 'enzyme-to-json'; -import TitledTextBlock from '../'; +import TitledText from '../TitledText'; -describe('TextBlock Component', () => { +describe('TitledText', () => { const data = { title: 'Title1', content: [ @@ -12,26 +12,26 @@ describe('TextBlock Component', () => { }; it('matches snapshot', () => { - const wrapper = mount(); + const wrapper = mount(); expect(mountToJson(wrapper)).toMatchSnapshot(); }); it('should render title with default class', () => { - const wrapper = mount(); + const wrapper = mount(); const elem = wrapper.find('h1').first(); expect(elem.text()).toEqual('Title1'); expect(elem.hasClass('heading-1')).toBeTruthy(); }); it('should render title with specified class', () => { - const wrapper = mount(); + const wrapper = mount(); const elem = wrapper.find('h1').first(); expect(elem.text()).toEqual('Title1'); expect(elem.hasClass('heading-2')).toBeTruthy(); }); it('should render content', () => { - const wrapper = mount(); + const wrapper = mount(); expect(wrapper.find('h2').first().text()).toEqual('Small Title 1'); expect(wrapper.find('p').first().text()).toEqual('Small Text1'); }); diff --git a/enriched/src/blocks/TitledTextBlock/__tests__/__snapshots__/titledTextBlock.spec.jsx.snap b/enriched/src/blocks/TitledText/__tests__/__snapshots__/TitledText.spec.jsx.snap similarity index 90% rename from enriched/src/blocks/TitledTextBlock/__tests__/__snapshots__/titledTextBlock.spec.jsx.snap rename to enriched/src/blocks/TitledText/__tests__/__snapshots__/TitledText.spec.jsx.snap index 2c2cc63533..0b710160c3 100644 --- a/enriched/src/blocks/TitledTextBlock/__tests__/__snapshots__/titledTextBlock.spec.jsx.snap +++ b/enriched/src/blocks/TitledText/__tests__/__snapshots__/TitledText.spec.jsx.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`TextBlock Component matches snapshot 1`] = ` - - + `; diff --git a/enriched/src/blocks/VideoBlock/index.jsx b/enriched/src/blocks/Video/Video.jsx similarity index 82% rename from enriched/src/blocks/VideoBlock/index.jsx rename to enriched/src/blocks/Video/Video.jsx index 523fd24ef6..759c89b991 100644 --- a/enriched/src/blocks/VideoBlock/index.jsx +++ b/enriched/src/blocks/Video/Video.jsx @@ -1,11 +1,9 @@ import React from 'react'; import PropTypes from 'prop-types'; -if (process.env.BROWSER) { - require('./video-block.scss'); -} +import './Video.scss'; -const VideoBlock = (props) => { +const Video = (props) => { const { caption, subtext, videoUrl } = props; return ( @@ -27,16 +25,16 @@ const VideoBlock = (props) => { ); }; -VideoBlock.propTypes = { +Video.propTypes = { caption: PropTypes.string, subtext: PropTypes.string, videoUrl: PropTypes.string }; -VideoBlock.defaultProps = { +Video.defaultProps = { subtext: '', caption: '', videoUrl: '' }; -export default VideoBlock; +export default Video; diff --git a/enriched/src/blocks/VideoBlock/video-block.scss b/enriched/src/blocks/Video/Video.scss similarity index 100% rename from enriched/src/blocks/VideoBlock/video-block.scss rename to enriched/src/blocks/Video/Video.scss diff --git a/enriched/src/blocks/VideoBlock/__tests__/videoBlock.spec.jsx b/enriched/src/blocks/Video/__tests__/Video.spec.jsx similarity index 71% rename from enriched/src/blocks/VideoBlock/__tests__/videoBlock.spec.jsx rename to enriched/src/blocks/Video/__tests__/Video.spec.jsx index 674281b780..c83c8e0166 100644 --- a/enriched/src/blocks/VideoBlock/__tests__/videoBlock.spec.jsx +++ b/enriched/src/blocks/Video/__tests__/Video.spec.jsx @@ -1,34 +1,34 @@ import React from 'react'; import { mount } from 'enzyme'; import { mountToJson } from 'enzyme-to-json'; -import VideoBlock from '../'; +import Video from '../Video'; -describe('VideoBlock', () => { +describe('Video', () => { const data = { caption: 'Foo', subtext: 'Bar', videoUrl: 'https://www.youtube.com/embed/MaCZN2N6Q_I?cc_load_policy=1' }; it('matches snapshot', () => { - const wrapper = mount(); + const wrapper = mount(