Merge pull request #208 from reapit/develop

Merge develop to master v0.5.24

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reapit/elements",
-  "version": "0.5.23",
+  "version": "0.5.24",
   "description": "A collection of React components and utilities for building apps for Reapit Marketplace",
   "main": "dist/index.js",
   "umd:main": "dist/elements.umd.production.js",

src/components/Info/__tests__/__snapshots__/index.tsx.snap

@@ -30,14 +30,14 @@ exports[`Info should match a snapshot for variant CLIENT_APPS_EMPTY 1`] = `
 
 exports[`Info should match a snapshot for variant DEVELOPER_APPS_EMPTY 1`] = `
 <Component
-  message="You currently have no apps listed. Go to the submit app page to submit an app. After submission, you will need to edit the app and set status to isListed to appear in the marketplace"
+  message="It looks like you haven’t submitted an App yet . When you’re ready, click on ‘Submit’ from the menu to get started."
   type="info"
 />
 `;
 
 exports[`Info should match a snapshot for variant INSTALLED_APPS_EMPTY 1`] = `
 <Component
-  message="You have no apps installed - try browsing the apps list for apps you might find useful"
+  message="It looks like you haven’t installed any Apps yet. Have a look at what’s available by clicking ‘Browse’ from the menu."
   type="info"
 />
 `;

src/components/Info/__tests__/index.tsx

@@ -2,6 +2,8 @@ import * as React from 'react'
 import { shallow } from 'enzyme'
 import toJson from 'enzyme-to-json'
 import { Info, InfoType } from '..'
+import { infoText } from '../index'
+import Alert from '../../Alert'
 
 const variants: InfoType[] = [
   '404',
@@ -18,4 +20,13 @@ describe('Info', () => {
       expect(toJson(shallow(<Info infoType={variant} />))).toMatchSnapshot()
     })
   })
+
+  variants.forEach(variant => {
+    it(`should have message \"${infoText(variant)}\" when info type is \"${variant}\"`, () => {
+      const alert = shallow(<Info infoType={variant} />)
+        .find(Alert)
+        .dive()
+      expect(alert.text()).toBe(infoText(variant))
+    })
+  })
 })

src/components/Info/index.tsx

@@ -13,16 +13,16 @@ export interface InfoProps {
   infoType: InfoType
 }
 
-const infoText = (infoType: InfoType) => {
+export const infoText = (infoType: InfoType) => {
   switch (infoType) {
     case '404':
       return 'Page not found'
     case 'CLIENT_APPS_EMPTY':
       return 'We are sorry, there are no apps listed compatible with your account'
     case 'INSTALLED_APPS_EMPTY':
-      return 'You have no apps installed - try browsing the apps list for apps you might find useful'
+      return 'It looks like you haven’t installed any Apps yet. Have a look at what’s available by clicking ‘Browse’ from the menu.'
     case 'DEVELOPER_APPS_EMPTY':
-      return 'You currently have no apps listed. Go to the submit app page to submit an app. After submission, you will need to edit the app and set status to isListed to appear in the marketplace'
+      return 'It looks like you haven’t submitted an App yet . When you’re ready, click on ‘Submit’ from the menu to get started.'
     case 'ADMIN_APPROVALS_EMPTY':
       return 'There are no updates that require approval'
     default:

src/components/Info/info.stories.tsx

@@ -5,3 +5,4 @@ import { Info } from './index'
 storiesOf('Info', module)
   .add('404', () => <Info infoType="404" />)
   .add('NoAppsInstalled', () => <Info infoType="INSTALLED_APPS_EMPTY" />)
+  .add('DeveloperAppsEmpty', () => <Info infoType="DEVELOPER_APPS_EMPTY" />)

src/components/ToastMessage/__tests__/__snapshots__/index.tsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`ToastMessage should match a snapshot 1`] = `
+exports[`ToastMessage should match a snapshot when pass different props 1`] = `
 <div
   className="toast visible"
   data-test="toast-wrapper"
@@ -15,3 +15,19 @@ exports[`ToastMessage should match a snapshot 1`] = `
   </Component>
 </div>
 `;
+
+exports[`ToastMessage should match a snapshot with default baseProps 1`] = `
+<div
+  className="toast "
+  data-test="toast-wrapper"
+  onClick={[MockFunction]}
+>
+  <Component
+    fullWidth={true}
+    type="reset"
+    variant="primary"
+  >
+    Toast message
+  </Component>
+</div>
+`;

src/components/ToastMessage/__tests__/index.tsx

@@ -3,20 +3,28 @@ import { shallow } from 'enzyme'
 import toJson from 'enzyme-to-json'
 import { ToastMessage, ToastMessageProps, ToastVariant } from '..'
 
-const defaultProps: ToastMessageProps = {
-  visible: true,
+const baseProps: ToastMessageProps = {
   message: 'Toast message',
   variant: 'primary',
   onCloseToast: jest.fn()
 }
+const defaultProps: ToastMessageProps = {
+  ...baseProps,
+  visible: true,
+  displayDuration: 5000
+}
 
 describe('ToastMessage', () => {
-  it('should match a snapshot', () => {
+  it('should match a snapshot with default baseProps', () => {
+    expect(toJson(shallow(<ToastMessage {...baseProps} />))).toMatchSnapshot()
+  })
+
+  it('should match a snapshot when pass different props', () => {
     expect(toJson(shallow(<ToastMessage {...defaultProps} />))).toMatchSnapshot()
   })
 
   it('should dismiss toast when click', () => {
-    shallow(<ToastMessage {...defaultProps} />)
+    shallow(<ToastMessage {...defaultProps} visible={true} />)
       .find('[data-test="toast-wrapper"]')
       .first()
       .simulate('click')

src/components/ToastMessage/index.tsx

@@ -4,15 +4,22 @@ import { Button } from '../Button'
 export type ToastVariant = 'primary' | 'secondary' | 'danger' | 'info'
 
 export interface ToastMessageProps {
-  visible: boolean
+  visible?: boolean
+  displayDuration?: number
   message: string
   variant: ToastVariant
   onCloseToast: () => void
 }
 
-export const ToastMessage: React.FC<ToastMessageProps> = ({ visible = false, message, onCloseToast, variant }) => {
+export const ToastMessage: React.FC<ToastMessageProps> = ({
+  visible = false,
+  displayDuration = 3000,
+  message,
+  onCloseToast,
+  variant
+}) => {
   if (visible) {
-    setTimeout(onCloseToast, 3000)
+    setTimeout(onCloseToast, displayDuration)
   }
 
   return (

yarn.lock

@@ -6375,9 +6375,9 @@ [email protected], gzip-size@^5.0.0:
     pify "^4.0.1"
 
 handlebars@^4.1.2:
-  version "4.4.3"
-  resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.4.3.tgz#180bae52c1d0e9ec0c15d7e82a4362d662762f6e"
-  integrity sha512-B0W4A2U1ww3q7VVthTKfh+epHx+q4mCt6iK+zEAzbMBpWQAwxCeKxEGpj/1oQTpzPXDNSOG7hmG14TsISH50yw==
+  version "4.5.3"
+  resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.5.3.tgz#5cf75bd8714f7605713511a56be7c349becb0482"
+  integrity sha512-3yPecJoJHK/4c6aZhSvxOyG4vJKDshV36VHp0iVCDVh7o9w2vwi3NSnL2MMPj3YdduqaBcu7cGbggJQM0br9xA==
   dependencies:
     neo-async "^2.6.0"
     optimist "^0.6.1"