From 5ebb44a5f422358e5b22d45a7ce7113ffcb22e93 Mon Sep 17 00:00:00 2001
From: michele <michele@gumgum.com>
Date: Tue, 28 Aug 2018 22:06:19 -0700
Subject: [PATCH] 32- allow logo on login page to be optional

---
 GITWORKFLOW.md                                |  8 +++----
 _stories/molecules/LoginForm/README.md        |  7 ++++---
 _stories/molecules/LoginForm/index.js         |  1 +
 .../__snapshots__/LoginForm.test.js.snap      |  1 +
 components/molecules/LoginForm.jsx            | 21 +++++++++++++++----
 package.json                                  |  1 +
 6 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/GITWORKFLOW.md b/GITWORKFLOW.md
index 0ffa89a..f6d9316 100644
--- a/GITWORKFLOW.md
+++ b/GITWORKFLOW.md
@@ -35,7 +35,7 @@ git commit -m "#12 Add red button component" # creates a commit with the message
 ##### Creating Feature Branches
 
 ```
-git checkout stage
+git checkout develop
 git pull
 git flow feature start #ISSUE_ID-DESCRIBE-THE-BRANCH
 
@@ -64,7 +64,7 @@ git flow feature rebase -i
 # Important - force your changes because you are rewriting all of the hashes
 git push origin feature/YOUR-BRANCH --force
 
-# if your branch is ready to merge, use git flow feature finish to merge it back to stage. this puts you on stage and then you can push your changes
+# if your branch is ready to merge, use git flow feature finish to merge it back to develop. this puts you on develop and then you can push your changes
 git flow feature finish YOUR-BRANCH
 git push
 ```
@@ -76,14 +76,14 @@ Your PR will be merged by a user with merge access after it gets approved by at
 ```
 git checkout master
 git pull
-git checkout stage
+git checkout develop
 git pull
 git flow release start '1.x.x'
 npm version  TAG #use the appropriate tag for your release (major, minor, patch)
 
 git flow release finish 1.x.x # when prompted, tag should be the release version
 git push --tags
-git push origin stage
+git push origin develop
 git push origin master
 ```
 
diff --git a/_stories/molecules/LoginForm/README.md b/_stories/molecules/LoginForm/README.md
index 4856a88..1a5d338 100644
--- a/_stories/molecules/LoginForm/README.md
+++ b/_stories/molecules/LoginForm/README.md
@@ -1,9 +1,9 @@
 **NOTE:** The minimum DS version required for this component to render properly is: **1.3.5**
 
-The `<LoginForm>`, as the name implies, renders a formthat can be customized to look like any of [these prototypes](http://ds.gumgum.com/stable/#gds-account-modal).
-This component can display the Product logo (underneath GumGum's logo), a Cap with text above the form fields and a link for password recovery. The form inputs and submit buttons must be provided.
+The `<LoginForm>`, as the name implies, renders a form that can be customized to look like any of [these prototypes](http://ds.gumgum.com/stable/#gds-account-modal).
+This component can display the Product name (underneath GumGum's logo), a Cap with text above the form fields and a link for password recovery. If you do not want to show GumGum's logo, you can pass the prop `hideLogo`. The form inputs and submit buttons must be provided.
 
-All of its atoms (except GumGum's logo) are optional.
+All of its atoms are optional.
 
 Form values can be accessed on submission with the `onSubmit` callback.
 
@@ -13,6 +13,7 @@ prop name   | description
 ------------|------------
 capText         | Text to display in the cap between the logo and form.
 logoText        | Product name, shown right below GumGum's logo
+hideLogo        | Boolean indicating whether or not you would like to hide GumGum's logo
 onSubmit        | (Required) function called on form submition
 recoveryFn      | Callback used to redirect to a password recovery page
 recoveryText    | Text to show for password recovery, defauts to "Forgot your password?"
diff --git a/_stories/molecules/LoginForm/index.js b/_stories/molecules/LoginForm/index.js
index c953cf7..780675d 100644
--- a/_stories/molecules/LoginForm/index.js
+++ b/_stories/molecules/LoginForm/index.js
@@ -14,6 +14,7 @@ const component = () => (
     <LoginForm
         capText={text('Cap Text', 'Welcome')}
         logoText={text('Logo Text', 'Storybook')}
+        hideLogo={boolean('Hide Logo', false)}
         onSubmit={action('Form Submit')}
         recoveryFn={action('Recovery Action')}
         recoveryText={text('Recovery Text', 'Forgot Password?')}>
diff --git a/_tests/molecules/__snapshots__/LoginForm.test.js.snap b/_tests/molecules/__snapshots__/LoginForm.test.js.snap
index 4d41106..6b0a812 100644
--- a/_tests/molecules/__snapshots__/LoginForm.test.js.snap
+++ b/_tests/molecules/__snapshots__/LoginForm.test.js.snap
@@ -3,6 +3,7 @@
 exports[`Expect <LoginForm> to render 1`] = `
 <LoginForm
   capText="Text"
+  hideLogo={false}
   logoText="Logo Text"
   onSubmit={[Function]}
   recoveryFn={[Function]}
diff --git a/components/molecules/LoginForm.jsx b/components/molecules/LoginForm.jsx
index 0e74173..c063d52 100644
--- a/components/molecules/LoginForm.jsx
+++ b/components/molecules/LoginForm.jsx
@@ -1,10 +1,21 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import cx from 'classnames';
 
 const wrapperStyle = { position: 'relative' };
 
-const LoginForm = ({ capText, children, logoText, onSubmit, recoveryFn, recoveryText }) => (
-    <div className="gds-account-modal gds-account-modal--logo" style={wrapperStyle}>
+const LoginForm = ({
+    capText,
+    children,
+    hideLogo,
+    logoText,
+    onSubmit,
+    recoveryFn,
+    recoveryText
+}) => (
+    <div
+        className={cx('gds-account-modal', { 'gds-account-modal--logo': !hideLogo })}
+        style={wrapperStyle}>
         <div className="gds-account-modal__form gds-card -p-t-3-sm -p-t-0">
             {logoText && <div className="gds-account-modal__logo-product">{logoText}</div>}
             {capText && (
@@ -29,7 +40,8 @@ LoginForm.displayName = 'LoginForm';
 LoginForm.defaultProps = {
     capText: '',
     logoText: '',
-    recoveryText: 'Forgot your password?'
+    recoveryText: 'Forgot your password?',
+    hideLogo: false
 };
 
 LoginForm.propTypes = {
@@ -38,7 +50,8 @@ LoginForm.propTypes = {
     logoText: PropTypes.string,
     onSubmit: PropTypes.func.isRequired,
     recoveryFn: PropTypes.func,
-    recoveryText: PropTypes.string
+    recoveryText: PropTypes.string,
+    hideLogo: PropTypes.bool
 };
 
 export default LoginForm;
diff --git a/package.json b/package.json
index 6a90dd5..f95f25e 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
         "prepare": "npm run build",
         "lint": "eslint ./components --color",
         "test": "NODE_ENV='test' jest",
+        "test:updateSnapshot": "NODE_ENV='test' jest --updateSnapshot",
         "test:watch": "NODE_ENV='test' jest --watch",
         "preclean": "rimraf node_modules",
         "clean": "yarn cache clean && yarn install",