From edb613a39ad2e987ad191fdd7c2b78c6a1aeb7c6 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 19 May 2020 15:59:26 +0530
Subject: [PATCH 01/62] add button core component

---
 .../src/components/core/ButtonComponent.js    | 43 +++++++++++++++++++
 1 file changed, 43 insertions(+)
 create mode 100644 react-frontend/src/components/core/ButtonComponent.js

diff --git a/react-frontend/src/components/core/ButtonComponent.js b/react-frontend/src/components/core/ButtonComponent.js
new file mode 100644
index 000000000..f894ab34e
--- /dev/null
+++ b/react-frontend/src/components/core/ButtonComponent.js
@@ -0,0 +1,43 @@
+import React from "react";
+import { Button } from "react-bootstrap";
+import PropTypes from "prop-types";
+
+const ButtonComponent = ({
+  className,
+  type,
+  onClick,
+  size,
+  text,
+  style,
+  icon,
+}) => (
+  <Button
+    className={className}
+    type={type}
+    onClick={onClick}
+    size={size}
+    style={style}
+  >
+    {icon}
+    {text}
+  </Button>
+);
+
+ButtonComponent.propTypes = {
+  className: PropTypes.string,
+  type: PropTypes.string.isRequired,
+  onClick: PropTypes.func.isRequired,
+  size: PropTypes.oneOf(["sm", "lg"]),
+  text: PropTypes.string.isRequired,
+  style: PropTypes.object,
+  icon: PropTypes.object,
+};
+
+ButtonComponent.defaultProps = {
+  type: "submit",
+  onClick: () => {
+    /* ToDo completing in future */
+  },
+};
+
+export default ButtonComponent;

From ac460fb6a535f5727c6b34b7a4fdd964e053eea8 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 19 May 2020 16:03:22 +0530
Subject: [PATCH 02/62] add button core component

---
 .../src/components/core/ButtonComponent.js    | 19 ++-----------------
 1 file changed, 2 insertions(+), 17 deletions(-)

diff --git a/react-frontend/src/components/core/ButtonComponent.js b/react-frontend/src/components/core/ButtonComponent.js
index f894ab34e..bd56fd2d2 100644
--- a/react-frontend/src/components/core/ButtonComponent.js
+++ b/react-frontend/src/components/core/ButtonComponent.js
@@ -2,22 +2,8 @@ import React from "react";
 import { Button } from "react-bootstrap";
 import PropTypes from "prop-types";
 
-const ButtonComponent = ({
-  className,
-  type,
-  onClick,
-  size,
-  text,
-  style,
-  icon,
-}) => (
-  <Button
-    className={className}
-    type={type}
-    onClick={onClick}
-    size={size}
-    style={style}
-  >
+const ButtonComponent = ({ className, type, onClick, size, text, icon }) => (
+  <Button className={className} type={type} onClick={onClick} size={size}>
     {icon}
     {text}
   </Button>
@@ -29,7 +15,6 @@ ButtonComponent.propTypes = {
   onClick: PropTypes.func.isRequired,
   size: PropTypes.oneOf(["sm", "lg"]),
   text: PropTypes.string.isRequired,
-  style: PropTypes.object,
   icon: PropTypes.object,
 };
 

From e4625633a58cec2b8fc9da77f6d998950f67a40e Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 19 May 2020 16:18:53 +0530
Subject: [PATCH 03/62] add Label core component

---
 .../src/components/core/LabelComponent.js          | 14 ++++++++++++++
 1 file changed, 14 insertions(+)
 create mode 100644 react-frontend/src/components/core/LabelComponent.js

diff --git a/react-frontend/src/components/core/LabelComponent.js b/react-frontend/src/components/core/LabelComponent.js
new file mode 100644
index 000000000..06dd42769
--- /dev/null
+++ b/react-frontend/src/components/core/LabelComponent.js
@@ -0,0 +1,14 @@
+import React from "react";
+import { Form } from "react-bootstrap";
+import PropTypes from "prop-types";
+
+const LabelComponent = ({ text, className }) => (
+  <Form.Label className={className}> {text} </Form.Label>
+);
+
+LabelComponent.propTypes = {
+  className: PropTypes.string,
+  text: PropTypes.string.isRequired,
+};
+
+export default LabelComponent;

From 7b1d6fede6057d1c7a41c54f7dfbe8ae9ad34795 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 19 May 2020 16:37:11 +0530
Subject: [PATCH 04/62] restructure of core component

---
 .../src/components/core/{ => Button}/ButtonComponent.js           | 0
 react-frontend/src/components/core/{ => Label}/LabelComponent.js  | 0
 2 files changed, 0 insertions(+), 0 deletions(-)
 rename react-frontend/src/components/core/{ => Button}/ButtonComponent.js (100%)
 rename react-frontend/src/components/core/{ => Label}/LabelComponent.js (100%)

diff --git a/react-frontend/src/components/core/ButtonComponent.js b/react-frontend/src/components/core/Button/ButtonComponent.js
similarity index 100%
rename from react-frontend/src/components/core/ButtonComponent.js
rename to react-frontend/src/components/core/Button/ButtonComponent.js
diff --git a/react-frontend/src/components/core/LabelComponent.js b/react-frontend/src/components/core/Label/LabelComponent.js
similarity index 100%
rename from react-frontend/src/components/core/LabelComponent.js
rename to react-frontend/src/components/core/Label/LabelComponent.js

From f72b8450e6cc429d710c4340ec1fd0ff589fad4e Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 19 May 2020 17:12:50 +0530
Subject: [PATCH 05/62] add test case files of button and core components

---
 .../src/components/core/Button/ButtonComponent.test.js | 10 ++++++++++
 .../src/components/core/Label/LabelComponent.test.js   | 10 ++++++++++
 2 files changed, 20 insertions(+)
 create mode 100644 react-frontend/src/components/core/Button/ButtonComponent.test.js
 create mode 100644 react-frontend/src/components/core/Label/LabelComponent.test.js

diff --git a/react-frontend/src/components/core/Button/ButtonComponent.test.js b/react-frontend/src/components/core/Button/ButtonComponent.test.js
new file mode 100644
index 000000000..23b415334
--- /dev/null
+++ b/react-frontend/src/components/core/Button/ButtonComponent.test.js
@@ -0,0 +1,10 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import ButtonComponent from "components/core/Button/ButtonComponent";
+
+it("ButtonComponent should equal to submit text", () => {
+  const { getByText } = render(
+    <ButtonComponent className="text-info" text="submit" type="submit" />
+  );
+  expect(getByText("submit")).toHaveTextContent("submit");
+});
diff --git a/react-frontend/src/components/core/Label/LabelComponent.test.js b/react-frontend/src/components/core/Label/LabelComponent.test.js
new file mode 100644
index 000000000..87d3bfc54
--- /dev/null
+++ b/react-frontend/src/components/core/Label/LabelComponent.test.js
@@ -0,0 +1,10 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import LabelComponent from "components/core/Label/LabelComponent";
+
+it("LabelComponent should equal to submit text", () => {
+  const { getByText } = render(
+    <LabelComponent className="text-info" text="submit" />
+  );
+  expect(getByText("submit")).toHaveTextContent("submit");
+});

From 0fca63ef71db544539b6d41d9541eac5be7ff2b1 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 19 May 2020 18:51:33 +0530
Subject: [PATCH 06/62] add video core component with test file

---
 .../core/Button/ButtonComponent.test.js       |  4 +--
 .../core/Label/LabelComponent.test.js         |  4 +--
 .../components/core/video/VideoComponent.js   | 29 +++++++++++++++++++
 .../core/video/VideoComponent.test.js         | 10 +++++++
 4 files changed, 41 insertions(+), 6 deletions(-)
 create mode 100644 react-frontend/src/components/core/video/VideoComponent.js
 create mode 100644 react-frontend/src/components/core/video/VideoComponent.test.js

diff --git a/react-frontend/src/components/core/Button/ButtonComponent.test.js b/react-frontend/src/components/core/Button/ButtonComponent.test.js
index 23b415334..05715b0f3 100644
--- a/react-frontend/src/components/core/Button/ButtonComponent.test.js
+++ b/react-frontend/src/components/core/Button/ButtonComponent.test.js
@@ -3,8 +3,6 @@ import { render } from "@testing-library/react";
 import ButtonComponent from "components/core/Button/ButtonComponent";
 
 it("ButtonComponent should equal to submit text", () => {
-  const { getByText } = render(
-    <ButtonComponent className="text-info" text="submit" type="submit" />
-  );
+  const { getByText } = render(<ButtonComponent text="submit" type="submit" />);
   expect(getByText("submit")).toHaveTextContent("submit");
 });
diff --git a/react-frontend/src/components/core/Label/LabelComponent.test.js b/react-frontend/src/components/core/Label/LabelComponent.test.js
index 87d3bfc54..029130849 100644
--- a/react-frontend/src/components/core/Label/LabelComponent.test.js
+++ b/react-frontend/src/components/core/Label/LabelComponent.test.js
@@ -3,8 +3,6 @@ import { render } from "@testing-library/react";
 import LabelComponent from "components/core/Label/LabelComponent";
 
 it("LabelComponent should equal to submit text", () => {
-  const { getByText } = render(
-    <LabelComponent className="text-info" text="submit" />
-  );
+  const { getByText } = render(<LabelComponent text="submit" />);
   expect(getByText("submit")).toHaveTextContent("submit");
 });
diff --git a/react-frontend/src/components/core/video/VideoComponent.js b/react-frontend/src/components/core/video/VideoComponent.js
new file mode 100644
index 000000000..0b498feec
--- /dev/null
+++ b/react-frontend/src/components/core/video/VideoComponent.js
@@ -0,0 +1,29 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+const VideoComponent = ({ className, src, controls, height, width, title }) => (
+  /*eslint-disable-next-line jsx-a11y/media-has-caption */
+  <video
+    title={title}
+    className={className}
+    src={src}
+    controls={controls}
+    height={height}
+    width={width}
+  />
+);
+
+VideoComponent.propTypes = {
+  title: PropTypes.string,
+  className: PropTypes.string,
+  src: PropTypes.string.isRequired,
+  controls: PropTypes.oneOf(["controls"]),
+  height: PropTypes.number,
+  width: PropTypes.number,
+};
+
+VideoComponent.defaultProps = {
+  controls: "controls",
+};
+
+export default VideoComponent;
diff --git a/react-frontend/src/components/core/video/VideoComponent.test.js b/react-frontend/src/components/core/video/VideoComponent.test.js
new file mode 100644
index 000000000..51a359b5f
--- /dev/null
+++ b/react-frontend/src/components/core/video/VideoComponent.test.js
@@ -0,0 +1,10 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import VideoComponent from "components/core/video/VideoComponent";
+
+it("VideoComponent should equal to Title", () => {
+  const { getByTitle } = render(
+    <VideoComponent src={require("login/video.mp4")} title="peerly video" />
+  );
+  expect(getByTitle("peerly video")).toBeInTheDocument();
+});

From 913d021ad89064e7e73a9198ffe4369155959223 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Wed, 20 May 2020 14:33:04 +0530
Subject: [PATCH 07/62] update directory structure in src

---
 .../core => core-components}/Button/ButtonComponent.js            | 0
 .../core => core-components}/Button/ButtonComponent.test.js       | 0
 .../{components/core => core-components}/Label/LabelComponent.js  | 0
 .../core => core-components}/Label/LabelComponent.test.js         | 0
 .../{components/core => core-components}/video/VideoComponent.js  | 0
 .../core => core-components}/video/VideoComponent.test.js         | 0
 6 files changed, 0 insertions(+), 0 deletions(-)
 rename react-frontend/src/{components/core => core-components}/Button/ButtonComponent.js (100%)
 rename react-frontend/src/{components/core => core-components}/Button/ButtonComponent.test.js (100%)
 rename react-frontend/src/{components/core => core-components}/Label/LabelComponent.js (100%)
 rename react-frontend/src/{components/core => core-components}/Label/LabelComponent.test.js (100%)
 rename react-frontend/src/{components/core => core-components}/video/VideoComponent.js (100%)
 rename react-frontend/src/{components/core => core-components}/video/VideoComponent.test.js (100%)

diff --git a/react-frontend/src/components/core/Button/ButtonComponent.js b/react-frontend/src/core-components/Button/ButtonComponent.js
similarity index 100%
rename from react-frontend/src/components/core/Button/ButtonComponent.js
rename to react-frontend/src/core-components/Button/ButtonComponent.js
diff --git a/react-frontend/src/components/core/Button/ButtonComponent.test.js b/react-frontend/src/core-components/Button/ButtonComponent.test.js
similarity index 100%
rename from react-frontend/src/components/core/Button/ButtonComponent.test.js
rename to react-frontend/src/core-components/Button/ButtonComponent.test.js
diff --git a/react-frontend/src/components/core/Label/LabelComponent.js b/react-frontend/src/core-components/Label/LabelComponent.js
similarity index 100%
rename from react-frontend/src/components/core/Label/LabelComponent.js
rename to react-frontend/src/core-components/Label/LabelComponent.js
diff --git a/react-frontend/src/components/core/Label/LabelComponent.test.js b/react-frontend/src/core-components/Label/LabelComponent.test.js
similarity index 100%
rename from react-frontend/src/components/core/Label/LabelComponent.test.js
rename to react-frontend/src/core-components/Label/LabelComponent.test.js
diff --git a/react-frontend/src/components/core/video/VideoComponent.js b/react-frontend/src/core-components/video/VideoComponent.js
similarity index 100%
rename from react-frontend/src/components/core/video/VideoComponent.js
rename to react-frontend/src/core-components/video/VideoComponent.js
diff --git a/react-frontend/src/components/core/video/VideoComponent.test.js b/react-frontend/src/core-components/video/VideoComponent.test.js
similarity index 100%
rename from react-frontend/src/components/core/video/VideoComponent.test.js
rename to react-frontend/src/core-components/video/VideoComponent.test.js

From dc35a9fea6f1ae1aa8abcdf7666d273cd71cb7de Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Wed, 20 May 2020 15:23:01 +0530
Subject: [PATCH 08/62] update the component path in core componet test files

---
 react-frontend/src/core-components/Label/LabelComponent.test.js | 2 +-
 react-frontend/src/core-components/video/VideoComponent.test.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/react-frontend/src/core-components/Label/LabelComponent.test.js b/react-frontend/src/core-components/Label/LabelComponent.test.js
index 029130849..3891cd662 100644
--- a/react-frontend/src/core-components/Label/LabelComponent.test.js
+++ b/react-frontend/src/core-components/Label/LabelComponent.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import LabelComponent from "components/core/Label/LabelComponent";
+import LabelComponent from "core-components/Label/LabelComponent";
 
 it("LabelComponent should equal to submit text", () => {
   const { getByText } = render(<LabelComponent text="submit" />);
diff --git a/react-frontend/src/core-components/video/VideoComponent.test.js b/react-frontend/src/core-components/video/VideoComponent.test.js
index 51a359b5f..19f100c6e 100644
--- a/react-frontend/src/core-components/video/VideoComponent.test.js
+++ b/react-frontend/src/core-components/video/VideoComponent.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import VideoComponent from "components/core/video/VideoComponent";
+import VideoComponent from "core-components/video/VideoComponent";
 
 it("VideoComponent should equal to Title", () => {
   const { getByTitle } = render(

From 80753778f0192aa9f973a57ea1f11e43226635c5 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Wed, 20 May 2020 16:06:41 +0530
Subject: [PATCH 09/62] update button core component path in ButtonComponent
 test file

---
 .../src/core-components/Button/ButtonComponent.test.js          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/react-frontend/src/core-components/Button/ButtonComponent.test.js b/react-frontend/src/core-components/Button/ButtonComponent.test.js
index 05715b0f3..e56699a30 100644
--- a/react-frontend/src/core-components/Button/ButtonComponent.test.js
+++ b/react-frontend/src/core-components/Button/ButtonComponent.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import ButtonComponent from "components/core/Button/ButtonComponent";
+import ButtonComponent from "core-components/Button/ButtonComponent";
 
 it("ButtonComponent should equal to submit text", () => {
   const { getByText } = render(<ButtonComponent text="submit" type="submit" />);

From 30e479a17db8b3b450a7bec480014c55b6faae77 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 25 May 2020 12:47:50 +0530
Subject: [PATCH 10/62] resolved comment's on PR and add core-component for Row
 Col

---
 .../core-components/Button/ButtonComponent.js | 28 ------------------
 .../core-components/button/ButtonComponent.js | 29 ++++++++++++++++++-
 .../button/ButtonComponent.js~HEAD            |  1 +
 .../ButtonComponent.test.js                   |  2 +-
 .../src/core-components/col/ColComponent.js   |  3 ++
 .../core-components/col/ColComponent.test.js  |  9 ++++++
 .../{Label => label}/LabelComponent.js        |  0
 .../{Label => label}/LabelComponent.test.js   |  2 +-
 .../src/core-components/row/RowComponent.js   |  3 ++
 .../core-components/row/RowComponent.test.js  | 10 +++++++
 10 files changed, 56 insertions(+), 31 deletions(-)
 delete mode 100644 react-frontend/src/core-components/Button/ButtonComponent.js
 create mode 100644 react-frontend/src/core-components/button/ButtonComponent.js~HEAD
 rename react-frontend/src/core-components/{Button => button}/ButtonComponent.test.js (81%)
 create mode 100644 react-frontend/src/core-components/col/ColComponent.js
 create mode 100644 react-frontend/src/core-components/col/ColComponent.test.js
 rename react-frontend/src/core-components/{Label => label}/LabelComponent.js (100%)
 rename react-frontend/src/core-components/{Label => label}/LabelComponent.test.js (80%)
 create mode 100644 react-frontend/src/core-components/row/RowComponent.js
 create mode 100644 react-frontend/src/core-components/row/RowComponent.test.js

diff --git a/react-frontend/src/core-components/Button/ButtonComponent.js b/react-frontend/src/core-components/Button/ButtonComponent.js
deleted file mode 100644
index bd56fd2d2..000000000
--- a/react-frontend/src/core-components/Button/ButtonComponent.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import React from "react";
-import { Button } from "react-bootstrap";
-import PropTypes from "prop-types";
-
-const ButtonComponent = ({ className, type, onClick, size, text, icon }) => (
-  <Button className={className} type={type} onClick={onClick} size={size}>
-    {icon}
-    {text}
-  </Button>
-);
-
-ButtonComponent.propTypes = {
-  className: PropTypes.string,
-  type: PropTypes.string.isRequired,
-  onClick: PropTypes.func.isRequired,
-  size: PropTypes.oneOf(["sm", "lg"]),
-  text: PropTypes.string.isRequired,
-  icon: PropTypes.object,
-};
-
-ButtonComponent.defaultProps = {
-  type: "submit",
-  onClick: () => {
-    /* ToDo completing in future */
-  },
-};
-
-export default ButtonComponent;
diff --git a/react-frontend/src/core-components/button/ButtonComponent.js b/react-frontend/src/core-components/button/ButtonComponent.js
index 2aa357f7b..cf8acf207 100644
--- a/react-frontend/src/core-components/button/ButtonComponent.js
+++ b/react-frontend/src/core-components/button/ButtonComponent.js
@@ -1 +1,28 @@
-export { Button } from "react-bootstrap";
+import React from "react";
+import { Button } from "react-bootstrap";
+import PropTypes from "prop-types";
+
+const ButtonComponent = ({ className, type, onClick, size, text, icon }) => (
+  <Button className={className} type={type} onClick={onClick} size={size}>
+    {icon}
+    {text}
+  </Button>
+);
+
+ButtonComponent.propTypes = {
+  className: PropTypes.string,
+  type: PropTypes.string.isRequired,
+  onClick: PropTypes.func.isRequired,
+  size: PropTypes.oneOf(["sm", "lg"]),
+  text: PropTypes.string,
+  icon: PropTypes.object,
+};
+
+ButtonComponent.defaultProps = {
+  type: "submit",
+  onClick: () => {
+    /* ToDo completing in future */
+  },
+};
+
+export default ButtonComponent;
diff --git a/react-frontend/src/core-components/button/ButtonComponent.js~HEAD b/react-frontend/src/core-components/button/ButtonComponent.js~HEAD
new file mode 100644
index 000000000..2aa357f7b
--- /dev/null
+++ b/react-frontend/src/core-components/button/ButtonComponent.js~HEAD
@@ -0,0 +1 @@
+export { Button } from "react-bootstrap";
diff --git a/react-frontend/src/core-components/Button/ButtonComponent.test.js b/react-frontend/src/core-components/button/ButtonComponent.test.js
similarity index 81%
rename from react-frontend/src/core-components/Button/ButtonComponent.test.js
rename to react-frontend/src/core-components/button/ButtonComponent.test.js
index e56699a30..c5f0be6ae 100644
--- a/react-frontend/src/core-components/Button/ButtonComponent.test.js
+++ b/react-frontend/src/core-components/button/ButtonComponent.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import ButtonComponent from "core-components/Button/ButtonComponent";
+import ButtonComponent from "core-components/button/ButtonComponent";
 
 it("ButtonComponent should equal to submit text", () => {
   const { getByText } = render(<ButtonComponent text="submit" type="submit" />);
diff --git a/react-frontend/src/core-components/col/ColComponent.js b/react-frontend/src/core-components/col/ColComponent.js
new file mode 100644
index 000000000..58c678a2f
--- /dev/null
+++ b/react-frontend/src/core-components/col/ColComponent.js
@@ -0,0 +1,3 @@
+import { Col } from "react-bootstrap";
+
+export default Col;
diff --git a/react-frontend/src/core-components/col/ColComponent.test.js b/react-frontend/src/core-components/col/ColComponent.test.js
new file mode 100644
index 000000000..254b13312
--- /dev/null
+++ b/react-frontend/src/core-components/col/ColComponent.test.js
@@ -0,0 +1,9 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import ColComponent from "core-components/col/ColComponent";
+
+it("ColComponent should equal to submit text", () => {
+  const { getByTitle } = render(<ColComponent title="my col" />);
+  const data = getByTitle("my col");
+  expect(data.title).toBe("my col");
+});
diff --git a/react-frontend/src/core-components/Label/LabelComponent.js b/react-frontend/src/core-components/label/LabelComponent.js
similarity index 100%
rename from react-frontend/src/core-components/Label/LabelComponent.js
rename to react-frontend/src/core-components/label/LabelComponent.js
diff --git a/react-frontend/src/core-components/Label/LabelComponent.test.js b/react-frontend/src/core-components/label/LabelComponent.test.js
similarity index 80%
rename from react-frontend/src/core-components/Label/LabelComponent.test.js
rename to react-frontend/src/core-components/label/LabelComponent.test.js
index 3891cd662..42f308b5e 100644
--- a/react-frontend/src/core-components/Label/LabelComponent.test.js
+++ b/react-frontend/src/core-components/label/LabelComponent.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import LabelComponent from "core-components/Label/LabelComponent";
+import LabelComponent from "core-components/label/LabelComponent";
 
 it("LabelComponent should equal to submit text", () => {
   const { getByText } = render(<LabelComponent text="submit" />);
diff --git a/react-frontend/src/core-components/row/RowComponent.js b/react-frontend/src/core-components/row/RowComponent.js
new file mode 100644
index 000000000..c8327da59
--- /dev/null
+++ b/react-frontend/src/core-components/row/RowComponent.js
@@ -0,0 +1,3 @@
+import { Row } from "react-bootstrap";
+
+export default Row;
diff --git a/react-frontend/src/core-components/row/RowComponent.test.js b/react-frontend/src/core-components/row/RowComponent.test.js
new file mode 100644
index 000000000..38a01e366
--- /dev/null
+++ b/react-frontend/src/core-components/row/RowComponent.test.js
@@ -0,0 +1,10 @@
+import React from "react";
+import { render } from "@testing-library/react";
+
+import RowComponent from "core-components/row/RowComponent";
+
+it("RowComponent should be render", () => {
+  const { getByTitle } = render(<RowComponent title="my row" />);
+  const data = getByTitle("my row");
+  expect(data.title).toBe("my row");
+});

From 3c58e4ccd5fd00b34b1744ba9251f8e16c9418dc Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 25 May 2020 12:56:36 +0530
Subject: [PATCH 11/62] separate import module and third party module using add
 empty line

---
 .../src/core-components/button/ButtonComponent.test.js           | 1 +
 react-frontend/src/core-components/col/ColComponent.test.js      | 1 +
 react-frontend/src/core-components/label/LabelComponent.test.js  | 1 +
 react-frontend/src/core-components/video/VideoComponent.test.js  | 1 +
 4 files changed, 4 insertions(+)

diff --git a/react-frontend/src/core-components/button/ButtonComponent.test.js b/react-frontend/src/core-components/button/ButtonComponent.test.js
index c5f0be6ae..11b7e3b3d 100644
--- a/react-frontend/src/core-components/button/ButtonComponent.test.js
+++ b/react-frontend/src/core-components/button/ButtonComponent.test.js
@@ -1,5 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
+
 import ButtonComponent from "core-components/button/ButtonComponent";
 
 it("ButtonComponent should equal to submit text", () => {
diff --git a/react-frontend/src/core-components/col/ColComponent.test.js b/react-frontend/src/core-components/col/ColComponent.test.js
index 254b13312..59ca87cf0 100644
--- a/react-frontend/src/core-components/col/ColComponent.test.js
+++ b/react-frontend/src/core-components/col/ColComponent.test.js
@@ -1,5 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
+
 import ColComponent from "core-components/col/ColComponent";
 
 it("ColComponent should equal to submit text", () => {
diff --git a/react-frontend/src/core-components/label/LabelComponent.test.js b/react-frontend/src/core-components/label/LabelComponent.test.js
index 42f308b5e..e6e51bb60 100644
--- a/react-frontend/src/core-components/label/LabelComponent.test.js
+++ b/react-frontend/src/core-components/label/LabelComponent.test.js
@@ -1,5 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
+
 import LabelComponent from "core-components/label/LabelComponent";
 
 it("LabelComponent should equal to submit text", () => {
diff --git a/react-frontend/src/core-components/video/VideoComponent.test.js b/react-frontend/src/core-components/video/VideoComponent.test.js
index 19f100c6e..87fb1cf55 100644
--- a/react-frontend/src/core-components/video/VideoComponent.test.js
+++ b/react-frontend/src/core-components/video/VideoComponent.test.js
@@ -1,5 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
+
 import VideoComponent from "core-components/video/VideoComponent";
 
 it("VideoComponent should equal to Title", () => {

From d05254d5e3f3833facaa5e3201c71d262ad47cf1 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 25 May 2020 21:06:08 +0530
Subject: [PATCH 12/62] change button core component and resolve comment on PR

---
 .../core-components/button/ButtonComponent.js | 27 +------------------
 .../button/ButtonComponent.test.js            |  4 +--
 2 files changed, 3 insertions(+), 28 deletions(-)

diff --git a/react-frontend/src/core-components/button/ButtonComponent.js b/react-frontend/src/core-components/button/ButtonComponent.js
index cf8acf207..f85f0df13 100644
--- a/react-frontend/src/core-components/button/ButtonComponent.js
+++ b/react-frontend/src/core-components/button/ButtonComponent.js
@@ -1,28 +1,3 @@
-import React from "react";
 import { Button } from "react-bootstrap";
-import PropTypes from "prop-types";
 
-const ButtonComponent = ({ className, type, onClick, size, text, icon }) => (
-  <Button className={className} type={type} onClick={onClick} size={size}>
-    {icon}
-    {text}
-  </Button>
-);
-
-ButtonComponent.propTypes = {
-  className: PropTypes.string,
-  type: PropTypes.string.isRequired,
-  onClick: PropTypes.func.isRequired,
-  size: PropTypes.oneOf(["sm", "lg"]),
-  text: PropTypes.string,
-  icon: PropTypes.object,
-};
-
-ButtonComponent.defaultProps = {
-  type: "submit",
-  onClick: () => {
-    /* ToDo completing in future */
-  },
-};
-
-export default ButtonComponent;
+export default Button;
diff --git a/react-frontend/src/core-components/button/ButtonComponent.test.js b/react-frontend/src/core-components/button/ButtonComponent.test.js
index 11b7e3b3d..94c1466f6 100644
--- a/react-frontend/src/core-components/button/ButtonComponent.test.js
+++ b/react-frontend/src/core-components/button/ButtonComponent.test.js
@@ -1,9 +1,9 @@
 import React from "react";
 import { render } from "@testing-library/react";
 
-import ButtonComponent from "core-components/button/ButtonComponent";
+import Button from "core-components/button/ButtonComponent";
 
 it("ButtonComponent should equal to submit text", () => {
-  const { getByText } = render(<ButtonComponent text="submit" type="submit" />);
+  const { getByText } = render(<Button type="submit">submit</Button>);
   expect(getByText("submit")).toHaveTextContent("submit");
 });

From 58d297483a63af5e87474e1fa3d3ce0affd71d81 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 26 May 2020 14:15:43 +0530
Subject: [PATCH 13/62] create a grid component for export Row Col core
 component instead of separate component and Delete Row Col separate
 components files

---
 react-frontend/src/core-components/col/ColComponent.js |  3 ---
 .../src/core-components/col/ColComponent.test.js       | 10 ----------
 .../src/core-components/grid/GridComponents.js         |  4 ++++
 react-frontend/src/core-components/row/RowComponent.js |  3 ---
 .../src/core-components/row/RowComponent.test.js       | 10 ----------
 5 files changed, 4 insertions(+), 26 deletions(-)
 delete mode 100644 react-frontend/src/core-components/col/ColComponent.js
 delete mode 100644 react-frontend/src/core-components/col/ColComponent.test.js
 create mode 100644 react-frontend/src/core-components/grid/GridComponents.js
 delete mode 100644 react-frontend/src/core-components/row/RowComponent.js
 delete mode 100644 react-frontend/src/core-components/row/RowComponent.test.js

diff --git a/react-frontend/src/core-components/col/ColComponent.js b/react-frontend/src/core-components/col/ColComponent.js
deleted file mode 100644
index 58c678a2f..000000000
--- a/react-frontend/src/core-components/col/ColComponent.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { Col } from "react-bootstrap";
-
-export default Col;
diff --git a/react-frontend/src/core-components/col/ColComponent.test.js b/react-frontend/src/core-components/col/ColComponent.test.js
deleted file mode 100644
index 59ca87cf0..000000000
--- a/react-frontend/src/core-components/col/ColComponent.test.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import ColComponent from "core-components/col/ColComponent";
-
-it("ColComponent should equal to submit text", () => {
-  const { getByTitle } = render(<ColComponent title="my col" />);
-  const data = getByTitle("my col");
-  expect(data.title).toBe("my col");
-});
diff --git a/react-frontend/src/core-components/grid/GridComponents.js b/react-frontend/src/core-components/grid/GridComponents.js
new file mode 100644
index 000000000..8a2fdf343
--- /dev/null
+++ b/react-frontend/src/core-components/grid/GridComponents.js
@@ -0,0 +1,4 @@
+import { Row, Col, Container } from "react-bootstrap";
+
+export default Container;
+export { Row, Col };
diff --git a/react-frontend/src/core-components/row/RowComponent.js b/react-frontend/src/core-components/row/RowComponent.js
deleted file mode 100644
index c8327da59..000000000
--- a/react-frontend/src/core-components/row/RowComponent.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { Row } from "react-bootstrap";
-
-export default Row;
diff --git a/react-frontend/src/core-components/row/RowComponent.test.js b/react-frontend/src/core-components/row/RowComponent.test.js
deleted file mode 100644
index 38a01e366..000000000
--- a/react-frontend/src/core-components/row/RowComponent.test.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import RowComponent from "core-components/row/RowComponent";
-
-it("RowComponent should be render", () => {
-  const { getByTitle } = render(<RowComponent title="my row" />);
-  const data = getByTitle("my row");
-  expect(data.title).toBe("my row");
-});

From 8b95d6252b2f995f5a7e5dbae62731f8b2e8aa8b Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Tue, 19 May 2020 19:52:00 +0530
Subject: [PATCH 14/62] addedshared component for peerly logo

---
 .../shared/peerly-logo/LogoComponent.js       | 30 +++++++++++++++++++
 .../shared/peerly-logo/LogoComponent.test.js  |  9 ++++++
 2 files changed, 39 insertions(+)
 create mode 100644 react-frontend/src/components/shared/peerly-logo/LogoComponent.js
 create mode 100644 react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js

diff --git a/react-frontend/src/components/shared/peerly-logo/LogoComponent.js b/react-frontend/src/components/shared/peerly-logo/LogoComponent.js
new file mode 100644
index 000000000..1fa32876d
--- /dev/null
+++ b/react-frontend/src/components/shared/peerly-logo/LogoComponent.js
@@ -0,0 +1,30 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+import LabelComponent from "components/core/Label/LabelComponent";
+
+const LogoComponent = ({
+  peerlyLogoClassName,
+  text,
+  plusIconClassName,
+  peerlyTextClassName,
+}) => (
+  <div data-testid="peerlyLogoComponent" className={peerlyLogoClassName}>
+    <div>
+      <LabelComponent text="+" className={plusIconClassName} />
+    </div>
+    <div>
+      <LabelComponent text={text} className={peerlyTextClassName} />
+    </div>
+  </div>
+);
+
+LogoComponent.propTypes = {
+  className: PropTypes.string,
+  text: PropTypes.string.isRequired,
+  peerlyTextClassName: PropTypes.string,
+  plusIconClassName: PropTypes.string,
+  peerlyLogoClassName: PropTypes.string,
+};
+
+export default LogoComponent;
diff --git a/react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js b/react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js
new file mode 100644
index 000000000..2803fab3d
--- /dev/null
+++ b/react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js
@@ -0,0 +1,9 @@
+import React from "react";
+import { render } from "@testing-library/react";
+
+import LogoComponent from "components/shared/peerly-logo/LogoComponent";
+
+it("should equal to + Peerly text", () => {
+  const { getByTestId } = render(<LogoComponent text="Peerly" />);
+  expect(getByTestId("peerlyLogoComponent")).toHaveTextContent("+ Peerly");
+});

From f01be9b257b17591a361d9df79ad955642b521c3 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Wed, 20 May 2020 15:47:33 +0530
Subject: [PATCH 15/62] added shared components

---
 .../peerly-Logo/LogoComponent.js              | 24 +++++++++++++++++++
 .../peerly-Logo/LogoComponent.test.js         |  9 +++++++
 2 files changed, 33 insertions(+)
 create mode 100644 react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
 create mode 100644 react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js

diff --git a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
new file mode 100644
index 000000000..56ec2d647
--- /dev/null
+++ b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
@@ -0,0 +1,24 @@
+import React from "react";
+
+import { Col, Row } from "react-bootstrap";
+
+import LabelComponent from "core-components/core/Label/LabelComponent";
+
+const LogoComponent = () => (
+  <Col data-testid="peerlyLogoComponent">
+    <Row>
+      <LabelComponent
+        text="+"
+        className="text-black font-weight-bold text-center w-100"
+      />
+    </Row>
+    <Row>
+      <LabelComponent
+        text="Peerly"
+        className="text-black font-weight-bold text-center w-100"
+      />
+    </Row>
+  </Col>
+);
+
+export default LogoComponent;
diff --git a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js
new file mode 100644
index 000000000..3e3793252
--- /dev/null
+++ b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js
@@ -0,0 +1,9 @@
+import React from "react";
+import { render } from "@testing-library/react";
+
+import LogoComponent from "shared-components/peerly-logo/LogoComponent";
+
+it("should equal to + Peerly text", () => {
+  const { getByTestId } = render(<LogoComponent text="Peerly" />);
+  expect(getByTestId("peerlyLogoComponent")).toHaveTextContent("+ Peerly");
+});

From 0a94aa4b3a656501d302aad4ad25e8061af611f4 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Wed, 20 May 2020 16:01:41 +0530
Subject: [PATCH 16/62] added file updations

---
 .../shared/peerly-logo/LogoComponent.js       | 30 -------------------
 .../shared/peerly-logo/LogoComponent.test.js  |  9 ------
 2 files changed, 39 deletions(-)
 delete mode 100644 react-frontend/src/components/shared/peerly-logo/LogoComponent.js
 delete mode 100644 react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js

diff --git a/react-frontend/src/components/shared/peerly-logo/LogoComponent.js b/react-frontend/src/components/shared/peerly-logo/LogoComponent.js
deleted file mode 100644
index 1fa32876d..000000000
--- a/react-frontend/src/components/shared/peerly-logo/LogoComponent.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-
-import LabelComponent from "components/core/Label/LabelComponent";
-
-const LogoComponent = ({
-  peerlyLogoClassName,
-  text,
-  plusIconClassName,
-  peerlyTextClassName,
-}) => (
-  <div data-testid="peerlyLogoComponent" className={peerlyLogoClassName}>
-    <div>
-      <LabelComponent text="+" className={plusIconClassName} />
-    </div>
-    <div>
-      <LabelComponent text={text} className={peerlyTextClassName} />
-    </div>
-  </div>
-);
-
-LogoComponent.propTypes = {
-  className: PropTypes.string,
-  text: PropTypes.string.isRequired,
-  peerlyTextClassName: PropTypes.string,
-  plusIconClassName: PropTypes.string,
-  peerlyLogoClassName: PropTypes.string,
-};
-
-export default LogoComponent;
diff --git a/react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js b/react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js
deleted file mode 100644
index 2803fab3d..000000000
--- a/react-frontend/src/components/shared/peerly-logo/LogoComponent.test.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import LogoComponent from "components/shared/peerly-logo/LogoComponent";
-
-it("should equal to + Peerly text", () => {
-  const { getByTestId } = render(<LogoComponent text="Peerly" />);
-  expect(getByTestId("peerlyLogoComponent")).toHaveTextContent("+ Peerly");
-});

From 71771f37621ff526e6e48213d0ad1fd9bc8bea23 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Wed, 20 May 2020 17:08:37 +0530
Subject: [PATCH 17/62] removed black text and implemented white

---
 .../src/shared-components/peerly-Logo/LogoComponent.js | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
index 56ec2d647..2cb662738 100644
--- a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
@@ -7,16 +7,10 @@ import LabelComponent from "core-components/core/Label/LabelComponent";
 const LogoComponent = () => (
   <Col data-testid="peerlyLogoComponent">
     <Row>
-      <LabelComponent
-        text="+"
-        className="text-black font-weight-bold text-center w-100"
-      />
+      <LabelComponent text="+" className="text-white text-center w-100" />
     </Row>
     <Row>
-      <LabelComponent
-        text="Peerly"
-        className="text-black font-weight-bold text-center w-100"
-      />
+      <LabelComponent text="Peerly" className="text-white text-center w-100" />
     </Row>
   </Col>
 );

From b202003c670822da05c0fcf7f38c94872d20d9f3 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Thu, 21 May 2020 14:22:38 +0530
Subject: [PATCH 18/62] followed directory structure

---
 .../peerly-logo/LogoComponent.js               | 18 ++++++++++++++++++
 .../peerly-logo/LogoComponent.test.js          |  9 +++++++++
 2 files changed, 27 insertions(+)
 create mode 100644 react-frontend/src/shared-components/peerly-logo/LogoComponent.js
 create mode 100644 react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js

diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
new file mode 100644
index 000000000..a5c4a5960
--- /dev/null
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -0,0 +1,18 @@
+import React from "react";
+
+import { Col, Row } from "react-bootstrap";
+
+import LabelComponent from "core-components/Label/LabelComponent";
+
+const LogoComponent = () => (
+  <Col data-testid="peerlyLogoComponent">
+    <Row>
+      <LabelComponent text="+" className="text-white text-center w-100" />
+    </Row>
+    <Row>
+      <LabelComponent text="Peerly" className="text-white text-center w-100" />
+    </Row>
+  </Col>
+);
+
+export default LogoComponent;
diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js
new file mode 100644
index 000000000..3e3793252
--- /dev/null
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js
@@ -0,0 +1,9 @@
+import React from "react";
+import { render } from "@testing-library/react";
+
+import LogoComponent from "shared-components/peerly-logo/LogoComponent";
+
+it("should equal to + Peerly text", () => {
+  const { getByTestId } = render(<LogoComponent text="Peerly" />);
+  expect(getByTestId("peerlyLogoComponent")).toHaveTextContent("+ Peerly");
+});

From bcc314e6551a150174b921c2300aec1eecbafdbf Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Thu, 21 May 2020 14:23:10 +0530
Subject: [PATCH 19/62] removed old directory structure

---
 .../peerly-Logo/LogoComponent.js               | 18 ------------------
 .../peerly-Logo/LogoComponent.test.js          |  9 ---------
 2 files changed, 27 deletions(-)
 delete mode 100644 react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
 delete mode 100644 react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js

diff --git a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
deleted file mode 100644
index 2cb662738..000000000
--- a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import React from "react";
-
-import { Col, Row } from "react-bootstrap";
-
-import LabelComponent from "core-components/core/Label/LabelComponent";
-
-const LogoComponent = () => (
-  <Col data-testid="peerlyLogoComponent">
-    <Row>
-      <LabelComponent text="+" className="text-white text-center w-100" />
-    </Row>
-    <Row>
-      <LabelComponent text="Peerly" className="text-white text-center w-100" />
-    </Row>
-  </Col>
-);
-
-export default LogoComponent;
diff --git a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js b/react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js
deleted file mode 100644
index 3e3793252..000000000
--- a/react-frontend/src/shared-components/peerly-Logo/LogoComponent.test.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import LogoComponent from "shared-components/peerly-logo/LogoComponent";
-
-it("should equal to + Peerly text", () => {
-  const { getByTestId } = render(<LogoComponent text="Peerly" />);
-  expect(getByTestId("peerlyLogoComponent")).toHaveTextContent("+ Peerly");
-});

From df3f4d5ab259d9487231c7816f93e176fae40de6 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Mon, 25 May 2020 07:21:14 +0530
Subject: [PATCH 20/62] updated Peerly logo component with logo

---
 .../peerly-logo/LogoComponent.js              | 52 ++++++++++++++++---
 1 file changed, 44 insertions(+), 8 deletions(-)

diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
index a5c4a5960..aa86d4050 100644
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -1,18 +1,54 @@
 import React from "react";
 
 import { Col, Row } from "react-bootstrap";
+import Styled from "styled-components";
 
 import LabelComponent from "core-components/Label/LabelComponent";
 
+const Logo = Styled.div`
+& {
+  width: 50px;
+  height: 50px;   
+  position: absolute;
+  top: 10px;
+  align-content: center;
+  transform: rotate(45deg);   
+}
+&: before {
+  content: "";
+  width: 30px;
+  height: 30px;
+  border: 2px solid #FFFFFF;            
+  position: absolute;
+  transform: translate(-50%,-50%);
+  top: 50%;
+  left: 50%;
+}  
+`;
+const PlusSign = Styled.div`
+  position: absolute;
+  top: 55%;
+  left: 55%;
+  transform: translate(-50%, -50%) rotate(-45deg)
+  color: #FFFFFF;
+`;
+
 const LogoComponent = () => (
-  <Col data-testid="peerlyLogoComponent">
-    <Row>
-      <LabelComponent text="+" className="text-white text-center w-100" />
-    </Row>
-    <Row>
-      <LabelComponent text="Peerly" className="text-white text-center w-100" />
-    </Row>
-  </Col>
+  <Row className="d-flex flex-column" data-testid="peerlyLogoComponent">
+    <Col className="d-flex justify-content-center">
+      <Logo>
+        <PlusSign>
+          <LabelComponent text="+" className="text-center w-100" />
+        </PlusSign>
+      </Logo>
+    </Col>
+    <Col>
+      <LabelComponent
+        text="Peerly"
+        className="text-white mt-5 pt-1 text-center w-100"
+      />
+    </Col>
+  </Row>
 );
 
 export default LogoComponent;

From 321b44e9b1e6602eb6a5eb68b7336a1300ede614 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Mon, 25 May 2020 13:06:18 +0530
Subject: [PATCH 21/62] updated file with style guides

---
 .../peerly-logo/LogoComponent.js              | 26 +++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
index aa86d4050..9e68bd8f9 100644
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -1,9 +1,10 @@
 import React from "react";
-
-import { Col, Row } from "react-bootstrap";
+//import { Col, Row } from "react-bootstrap";
 import Styled from "styled-components";
 
 import LabelComponent from "core-components/Label/LabelComponent";
+import Row from "core-components/row/rowComponent";
+import Col from "core-components/col/colComponents";
 
 const Logo = Styled.div`
 & {
@@ -11,14 +12,13 @@ const Logo = Styled.div`
   height: 50px;   
   position: absolute;
   top: 10px;
-  align-content: center;
-  transform: rotate(45deg);   
+  transform: rotate(45deg);
 }
 &: before {
   content: "";
-  width: 30px;
-  height: 30px;
-  border: 2px solid #FFFFFF;            
+  width: 20px;
+  height: 20px;
+  border: 2px solid black;              
   position: absolute;
   transform: translate(-50%,-50%);
   top: 50%;
@@ -26,11 +26,11 @@ const Logo = Styled.div`
 }  
 `;
 const PlusSign = Styled.div`
-  position: absolute;
-  top: 55%;
-  left: 55%;
-  transform: translate(-50%, -50%) rotate(-45deg)
-  color: #FFFFFF;
+position: absolute;
+top: 55%;
+left: 55%;
+transform: translate(-50%, -50%) rotate(-45deg);
+color: black;
 `;
 
 const LogoComponent = () => (
@@ -45,7 +45,7 @@ const LogoComponent = () => (
     <Col>
       <LabelComponent
         text="Peerly"
-        className="text-white mt-5 pt-1 text-center w-100"
+        className="text-black mt-5 pt-1 text-center w-100"
       />
     </Col>
   </Row>

From 917083e98ec8a1aa66ce0fb5ab4949dc5f0877b0 Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Mon, 25 May 2020 13:24:29 +0530
Subject: [PATCH 22/62] updated logo component by adding core component wrapper
 over it

---
 .../src/shared-components/peerly-logo/LogoComponent.js     | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
index 9e68bd8f9..cdd352e9f 100644
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -1,10 +1,9 @@
 import React from "react";
-//import { Col, Row } from "react-bootstrap";
 import Styled from "styled-components";
 
-import LabelComponent from "core-components/Label/LabelComponent";
-import Row from "core-components/row/rowComponent";
-import Col from "core-components/col/colComponents";
+import LabelComponent from "core-components/label/LabelComponent";
+import Row from "core-components/row/RowComponent";
+import Col from "core-components/col/ColComponent";
 
 const Logo = Styled.div`
 & {

From 8c04e91b4adaf4237a177cf6f71d5b658a00c20f Mon Sep 17 00:00:00 2001
From: onkar-josh <onkar.hasabe@joshsoftware.com>
Date: Mon, 25 May 2020 14:39:06 +0530
Subject: [PATCH 23/62] changed text colour

---
 .../src/shared-components/peerly-logo/LogoComponent.js      | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
index cdd352e9f..11651dbdd 100644
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -17,7 +17,7 @@ const Logo = Styled.div`
   content: "";
   width: 20px;
   height: 20px;
-  border: 2px solid black;              
+  border: 2px solid #FFFFFF;              
   position: absolute;
   transform: translate(-50%,-50%);
   top: 50%;
@@ -29,7 +29,7 @@ position: absolute;
 top: 55%;
 left: 55%;
 transform: translate(-50%, -50%) rotate(-45deg);
-color: black;
+color: #FFFFFF;
 `;
 
 const LogoComponent = () => (
@@ -44,7 +44,7 @@ const LogoComponent = () => (
     <Col>
       <LabelComponent
         text="Peerly"
-        className="text-black mt-5 pt-1 text-center w-100"
+        className="text-white mt-5 pt-1 text-center w-100"
       />
     </Col>
   </Row>

From 7e7d1a8f57089b5561d7c62ea997414f44d95567 Mon Sep 17 00:00:00 2001
From: Avinash Mane <avimanepatil@gmail.com>
Date: Tue, 19 May 2020 20:05:03 +0530
Subject: [PATCH 24/62] added shared component for login form

---
 .../loginTextComponent/LoginTextComponent.js  | 23 +++++++++++++++++++
 .../LoginTextComponent.test.js                | 16 +++++++++++++
 2 files changed, 39 insertions(+)
 create mode 100644 react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js
 create mode 100644 react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js

diff --git a/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js b/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js
new file mode 100644
index 000000000..9ec13f6e8
--- /dev/null
+++ b/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js
@@ -0,0 +1,23 @@
+import React from "react";
+import PropTypes from "prop-types";
+import LabelComponent from "components/core/Label/LabelComponent";
+
+const LoginTextComponent = ({
+  className,
+  orgPrimaryCoreValue,
+  encouragementThought,
+}) => (
+  <div className={className} data-testid="LoginTextComponent">
+    <LabelComponent text={orgPrimaryCoreValue} />
+    <hr className="w-25 bg-light" />
+    <LabelComponent text={encouragementThought} />
+  </div>
+);
+
+LoginTextComponent.propTypes = {
+  className: PropTypes.string,
+  orgPrimaryCoreValue: PropTypes.string.isRequired,
+  encouragementThought: PropTypes.string.isRequired,
+};
+
+export default LoginTextComponent;
diff --git a/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js b/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js
new file mode 100644
index 000000000..d8e2ae5ea
--- /dev/null
+++ b/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js
@@ -0,0 +1,16 @@
+import React from "react";
+import { render } from "@testing-library/react";
+
+import LoginTextComponent from "components/shared/loginTextComponent/LoginTextComponent";
+
+it("should equal to value", () => {
+  const { getByTestId } = render(
+    <LoginTextComponent
+      orgPrimaryCoreValue="core value"
+      encouragementThought="positive"
+    />
+  );
+  expect(getByTestId("LoginTextComponent")).toHaveTextContent(
+    "core value positive"
+  );
+});

From 94b9e602d647cf4e077dae005202551f469119d8 Mon Sep 17 00:00:00 2001
From: Avinash Mane <avimanepatil@gmail.com>
Date: Wed, 20 May 2020 15:29:23 +0530
Subject: [PATCH 25/62] added react-bootstrap component

---
 .../loginTextComponent/LoginTextComponent.js        | 13 ++++++++++---
 .../loginTextComponent/LoginTextComponent.test.js   |  4 ++--
 2 files changed, 12 insertions(+), 5 deletions(-)
 rename react-frontend/src/{components/shared => shared-components}/loginTextComponent/LoginTextComponent.js (58%)
 rename react-frontend/src/{components/shared => shared-components}/loginTextComponent/LoginTextComponent.test.js (78%)

diff --git a/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
similarity index 58%
rename from react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js
rename to react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
index 9ec13f6e8..58dca1759 100644
--- a/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.js
+++ b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
@@ -1,5 +1,6 @@
 import React from "react";
 import PropTypes from "prop-types";
+import { Col } from "react-bootstrap";
 import LabelComponent from "components/core/Label/LabelComponent";
 
 const LoginTextComponent = ({
@@ -7,13 +8,19 @@ const LoginTextComponent = ({
   orgPrimaryCoreValue,
   encouragementThought,
 }) => (
-  <div className={className} data-testid="LoginTextComponent">
-    <LabelComponent text={orgPrimaryCoreValue} />
+  <Col className={className} data-testid="LoginTextComponent">
+    <LabelComponent text={orgPrimaryCoreValue} className="font-weight-bold" />
     <hr className="w-25 bg-light" />
     <LabelComponent text={encouragementThought} />
-  </div>
+  </Col>
 );
 
+LoginTextComponent.defaultProps = {
+  orgPrimaryCoreValue: "Lets Create the Office Positive",
+  encouragementThought: "Encouragement Driven",
+  className: "text-white text-center bg-dark",
+};
+
 LoginTextComponent.propTypes = {
   className: PropTypes.string,
   orgPrimaryCoreValue: PropTypes.string.isRequired,
diff --git a/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
similarity index 78%
rename from react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js
rename to react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
index d8e2ae5ea..1b6b768b1 100644
--- a/react-frontend/src/components/shared/loginTextComponent/LoginTextComponent.test.js
+++ b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
@@ -6,11 +6,11 @@ import LoginTextComponent from "components/shared/loginTextComponent/LoginTextCo
 it("should equal to value", () => {
   const { getByTestId } = render(
     <LoginTextComponent
-      orgPrimaryCoreValue="core value"
+      orgPrimaryCoreValue="Lets Create the Office Positive"
       encouragementThought="positive"
     />
   );
   expect(getByTestId("LoginTextComponent")).toHaveTextContent(
-    "core value positive"
+    "Lets Create the Office Positive positive"
   );
 });

From 3a595f5353b49142f31c1f1f80f733605b3af024 Mon Sep 17 00:00:00 2001
From: Avinash Mane <avimanepatil@gmail.com>
Date: Wed, 20 May 2020 16:03:45 +0530
Subject: [PATCH 26/62] change directory structure

---
 .../shared-components/loginTextComponent/LoginTextComponent.js | 2 +-
 .../loginTextComponent/LoginTextComponent.test.js              | 3 +--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
index 58dca1759..c292e6b38 100644
--- a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
+++ b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
@@ -1,7 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 import { Col } from "react-bootstrap";
-import LabelComponent from "components/core/Label/LabelComponent";
+import LabelComponent from "core-components/Label/LabelComponent";
 
 const LoginTextComponent = ({
   className,
diff --git a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
index 1b6b768b1..2bd274102 100644
--- a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
+++ b/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
@@ -1,7 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-
-import LoginTextComponent from "components/shared/loginTextComponent/LoginTextComponent";
+import LoginTextComponent from "./LoginTextComponent";
 
 it("should equal to value", () => {
   const { getByTestId } = render(

From 7d5755bc561d37d29dce5c666798f3446fb2f05f Mon Sep 17 00:00:00 2001
From: Avinash Mane <avimanepatil@gmail.com>
Date: Thu, 21 May 2020 14:57:11 +0530
Subject: [PATCH 27/62] add styled in text component

---
 .../LoginTextComponent.js                          | 14 +++++++++++---
 .../LoginTextComponent.test.js                     |  0
 2 files changed, 11 insertions(+), 3 deletions(-)
 rename react-frontend/src/shared-components/{loginTextComponent => login-text-component}/LoginTextComponent.js (74%)
 rename react-frontend/src/shared-components/{loginTextComponent => login-text-component}/LoginTextComponent.test.js (100%)

diff --git a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
similarity index 74%
rename from react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
rename to react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
index c292e6b38..90933df6e 100644
--- a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.js
+++ b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
@@ -1,16 +1,24 @@
 import React from "react";
 import PropTypes from "prop-types";
 import { Col } from "react-bootstrap";
+import styled from "styled-components";
 import LabelComponent from "core-components/Label/LabelComponent";
 
+const HrLine = styled.hr`
+  width: 10%;
+  background: white;
+`;
 const LoginTextComponent = ({
   className,
   orgPrimaryCoreValue,
   encouragementThought,
 }) => (
   <Col className={className} data-testid="LoginTextComponent">
-    <LabelComponent text={orgPrimaryCoreValue} className="font-weight-bold" />
-    <hr className="w-25 bg-light" />
+    <LabelComponent
+      text={orgPrimaryCoreValue}
+      className="font-weight-bold h3 mx-4"
+    />
+    <HrLine />
     <LabelComponent text={encouragementThought} />
   </Col>
 );
@@ -18,7 +26,7 @@ const LoginTextComponent = ({
 LoginTextComponent.defaultProps = {
   orgPrimaryCoreValue: "Lets Create the Office Positive",
   encouragementThought: "Encouragement Driven",
-  className: "text-white text-center bg-dark",
+  className: "text-white text-center ",
 };
 
 LoginTextComponent.propTypes = {
diff --git a/react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
similarity index 100%
rename from react-frontend/src/shared-components/loginTextComponent/LoginTextComponent.test.js
rename to react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js

From 40f9895f55484174abed723c9cc031d27c1f985e Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Wed, 20 May 2020 18:20:27 +0530
Subject: [PATCH 28/62] add login form panel component with logo and button

---
 .../login/LoginPanel.js                       | 48 +++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js

diff --git a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
new file mode 100644
index 000000000..b415b0871
--- /dev/null
+++ b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
@@ -0,0 +1,48 @@
+import React from "react";
+import { Row } from "react-bootstrap";
+import PropTypes from "prop-types";
+import { AiOutlineMail } from "react-icons/ai";
+import Styled from "styled-components";
+
+import LogoComponent from "shared-components/peerly-Logo/LogoComponent";
+import ButtonComponent from "core-components/Button/ButtonComponent";
+import LoginTextComponent from "shared-components/loginTextComponent/LoginTextComponent";
+
+const StyledDiv = Styled.div`
+background: #334856
+`;
+
+const FirstRow = Styled(Row)`
+font: Helvetica Neue,Regular 
+`;
+const ButtonComponent2 = Styled(ButtonComponent)`
+height: 40px
+`;
+
+const LoginPanel = ({ buttonText }) => (
+  <StyledDiv className="h-100">
+    <FirstRow className="h1 text-white">
+      <LogoComponent />
+    </FirstRow>
+    <Row className="justify-content-center h-50">
+      <ButtonComponent2
+        className="btn-light "
+        icon={<AiOutlineMail height={15} width={2} />}
+        text={buttonText}
+      />
+    </Row>
+    <Row className="">
+      <LoginTextComponent className="text-white text-center" />
+    </Row>
+  </StyledDiv>
+);
+
+LoginPanel.propTypes = {
+  buttonText: PropTypes.string,
+};
+
+LoginPanel.defaultProps = {
+  buttonText: "Sign in with Google",
+};
+
+export default LoginPanel;

From 7465180616dae6fed9f13e187a322b190168b522 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Wed, 20 May 2020 19:18:49 +0530
Subject: [PATCH 29/62] add LoginTextComponent and create component mobile
 responsive

---
 .../login/LoginPanel.js                       | 34 +++++++++++--------
 1 file changed, 20 insertions(+), 14 deletions(-)

diff --git a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
index b415b0871..a6ff29cdb 100644
--- a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
+++ b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
@@ -8,33 +8,39 @@ import LogoComponent from "shared-components/peerly-Logo/LogoComponent";
 import ButtonComponent from "core-components/Button/ButtonComponent";
 import LoginTextComponent from "shared-components/loginTextComponent/LoginTextComponent";
 
-const StyledDiv = Styled.div`
-background: #334856
+const Div = Styled.div`
+background: #334856;
+height: auto
 `;
 
 const FirstRow = Styled(Row)`
-font: Helvetica Neue,Regular 
+font: Helvetica Neue,Regular;
+height: auto
 `;
-const ButtonComponent2 = Styled(ButtonComponent)`
-height: 40px
+const SignInButtonComponent = Styled(ButtonComponent)`
+border-radius: 25px;
+
 `;
 
 const LoginPanel = ({ buttonText }) => (
-  <StyledDiv className="h-100">
-    <FirstRow className="h1 text-white">
+  <Div className="h-100 align-items-center">
+    <FirstRow className="h1 text-white ">
       <LogoComponent />
     </FirstRow>
+    <Div className="h-25 d-sm-block d-md-none"></Div>
     <Row className="justify-content-center h-50">
-      <ButtonComponent2
-        className="btn-light "
-        icon={<AiOutlineMail height={15} width={2} />}
-        text={buttonText}
-      />
+      <div className="align-items-center d-flex justify-content-center">
+        <SignInButtonComponent
+          className="btn-light "
+          icon={<AiOutlineMail height={15} width={2} />}
+          text={buttonText}
+        />
+      </div>
     </Row>
-    <Row className="">
+    <Row className="d-none d-md-block h-25">
       <LoginTextComponent className="text-white text-center" />
     </Row>
-  </StyledDiv>
+  </Div>
 );
 
 LoginPanel.propTypes = {

From 0e1c0309a4a45b11ddcd4540737e6356e27d16dd Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Wed, 20 May 2020 20:06:23 +0530
Subject: [PATCH 30/62] add test case file for LoginPanel

---
 .../presentational-component/login/LoginPanel.js          | 5 +++--
 .../presentational-component/login/LoginPanel.test.js     | 8 ++++++++
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.test.js

diff --git a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
index a6ff29cdb..b6a6081d3 100644
--- a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
+++ b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
@@ -15,11 +15,12 @@ height: auto
 
 const FirstRow = Styled(Row)`
 font: Helvetica Neue,Regular;
-height: auto
+height: auto;
+padding-top: 1rem;
 `;
+
 const SignInButtonComponent = Styled(ButtonComponent)`
 border-radius: 25px;
-
 `;
 
 const LoginPanel = ({ buttonText }) => (
diff --git a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.test.js b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.test.js
new file mode 100644
index 000000000..906458d3b
--- /dev/null
+++ b/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.test.js
@@ -0,0 +1,8 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import LoginPanel from "./LoginPanel";
+
+it("should equal to value", () => {
+  const { getByText } = render(<LoginPanel />);
+  expect(getByText("Peerly")).toHaveTextContent("Peerly");
+});

From 94096240499e2034e542ef00cf4375a6213b415b Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 21 May 2020 14:38:09 +0530
Subject: [PATCH 31/62] change position of LoginPanel Component

---
 .../login/LoginPanel.js                        | 18 ++++++++++++++----
 .../login/LoginPanel.test.js                   |  0
 2 files changed, 14 insertions(+), 4 deletions(-)
 rename react-frontend/src/featurewise-directories/{presentational-component => }/login/LoginPanel.js (73%)
 rename react-frontend/src/featurewise-directories/{presentational-component => }/login/LoginPanel.test.js (100%)

diff --git a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js b/react-frontend/src/featurewise-directories/login/LoginPanel.js
similarity index 73%
rename from react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
rename to react-frontend/src/featurewise-directories/login/LoginPanel.js
index b6a6081d3..bc86b7f75 100644
--- a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.js
+++ b/react-frontend/src/featurewise-directories/login/LoginPanel.js
@@ -23,7 +23,11 @@ const SignInButtonComponent = Styled(ButtonComponent)`
 border-radius: 25px;
 `;
 
-const LoginPanel = ({ buttonText }) => (
+const LoginPanel = ({
+  buttonText,
+  orgPrimaryCoreValue,
+  encouragementThought,
+}) => (
   <Div className="h-100 align-items-center">
     <FirstRow className="h1 text-white ">
       <LogoComponent />
@@ -33,23 +37,29 @@ const LoginPanel = ({ buttonText }) => (
       <div className="align-items-center d-flex justify-content-center">
         <SignInButtonComponent
           className="btn-light "
-          icon={<AiOutlineMail height={15} width={2} />}
+          icon={<AiOutlineMail height={15} width={2} fontSize={15} />}
           text={buttonText}
         />
       </div>
     </Row>
     <Row className="d-none d-md-block h-25">
-      <LoginTextComponent className="text-white text-center" />
+      <LoginTextComponent
+        className="text-white text-center h3"
+        orgPrimaryCoreValue={orgPrimaryCoreValue}
+        encouragementThought={encouragementThought}
+      />
     </Row>
   </Div>
 );
 
 LoginPanel.propTypes = {
   buttonText: PropTypes.string,
+  orgPrimaryCoreValue: PropTypes.string,
+  encouragementThought: PropTypes.string,
 };
 
 LoginPanel.defaultProps = {
-  buttonText: "Sign in with Google",
+  buttonText: " Sign in with Google",
 };
 
 export default LoginPanel;
diff --git a/react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.test.js b/react-frontend/src/featurewise-directories/login/LoginPanel.test.js
similarity index 100%
rename from react-frontend/src/featurewise-directories/presentational-component/login/LoginPanel.test.js
rename to react-frontend/src/featurewise-directories/login/LoginPanel.test.js

From 470bf524a58ff38623777b301c7d4d7258d89415 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 21 May 2020 16:42:54 +0530
Subject: [PATCH 32/62] Delete empty div in LoginPanel

---
 .../login/LoginPanel.js                       | 56 +++++++++++--------
 1 file changed, 34 insertions(+), 22 deletions(-)

diff --git a/react-frontend/src/featurewise-directories/login/LoginPanel.js b/react-frontend/src/featurewise-directories/login/LoginPanel.js
index bc86b7f75..923a4c78e 100644
--- a/react-frontend/src/featurewise-directories/login/LoginPanel.js
+++ b/react-frontend/src/featurewise-directories/login/LoginPanel.js
@@ -4,23 +4,36 @@ import PropTypes from "prop-types";
 import { AiOutlineMail } from "react-icons/ai";
 import Styled from "styled-components";
 
-import LogoComponent from "shared-components/peerly-Logo/LogoComponent";
+import LogoComponent from "shared-components/peerly-logo/LogoComponent";
 import ButtonComponent from "core-components/Button/ButtonComponent";
-import LoginTextComponent from "shared-components/loginTextComponent/LoginTextComponent";
+import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
+import styled from "styled-components";
 
 const Div = Styled.div`
 background: #334856;
 height: auto
 `;
 
+const SecondRow = styled(Row)`
+  height: 33.33%;
+  @media (max-width: 768px) {
+    height: 55.5%;
+  }
+`;
+const ThirdRow = styled(Row)`
+  @media (mix-width: 768px) {
+    height: 33.33%;
+  }
+`;
 const FirstRow = Styled(Row)`
-font: Helvetica Neue,Regular;
-height: auto;
-padding-top: 1rem;
+  font: Helvetica Neue,Regular;
+  padding-top: 1rem;
+  height: 33.33%;
 `;
 
 const SignInButtonComponent = Styled(ButtonComponent)`
-border-radius: 25px;
+  border-radius: 25px;
+  height: auto;
 `;
 
 const LoginPanel = ({
@@ -32,23 +45,22 @@ const LoginPanel = ({
     <FirstRow className="h1 text-white ">
       <LogoComponent />
     </FirstRow>
-    <Div className="h-25 d-sm-block d-md-none"></Div>
-    <Row className="justify-content-center h-50">
-      <div className="align-items-center d-flex justify-content-center">
-        <SignInButtonComponent
-          className="btn-light "
-          icon={<AiOutlineMail height={15} width={2} fontSize={15} />}
-          text={buttonText}
-        />
-      </div>
-    </Row>
-    <Row className="d-none d-md-block h-25">
-      <LoginTextComponent
-        className="text-white text-center h3"
-        orgPrimaryCoreValue={orgPrimaryCoreValue}
-        encouragementThought={encouragementThought}
+    <SecondRow className="align-items-center auto-height d-flex justify-content-center">
+      <SignInButtonComponent
+        className="btn-light "
+        icon={<AiOutlineMail height={15} width={2} fontSize={15} />}
+        text={buttonText}
       />
-    </Row>
+    </SecondRow>
+    <div className="d-none d-md-block ">
+      <ThirdRow className="align-items-center d-flex justify-content-center">
+        <LoginTextComponent
+          className="text-white text-center "
+          orgPrimaryCoreValue={orgPrimaryCoreValue}
+          encouragementThought={encouragementThought}
+        />
+      </ThirdRow>
+    </div>
   </Div>
 );
 

From fd2f9006170e74555cb70e873f94fc4e9b4bdad6 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 21 May 2020 17:38:47 +0530
Subject: [PATCH 33/62] add some test for LoginPanel Component

---
 .../login/LoginPanel.test.js                        | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/react-frontend/src/featurewise-directories/login/LoginPanel.test.js b/react-frontend/src/featurewise-directories/login/LoginPanel.test.js
index 906458d3b..a8c4d5d7b 100644
--- a/react-frontend/src/featurewise-directories/login/LoginPanel.test.js
+++ b/react-frontend/src/featurewise-directories/login/LoginPanel.test.js
@@ -2,7 +2,16 @@ import React from "react";
 import { render } from "@testing-library/react";
 import LoginPanel from "./LoginPanel";
 
-it("should equal to value", () => {
-  const { getByText } = render(<LoginPanel />);
+test("should equal to value", () => {
+  const { getByText } = render(
+    <LoginPanel
+      orgPrimaryCoreValue="Let Create"
+      buttonText="Google Sign in"
+      encouragementThought="office positive"
+    />
+  );
   expect(getByText("Peerly")).toHaveTextContent("Peerly");
+  expect(getByText("Let Create")).toHaveTextContent("Let Create");
+  expect(getByText("office positive")).toHaveTextContent("office positive");
+  expect(getByText("Google Sign in")).toHaveTextContent("Google Sign in");
 });

From 670f10a707b5b0083ab73bf0238f13f6b0607bbd Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 21 May 2020 19:13:31 +0530
Subject: [PATCH 34/62] optimism loginPanel code and change place of login
 component

---
 .../login/LoginPanel.js                       | 30 ++++++++-----------
 .../login/LoginPanel.test.js                  |  2 +-
 2 files changed, 14 insertions(+), 18 deletions(-)
 rename react-frontend/src/{featurewise-directories => }/login/LoginPanel.js (77%)
 rename react-frontend/src/{featurewise-directories => }/login/LoginPanel.test.js (93%)

diff --git a/react-frontend/src/featurewise-directories/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
similarity index 77%
rename from react-frontend/src/featurewise-directories/login/LoginPanel.js
rename to react-frontend/src/login/LoginPanel.js
index 923a4c78e..0ba293c49 100644
--- a/react-frontend/src/featurewise-directories/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -7,33 +7,29 @@ import Styled from "styled-components";
 import LogoComponent from "shared-components/peerly-logo/LogoComponent";
 import ButtonComponent from "core-components/Button/ButtonComponent";
 import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
-import styled from "styled-components";
 
 const Div = Styled.div`
 background: #334856;
 height: auto
 `;
-
-const SecondRow = styled(Row)`
+const FirstRow = Styled(Row)`
+  font: Helvetica Neue,Regular;
+  padding-top: 1rem;
+  height: 33.33%;
+`;
+const SecondRow = Styled(Row)`
   height: 33.33%;
-  @media (max-width: 768px) {
+  @media (max-width: 769px) {
     height: 55.5%;
   }
 `;
-const ThirdRow = styled(Row)`
-  @media (mix-width: 768px) {
+const ThirdRow = Styled(Row)`
+  @media (min-width: 767px) {
     height: 33.33%;
   }
 `;
-const FirstRow = Styled(Row)`
-  font: Helvetica Neue,Regular;
-  padding-top: 1rem;
-  height: 33.33%;
-`;
-
 const SignInButtonComponent = Styled(ButtonComponent)`
   border-radius: 25px;
-  height: auto;
 `;
 
 const LoginPanel = ({
@@ -42,18 +38,18 @@ const LoginPanel = ({
   encouragementThought,
 }) => (
   <Div className="h-100 align-items-center">
-    <FirstRow className="h1 text-white ">
+    <FirstRow className="h1">
       <LogoComponent />
     </FirstRow>
-    <SecondRow className="align-items-center auto-height d-flex justify-content-center">
+    <SecondRow className="align-items-center d-flex justify-content-center">
       <SignInButtonComponent
         className="btn-light "
-        icon={<AiOutlineMail height={15} width={2} fontSize={15} />}
+        icon={<AiOutlineMail fontSize={15} />}
         text={buttonText}
       />
     </SecondRow>
     <div className="d-none d-md-block ">
-      <ThirdRow className="align-items-center d-flex justify-content-center">
+      <ThirdRow>
         <LoginTextComponent
           className="text-white text-center "
           orgPrimaryCoreValue={orgPrimaryCoreValue}
diff --git a/react-frontend/src/featurewise-directories/login/LoginPanel.test.js b/react-frontend/src/login/LoginPanel.test.js
similarity index 93%
rename from react-frontend/src/featurewise-directories/login/LoginPanel.test.js
rename to react-frontend/src/login/LoginPanel.test.js
index a8c4d5d7b..2dce23782 100644
--- a/react-frontend/src/featurewise-directories/login/LoginPanel.test.js
+++ b/react-frontend/src/login/LoginPanel.test.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import LoginPanel from "./LoginPanel";
+import LoginPanel from "login/LoginPanel";
 
 test("should equal to value", () => {
   const { getByText } = render(

From 0e916a41eff7256ddda6861fab1fc58ed6aa4536 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 21 May 2020 19:25:37 +0530
Subject: [PATCH 35/62] rename Styling div component into Wrapper

---
 react-frontend/src/login/LoginPanel.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 0ba293c49..b17ed71e3 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -8,7 +8,7 @@ import LogoComponent from "shared-components/peerly-logo/LogoComponent";
 import ButtonComponent from "core-components/Button/ButtonComponent";
 import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
 
-const Div = Styled.div`
+const Wrapper = Styled.div`
 background: #334856;
 height: auto
 `;
@@ -37,7 +37,7 @@ const LoginPanel = ({
   orgPrimaryCoreValue,
   encouragementThought,
 }) => (
-  <Div className="h-100 align-items-center">
+  <Wrapper className="h-100 align-items-center">
     <FirstRow className="h1">
       <LogoComponent />
     </FirstRow>
@@ -57,7 +57,7 @@ const LoginPanel = ({
         />
       </ThirdRow>
     </div>
-  </Div>
+  </Wrapper>
 );
 
 LoginPanel.propTypes = {

From 2a0dfd24b2254945c1b3e17a37ed001394616120 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Fri, 22 May 2020 14:20:42 +0530
Subject: [PATCH 36/62] remove css media query and add bootstrap class for
 responsive LoginPanel component

---
 react-frontend/src/login/LoginPanel.js | 48 ++++++++++----------------
 1 file changed, 18 insertions(+), 30 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index b17ed71e3..287562571 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -1,5 +1,5 @@
 import React from "react";
-import { Row } from "react-bootstrap";
+import { Col } from "react-bootstrap";
 import PropTypes from "prop-types";
 import { AiOutlineMail } from "react-icons/ai";
 import Styled from "styled-components";
@@ -10,23 +10,10 @@ import LoginTextComponent from "shared-components/login-text-component/LoginText
 
 const Wrapper = Styled.div`
 background: #334856;
-height: auto
 `;
-const FirstRow = Styled(Row)`
+const FirstCol = Styled(Col)`
   font: Helvetica Neue,Regular;
   padding-top: 1rem;
-  height: 33.33%;
-`;
-const SecondRow = Styled(Row)`
-  height: 33.33%;
-  @media (max-width: 769px) {
-    height: 55.5%;
-  }
-`;
-const ThirdRow = Styled(Row)`
-  @media (min-width: 767px) {
-    height: 33.33%;
-  }
 `;
 const SignInButtonComponent = Styled(ButtonComponent)`
   border-radius: 25px;
@@ -36,27 +23,27 @@ const LoginPanel = ({
   buttonText,
   orgPrimaryCoreValue,
   encouragementThought,
+  onClick,
 }) => (
-  <Wrapper className="h-100 align-items-center">
-    <FirstRow className="h1">
+  <Wrapper className="h-100 align-items-center d-flex flex-column">
+    <FirstCol className="h1">
       <LogoComponent />
-    </FirstRow>
-    <SecondRow className="align-items-center d-flex justify-content-center">
+    </FirstCol>
+    <Col className="align-items-center d-flex justify-content-center ">
       <SignInButtonComponent
-        className="btn-light "
+        className="btn-light"
         icon={<AiOutlineMail fontSize={15} />}
         text={buttonText}
+        onClick={onClick}
+      />
+    </Col>
+    <Col className="d-none d-md-block d-lg-block">
+      <LoginTextComponent
+        className="text-white text-center "
+        orgPrimaryCoreValue={orgPrimaryCoreValue}
+        encouragementThought={encouragementThought}
       />
-    </SecondRow>
-    <div className="d-none d-md-block ">
-      <ThirdRow>
-        <LoginTextComponent
-          className="text-white text-center "
-          orgPrimaryCoreValue={orgPrimaryCoreValue}
-          encouragementThought={encouragementThought}
-        />
-      </ThirdRow>
-    </div>
+    </Col>
   </Wrapper>
 );
 
@@ -64,6 +51,7 @@ LoginPanel.propTypes = {
   buttonText: PropTypes.string,
   orgPrimaryCoreValue: PropTypes.string,
   encouragementThought: PropTypes.string,
+  onClick: PropTypes.func.isRequired,
 };
 
 LoginPanel.defaultProps = {

From bd41ab0808a39f5fee0b8d3b7d8e59ae1f5e2bea Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 25 May 2020 14:52:48 +0530
Subject: [PATCH 37/62] use Col component form core component in LoginPanel

---
 react-frontend/src/login/LoginPanel.js                      | 6 +++---
 .../login-text-component/LoginTextComponent.js              | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 287562571..53ef1ccd3 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -1,12 +1,12 @@
 import React from "react";
-import { Col } from "react-bootstrap";
 import PropTypes from "prop-types";
 import { AiOutlineMail } from "react-icons/ai";
 import Styled from "styled-components";
 
 import LogoComponent from "shared-components/peerly-logo/LogoComponent";
-import ButtonComponent from "core-components/Button/ButtonComponent";
+import ButtonComponent from "core-components/button/ButtonComponent";
 import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
+import Col from "core-components/col/ColComponent";
 
 const Wrapper = Styled.div`
 background: #334856;
@@ -26,7 +26,7 @@ const LoginPanel = ({
   onClick,
 }) => (
   <Wrapper className="h-100 align-items-center d-flex flex-column">
-    <FirstCol className="h1">
+    <FirstCol className="h1 text-white">
       <LogoComponent />
     </FirstCol>
     <Col className="align-items-center d-flex justify-content-center ">
diff --git a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
index 90933df6e..9c95a03cf 100644
--- a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
+++ b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
@@ -2,7 +2,7 @@ import React from "react";
 import PropTypes from "prop-types";
 import { Col } from "react-bootstrap";
 import styled from "styled-components";
-import LabelComponent from "core-components/Label/LabelComponent";
+import LabelComponent from "core-components/label/LabelComponent";
 
 const HrLine = styled.hr`
   width: 10%;

From 043a6ed882380aae2578617b8a3ef392e8ed547f Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 25 May 2020 15:27:31 +0530
Subject: [PATCH 38/62] resolve comment on file LoginTextComponent.js,
 LoginTextComponent.text.js LoginPanel.js

---
 react-frontend/src/login/LoginPanel.js                         | 2 +-
 .../login-text-component/LoginTextComponent.js                 | 2 ++
 .../login-text-component/LoginTextComponent.test.js            | 3 ++-
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 53ef1ccd3..40b1e9c8c 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -9,7 +9,7 @@ import LoginTextComponent from "shared-components/login-text-component/LoginText
 import Col from "core-components/col/ColComponent";
 
 const Wrapper = Styled.div`
-background: #334856;
+  background: #334856;
 `;
 const FirstCol = Styled(Col)`
   font: Helvetica Neue,Regular;
diff --git a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
index 9c95a03cf..2d4aaa73e 100644
--- a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
+++ b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
@@ -2,12 +2,14 @@ import React from "react";
 import PropTypes from "prop-types";
 import { Col } from "react-bootstrap";
 import styled from "styled-components";
+
 import LabelComponent from "core-components/label/LabelComponent";
 
 const HrLine = styled.hr`
   width: 10%;
   background: white;
 `;
+
 const LoginTextComponent = ({
   className,
   orgPrimaryCoreValue,
diff --git a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
index 2bd274102..81a6fdff5 100644
--- a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
+++ b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
@@ -1,6 +1,7 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import LoginTextComponent from "./LoginTextComponent";
+
+import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
 
 it("should equal to value", () => {
   const { getByTestId } = render(

From dda04177db71787a81c1739d6eb63c46d68f6175 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 25 May 2020 21:10:33 +0530
Subject: [PATCH 39/62] fixed indentation on LogoComponent

---
 .../src/shared-components/peerly-logo/LogoComponent.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
index 11651dbdd..9c1b81054 100644
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -25,11 +25,11 @@ const Logo = Styled.div`
 }  
 `;
 const PlusSign = Styled.div`
-position: absolute;
-top: 55%;
-left: 55%;
-transform: translate(-50%, -50%) rotate(-45deg);
-color: #FFFFFF;
+  position: absolute;
+  top: 55%;
+  left: 55%;
+  transform: translate(-50%, -50%) rotate(-45deg);
+  color: #FFFFFF;
 `;
 
 const LogoComponent = () => (

From 5ffb41f3cc1e24caa778f8fe57fd8e7021b85e2d Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 26 May 2020 12:02:05 +0530
Subject: [PATCH 40/62] Update Sign in button in LoginPanel as per button core
 component

---
 react-frontend/src/login/LoginPanel.js | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 40b1e9c8c..87b80135c 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -30,12 +30,10 @@ const LoginPanel = ({
       <LogoComponent />
     </FirstCol>
     <Col className="align-items-center d-flex justify-content-center ">
-      <SignInButtonComponent
-        className="btn-light"
-        icon={<AiOutlineMail fontSize={15} />}
-        text={buttonText}
-        onClick={onClick}
-      />
+      <SignInButtonComponent className="btn-light" onClick={onClick}>
+        <AiOutlineMail fontSize={15} />
+        {buttonText}
+      </SignInButtonComponent>
     </Col>
     <Col className="d-none d-md-block d-lg-block">
       <LoginTextComponent

From a008cdd606b9e8076d52a38b9551580900a471cb Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 26 May 2020 14:32:42 +0530
Subject: [PATCH 41/62] change import statement for col core component in
 LoginPanel, LogoComponent, LoginTextComponent

---
 react-frontend/src/login/LoginPanel.js                         | 2 +-
 .../login-text-component/LoginTextComponent.js                 | 2 +-
 .../src/shared-components/peerly-logo/LogoComponent.js         | 3 +--
 3 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 87b80135c..2677c285f 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -6,7 +6,7 @@ import Styled from "styled-components";
 import LogoComponent from "shared-components/peerly-logo/LogoComponent";
 import ButtonComponent from "core-components/button/ButtonComponent";
 import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
-import Col from "core-components/col/ColComponent";
+import { Col } from "core-components/grid/GridComponents";
 
 const Wrapper = Styled.div`
   background: #334856;
diff --git a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
index 2d4aaa73e..b18d96966 100644
--- a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
+++ b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
@@ -1,9 +1,9 @@
 import React from "react";
 import PropTypes from "prop-types";
-import { Col } from "react-bootstrap";
 import styled from "styled-components";
 
 import LabelComponent from "core-components/label/LabelComponent";
+import { Col } from "core-components/grid/GridComponents";
 
 const HrLine = styled.hr`
   width: 10%;
diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
index 9c1b81054..bb9c440c8 100644
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
@@ -2,8 +2,7 @@ import React from "react";
 import Styled from "styled-components";
 
 import LabelComponent from "core-components/label/LabelComponent";
-import Row from "core-components/row/RowComponent";
-import Col from "core-components/col/ColComponent";
+import { Row, Col } from "core-components/grid/GridComponents";
 
 const Logo = Styled.div`
 & {

From 9b701f94095b48b07033aa4992e9a769cf2132c9 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 4 Jun 2020 11:10:26 +0530
Subject: [PATCH 42/62] get rebase of fresh master and delete an nessaery
 necessary files

---
 .../core-components/button/ButtonComponent.js |  4 +--
 .../button/ButtonComponent.js~HEAD            |  1 -
 .../button/ButtonComponent.test.js            |  9 ------
 .../core-components/grid/GridComponents.js    |  4 ---
 .../core-components/label/LabelComponent.js   | 14 ---------
 .../label/LabelComponent.test.js              |  9 ------
 .../core-components/video/VideoComponent.js   | 29 -------------------
 .../video/VideoComponent.test.js              | 11 -------
 8 files changed, 1 insertion(+), 80 deletions(-)
 delete mode 100644 react-frontend/src/core-components/button/ButtonComponent.js~HEAD
 delete mode 100644 react-frontend/src/core-components/button/ButtonComponent.test.js
 delete mode 100644 react-frontend/src/core-components/grid/GridComponents.js
 delete mode 100644 react-frontend/src/core-components/label/LabelComponent.js
 delete mode 100644 react-frontend/src/core-components/label/LabelComponent.test.js
 delete mode 100644 react-frontend/src/core-components/video/VideoComponent.js
 delete mode 100644 react-frontend/src/core-components/video/VideoComponent.test.js

diff --git a/react-frontend/src/core-components/button/ButtonComponent.js b/react-frontend/src/core-components/button/ButtonComponent.js
index f85f0df13..2aa357f7b 100644
--- a/react-frontend/src/core-components/button/ButtonComponent.js
+++ b/react-frontend/src/core-components/button/ButtonComponent.js
@@ -1,3 +1 @@
-import { Button } from "react-bootstrap";
-
-export default Button;
+export { Button } from "react-bootstrap";
diff --git a/react-frontend/src/core-components/button/ButtonComponent.js~HEAD b/react-frontend/src/core-components/button/ButtonComponent.js~HEAD
deleted file mode 100644
index 2aa357f7b..000000000
--- a/react-frontend/src/core-components/button/ButtonComponent.js~HEAD
+++ /dev/null
@@ -1 +0,0 @@
-export { Button } from "react-bootstrap";
diff --git a/react-frontend/src/core-components/button/ButtonComponent.test.js b/react-frontend/src/core-components/button/ButtonComponent.test.js
deleted file mode 100644
index 94c1466f6..000000000
--- a/react-frontend/src/core-components/button/ButtonComponent.test.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import Button from "core-components/button/ButtonComponent";
-
-it("ButtonComponent should equal to submit text", () => {
-  const { getByText } = render(<Button type="submit">submit</Button>);
-  expect(getByText("submit")).toHaveTextContent("submit");
-});
diff --git a/react-frontend/src/core-components/grid/GridComponents.js b/react-frontend/src/core-components/grid/GridComponents.js
deleted file mode 100644
index 8a2fdf343..000000000
--- a/react-frontend/src/core-components/grid/GridComponents.js
+++ /dev/null
@@ -1,4 +0,0 @@
-import { Row, Col, Container } from "react-bootstrap";
-
-export default Container;
-export { Row, Col };
diff --git a/react-frontend/src/core-components/label/LabelComponent.js b/react-frontend/src/core-components/label/LabelComponent.js
deleted file mode 100644
index 06dd42769..000000000
--- a/react-frontend/src/core-components/label/LabelComponent.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from "react";
-import { Form } from "react-bootstrap";
-import PropTypes from "prop-types";
-
-const LabelComponent = ({ text, className }) => (
-  <Form.Label className={className}> {text} </Form.Label>
-);
-
-LabelComponent.propTypes = {
-  className: PropTypes.string,
-  text: PropTypes.string.isRequired,
-};
-
-export default LabelComponent;
diff --git a/react-frontend/src/core-components/label/LabelComponent.test.js b/react-frontend/src/core-components/label/LabelComponent.test.js
deleted file mode 100644
index e6e51bb60..000000000
--- a/react-frontend/src/core-components/label/LabelComponent.test.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import LabelComponent from "core-components/label/LabelComponent";
-
-it("LabelComponent should equal to submit text", () => {
-  const { getByText } = render(<LabelComponent text="submit" />);
-  expect(getByText("submit")).toHaveTextContent("submit");
-});
diff --git a/react-frontend/src/core-components/video/VideoComponent.js b/react-frontend/src/core-components/video/VideoComponent.js
deleted file mode 100644
index 0b498feec..000000000
--- a/react-frontend/src/core-components/video/VideoComponent.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-
-const VideoComponent = ({ className, src, controls, height, width, title }) => (
-  /*eslint-disable-next-line jsx-a11y/media-has-caption */
-  <video
-    title={title}
-    className={className}
-    src={src}
-    controls={controls}
-    height={height}
-    width={width}
-  />
-);
-
-VideoComponent.propTypes = {
-  title: PropTypes.string,
-  className: PropTypes.string,
-  src: PropTypes.string.isRequired,
-  controls: PropTypes.oneOf(["controls"]),
-  height: PropTypes.number,
-  width: PropTypes.number,
-};
-
-VideoComponent.defaultProps = {
-  controls: "controls",
-};
-
-export default VideoComponent;
diff --git a/react-frontend/src/core-components/video/VideoComponent.test.js b/react-frontend/src/core-components/video/VideoComponent.test.js
deleted file mode 100644
index 87fb1cf55..000000000
--- a/react-frontend/src/core-components/video/VideoComponent.test.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import VideoComponent from "core-components/video/VideoComponent";
-
-it("VideoComponent should equal to Title", () => {
-  const { getByTitle } = render(
-    <VideoComponent src={require("login/video.mp4")} title="peerly video" />
-  );
-  expect(getByTitle("peerly video")).toBeInTheDocument();
-});

From 04119c9ed096d746667f42151c10241a7bd1aac9 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 4 Jun 2020 17:45:07 +0530
Subject: [PATCH 43/62] add GoogleButton Component for Google Sign in

---
 react-frontend/src/login/GoogleLoginButton.js | 29 +++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 react-frontend/src/login/GoogleLoginButton.js

diff --git a/react-frontend/src/login/GoogleLoginButton.js b/react-frontend/src/login/GoogleLoginButton.js
new file mode 100644
index 000000000..cbe5a86a1
--- /dev/null
+++ b/react-frontend/src/login/GoogleLoginButton.js
@@ -0,0 +1,29 @@
+import React from "react";
+import PropTypes from "prop-types";
+import GoogleLogin from "react-google-login";
+
+const GoogleLoginButtonComponent = ({
+  responseGoogleOnSuccess,
+  responseGoogleOnFailure,
+  buttonText,
+}) => (
+  <GoogleLogin
+    clientId="907716014506-306rlfo0dobiib8ee07870g1ct66910d.apps.googleusercontent.com"
+    buttonText={buttonText}
+    onSuccess={responseGoogleOnSuccess}
+    onFailure={responseGoogleOnFailure}
+    cookiePolicy={"single_host_origin"}
+  />
+);
+
+GoogleLoginButtonComponent.defaultProps = {
+  buttonText: "Sign in with google",
+};
+
+GoogleLoginButtonComponent.propTypes = {
+  responseGoogleOnSuccess: PropTypes.func.isRequired,
+  responseGoogleOnFailure: PropTypes.func.isRequired,
+  buttonText: PropTypes.string,
+};
+
+export default GoogleLoginButtonComponent;

From dfc7beb03152441cde5a1760f059d20f6d00a60f Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 4 Jun 2020 17:46:57 +0530
Subject: [PATCH 44/62] add Google Button into LoginPanal and resolve all
 comment onn PR

---
 react-frontend/src/login/LoginPanel.js | 80 +++++++++++++++++---------
 1 file changed, 54 insertions(+), 26 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 2677c285f..8cd11f8a6 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -1,21 +1,22 @@
 import React from "react";
 import PropTypes from "prop-types";
-import { AiOutlineMail } from "react-icons/ai";
 import Styled from "styled-components";
 
 import LogoComponent from "shared-components/peerly-logo/LogoComponent";
-import ButtonComponent from "core-components/button/ButtonComponent";
 import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
-import { Col } from "core-components/grid/GridComponents";
+import { Col, Row } from "core-components/grid/GridComponent";
+import GoogleLoginButton from "login/GoogleLoginButton";
 
-const Wrapper = Styled.div`
-  background: #334856;
+const RowComponent = Styled(Row)`
+  height: calc(100%/3);
 `;
+
 const FirstCol = Styled(Col)`
   font: Helvetica Neue,Regular;
   padding-top: 1rem;
 `;
-const SignInButtonComponent = Styled(ButtonComponent)`
+
+const GoogleButton = Styled(GoogleLoginButton)`
   border-radius: 25px;
 `;
 
@@ -23,33 +24,60 @@ const LoginPanel = ({
   buttonText,
   orgPrimaryCoreValue,
   encouragementThought,
-  onClick,
+  responseGoogleOnSuccess,
+  responseGoogleOnFailure,
 }) => (
-  <Wrapper className="h-100 align-items-center d-flex flex-column">
-    <FirstCol className="h1 text-white">
-      <LogoComponent />
-    </FirstCol>
-    <Col className="align-items-center d-flex justify-content-center ">
-      <SignInButtonComponent className="btn-light" onClick={onClick}>
-        <AiOutlineMail fontSize={15} />
-        {buttonText}
-      </SignInButtonComponent>
-    </Col>
-    <Col className="d-none d-md-block d-lg-block">
-      <LoginTextComponent
-        className="text-white text-center "
-        orgPrimaryCoreValue={orgPrimaryCoreValue}
-        encouragementThought={encouragementThought}
-      />
-    </Col>
-  </Wrapper>
+  <>
+    <div className="d-sm-none d-md-block h-100">
+      <RowComponent>
+        <FirstCol className="h1 text-white">
+          <LogoComponent />
+        </FirstCol>
+      </RowComponent>
+      <RowComponent>
+        <Col className="text-center m-auto">
+          <GoogleButton
+            responseGoogleOnSuccess={responseGoogleOnSuccess}
+            responseGoogleOnFailure={responseGoogleOnFailure}
+            buttonText={buttonText}
+          ></GoogleButton>
+        </Col>
+      </RowComponent>
+      <RowComponent className="d-none d-md-block">
+        <Col>
+          <LoginTextComponent
+            className="text-white text-center "
+            orgPrimaryCoreValue={orgPrimaryCoreValue}
+            encouragementThought={encouragementThought}
+          />
+        </Col>
+      </RowComponent>
+    </div>
+    <div className="d-none d-sm-block d-md-none h-100">
+      <Row className="h-50">
+        <FirstCol className="h1 text-white">
+          <LogoComponent />
+        </FirstCol>
+      </Row>
+      <Row className="h-50">
+        <Col className="text-center m-auto">
+          <GoogleButton
+            responseGoogleOnSuccess={responseGoogleOnSuccess}
+            responseGoogleOnFailure={responseGoogleOnFailure}
+            buttonText={buttonText}
+          ></GoogleButton>
+        </Col>
+      </Row>
+    </div>
+  </>
 );
 
 LoginPanel.propTypes = {
   buttonText: PropTypes.string,
   orgPrimaryCoreValue: PropTypes.string,
   encouragementThought: PropTypes.string,
-  onClick: PropTypes.func.isRequired,
+  responseGoogleOnSuccess: PropTypes.func.isRequired,
+  responseGoogleOnFailure: PropTypes.func.isRequired,
 };
 
 LoginPanel.defaultProps = {

From e43156a3ea3c56fd0e9e3626e8538e4d0c9338c0 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 4 Jun 2020 17:50:13 +0530
Subject: [PATCH 45/62] add react-google-login npm package for google login
 Component

---
 react-frontend/package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/react-frontend/package.json b/react-frontend/package.json
index d39fe5771..6f31d9d56 100644
--- a/react-frontend/package.json
+++ b/react-frontend/package.json
@@ -13,6 +13,7 @@
     "react": "^16.13.1",
     "react-bootstrap": "^1.0.0",
     "react-dom": "^16.13.1",
+    "react-google-login": "^5.1.20",
     "react-redux": "^7.2.0",
     "react-router-dom": "^5.1.2",
     "react-scripts": "3.4.1",

From cc982b6d0dc1b16b6c3e8dbed332db2538ee429e Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:13:11 +0530
Subject: [PATCH 46/62] delete extra files which is not use

---
 .../LoginTextComponent.js                     | 40 --------------
 .../LoginTextComponent.test.js                | 16 ------
 .../peerly-logo/LogoComponent.js              | 52 -------------------
 .../peerly-logo/LogoComponent.test.js         |  9 ----
 4 files changed, 117 deletions(-)
 delete mode 100644 react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
 delete mode 100644 react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
 delete mode 100644 react-frontend/src/shared-components/peerly-logo/LogoComponent.js
 delete mode 100644 react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js

diff --git a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
deleted file mode 100644
index b18d96966..000000000
--- a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-import styled from "styled-components";
-
-import LabelComponent from "core-components/label/LabelComponent";
-import { Col } from "core-components/grid/GridComponents";
-
-const HrLine = styled.hr`
-  width: 10%;
-  background: white;
-`;
-
-const LoginTextComponent = ({
-  className,
-  orgPrimaryCoreValue,
-  encouragementThought,
-}) => (
-  <Col className={className} data-testid="LoginTextComponent">
-    <LabelComponent
-      text={orgPrimaryCoreValue}
-      className="font-weight-bold h3 mx-4"
-    />
-    <HrLine />
-    <LabelComponent text={encouragementThought} />
-  </Col>
-);
-
-LoginTextComponent.defaultProps = {
-  orgPrimaryCoreValue: "Lets Create the Office Positive",
-  encouragementThought: "Encouragement Driven",
-  className: "text-white text-center ",
-};
-
-LoginTextComponent.propTypes = {
-  className: PropTypes.string,
-  orgPrimaryCoreValue: PropTypes.string.isRequired,
-  encouragementThought: PropTypes.string.isRequired,
-};
-
-export default LoginTextComponent;
diff --git a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js b/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
deleted file mode 100644
index 81a6fdff5..000000000
--- a/react-frontend/src/shared-components/login-text-component/LoginTextComponent.test.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
-
-it("should equal to value", () => {
-  const { getByTestId } = render(
-    <LoginTextComponent
-      orgPrimaryCoreValue="Lets Create the Office Positive"
-      encouragementThought="positive"
-    />
-  );
-  expect(getByTestId("LoginTextComponent")).toHaveTextContent(
-    "Lets Create the Office Positive positive"
-  );
-});
diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
deleted file mode 100644
index bb9c440c8..000000000
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.js
+++ /dev/null
@@ -1,52 +0,0 @@
-import React from "react";
-import Styled from "styled-components";
-
-import LabelComponent from "core-components/label/LabelComponent";
-import { Row, Col } from "core-components/grid/GridComponents";
-
-const Logo = Styled.div`
-& {
-  width: 50px;
-  height: 50px;   
-  position: absolute;
-  top: 10px;
-  transform: rotate(45deg);
-}
-&: before {
-  content: "";
-  width: 20px;
-  height: 20px;
-  border: 2px solid #FFFFFF;              
-  position: absolute;
-  transform: translate(-50%,-50%);
-  top: 50%;
-  left: 50%;
-}  
-`;
-const PlusSign = Styled.div`
-  position: absolute;
-  top: 55%;
-  left: 55%;
-  transform: translate(-50%, -50%) rotate(-45deg);
-  color: #FFFFFF;
-`;
-
-const LogoComponent = () => (
-  <Row className="d-flex flex-column" data-testid="peerlyLogoComponent">
-    <Col className="d-flex justify-content-center">
-      <Logo>
-        <PlusSign>
-          <LabelComponent text="+" className="text-center w-100" />
-        </PlusSign>
-      </Logo>
-    </Col>
-    <Col>
-      <LabelComponent
-        text="Peerly"
-        className="text-white mt-5 pt-1 text-center w-100"
-      />
-    </Col>
-  </Row>
-);
-
-export default LogoComponent;
diff --git a/react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js b/react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js
deleted file mode 100644
index 3e3793252..000000000
--- a/react-frontend/src/shared-components/peerly-logo/LogoComponent.test.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react";
-
-import LogoComponent from "shared-components/peerly-logo/LogoComponent";
-
-it("should equal to + Peerly text", () => {
-  const { getByTestId } = render(<LogoComponent text="Peerly" />);
-  expect(getByTestId("peerlyLogoComponent")).toHaveTextContent("+ Peerly");
-});

From 3811b22e2548c5d1e37b4cac68a5a23e98c12607 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:21:58 +0530
Subject: [PATCH 47/62] use a env variable for clientId props for google login
 button

---
 react-frontend/src/login/GoogleLoginButton.js |  2 +-
 react-frontend/src/login/LoginPanel.js        | 59 ++++++++++---------
 react-frontend/src/login/LoginPanel.test.js   | 20 ++++---
 3 files changed, 44 insertions(+), 37 deletions(-)

diff --git a/react-frontend/src/login/GoogleLoginButton.js b/react-frontend/src/login/GoogleLoginButton.js
index cbe5a86a1..77e6ec273 100644
--- a/react-frontend/src/login/GoogleLoginButton.js
+++ b/react-frontend/src/login/GoogleLoginButton.js
@@ -8,7 +8,7 @@ const GoogleLoginButtonComponent = ({
   buttonText,
 }) => (
   <GoogleLogin
-    clientId="907716014506-306rlfo0dobiib8ee07870g1ct66910d.apps.googleusercontent.com"
+    clientId={process.env.REACT_APP_GOOGLE_CLIENT_ID}
     buttonText={buttonText}
     onSuccess={responseGoogleOnSuccess}
     onFailure={responseGoogleOnFailure}
diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 8cd11f8a6..26ac28db1 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -1,87 +1,88 @@
 import React from "react";
 import PropTypes from "prop-types";
-import Styled from "styled-components";
+import styled from "styled-components";
 
-import LogoComponent from "shared-components/peerly-logo/LogoComponent";
-import LoginTextComponent from "shared-components/login-text-component/LoginTextComponent";
+import PeerlyTextAndLogo from "shared-components/peerly-logo/PeerlyTextAndLogo";
+import InformativeTextComponent from "login/InformativeTextComponent";
 import { Col, Row } from "core-components/grid/GridComponent";
 import GoogleLoginButton from "login/GoogleLoginButton";
 
-const RowComponent = Styled(Row)`
-  height: calc(100%/3);
+const RowComponent = styled(Row)`
+  height: calc(100% / 3);
 `;
-
-const FirstCol = Styled(Col)`
-  font: Helvetica Neue,Regular;
+const FirstCol = styled(Col)`
   padding-top: 1rem;
 `;
-
-const GoogleButton = Styled(GoogleLoginButton)`
-  border-radius: 25px;
+const Wrapper = styled.div`
+  background-color: ${({ theme }) =>
+    theme === "dark" ? "#334856" : "var(--white)"};
 `;
 
 const LoginPanel = ({
   buttonText,
-  orgPrimaryCoreValue,
+  informativeText,
   encouragementThought,
   responseGoogleOnSuccess,
   responseGoogleOnFailure,
+  theme,
 }) => (
   <>
-    <div className="d-sm-none d-md-block h-100">
+    <Wrapper className="d-none d-md-block  h-100" theme={theme}>
       <RowComponent>
-        <FirstCol className="h1 text-white">
-          <LogoComponent />
+        <FirstCol>
+          <PeerlyTextAndLogo theme={theme} />
         </FirstCol>
       </RowComponent>
       <RowComponent>
         <Col className="text-center m-auto">
-          <GoogleButton
+          <GoogleLoginButton
             responseGoogleOnSuccess={responseGoogleOnSuccess}
             responseGoogleOnFailure={responseGoogleOnFailure}
             buttonText={buttonText}
-          ></GoogleButton>
+          ></GoogleLoginButton>
         </Col>
       </RowComponent>
-      <RowComponent className="d-none d-md-block">
+      <RowComponent>
         <Col>
-          <LoginTextComponent
-            className="text-white text-center "
-            orgPrimaryCoreValue={orgPrimaryCoreValue}
+          <InformativeTextComponent
+            informativeText={informativeText}
             encouragementThought={encouragementThought}
+            theme={theme}
           />
         </Col>
       </RowComponent>
-    </div>
-    <div className="d-none d-sm-block d-md-none h-100">
+    </Wrapper>
+    <Wrapper className="d-block d-sm-block d-md-none h-100" theme={theme}>
       <Row className="h-50">
-        <FirstCol className="h1 text-white">
-          <LogoComponent />
+        <FirstCol>
+          <PeerlyTextAndLogo theme={theme} />
         </FirstCol>
       </Row>
       <Row className="h-50">
         <Col className="text-center m-auto">
-          <GoogleButton
+          <GoogleLoginButton
             responseGoogleOnSuccess={responseGoogleOnSuccess}
             responseGoogleOnFailure={responseGoogleOnFailure}
             buttonText={buttonText}
-          ></GoogleButton>
+          ></GoogleLoginButton>
         </Col>
       </Row>
-    </div>
+    </Wrapper>
   </>
 );
 
 LoginPanel.propTypes = {
   buttonText: PropTypes.string,
-  orgPrimaryCoreValue: PropTypes.string,
+  informativeText: PropTypes.string,
   encouragementThought: PropTypes.string,
   responseGoogleOnSuccess: PropTypes.func.isRequired,
   responseGoogleOnFailure: PropTypes.func.isRequired,
+  theme: PropTypes.oneOf(["dark", "light"]),
 };
 
 LoginPanel.defaultProps = {
   buttonText: " Sign in with Google",
+  theme: "dark",
 };
 
 export default LoginPanel;
diff --git a/react-frontend/src/login/LoginPanel.test.js b/react-frontend/src/login/LoginPanel.test.js
index 2dce23782..c109af8e0 100644
--- a/react-frontend/src/login/LoginPanel.test.js
+++ b/react-frontend/src/login/LoginPanel.test.js
@@ -1,17 +1,23 @@
 import React from "react";
 import { render } from "@testing-library/react";
+
 import LoginPanel from "login/LoginPanel";
 
-test("should equal to value", () => {
-  const { getByText } = render(
+test("LoginPanel should pass a snapshot", () => {
+  const responseCheckFunction = () => {
+    return true;
+  };
+
+  const { asFragment } = render(
     <LoginPanel
-      orgPrimaryCoreValue="Let Create"
+      informativeText="Let Create"
       buttonText="Google Sign in"
       encouragementThought="office positive"
+      theme="dark"
+      responseGoogleOnFailure={responseCheckFunction}
+      responseGoogleOnSuccess={responseCheckFunction}
     />
   );
-  expect(getByText("Peerly")).toHaveTextContent("Peerly");
-  expect(getByText("Let Create")).toHaveTextContent("Let Create");
-  expect(getByText("office positive")).toHaveTextContent("office positive");
-  expect(getByText("Google Sign in")).toHaveTextContent("Google Sign in");
+
+  expect(asFragment()).toMatchSnapshot();
 });

From 0ab972cfbeef2fa4642688523f2b42aa5c829938 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:22:28 +0530
Subject: [PATCH 48/62] add snapshot test case for google login button

---
 .../src/login/GoogleLoginButton.test.js       | 20 +++++++++++++++++++
 1 file changed, 20 insertions(+)
 create mode 100644 react-frontend/src/login/GoogleLoginButton.test.js

diff --git a/react-frontend/src/login/GoogleLoginButton.test.js b/react-frontend/src/login/GoogleLoginButton.test.js
new file mode 100644
index 000000000..f43a90047
--- /dev/null
+++ b/react-frontend/src/login/GoogleLoginButton.test.js
@@ -0,0 +1,20 @@
+import React from "react";
+import { render } from "@testing-library/react";
+
+import GoogleLoginButton from "login/GoogleLoginButton";
+
+test("GoogleLoginButton should pass a snapshot", () => {
+  const responseCheckFunction = () => {
+    return true;
+  };
+
+  const { asFragment } = render(
+    <GoogleLoginButton
+      buttonText="Google Sign in"
+      responseGoogleOnFailure={responseCheckFunction}
+      responseGoogleOnSuccess={responseCheckFunction}
+    />
+  );
+
+  expect(asFragment()).toMatchSnapshot();
+});

From a949ed3cf8e18d6dbbd8e90deff37fe08920addd Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:23:48 +0530
Subject: [PATCH 49/62] add snapshot file of test case in login

---
 .../GoogleLoginButton.test.js.snap            |  52 +++
 .../__snapshots__/LoginPanel.test.js.snap     | 297 ++++++++++++++++++
 2 files changed, 349 insertions(+)
 create mode 100644 react-frontend/src/login/__snapshots__/GoogleLoginButton.test.js.snap
 create mode 100644 react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap

diff --git a/react-frontend/src/login/__snapshots__/GoogleLoginButton.test.js.snap b/react-frontend/src/login/__snapshots__/GoogleLoginButton.test.js.snap
new file mode 100644
index 000000000..cea960bfe
--- /dev/null
+++ b/react-frontend/src/login/__snapshots__/GoogleLoginButton.test.js.snap
@@ -0,0 +1,52 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`GoogleLoginButton should pass a snapshot 1`] = `
+<DocumentFragment>
+  <button
+    disabled=""
+    style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
+    type="button"
+  >
+    <div
+      style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
+    >
+      <svg
+        height="18"
+        width="18"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <g
+          fill="#000"
+          fill-rule="evenodd"
+        >
+          <path
+            d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
+            fill="#EA4335"
+          />
+          <path
+            d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
+            fill="#4285F4"
+          />
+          <path
+            d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
+            fill="#FBBC05"
+          />
+          <path
+            d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
+            fill="#34A853"
+          />
+          <path
+            d="M0 0h18v18H0z"
+            fill="none"
+          />
+        </g>
+      </svg>
+    </div>
+    <span
+      style="font-weight: 500; padding: 10px 10px 10px 0px;"
+    >
+      Google Sign in
+    </span>
+  </button>
+</DocumentFragment>
+`;
diff --git a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
new file mode 100644
index 000000000..5b92d15bd
--- /dev/null
+++ b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
@@ -0,0 +1,297 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`LoginPanel should pass a snapshot 1`] = `
+<DocumentFragment>
+  .c4 {
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+  font-size: 48px;
+  color: var(--white);
+}
+
+.c3 {
+  text-align: center;
+  margin-top: 15px;
+  width: 83px;
+  height: 83px;
+  border: 3px solid var(--white);
+  background-color: var(--black);
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+
+.c5 {
+  color: var(--white);
+  background-color: var(--black);
+  font-size: 48px;
+}
+
+.c7 {
+  width: 10%;
+  background: var(--white);
+}
+
+.c6 {
+  color: var(--white);
+  background-color: var(--black);
+}
+
+.c1 {
+  height: calc(100% / 3);
+}
+
+.c2 {
+  padding-top: 1rem;
+}
+
+.c0 {
+  background-color: #334856;
+}
+
+<div
+    class="c0 d-none d-md-block  h-100"
+  >
+    <div
+      class="c1 row"
+    >
+      <div
+        class="c2 col"
+      >
+        <div
+          data-testid="peerlyLogoComponent"
+        >
+          <div
+            class="c3 mx-auto"
+            data-testid="Logo"
+          >
+            <div
+              class="c4"
+              data-testid="plusSignText"
+              font-size="48px"
+            >
+              +
+            </div>
+          </div>
+        </div>
+        <div
+          class="text-center"
+        >
+          <div
+            class="c5"
+            data-testid="PeerlyTextComponents"
+            font-size="48px"
+          >
+            Peerly
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="c1 row"
+    >
+      <div
+        class="text-center m-auto col"
+      >
+        <button
+          disabled=""
+          style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
+          type="button"
+        >
+          <div
+            style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
+          >
+            <svg
+              height="18"
+              width="18"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <g
+                fill="#000"
+                fill-rule="evenodd"
+              >
+                <path
+                  d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
+                  fill="#EA4335"
+                />
+                <path
+                  d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
+                  fill="#4285F4"
+                />
+                <path
+                  d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
+                  fill="#FBBC05"
+                />
+                <path
+                  d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
+                  fill="#34A853"
+                />
+                <path
+                  d="M0 0h18v18H0z"
+                  fill="none"
+                />
+              </g>
+            </svg>
+          </div>
+          <span
+            style="font-weight: 500; padding: 10px 10px 10px 0px;"
+          >
+            Google Sign in
+          </span>
+        </button>
+      </div>
+    </div>
+    <div
+      class="c1 row"
+    >
+      <div
+        class="col"
+      >
+        <div
+          class="c6 text-center undefined"
+          data-testid="info"
+        >
+          <h3>
+            Let Create
+          </h3>
+          <hr
+            class="c7"
+            data-testid="hrLine"
+          />
+          <h6>
+            office positive
+          </h6>
+        </div>
+      </div>
+    </div>
+  </div>
+  .c3 {
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+  font-size: 48px;
+  color: var(--white);
+}
+
+.c2 {
+  text-align: center;
+  margin-top: 15px;
+  width: 83px;
+  height: 83px;
+  border: 3px solid var(--white);
+  background-color: var(--black);
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+
+.c4 {
+  color: var(--white);
+  background-color: var(--black);
+  font-size: 48px;
+}
+
+.c1 {
+  padding-top: 1rem;
+}
+
+.c0 {
+  background-color: #334856;
+}
+
+<div
+    class="c0 d-block d-sm-block d-md-none h-100"
+  >
+    <div
+      class="h-50 row"
+    >
+      <div
+        class="c1 col"
+      >
+        <div
+          data-testid="peerlyLogoComponent"
+        >
+          <div
+            class="c2 mx-auto"
+            data-testid="Logo"
+          >
+            <div
+              class="c3"
+              data-testid="plusSignText"
+              font-size="48px"
+            >
+              +
+            </div>
+          </div>
+        </div>
+        <div
+          class="text-center"
+        >
+          <div
+            class="c4"
+            data-testid="PeerlyTextComponents"
+            font-size="48px"
+          >
+            Peerly
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="h-50 row"
+    >
+      <div
+        class="text-center m-auto col"
+      >
+        <button
+          disabled=""
+          style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
+          type="button"
+        >
+          <div
+            style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
+          >
+            <svg
+              height="18"
+              width="18"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <g
+                fill="#000"
+                fill-rule="evenodd"
+              >
+                <path
+                  d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
+                  fill="#EA4335"
+                />
+                <path
+                  d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
+                  fill="#4285F4"
+                />
+                <path
+                  d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
+                  fill="#FBBC05"
+                />
+                <path
+                  d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
+                  fill="#34A853"
+                />
+                <path
+                  d="M0 0h18v18H0z"
+                  fill="none"
+                />
+              </g>
+            </svg>
+          </div>
+          <span
+            style="font-weight: 500; padding: 10px 10px 10px 0px;"
+          >
+            Google Sign in
+          </span>
+        </button>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

From 67e15f1e2be92b02790e95f008209dd49772a8f0 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:35:03 +0530
Subject: [PATCH 50/62] add peerly.env.local file to give env variable details

---
 react-frontend/peerly.env.local | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 react-frontend/peerly.env.local

diff --git a/react-frontend/peerly.env.local b/react-frontend/peerly.env.local
new file mode 100644
index 000000000..62175691b
--- /dev/null
+++ b/react-frontend/peerly.env.local
@@ -0,0 +1 @@
+REACT_APP_GOOGLE_CLIENT_ID = "xxxxx"
\ No newline at end of file

From 5c612f44c495480db8940e0fe99823abb609bf9f Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:46:29 +0530
Subject: [PATCH 51/62] all component Wrap in React memo

---
 react-frontend/src/login/GoogleLoginButton.js | 2 +-
 react-frontend/src/login/LoginPanel.js        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/react-frontend/src/login/GoogleLoginButton.js b/react-frontend/src/login/GoogleLoginButton.js
index 77e6ec273..2da2beec1 100644
--- a/react-frontend/src/login/GoogleLoginButton.js
+++ b/react-frontend/src/login/GoogleLoginButton.js
@@ -26,4 +26,4 @@ GoogleLoginButtonComponent.propTypes = {
   buttonText: PropTypes.string,
 };
 
-export default GoogleLoginButtonComponent;
+export default React.memo(GoogleLoginButtonComponent);
diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 26ac28db1..f5de36c78 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -85,4 +85,4 @@ LoginPanel.defaultProps = {
   theme: "dark",
 };
 
-export default LoginPanel;
+export default React.memo(LoginPanel);

From 7bd2390ff850258c9bbfd30e35ef5fd98517e87e Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 17:51:22 +0530
Subject: [PATCH 52/62] set css color at Login panel background atomic and
 update snapshot

---
 react-frontend/src/login/LoginPanel.js                        | 2 +-
 .../src/login/__snapshots__/LoginPanel.test.js.snap           | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index f5de36c78..1a7931449 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -15,7 +15,7 @@ const FirstCol = styled(Col)`
 `;
 const Wrapper = styled.div`
   background-color: ${({ theme }) =>
-    theme === "dark" ? "#334856" : "var(--white)"};
+    theme === "dark" ? "var(--atomic)" : "var(--white)"};
 `;
 
 const LoginPanel = ({
diff --git a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
index 5b92d15bd..801851066 100644
--- a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
+++ b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
@@ -47,7 +47,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
 }
 
 .c0 {
-  background-color: #334856;
+  background-color: var(--atomic);
 }
 
 <div
@@ -197,7 +197,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
 }
 
 .c0 {
-  background-color: #334856;
+  background-color: var(--atomic);
 }
 
 <div

From 4069360b90da9210d9c9314f447a18b2aca47707 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 18:46:38 +0530
Subject: [PATCH 53/62] delete peerly.env.local

---
 react-frontend/peerly.env.local | 1 -
 1 file changed, 1 deletion(-)
 delete mode 100644 react-frontend/peerly.env.local

diff --git a/react-frontend/peerly.env.local b/react-frontend/peerly.env.local
deleted file mode 100644
index 62175691b..000000000
--- a/react-frontend/peerly.env.local
+++ /dev/null
@@ -1 +0,0 @@
-REACT_APP_GOOGLE_CLIENT_ID = "xxxxx"
\ No newline at end of file

From 6ce2df5ab734479c8a889a834ab3815d6d054b27 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 18:52:50 +0530
Subject: [PATCH 54/62] resolve comment's on LoginPanel Component and update
 test case

---
 react-frontend/src/login/LoginPanel.js        | 41 +++++----------
 .../__snapshots__/LoginPanel.test.js.snap     | 52 ++++++++-----------
 2 files changed, 36 insertions(+), 57 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 1a7931449..5f1f514c0 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -10,60 +10,54 @@ import GoogleLoginButton from "login/GoogleLoginButton";
 const RowComponent = styled(Row)`
   height: calc(100% / 3);
 `;
-const FirstCol = styled(Col)`
-  padding-top: 1rem;
-`;
 const Wrapper = styled.div`
-  background-color: ${({ theme }) =>
-    theme === "dark" ? "var(--atomic)" : "var(--white)"};
+  background-color: var(--atomic);
 `;
 
 const LoginPanel = ({
-  buttonText,
   informativeText,
   encouragementThought,
   responseGoogleOnSuccess,
   responseGoogleOnFailure,
-  theme,
 }) => (
   <>
-    <Wrapper className="d-none d-md-block  h-100" theme={theme}>
+    <Wrapper className="d-none d-md-block  h-100">
       <RowComponent>
-        <FirstCol>
-          <PeerlyTextAndLogo theme={theme} />
-        </FirstCol>
+        <Col className="pt-3">
+          <PeerlyTextAndLogo theme="dark" />
+        </Col>
       </RowComponent>
       <RowComponent>
         <Col className="text-center m-auto">
           <GoogleLoginButton
             responseGoogleOnSuccess={responseGoogleOnSuccess}
             responseGoogleOnFailure={responseGoogleOnFailure}
-            buttonText={buttonText}
+            buttonText="Google sign in"
           ></GoogleLoginButton>
         </Col>
       </RowComponent>
       <RowComponent>
-        <Col>
+        <Col className="my-auto">
           <InformativeTextComponent
             informativeText={informativeText}
             encouragementThought={encouragementThought}
-            theme={theme}
+            theme="dark"
           />
         </Col>
       </RowComponent>
     </Wrapper>
-    <Wrapper className="d-block d-sm-block d-md-none h-100" theme={theme}>
-      <Row className="h-50">
-        <FirstCol>
-          <PeerlyTextAndLogo theme={theme} />
-        </FirstCol>
+    <Wrapper className="d-block d-sm-block d-md-none h-100">
+      <Row className="h-50 pt-3">
+        <Col className="p-1">
+          <PeerlyTextAndLogo theme="dark" />
+        </Col>
       </Row>
       <Row className="h-50">
         <Col className="text-center m-auto">
           <GoogleLoginButton
             responseGoogleOnSuccess={responseGoogleOnSuccess}
             responseGoogleOnFailure={responseGoogleOnFailure}
-            buttonText={buttonText}
+            buttonText="Google sign in"
           ></GoogleLoginButton>
         </Col>
       </Row>
@@ -72,17 +66,10 @@ const LoginPanel = ({
 );
 
 LoginPanel.propTypes = {
-  buttonText: PropTypes.string,
   informativeText: PropTypes.string,
   encouragementThought: PropTypes.string,
   responseGoogleOnSuccess: PropTypes.func.isRequired,
   responseGoogleOnFailure: PropTypes.func.isRequired,
-  theme: PropTypes.oneOf(["dark", "light"]),
-};
-
-LoginPanel.defaultProps = {
-  buttonText: " Sign in with Google",
-  theme: "dark",
 };
 
 export default React.memo(LoginPanel);
diff --git a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
index 801851066..b7c9bf245 100644
--- a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
+++ b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`LoginPanel should pass a snapshot 1`] = `
 <DocumentFragment>
-  .c4 {
+  .c3 {
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
@@ -10,7 +10,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   color: var(--white);
 }
 
-.c3 {
+.c2 {
   text-align: center;
   margin-top: 15px;
   width: 83px;
@@ -22,18 +22,18 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   transform: rotate(45deg);
 }
 
-.c5 {
+.c4 {
   color: var(--white);
   background-color: var(--black);
   font-size: 48px;
 }
 
-.c7 {
+.c6 {
   width: 10%;
   background: var(--white);
 }
 
-.c6 {
+.c5 {
   color: var(--white);
   background-color: var(--black);
 }
@@ -42,10 +42,6 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   height: calc(100% / 3);
 }
 
-.c2 {
-  padding-top: 1rem;
-}
-
 .c0 {
   background-color: var(--atomic);
 }
@@ -57,17 +53,17 @@ exports[`LoginPanel should pass a snapshot 1`] = `
       class="c1 row"
     >
       <div
-        class="c2 col"
+        class="pt-3 col"
       >
         <div
           data-testid="peerlyLogoComponent"
         >
           <div
-            class="c3 mx-auto"
+            class="c2 mx-auto"
             data-testid="Logo"
           >
             <div
-              class="c4"
+              class="c3"
               data-testid="plusSignText"
               font-size="48px"
             >
@@ -79,7 +75,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
           class="text-center"
         >
           <div
-            class="c5"
+            class="c4"
             data-testid="PeerlyTextComponents"
             font-size="48px"
           >
@@ -137,7 +133,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
           <span
             style="font-weight: 500; padding: 10px 10px 10px 0px;"
           >
-            Google Sign in
+            Google sign in
           </span>
         </button>
       </div>
@@ -146,17 +142,17 @@ exports[`LoginPanel should pass a snapshot 1`] = `
       class="c1 row"
     >
       <div
-        class="col"
+        class="my-auto col"
       >
         <div
-          class="c6 text-center undefined"
+          class="c5 text-center undefined"
           data-testid="info"
         >
           <h3>
             Let Create
           </h3>
           <hr
-            class="c7"
+            class="c6"
             data-testid="hrLine"
           />
           <h6>
@@ -166,7 +162,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
       </div>
     </div>
   </div>
-  .c3 {
+  .c2 {
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
@@ -174,7 +170,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   color: var(--white);
 }
 
-.c2 {
+.c1 {
   text-align: center;
   margin-top: 15px;
   width: 83px;
@@ -186,16 +182,12 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   transform: rotate(45deg);
 }
 
-.c4 {
+.c3 {
   color: var(--white);
   background-color: var(--black);
   font-size: 48px;
 }
 
-.c1 {
-  padding-top: 1rem;
-}
-
 .c0 {
   background-color: var(--atomic);
 }
@@ -204,20 +196,20 @@ exports[`LoginPanel should pass a snapshot 1`] = `
     class="c0 d-block d-sm-block d-md-none h-100"
   >
     <div
-      class="h-50 row"
+      class="h-50 pt-3 row"
     >
       <div
-        class="c1 col"
+        class="p-1 col"
       >
         <div
           data-testid="peerlyLogoComponent"
         >
           <div
-            class="c2 mx-auto"
+            class="c1 mx-auto"
             data-testid="Logo"
           >
             <div
-              class="c3"
+              class="c2"
               data-testid="plusSignText"
               font-size="48px"
             >
@@ -229,7 +221,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
           class="text-center"
         >
           <div
-            class="c4"
+            class="c3"
             data-testid="PeerlyTextComponents"
             font-size="48px"
           >
@@ -287,7 +279,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
           <span
             style="font-weight: 500; padding: 10px 10px 10px 0px;"
           >
-            Google Sign in
+            Google sign in
           </span>
         </button>
       </div>

From b53e5b0b597375e3e27c0ca5552706045ca606e9 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 18:53:44 +0530
Subject: [PATCH 55/62] add google cookie policy set as env variable

---
 react-frontend/src/login/GoogleLoginButton.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/react-frontend/src/login/GoogleLoginButton.js b/react-frontend/src/login/GoogleLoginButton.js
index 2da2beec1..e2a24730a 100644
--- a/react-frontend/src/login/GoogleLoginButton.js
+++ b/react-frontend/src/login/GoogleLoginButton.js
@@ -12,7 +12,7 @@ const GoogleLoginButtonComponent = ({
     buttonText={buttonText}
     onSuccess={responseGoogleOnSuccess}
     onFailure={responseGoogleOnFailure}
-    cookiePolicy={"single_host_origin"}
+    cookiePolicy={process.env.REACT_APP_GOOGLE_COOKIE_POLICY}
   />
 );
 

From 8870a9766941bb64a43308a9a2e1b878ee7e5f69 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Mon, 8 Jun 2020 19:45:37 +0530
Subject: [PATCH 56/62] remove informative text and encouragementThought text
 as props

---
 react-frontend/src/login/LoginPanel.js          | 17 +++--------------
 .../login/__snapshots__/LoginPanel.test.js.snap |  4 ++--
 2 files changed, 5 insertions(+), 16 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 5f1f514c0..2b646c592 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -14,12 +14,7 @@ const Wrapper = styled.div`
   background-color: var(--atomic);
 `;
 
-const LoginPanel = ({
-  informativeText,
-  encouragementThought,
-  responseGoogleOnSuccess,
-  responseGoogleOnFailure,
-}) => (
+const LoginPanel = ({ responseGoogleOnSuccess, responseGoogleOnFailure }) => (
   <>
     <Wrapper className="d-none d-md-block  h-100">
       <RowComponent>
@@ -33,16 +28,12 @@ const LoginPanel = ({
             responseGoogleOnSuccess={responseGoogleOnSuccess}
             responseGoogleOnFailure={responseGoogleOnFailure}
             buttonText="Google sign in"
-          ></GoogleLoginButton>
+          />
         </Col>
       </RowComponent>
       <RowComponent>
         <Col className="my-auto">
-          <InformativeTextComponent
-            informativeText={informativeText}
-            encouragementThought={encouragementThought}
-            theme="dark"
-          />
+          <InformativeTextComponent theme="dark" />
         </Col>
       </RowComponent>
     </Wrapper>
@@ -66,8 +57,6 @@ const LoginPanel = ({
 );
 
 LoginPanel.propTypes = {
-  informativeText: PropTypes.string,
-  encouragementThought: PropTypes.string,
   responseGoogleOnSuccess: PropTypes.func.isRequired,
   responseGoogleOnFailure: PropTypes.func.isRequired,
 };
diff --git a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
index b7c9bf245..3ed22cbc6 100644
--- a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
+++ b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
@@ -149,14 +149,14 @@ exports[`LoginPanel should pass a snapshot 1`] = `
           data-testid="info"
         >
           <h3>
-            Let Create
+            Lets Create the Office Positive
           </h3>
           <hr
             class="c6"
             data-testid="hrLine"
           />
           <h6>
-            office positive
+            Encouragement Driven
           </h6>
         </div>
       </div>

From fff96ac9ba2d6c935388924192a165b3d996c3c0 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 9 Jun 2020 11:22:43 +0530
Subject: [PATCH 57/62] add height for loginpanel and wrapper Div in container

---
 react-frontend/src/login/LoginPanel.js | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index 2b646c592..dd8e05d73 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -4,19 +4,25 @@ import styled from "styled-components";
 
 import PeerlyTextAndLogo from "shared-components/peerly-logo/PeerlyTextAndLogo";
 import InformativeTextComponent from "login/InformativeTextComponent";
-import { Col, Row } from "core-components/grid/GridComponent";
+import { Col, Row, Container } from "core-components/grid/GridComponent";
 import GoogleLoginButton from "login/GoogleLoginButton";
 
 const RowComponent = styled(Row)`
   height: calc(100% / 3);
 `;
-const Wrapper = styled.div`
+const Div = styled.div`
   background-color: var(--atomic);
+  height: 100vh;
+`;
+
+const WrapperContainer = styled(Container)`
+  height: 100vh;
+  padding: 0%;
 `;
 
 const LoginPanel = ({ responseGoogleOnSuccess, responseGoogleOnFailure }) => (
-  <>
-    <Wrapper className="d-none d-md-block  h-100">
+  <WrapperContainer fluid={true}>
+    <Div className="d-none d-md-block  h-100">
       <RowComponent>
         <Col className="pt-3">
           <PeerlyTextAndLogo theme="dark" />
@@ -36,8 +42,8 @@ const LoginPanel = ({ responseGoogleOnSuccess, responseGoogleOnFailure }) => (
           <InformativeTextComponent theme="dark" />
         </Col>
       </RowComponent>
-    </Wrapper>
-    <Wrapper className="d-block d-sm-block d-md-none h-100">
+    </Div>
+    <Div className="d-block d-sm-block d-md-none h-100">
       <Row className="h-50 pt-3">
         <Col className="p-1">
           <PeerlyTextAndLogo theme="dark" />
@@ -52,8 +58,8 @@ const LoginPanel = ({ responseGoogleOnSuccess, responseGoogleOnFailure }) => (
           ></GoogleLoginButton>
         </Col>
       </Row>
-    </Wrapper>
-  </>
+    </Div>
+  </WrapperContainer>
 );
 
 LoginPanel.propTypes = {

From b96887b18825145d68fb8f0c25b01d5398ae44de Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Tue, 9 Jun 2020 11:24:51 +0530
Subject: [PATCH 58/62] update snapshot of LoginPanel.test.js

---
 .../__snapshots__/LoginPanel.test.js.snap     | 354 +++++++++---------
 1 file changed, 167 insertions(+), 187 deletions(-)

diff --git a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
index 3ed22cbc6..476cb5265 100644
--- a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
+++ b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`LoginPanel should pass a snapshot 1`] = `
 <DocumentFragment>
-  .c3 {
+  .c4 {
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
@@ -10,7 +10,7 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   color: var(--white);
 }
 
-.c2 {
+.c3 {
   text-align: center;
   margin-top: 15px;
   width: 83px;
@@ -22,266 +22,246 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   transform: rotate(45deg);
 }
 
-.c4 {
+.c5 {
   color: var(--white);
   background-color: var(--black);
   font-size: 48px;
 }
 
-.c6 {
+.c7 {
   width: 10%;
   background: var(--white);
 }
 
-.c5 {
+.c6 {
   color: var(--white);
   background-color: var(--black);
 }
 
-.c1 {
+.c2 {
   height: calc(100% / 3);
 }
 
-.c0 {
+.c1 {
   background-color: var(--atomic);
+  height: 100vh;
+}
+
+.c0 {
+  height: 100vh;
+  padding: 0%;
 }
 
 <div
-    class="c0 d-none d-md-block  h-100"
+    class="c0 container-fluid"
   >
     <div
-      class="c1 row"
+      class="c1 d-none d-md-block  h-100"
     >
       <div
-        class="pt-3 col"
+        class="c2 row"
       >
         <div
-          data-testid="peerlyLogoComponent"
+          class="pt-3 col"
         >
           <div
-            class="c2 mx-auto"
-            data-testid="Logo"
+            data-testid="peerlyLogoComponent"
           >
             <div
-              class="c3"
-              data-testid="plusSignText"
-              font-size="48px"
+              class="c3 mx-auto"
+              data-testid="Logo"
             >
-              +
+              <div
+                class="c4"
+                data-testid="plusSignText"
+                font-size="48px"
+              >
+                +
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          class="text-center"
-        >
           <div
-            class="c4"
-            data-testid="PeerlyTextComponents"
-            font-size="48px"
+            class="text-center"
           >
-            Peerly
+            <div
+              class="c5"
+              data-testid="PeerlyTextComponents"
+              font-size="48px"
+            >
+              Peerly
+            </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="c1 row"
-    >
       <div
-        class="text-center m-auto col"
+        class="c2 row"
       >
-        <button
-          disabled=""
-          style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
-          type="button"
+        <div
+          class="text-center m-auto col"
         >
-          <div
-            style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
+          <button
+            disabled=""
+            style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
+            type="button"
           >
-            <svg
-              height="18"
-              width="18"
-              xmlns="http://www.w3.org/2000/svg"
+            <div
+              style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
             >
-              <g
-                fill="#000"
-                fill-rule="evenodd"
+              <svg
+                height="18"
+                width="18"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <path
-                  d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
-                  fill="#EA4335"
-                />
-                <path
-                  d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
-                  fill="#4285F4"
-                />
-                <path
-                  d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
-                  fill="#FBBC05"
-                />
-                <path
-                  d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
-                  fill="#34A853"
-                />
-                <path
-                  d="M0 0h18v18H0z"
-                  fill="none"
-                />
-              </g>
-            </svg>
-          </div>
-          <span
-            style="font-weight: 500; padding: 10px 10px 10px 0px;"
-          >
-            Google sign in
-          </span>
-        </button>
+                <g
+                  fill="#000"
+                  fill-rule="evenodd"
+                >
+                  <path
+                    d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
+                    fill="#EA4335"
+                  />
+                  <path
+                    d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
+                    fill="#4285F4"
+                  />
+                  <path
+                    d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
+                    fill="#FBBC05"
+                  />
+                  <path
+                    d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
+                    fill="#34A853"
+                  />
+                  <path
+                    d="M0 0h18v18H0z"
+                    fill="none"
+                  />
+                </g>
+              </svg>
+            </div>
+            <span
+              style="font-weight: 500; padding: 10px 10px 10px 0px;"
+            >
+              Google sign in
+            </span>
+          </button>
+        </div>
       </div>
-    </div>
-    <div
-      class="c1 row"
-    >
       <div
-        class="my-auto col"
+        class="c2 row"
       >
         <div
-          class="c5 text-center undefined"
-          data-testid="info"
+          class="my-auto col"
         >
-          <h3>
-            Lets Create the Office Positive
-          </h3>
-          <hr
-            class="c6"
-            data-testid="hrLine"
-          />
-          <h6>
-            Encouragement Driven
-          </h6>
+          <div
+            class="c6 text-center undefined"
+            data-testid="info"
+          >
+            <h3>
+              Lets Create the Office Positive
+            </h3>
+            <hr
+              class="c7"
+              data-testid="hrLine"
+            />
+            <h6>
+              Encouragement Driven
+            </h6>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  .c2 {
-  -webkit-transform: rotate(45deg);
-  -ms-transform: rotate(45deg);
-  transform: rotate(45deg);
-  font-size: 48px;
-  color: var(--white);
-}
-
-.c1 {
-  text-align: center;
-  margin-top: 15px;
-  width: 83px;
-  height: 83px;
-  border: 3px solid var(--white);
-  background-color: var(--black);
-  -webkit-transform: rotate(45deg);
-  -ms-transform: rotate(45deg);
-  transform: rotate(45deg);
-}
-
-.c3 {
-  color: var(--white);
-  background-color: var(--black);
-  font-size: 48px;
-}
-
-.c0 {
-  background-color: var(--atomic);
-}
-
-<div
-    class="c0 d-block d-sm-block d-md-none h-100"
-  >
     <div
-      class="h-50 pt-3 row"
+      class="c1 d-block d-sm-block d-md-none h-100"
     >
       <div
-        class="p-1 col"
+        class="h-50 pt-3 row"
       >
         <div
-          data-testid="peerlyLogoComponent"
+          class="p-1 col"
         >
           <div
-            class="c1 mx-auto"
-            data-testid="Logo"
+            data-testid="peerlyLogoComponent"
           >
             <div
-              class="c2"
-              data-testid="plusSignText"
-              font-size="48px"
+              class="c3 mx-auto"
+              data-testid="Logo"
             >
-              +
+              <div
+                class="c4"
+                data-testid="plusSignText"
+                font-size="48px"
+              >
+                +
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          class="text-center"
-        >
           <div
-            class="c3"
-            data-testid="PeerlyTextComponents"
-            font-size="48px"
+            class="text-center"
           >
-            Peerly
+            <div
+              class="c5"
+              data-testid="PeerlyTextComponents"
+              font-size="48px"
+            >
+              Peerly
+            </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="h-50 row"
-    >
       <div
-        class="text-center m-auto col"
+        class="h-50 row"
       >
-        <button
-          disabled=""
-          style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
-          type="button"
+        <div
+          class="text-center m-auto col"
         >
-          <div
-            style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
+          <button
+            disabled=""
+            style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
+            type="button"
           >
-            <svg
-              height="18"
-              width="18"
-              xmlns="http://www.w3.org/2000/svg"
+            <div
+              style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
             >
-              <g
-                fill="#000"
-                fill-rule="evenodd"
+              <svg
+                height="18"
+                width="18"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <path
-                  d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
-                  fill="#EA4335"
-                />
-                <path
-                  d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
-                  fill="#4285F4"
-                />
-                <path
-                  d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
-                  fill="#FBBC05"
-                />
-                <path
-                  d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
-                  fill="#34A853"
-                />
-                <path
-                  d="M0 0h18v18H0z"
-                  fill="none"
-                />
-              </g>
-            </svg>
-          </div>
-          <span
-            style="font-weight: 500; padding: 10px 10px 10px 0px;"
-          >
-            Google sign in
-          </span>
-        </button>
+                <g
+                  fill="#000"
+                  fill-rule="evenodd"
+                >
+                  <path
+                    d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
+                    fill="#EA4335"
+                  />
+                  <path
+                    d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
+                    fill="#4285F4"
+                  />
+                  <path
+                    d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
+                    fill="#FBBC05"
+                  />
+                  <path
+                    d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
+                    fill="#34A853"
+                  />
+                  <path
+                    d="M0 0h18v18H0z"
+                    fill="none"
+                  />
+                </g>
+              </svg>
+            </div>
+            <span
+              style="font-weight: 500; padding: 10px 10px 10px 0px;"
+            >
+              Google sign in
+            </span>
+          </button>
+        </div>
       </div>
     </div>
   </div>

From 29813e9c901cd0dacf993b360364d255c39ff796 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 11 Jun 2020 11:18:48 +0530
Subject: [PATCH 59/62] update Login Panel component remove all extra style for
 equal height and remove row and col structure

---
 react-frontend/src/login/LoginPanel.js      | 70 +++++++--------------
 react-frontend/src/login/LoginPanel.test.js |  5 --
 2 files changed, 22 insertions(+), 53 deletions(-)

diff --git a/react-frontend/src/login/LoginPanel.js b/react-frontend/src/login/LoginPanel.js
index dd8e05d73..96432e3df 100644
--- a/react-frontend/src/login/LoginPanel.js
+++ b/react-frontend/src/login/LoginPanel.js
@@ -4,61 +4,35 @@ import styled from "styled-components";
 
 import PeerlyTextAndLogo from "shared-components/peerly-logo/PeerlyTextAndLogo";
 import InformativeTextComponent from "login/InformativeTextComponent";
-import { Col, Row, Container } from "core-components/grid/GridComponent";
+import { Container } from "core-components/grid/GridComponent";
 import GoogleLoginButton from "login/GoogleLoginButton";
 
-const RowComponent = styled(Row)`
-  height: calc(100% / 3);
-`;
-const Div = styled.div`
-  background-color: var(--atomic);
-  height: 100vh;
-`;
-
 const WrapperContainer = styled(Container)`
   height: 100vh;
-  padding: 0%;
+  background-color: var(--atomic);
 `;
 
 const LoginPanel = ({ responseGoogleOnSuccess, responseGoogleOnFailure }) => (
-  <WrapperContainer fluid={true}>
-    <Div className="d-none d-md-block  h-100">
-      <RowComponent>
-        <Col className="pt-3">
-          <PeerlyTextAndLogo theme="dark" />
-        </Col>
-      </RowComponent>
-      <RowComponent>
-        <Col className="text-center m-auto">
-          <GoogleLoginButton
-            responseGoogleOnSuccess={responseGoogleOnSuccess}
-            responseGoogleOnFailure={responseGoogleOnFailure}
-            buttonText="Google sign in"
-          />
-        </Col>
-      </RowComponent>
-      <RowComponent>
-        <Col className="my-auto">
-          <InformativeTextComponent theme="dark" />
-        </Col>
-      </RowComponent>
-    </Div>
-    <Div className="d-block d-sm-block d-md-none h-100">
-      <Row className="h-50 pt-3">
-        <Col className="p-1">
-          <PeerlyTextAndLogo theme="dark" />
-        </Col>
-      </Row>
-      <Row className="h-50">
-        <Col className="text-center m-auto">
-          <GoogleLoginButton
-            responseGoogleOnSuccess={responseGoogleOnSuccess}
-            responseGoogleOnFailure={responseGoogleOnFailure}
-            buttonText="Google sign in"
-          ></GoogleLoginButton>
-        </Col>
-      </Row>
-    </Div>
+  <WrapperContainer
+    className="flex-column justify-content-around d-flex"
+    fluid={true}
+  >
+    <div className="mb-5">
+      <PeerlyTextAndLogo theme="dark" />
+    </div>
+    <div className="text-center mb-3 pb-4">
+      <GoogleLoginButton
+        responseGoogleOnSuccess={responseGoogleOnSuccess}
+        responseGoogleOnFailure={responseGoogleOnFailure}
+        buttonText="Google sign in"
+      ></GoogleLoginButton>
+    </div>
+    <InformativeTextComponent
+      className="d-none d-md-block d-lg-block mt-4"
+      theme="dark"
+      informativeText="Lets Create the Office Positive"
+      encouragementThought="Encouragement Driven"
+    />
   </WrapperContainer>
 );
 
diff --git a/react-frontend/src/login/LoginPanel.test.js b/react-frontend/src/login/LoginPanel.test.js
index c109af8e0..5671c7ae6 100644
--- a/react-frontend/src/login/LoginPanel.test.js
+++ b/react-frontend/src/login/LoginPanel.test.js
@@ -10,14 +10,9 @@ test("LoginPanel should pass a snapshot", () => {
 
   const { asFragment } = render(
     <LoginPanel
-      informativeText="Let Create"
-      buttonText="Google Sign in"
-      encouragementThought="office positive"
-      theme="dark"
       responseGoogleOnFailure={responseCheckFunction}
       responseGoogleOnSuccess={responseCheckFunction}
     />
   );
-
   expect(asFragment()).toMatchSnapshot();
 });

From e610d3dbb833a7f78c314f5b954212a31f48ada6 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 11 Jun 2020 11:22:30 +0530
Subject: [PATCH 60/62] add snapshot of LoginPanel for test case

---
 .../__snapshots__/LoginPanel.test.js.snap     | 276 +++++-------------
 1 file changed, 77 insertions(+), 199 deletions(-)

diff --git a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
index 476cb5265..697c6c058 100644
--- a/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
+++ b/react-frontend/src/login/__snapshots__/LoginPanel.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`LoginPanel should pass a snapshot 1`] = `
 <DocumentFragment>
-  .c4 {
+  .c2 {
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
@@ -10,259 +10,137 @@ exports[`LoginPanel should pass a snapshot 1`] = `
   color: var(--white);
 }
 
-.c3 {
+.c1 {
   text-align: center;
   margin-top: 15px;
   width: 83px;
   height: 83px;
   border: 3px solid var(--white);
-  background-color: var(--black);
+  background-color: var(--atomic);
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
 }
 
-.c5 {
+.c3 {
   color: var(--white);
-  background-color: var(--black);
+  background-color: var(--atomic);
   font-size: 48px;
 }
 
-.c7 {
+.c5 {
   width: 10%;
   background: var(--white);
 }
 
-.c6 {
+.c4 {
   color: var(--white);
-  background-color: var(--black);
-}
-
-.c2 {
-  height: calc(100% / 3);
-}
-
-.c1 {
   background-color: var(--atomic);
-  height: 100vh;
 }
 
 .c0 {
   height: 100vh;
-  padding: 0%;
+  background-color: var(--atomic);
 }
 
 <div
-    class="c0 container-fluid"
+    class="c0 flex-column justify-content-around d-flex container-fluid"
   >
     <div
-      class="c1 d-none d-md-block  h-100"
+      class="mb-5"
     >
       <div
-        class="c2 row"
+        data-testid="peerlyLogoComponent"
       >
         <div
-          class="pt-3 col"
+          class="c1 mx-auto"
+          data-testid="Logo"
         >
           <div
-            data-testid="peerlyLogoComponent"
-          >
-            <div
-              class="c3 mx-auto"
-              data-testid="Logo"
-            >
-              <div
-                class="c4"
-                data-testid="plusSignText"
-                font-size="48px"
-              >
-                +
-              </div>
-            </div>
-          </div>
-          <div
-            class="text-center"
+            class="c2"
+            data-testid="plusSignText"
+            font-size="48px"
           >
-            <div
-              class="c5"
-              data-testid="PeerlyTextComponents"
-              font-size="48px"
-            >
-              Peerly
-            </div>
+            +
           </div>
         </div>
       </div>
       <div
-        class="c2 row"
-      >
-        <div
-          class="text-center m-auto col"
-        >
-          <button
-            disabled=""
-            style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
-            type="button"
-          >
-            <div
-              style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
-            >
-              <svg
-                height="18"
-                width="18"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <g
-                  fill="#000"
-                  fill-rule="evenodd"
-                >
-                  <path
-                    d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
-                    fill="#EA4335"
-                  />
-                  <path
-                    d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
-                    fill="#4285F4"
-                  />
-                  <path
-                    d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
-                    fill="#FBBC05"
-                  />
-                  <path
-                    d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
-                    fill="#34A853"
-                  />
-                  <path
-                    d="M0 0h18v18H0z"
-                    fill="none"
-                  />
-                </g>
-              </svg>
-            </div>
-            <span
-              style="font-weight: 500; padding: 10px 10px 10px 0px;"
-            >
-              Google sign in
-            </span>
-          </button>
-        </div>
-      </div>
-      <div
-        class="c2 row"
+        class="text-center"
       >
         <div
-          class="my-auto col"
+          class="c3"
+          data-testid="PeerlyTextComponents"
+          font-size="48px"
         >
-          <div
-            class="c6 text-center undefined"
-            data-testid="info"
-          >
-            <h3>
-              Lets Create the Office Positive
-            </h3>
-            <hr
-              class="c7"
-              data-testid="hrLine"
-            />
-            <h6>
-              Encouragement Driven
-            </h6>
-          </div>
+          Peerly
         </div>
       </div>
     </div>
     <div
-      class="c1 d-block d-sm-block d-md-none h-100"
+      class="text-center mb-3 pb-4"
     >
-      <div
-        class="h-50 pt-3 row"
+      <button
+        disabled=""
+        style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
+        type="button"
       >
         <div
-          class="p-1 col"
+          style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
         >
-          <div
-            data-testid="peerlyLogoComponent"
-          >
-            <div
-              class="c3 mx-auto"
-              data-testid="Logo"
-            >
-              <div
-                class="c4"
-                data-testid="plusSignText"
-                font-size="48px"
-              >
-                +
-              </div>
-            </div>
-          </div>
-          <div
-            class="text-center"
+          <svg
+            height="18"
+            width="18"
+            xmlns="http://www.w3.org/2000/svg"
           >
-            <div
-              class="c5"
-              data-testid="PeerlyTextComponents"
-              font-size="48px"
+            <g
+              fill="#000"
+              fill-rule="evenodd"
             >
-              Peerly
-            </div>
-          </div>
+              <path
+                d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
+                fill="#EA4335"
+              />
+              <path
+                d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
+                fill="#4285F4"
+              />
+              <path
+                d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
+                fill="#FBBC05"
+              />
+              <path
+                d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
+                fill="#34A853"
+              />
+              <path
+                d="M0 0h18v18H0z"
+                fill="none"
+              />
+            </g>
+          </svg>
         </div>
-      </div>
-      <div
-        class="h-50 row"
-      >
-        <div
-          class="text-center m-auto col"
+        <span
+          style="font-weight: 500; padding: 10px 10px 10px 0px;"
         >
-          <button
-            disabled=""
-            style="background-color: rgb(255, 255, 255); display: inline-flex; align-items: center; color: rgba(0, 0, 0, 0.54); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24), 0 0 1px 0 rgba(0, 0, 0, .24); padding: 0px; border-radius: 2px; border: 1px solid transparent; font-size: 14px; font-weight: 500; font-family: Roboto, sans-serif; opacity: 0.6;"
-            type="button"
-          >
-            <div
-              style="margin-right: 10px; background: rgb(255, 255, 255); padding: 10px; border-radius: 2px;"
-            >
-              <svg
-                height="18"
-                width="18"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <g
-                  fill="#000"
-                  fill-rule="evenodd"
-                >
-                  <path
-                    d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z"
-                    fill="#EA4335"
-                  />
-                  <path
-                    d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z"
-                    fill="#4285F4"
-                  />
-                  <path
-                    d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z"
-                    fill="#FBBC05"
-                  />
-                  <path
-                    d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z"
-                    fill="#34A853"
-                  />
-                  <path
-                    d="M0 0h18v18H0z"
-                    fill="none"
-                  />
-                </g>
-              </svg>
-            </div>
-            <span
-              style="font-weight: 500; padding: 10px 10px 10px 0px;"
-            >
-              Google sign in
-            </span>
-          </button>
-        </div>
-      </div>
+          Google sign in
+        </span>
+      </button>
+    </div>
+    <div
+      class="c4 text-center d-none d-md-block d-lg-block mt-4"
+      data-testid="info"
+    >
+      <h3>
+        Lets Create the Office Positive
+      </h3>
+      <hr
+        class="c5"
+        data-testid="hrLine"
+      />
+      <h6>
+        Encouragement Driven
+      </h6>
     </div>
   </div>
 </DocumentFragment>

From aeb6c5257c77905ca225d5e943a7a9e69694f2ba Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 11 Jun 2020 13:15:36 +0530
Subject: [PATCH 61/62] add env variable into addConstants.js file and use in
 GoogleLoginButton Component

---
 react-frontend/src/constants/appConstants.js  | 4 ++++
 react-frontend/src/login/GoogleLoginButton.js | 6 ++++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/react-frontend/src/constants/appConstants.js b/react-frontend/src/constants/appConstants.js
index 4c07653ee..4556a5b93 100644
--- a/react-frontend/src/constants/appConstants.js
+++ b/react-frontend/src/constants/appConstants.js
@@ -1,3 +1,7 @@
 export const REDIRECT_TIMEOUT = 3000;
 
 export const IMG_BASE_PATH = `${process.env.PUBLIC_URL}/assets/images/`;
+
+export const GOOGLE_CLIENT_ID = process.env.REACT_APP_GOOGLE_CLIENT_ID;
+
+export const GOOGLE_COOKIE_POLICY = process.env.REACT_APP_GOOGLE_COOKIE_POLICY;
diff --git a/react-frontend/src/login/GoogleLoginButton.js b/react-frontend/src/login/GoogleLoginButton.js
index e2a24730a..a4fb63e71 100644
--- a/react-frontend/src/login/GoogleLoginButton.js
+++ b/react-frontend/src/login/GoogleLoginButton.js
@@ -2,17 +2,19 @@ import React from "react";
 import PropTypes from "prop-types";
 import GoogleLogin from "react-google-login";
 
+import { GOOGLE_CLIENT_ID, GOOGLE_COOKIE_POLICY } from "constants/appConstants";
+
 const GoogleLoginButtonComponent = ({
   responseGoogleOnSuccess,
   responseGoogleOnFailure,
   buttonText,
 }) => (
   <GoogleLogin
-    clientId={process.env.REACT_APP_GOOGLE_CLIENT_ID}
+    clientId={GOOGLE_CLIENT_ID}
     buttonText={buttonText}
     onSuccess={responseGoogleOnSuccess}
     onFailure={responseGoogleOnFailure}
-    cookiePolicy={process.env.REACT_APP_GOOGLE_COOKIE_POLICY}
+    cookiePolicy={GOOGLE_COOKIE_POLICY}
   />
 );
 

From bb4f37a6b0fd69d488a088e3e61dd008d336aed8 Mon Sep 17 00:00:00 2001
From: Jitu007-Bunde <jitendrasbunde@gmail.com>
Date: Thu, 11 Jun 2020 13:22:58 +0530
Subject: [PATCH 62/62] add package-lock.json for react-google-login npm
 package

---
 react-frontend/package-lock.json | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/react-frontend/package-lock.json b/react-frontend/package-lock.json
index 9013687b6..991b54e09 100644
--- a/react-frontend/package-lock.json
+++ b/react-frontend/package-lock.json
@@ -11626,6 +11626,15 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.7.tgz",
       "integrity": "sha512-TAv1KJFh3RhqxNvhzxj6LeT5NWklP6rDr2a0jaTfsZ5wSZWHOGeqQyejUp3xxLfPt2UpyJEcVQB/zyPcmonNFA=="
     },
+    "react-google-login": {
+      "version": "5.1.20",
+      "resolved": "https://registry.npmjs.org/react-google-login/-/react-google-login-5.1.20.tgz",
+      "integrity": "sha512-/5vDx8Hy7Wo1fO1VC/0e5D6/ZGWgIgvcscI8mYZUQ653QOFf0c4GhTnKkebX5uE7m5rAB/2bzzZIUlIesGqWig==",
+      "requires": {
+        "@types/react": "*",
+        "prop-types": "^15.6.0"
+      }
+    },
     "react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",