From 70e7edf19e175cff4a4d69c859658769d6d8201d Mon Sep 17 00:00:00 2001
From: mbeche <mb.johnsonbece@gmail.com>
Date: Wed, 13 Nov 2019 18:13:14 -0600
Subject: [PATCH] refactor(bar-styling): remove glamorous div from header bars

Replaced styled components with style objects. Applied styles with css prop.

re #571
---
 src/atoms/header-bars/dsmJS/component-test.js      | 2 +-
 src/atoms/header-bars/dsmJS/component.js           | 7 +++----
 src/atoms/header-bars/location/component-test.js   | 2 +-
 src/atoms/header-bars/location/component.js        | 7 +++----
 src/atoms/header-bars/recurrence/component-test.js | 2 +-
 src/atoms/header-bars/recurrence/component.js      | 7 +++----
 src/atoms/header-bars/sponsor/component-test.js    | 2 +-
 src/atoms/header-bars/sponsor/component.js         | 7 +++----
 8 files changed, 16 insertions(+), 20 deletions(-)

diff --git a/src/atoms/header-bars/dsmJS/component-test.js b/src/atoms/header-bars/dsmJS/component-test.js
index 80c0ee1eb..d3ee27d48 100644
--- a/src/atoms/header-bars/dsmJS/component-test.js
+++ b/src/atoms/header-bars/dsmJS/component-test.js
@@ -7,6 +7,6 @@ suite('dsmJS bar', () => {
   test('that dsmJS is shown', () => {
     const wrapper = shallow(<DsmJsBar />);
 
-    assert.equal(wrapper.dive().text(), 'dsmJS');
+    assert.equal(wrapper.shallow().text(), 'dsmJS');
   });
 });
diff --git a/src/atoms/header-bars/dsmJS/component.js b/src/atoms/header-bars/dsmJS/component.js
index 68d11efb9..784164009 100644
--- a/src/atoms/header-bars/dsmJS/component.js
+++ b/src/atoms/header-bars/dsmJS/component.js
@@ -1,12 +1,11 @@
 import React from 'react';
-import glamorous from 'glamorous';
 import styles from '../styles';
 
-const DsmJsBarDiv = glamorous.div({
+const dsmJsBarStyles = {
   ...styles,
   background: '#56626B'
-});
+};
 
 export default function DsmJsBar() {
-  return <DsmJsBarDiv>dsmJS</DsmJsBarDiv>;
+  return <div css={dsmJsBarStyles}>dsmJS</div>;
 }
diff --git a/src/atoms/header-bars/location/component-test.js b/src/atoms/header-bars/location/component-test.js
index eef019ef7..90e071ebd 100644
--- a/src/atoms/header-bars/location/component-test.js
+++ b/src/atoms/header-bars/location/component-test.js
@@ -10,6 +10,6 @@ suite('location bar', () => {
 
     const wrapper = shallow(<LocationBar location={location} />);
 
-    assert.equal(wrapper.dive().text(), location);
+    assert.equal(wrapper.shallow().text(), location);
   });
 });
diff --git a/src/atoms/header-bars/location/component.js b/src/atoms/header-bars/location/component.js
index 28745911e..3703cb26c 100644
--- a/src/atoms/header-bars/location/component.js
+++ b/src/atoms/header-bars/location/component.js
@@ -1,15 +1,14 @@
 import React from 'react';
 import {string} from 'prop-types';
-import glamorous from 'glamorous';
 import styles from '../styles';
 
-const LocationBarDiv = glamorous.div({
+const locationBarStyles = {
   ...styles,
   background: '#F07C6C'
-});
+};
 
 export default function LocationBar({location}) {
-  return <LocationBarDiv>{location}</LocationBarDiv>;
+  return <div css={locationBarStyles}>{location}</div>;
 }
 
 LocationBar.propTypes = {location: string.isRequired};
diff --git a/src/atoms/header-bars/recurrence/component-test.js b/src/atoms/header-bars/recurrence/component-test.js
index 99effc065..f7091bc61 100644
--- a/src/atoms/header-bars/recurrence/component-test.js
+++ b/src/atoms/header-bars/recurrence/component-test.js
@@ -7,6 +7,6 @@ suite('Meeting Recurrence bar', () => {
   test('that the recurrence schedule is shown', () => {
     const wrapper = shallow(<RecurrenceBar />);
 
-    assert.equal(wrapper.dive().text(), 'Second Tuesday every month');
+    assert.equal(wrapper.shallow().text(), 'Second Tuesday every month');
   });
 });
diff --git a/src/atoms/header-bars/recurrence/component.js b/src/atoms/header-bars/recurrence/component.js
index 5e9244f01..205ea8de7 100644
--- a/src/atoms/header-bars/recurrence/component.js
+++ b/src/atoms/header-bars/recurrence/component.js
@@ -1,12 +1,11 @@
 import React from 'react';
-import glamorous from 'glamorous';
 import styles from '../styles';
 
-const RecurrenceBarDiv = glamorous.div({
+const recurrenceBarStyles = {
   ...styles,
   background: '#AD5472'
-});
+};
 
 export default function RecurrenceBar() {
-  return <RecurrenceBarDiv>Second Tuesday every month</RecurrenceBarDiv>;
+  return <div css={recurrenceBarStyles}>Second Tuesday every month</div>;
 }
diff --git a/src/atoms/header-bars/sponsor/component-test.js b/src/atoms/header-bars/sponsor/component-test.js
index 076c3cb4f..8ce927a10 100644
--- a/src/atoms/header-bars/sponsor/component-test.js
+++ b/src/atoms/header-bars/sponsor/component-test.js
@@ -10,6 +10,6 @@ suite('sponsor bar', () => {
 
     const wrapper = shallow(<SponsorBar sponsor={sponsor} />);
 
-    assert.equal(wrapper.dive().text(), sponsor);
+    assert.equal(wrapper.shallow().text(), sponsor);
   });
 });
diff --git a/src/atoms/header-bars/sponsor/component.js b/src/atoms/header-bars/sponsor/component.js
index a6e5c4f8d..71995ec21 100644
--- a/src/atoms/header-bars/sponsor/component.js
+++ b/src/atoms/header-bars/sponsor/component.js
@@ -1,15 +1,14 @@
 import React from 'react';
 import {string} from 'prop-types';
-import glamorous from 'glamorous';
 import styles from '../styles';
 
-const SponsorBarDiv = glamorous.div({
+const sponsorBarStyles = {
   ...styles,
   background: '#6C9380'
-});
+};
 
 export default function SponsorBar({sponsor}) {
-  return <SponsorBarDiv>{sponsor}</SponsorBarDiv>;
+  return <div css={sponsorBarStyles}>{sponsor}</div>;
 }
 
 SponsorBar.propTypes = {sponsor: string.isRequired};