fix JS error on announcement banner when no license is set (#1679)

app/components/announcement_banner/__snapshots__/announcement_banner.test.js.snap

@@ -14,7 +14,7 @@ ShallowWrapper {
     bannerColor="#ddd"
     bannerDismissed={false}
     bannerEnabled={true}
-    bannerText="Batter Text"
+    bannerText="Banner Text"
     bannerTextColor="#fff"
   />,
   Symbol(enzyme.__renderer__): Object {
@@ -58,7 +58,7 @@ ShallowWrapper {
             ]
           }
         >
-          Batter Text
+          Banner Text
         </Text>
         <Icon
           allowFontScaling={false}
@@ -107,7 +107,7 @@ ShallowWrapper {
               ]
             }
           >
-            Batter Text
+            Banner Text
           </Text>,
           <Icon
             allowFontScaling={false}
@@ -132,7 +132,7 @@ ShallowWrapper {
           "props": Object {
             "accessible": true,
             "allowFontScaling": true,
-            "children": "Batter Text",
+            "children": "Banner Text",
             "ellipsizeMode": "tail",
             "numberOfLines": 1,
             "style": Array [
@@ -147,7 +147,7 @@ ShallowWrapper {
             ],
           },
           "ref": null,
-          "rendered": "Batter Text",
+          "rendered": "Banner Text",
           "type": [Function],
         },
         Object {
@@ -204,7 +204,7 @@ ShallowWrapper {
               ]
             }
           >
-            Batter Text
+            Banner Text
           </Text>
           <Icon
             allowFontScaling={false}
@@ -253,7 +253,7 @@ ShallowWrapper {
                 ]
               }
             >
-              Batter Text
+              Banner Text
             </Text>,
             <Icon
               allowFontScaling={false}
@@ -278,7 +278,7 @@ ShallowWrapper {
             "props": Object {
               "accessible": true,
               "allowFontScaling": true,
-              "children": "Batter Text",
+              "children": "Banner Text",
               "ellipsizeMode": "tail",
               "numberOfLines": 1,
               "style": Array [
@@ -293,7 +293,7 @@ ShallowWrapper {
               ],
             },
             "ref": null,
-            "rendered": "Batter Text",
+            "rendered": "Banner Text",
             "type": [Function],
           },
           Object {
@@ -325,3 +325,41 @@ ShallowWrapper {
   },
 }
 `;
+
+exports[`AnnouncementBanner should match snapshot 2`] = `
+ShallowWrapper {
+  "length": 1,
+  Symbol(enzyme.__root__): [Circular],
+  Symbol(enzyme.__unrendered__): <AnnouncementBanner
+    actions={
+      Object {
+        "dismissBanner": [MockFunction],
+      }
+    }
+    allowDismissal={true}
+    bannerColor="#ddd"
+    bannerDismissed={false}
+    bannerEnabled={false}
+    bannerText="Banner Text"
+    bannerTextColor="#fff"
+  />,
+  Symbol(enzyme.__renderer__): Object {
+    "batchedUpdates": [Function],
+    "getNode": [Function],
+    "render": [Function],
+    "simulateEvent": [Function],
+    "unmount": [Function],
+  },
+  Symbol(enzyme.__node__): null,
+  Symbol(enzyme.__nodes__): Array [
+    null,
+  ],
+  Symbol(enzyme.__options__): Object {
+    "adapter": ReactSixteenAdapter {
+      "options": Object {
+        "enableComponentDidUpdateOnSetState": true,
+      },
+    },
+  },
+}
+`;

app/components/announcement_banner/announcement_banner.js

@@ -45,7 +45,8 @@ export default class AnnouncementBanner extends PureComponent {
     componentWillReceiveProps(nextProps) {
         if (this.props.bannerText !== nextProps.bannerText ||
             this.props.bannerEnabled !== nextProps.bannerEnabled ||
-            this.props.bannerDismissed !== nextProps.bannerDismissed) {
+            this.props.bannerDismissed !== nextProps.bannerDismissed
+        ) {
             const showBanner = nextProps.bannerEnabled && !nextProps.bannerDismissed && Boolean(nextProps.bannerText);
             this.toggleBanner(showBanner);
         }
@@ -86,15 +87,24 @@ export default class AnnouncementBanner extends PureComponent {
     };
 
     render() {
+        if (!this.props.bannerEnabled) {
+            return null;
+        }
+
         const {bannerHeight} = this.state;
+        const {
+            bannerColor,
+            bannerText,
+            bannerTextColor,
+        } = this.props;
 
         const bannerStyle = {
-            backgroundColor: this.props.bannerColor,
+            backgroundColor: bannerColor,
             height: bannerHeight,
         };
 
         const bannerTextStyle = {
-            color: this.props.bannerTextColor,
+            color: bannerTextColor,
         };
 
         return (
@@ -110,10 +120,10 @@ export default class AnnouncementBanner extends PureComponent {
                         numberOfLines={1}
                         style={[style.bannerText, bannerTextStyle]}
                     >
-                        {this.props.bannerText}
+                        {bannerText}
                     </Text>
                     <MaterialIcons
-                        color={this.props.bannerTextColor}
+                        color={bannerTextColor}
                         name='info'
                         size={16}
                     />

app/components/announcement_banner/announcement_banner.test.js

@@ -19,7 +19,7 @@ describe('AnnouncementBanner', () => {
         bannerColor: '#ddd',
         bannerDismissed: false,
         bannerEnabled: true,
-        bannerText: 'Batter Text',
+        bannerText: 'Banner Text',
         bannerTextColor: '#fff',
     };
 
@@ -29,6 +29,9 @@ describe('AnnouncementBanner', () => {
         );
 
         expect(wrapper).toMatchSnapshot();
+
+        wrapper.setProps({bannerEnabled: false});
+        expect(wrapper).toMatchSnapshot();
     });
 
     test('should call actions.dismissBanner on handleDismiss', () => {

app/components/announcement_banner/index.js

@@ -21,7 +21,7 @@ function mapStateToProps(state) {
         bannerDismissed: config.BannerText === announcement,
         bannerEnabled: config.EnableBanner === 'true' && license.IsLicensed === 'true',
         bannerText: config.BannerText,
-        bannerTextColor: config.BannerTextColor,
+        bannerTextColor: config.BannerTextColor || '#000',
     };
 }