From a075aa366ef26f3020816d698f24123973c52381 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 29 May 2020 17:26:53 +0530 Subject: [PATCH 01/26] added core value component --- .../shared-components/core-value/coreValue.js | 33 +++++++++++++++++++ 1 file changed, 33 insertions(+) create mode 100644 react-frontend/src/shared-components/core-value/coreValue.js diff --git a/react-frontend/src/shared-components/core-value/coreValue.js b/react-frontend/src/shared-components/core-value/coreValue.js new file mode 100644 index 000000000..79e7cacb1 --- /dev/null +++ b/react-frontend/src/shared-components/core-value/coreValue.js @@ -0,0 +1,33 @@ +import React from "react"; +import PropTypes from "prop-types"; +import Styled from "styled-components"; + +import { Form } from "core-components/form/FormComponent"; + +const Wrapper = Styled.div` +max-width:75px; +min-height:75px; +border-radius: 5px; +border: 3px solid black; +display: flex; +text-align: center; +font-size: 0.75em; +`; + +const CoreValueComponent = ({ + coreValueName, +}) => ( + + + {coreValueName} + + +); + +CoreValueComponent.propTypes = { + coreValueName: PropTypes.string.isRequired, +}; + +export default CoreValueComponent; + +/** */ \ No newline at end of file From d464d21c00b06a94ac31221a309ddec5322e49e7 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 29 May 2020 17:29:22 +0530 Subject: [PATCH 02/26] added core value component --- react-frontend/src/shared-components/core-value/coreValue.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/react-frontend/src/shared-components/core-value/coreValue.js b/react-frontend/src/shared-components/core-value/coreValue.js index 79e7cacb1..51aa4c4df 100644 --- a/react-frontend/src/shared-components/core-value/coreValue.js +++ b/react-frontend/src/shared-components/core-value/coreValue.js @@ -29,5 +29,3 @@ CoreValueComponent.propTypes = { }; export default CoreValueComponent; - -/** */ \ No newline at end of file From 0dd6b981f5eab0d1afc9c4da6cb221e474e97a80 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 29 May 2020 17:32:50 +0530 Subject: [PATCH 03/26] created file for core values component --- .../src/create-recognition/coreValues.js | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 react-frontend/src/create-recognition/coreValues.js diff --git a/react-frontend/src/create-recognition/coreValues.js b/react-frontend/src/create-recognition/coreValues.js new file mode 100644 index 000000000..7171a6ed4 --- /dev/null +++ b/react-frontend/src/create-recognition/coreValues.js @@ -0,0 +1,21 @@ +import React from "react"; +import PropTypes from "prop-types"; + +import CoreValue from "shared-components/core-value/coreValue"; +const CoreValues= ({ coreValues }) => + coreValues.map((coreValue, index) => ( + + )); + +CoreValues.propTypes = { + coreValues: PropTypes.arrayOf( + PropTypes.shape({ + coreValueName: PropTypes.string.isRequired, + }) + ), +}; + +export default CoreValues; \ No newline at end of file From e6bd67ce7781c05bde2e07d39e164b58a0e4f4a4 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 29 May 2020 17:36:51 +0530 Subject: [PATCH 04/26] added card component as core component --- react-frontend/src/core-components/card/card.js | 1 + 1 file changed, 1 insertion(+) create mode 100644 react-frontend/src/core-components/card/card.js diff --git a/react-frontend/src/core-components/card/card.js b/react-frontend/src/core-components/card/card.js new file mode 100644 index 000000000..26d92f130 --- /dev/null +++ b/react-frontend/src/core-components/card/card.js @@ -0,0 +1 @@ +export { Form } from "react-bootstrap"; \ No newline at end of file From 0d6aac52b35ddd268b89abbbd05f51be3e63f4e6 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 29 May 2020 19:05:59 +0530 Subject: [PATCH 05/26] exported card --- react-frontend/src/core-components/card/card.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/react-frontend/src/core-components/card/card.js b/react-frontend/src/core-components/card/card.js index 26d92f130..6e8f5a83f 100644 --- a/react-frontend/src/core-components/card/card.js +++ b/react-frontend/src/core-components/card/card.js @@ -1 +1 @@ -export { Form } from "react-bootstrap"; \ No newline at end of file +export { Card } from "react-bootstrap"; From 9e13f8fa3a4443fa1f55431dce58ab9296935d98 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 29 May 2020 19:07:05 +0530 Subject: [PATCH 06/26] created card body --- .../CreateRecognitionCardBody.js | 38 +++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 react-frontend/src/create-recognition/CreateRecognitionCardBody.js diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js new file mode 100644 index 000000000..e71c7009e --- /dev/null +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -0,0 +1,38 @@ +import React from "react"; +import PropTypes from "prop-types"; + +import { Card } from "core-components/card/card"; +import CoreValue from "create-recognition/coreValues" +import {Row, Col} from "core-components/grid/GridComponent" + +const coreValues = [ + { + id: 1, + coreValueName: "core Value Name 1", + }, + { + id: 2, + coreValueName: "core Value Name 2", + }, + { + id: 3, + coreValueName: "core Value Name 3", + }, + { + id: 4, + coreValueName: "core Value Name 4", + } +] + +const CreateRecognitionCardBody = () => + ( + + + + ) + +CreateRecognitionCardBody.propTypes = { + +}; + +export default CreateRecognitionCardBody; From 2903096e7ebb1bc387bd97abc876005f0f59864a Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Mon, 1 Jun 2020 16:05:29 +0530 Subject: [PATCH 07/26] created card body component for create recognition --- .../CreateRecognitionCardBody.js | 42 +++++++++++++------ 1 file changed, 29 insertions(+), 13 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index e71c7009e..b2ad32706 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -1,9 +1,11 @@ import React from "react"; -import PropTypes from "prop-types"; +import { useState } from "react"; import { Card } from "core-components/card/card"; -import CoreValue from "create-recognition/coreValues" -import {Row, Col} from "core-components/grid/GridComponent" +import { Form } from "core-components/form/FormComponent"; +import CoreValue from "create-recognition/coreValues"; +import { Row } from "core-components/grid/GridComponent"; +import { Button } from "core-components/button/ButtonComponent"; const coreValues = [ { @@ -21,18 +23,32 @@ const coreValues = [ { id: 4, coreValueName: "core Value Name 4", - } -] + }, +]; -const CreateRecognitionCardBody = () => - ( - - +const CreateRecognitionCardBody = () => { + const [comment, addComment] = useState(false); + const onClickAddComment = () => { + addComment(true); + }; + return ( + + Select Value + + + + + {comment ? ( + + ) : ( + + )} + + + + - ) - -CreateRecognitionCardBody.propTypes = { - + ); }; export default CreateRecognitionCardBody; From 04b1c2102fb0ad11ee63bc659594130edb06b020 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Mon, 1 Jun 2020 16:06:32 +0530 Subject: [PATCH 08/26] updated core values by updation in core value --- react-frontend/src/create-recognition/coreValues.js | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/react-frontend/src/create-recognition/coreValues.js b/react-frontend/src/create-recognition/coreValues.js index 7171a6ed4..066b9dbf2 100644 --- a/react-frontend/src/create-recognition/coreValues.js +++ b/react-frontend/src/create-recognition/coreValues.js @@ -2,12 +2,10 @@ import React from "react"; import PropTypes from "prop-types"; import CoreValue from "shared-components/core-value/coreValue"; -const CoreValues= ({ coreValues }) => + +const CoreValues = ({ coreValues }) => coreValues.map((coreValue, index) => ( - + )); CoreValues.propTypes = { @@ -18,4 +16,4 @@ CoreValues.propTypes = { ), }; -export default CoreValues; \ No newline at end of file +export default CoreValues; From 8414ca9de48fe75767e250ea9888aed3ea092da3 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Mon, 1 Jun 2020 16:07:03 +0530 Subject: [PATCH 09/26] updated styling of core value component --- .../shared-components/core-value/coreValue.js | 42 +++++++++++-------- 1 file changed, 25 insertions(+), 17 deletions(-) diff --git a/react-frontend/src/shared-components/core-value/coreValue.js b/react-frontend/src/shared-components/core-value/coreValue.js index 51aa4c4df..073f722f2 100644 --- a/react-frontend/src/shared-components/core-value/coreValue.js +++ b/react-frontend/src/shared-components/core-value/coreValue.js @@ -2,27 +2,35 @@ import React from "react"; import PropTypes from "prop-types"; import Styled from "styled-components"; -import { Form } from "core-components/form/FormComponent"; +import CoreValueIcon from "shared-components/core-value-icon/coreValueIconComponent"; +import { Row, Container } from "core-components/grid/GridComponent"; const Wrapper = Styled.div` -max-width:75px; -min-height:75px; -border-radius: 5px; -border: 3px solid black; -display: flex; -text-align: center; -font-size: 0.75em; + max-width:75px; + min-height:75px; + border-radius: 10px; + border: 3px solid black; + display: flex; + text-align: center; + font-size: 0.75em; `; -const CoreValueComponent = ({ - coreValueName, -}) => ( - - - {coreValueName} - - -); +const CoreValueComponent = ({ coreValueName }) => { + const onClick = () => { + onClick(10); + }; + + return ( + + + + + + {coreValueName} + + + ); +}; CoreValueComponent.propTypes = { coreValueName: PropTypes.string.isRequired, From 856667c97b65df58c61436549aa259cee4e00d55 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Mon, 1 Jun 2020 16:08:18 +0530 Subject: [PATCH 10/26] created recognitio card component --- .../src/create-recognition/CreateRecognitionCard.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 react-frontend/src/create-recognition/CreateRecognitionCard.js diff --git a/react-frontend/src/create-recognition/CreateRecognitionCard.js b/react-frontend/src/create-recognition/CreateRecognitionCard.js new file mode 100644 index 000000000..1607c0e22 --- /dev/null +++ b/react-frontend/src/create-recognition/CreateRecognitionCard.js @@ -0,0 +1,12 @@ +import React from "react"; + +import { Card } from "core-components/card/card"; +import CardBody from "create-recognition/CreateRecognitionCardBody"; + +const CreateRecognitionCard = () => ( + + + +); + +export default CreateRecognitionCard; From bc3fd30198bbbff4bde0b3880b8e051d505e34c5 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Mon, 1 Jun 2020 16:09:18 +0530 Subject: [PATCH 11/26] created create recognition card header component --- .../src/create-recognition/CreateRecognitionCardHeader.js | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 react-frontend/src/create-recognition/CreateRecognitionCardHeader.js diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardHeader.js b/react-frontend/src/create-recognition/CreateRecognitionCardHeader.js new file mode 100644 index 000000000..a940ce7e6 --- /dev/null +++ b/react-frontend/src/create-recognition/CreateRecognitionCardHeader.js @@ -0,0 +1,7 @@ +import React from "react"; + +import { Card } from "core-components/card/card"; + +const CreateRecognitionCardHeader = () => ; + +export default CreateRecognitionCardHeader; From 2f5df4b51ee463ba0d4c427570e61b97e0d86a16 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Mon, 1 Jun 2020 19:02:25 +0530 Subject: [PATCH 12/26] created a panel to show user profile and create recognition button --- .../LeftPanelCardHeader.js | 7 ++ .../LeftPanelUserProfile.js | 83 +++++++++++++++++++ 2 files changed, 90 insertions(+) create mode 100644 react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js create mode 100644 react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js diff --git a/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js b/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js new file mode 100644 index 000000000..dc1845187 --- /dev/null +++ b/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js @@ -0,0 +1,7 @@ +import React from "react"; + +import { Card } from "core-components/card/card"; + +const LeftPanelCardHeader = () => ; + +export default React.memo(LeftPanelCardHeader); diff --git a/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js b/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js new file mode 100644 index 000000000..843b96629 --- /dev/null +++ b/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js @@ -0,0 +1,83 @@ +import React from "react"; +import styled from "styled-components"; + +import { Card } from "core-components/card/card"; +import Img from "shared-components/user-image-name/UserImageName"; +import { Row } from "core-components/grid/GridComponent"; +import PlusSign from "shared-components/plus-sign/PlusSign"; + +const ButtonComp = styled.div` + background: transparent + url("https://public-v2links.adobecc.com/b8bcaf62-377d-428f-41ee-f038352e2a2e/component?params=component_id%3Afa4d001b-9437-454d-9251-b1f4057910a7¶ms=version%3A0&token=1591073643_da39a3ee_3cbad380723b213550e5fc5179e925e038cf581d&api_key=CometServer1") + 90% 60% no-repeat padding-box; + opacity: 1; + box-shadow: 0px 3px 6px #0000004e; + width: 45px; + height: 45px; + background-color: #d97d54; + border: none; + border-radius: 50%; + margin-top: 7.5px; + margin-left: 7.5px; +`; + +const Plus = styled.div` + position: absolute; + margin-left: 10px; + margin-top: 8px; + font-size: 23px; + color: white; +`; + +const RoundCircle = styled.div` + background: #fffff 0% 0% no-repeat padding-box; + box-shadow: 0px 3px 6px #0000004e; + opacity: 1; + border-radius: 50%; + width: 60px; + height: 60px; + display: "flex"; + justifycontent: "center"; + alignitems: "center"; +`; +const CardStyle = styled(Card)` +"border-top-left-radius": "10%"; +"height": "100vh"; + "border-top-right-radius": "10%"; + "border": "2px solid black"; +`; + +const LeftPanelUserProfile = () => { + const onClick = () => { + onClick(); + }; + return ( + + + + + + + + + + + + + + + + + + ); +}; + +export default LeftPanelUserProfile; From e54c061f2db3cb3800104e35d06a506a0f58ea31 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Tue, 2 Jun 2020 15:46:34 +0530 Subject: [PATCH 13/26] updated changes in card body --- .../CreateRecognitionCardBody.js | 44 +++++++++++++------ 1 file changed, 30 insertions(+), 14 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index b2ad32706..abf328e3d 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -1,5 +1,6 @@ import React from "react"; import { useState } from "react"; +import styled from "styled-components"; import { Card } from "core-components/card/card"; import { Form } from "core-components/form/FormComponent"; @@ -7,6 +8,17 @@ import CoreValue from "create-recognition/coreValues"; import { Row } from "core-components/grid/GridComponent"; import { Button } from "core-components/button/ButtonComponent"; +const Wrapper = styled.section` + margin-left: 15%; + margin-right: 15%; +`; +const WrapperForSelectValue = styled.section` + margin-right: 65%; +`; +//const WrapperForCoreValues = styled.section` + +//`; + const coreValues = [ { id: 1, @@ -33,20 +45,24 @@ const CreateRecognitionCardBody = () => { }; return ( - Select Value - - - - - {comment ? ( - - ) : ( - - )} - - - - + + + Select Value + + + + + + {comment ? ( + + ) : ( + + )} + + + + + ); }; From a251fae9a9badf80f9678a8d92201c3e39b3fcb7 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Tue, 2 Jun 2020 17:19:22 +0530 Subject: [PATCH 14/26] updated core value component for styling --- .../src/shared-components/core-value/coreValue.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/react-frontend/src/shared-components/core-value/coreValue.js b/react-frontend/src/shared-components/core-value/coreValue.js index 073f722f2..bda36767b 100644 --- a/react-frontend/src/shared-components/core-value/coreValue.js +++ b/react-frontend/src/shared-components/core-value/coreValue.js @@ -6,8 +6,8 @@ import CoreValueIcon from "shared-components/core-value-icon/coreValueIconCompon import { Row, Container } from "core-components/grid/GridComponent"; const Wrapper = Styled.div` - max-width:75px; - min-height:75px; + max-width: 60px; + min-height: 60px; border-radius: 10px; border: 3px solid black; display: flex; @@ -17,7 +17,7 @@ const Wrapper = Styled.div` const CoreValueComponent = ({ coreValueName }) => { const onClick = () => { - onClick(10); + // todo }; return ( From 61ace43e1d63c6bac992ce418b91de0b9c18bf6d Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Tue, 2 Jun 2020 17:20:31 +0530 Subject: [PATCH 15/26] updated create recognition by handling state --- .../CreateRecognitionCardBody.js | 32 ++++++++++++++----- 1 file changed, 24 insertions(+), 8 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index abf328e3d..6f1b9cc16 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -2,22 +2,24 @@ import React from "react"; import { useState } from "react"; import styled from "styled-components"; +//import { store } from "root/redux-store"; import { Card } from "core-components/card/card"; import { Form } from "core-components/form/FormComponent"; import CoreValue from "create-recognition/coreValues"; import { Row } from "core-components/grid/GridComponent"; import { Button } from "core-components/button/ButtonComponent"; +import Image from "shared-components/user-image-name/UserImageName"; const Wrapper = styled.section` - margin-left: 15%; - margin-right: 15%; + margin-left: 10%; + margin-right: 10%; `; const WrapperForSelectValue = styled.section` - margin-right: 65%; + margin-left: 10%; +`; +const CommentBoxWrapper = styled.div` + min-width: 50%; `; -//const WrapperForCoreValues = styled.section` - -//`; const coreValues = [ { @@ -43,10 +45,14 @@ const CreateRecognitionCardBody = () => { const onClickAddComment = () => { addComment(true); }; + const addCommentText = (event) => { + addCommentText(event.target.value); + }; return ( + - + Select Value @@ -54,7 +60,17 @@ const CreateRecognitionCardBody = () => { {comment ? ( - + + { + addCommentText( + event + ); /*store.dispatch({type:"add_comment",payload: event.target.value})*/ + }} + > + ) : ( )} From 618ded70869432c53d1c1b1e7c640de4b663a741 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 13:18:34 +0530 Subject: [PATCH 16/26] updated create recognition card body --- .../CreateRecognitionCardBody.js | 51 ++++++++++++++++--- 1 file changed, 43 insertions(+), 8 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index 6f1b9cc16..c28c5bcf1 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -1,8 +1,10 @@ import React from "react"; import { useState } from "react"; import styled from "styled-components"; +import PropTypes from "prop-types"; //import { store } from "root/redux-store"; +import ImageComponent from "core-components/image/ImageComponent"; import { Card } from "core-components/card/card"; import { Form } from "core-components/form/FormComponent"; import CoreValue from "create-recognition/coreValues"; @@ -15,12 +17,19 @@ const Wrapper = styled.section` margin-right: 10%; `; const WrapperForSelectValue = styled.section` - margin-left: 10%; + margin-left: 18%; + margin-right: 18%; `; const CommentBoxWrapper = styled.div` min-width: 50%; `; +/*const CardWrapper = styled.section` + borderRadius: "36px 36px 0px 0px", + minHeight: "100vh", + width: "206px", + background: "linear-gradient(#00000 100px, var(--white) 0%)", +`;*/ const coreValues = [ { id: 1, @@ -40,7 +49,11 @@ const coreValues = [ }, ]; -const CreateRecognitionCardBody = () => { +const CreateRecognitionCardBody = ({ + EmployeeName, + EmployeeImage, + Hi5Image, +}) => { const [comment, addComment] = useState(false); const onClickAddComment = () => { addComment(true); @@ -49,12 +62,20 @@ const CreateRecognitionCardBody = () => { addCommentText(event.target.value); }; return ( - - - - - Select Value + + + + + + + + Select Value + + @@ -79,8 +100,22 @@ const CreateRecognitionCardBody = () => { - + ); }; +CreateRecognitionCardBody.propTypes = { + EmployeeName: PropTypes.string, + EmployeeImage: PropTypes.string, + Hi5Image: PropTypes.string, +}; + export default CreateRecognitionCardBody; + +/** + * borderRadius: "36px 36px 0px 0px", + minHeight: "100vh", + width: "206px", + background: "linear-gradient(var(--sage) 100px, var(--white) 0%)", + * +*/ From bdeb221f8fe08031b844eefb84c0922c321ddd93 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 13:19:13 +0530 Subject: [PATCH 17/26] created core value text component --- .../core-value/CoreValueText.js | 22 +++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 react-frontend/src/shared-components/core-value/CoreValueText.js diff --git a/react-frontend/src/shared-components/core-value/CoreValueText.js b/react-frontend/src/shared-components/core-value/CoreValueText.js new file mode 100644 index 000000000..6f7ee9f69 --- /dev/null +++ b/react-frontend/src/shared-components/core-value/CoreValueText.js @@ -0,0 +1,22 @@ +import React from "react"; +import PropTypes from "prop-types"; +import Styled from "styled-components"; + +const Wrapper = Styled.div` + font-size: ${({ fontSize }) => fontSize}; +`; + +const CoreValueComponent = ({ coreValueName, fontSize }) => { + return {coreValueName}; +}; + +CoreValueComponent.defaultProps = { + fontSize: "1em", +}; + +CoreValueComponent.propTypes = { + coreValueName: PropTypes.string.isRequired, + fontSize: PropTypes.string, +}; + +export default CoreValueComponent; From e2dc0be18bf6330e2e70ac78fc79328ade441075 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 16:52:52 +0530 Subject: [PATCH 18/26] updated create recognition by removing old structure --- .../CreateRecognitionCardBody.js | 49 +++++-------------- 1 file changed, 13 insertions(+), 36 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index c28c5bcf1..affc09dbd 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -2,34 +2,28 @@ import React from "react"; import { useState } from "react"; import styled from "styled-components"; import PropTypes from "prop-types"; +import { ListGroup } from "react-bootstrap"; -//import { store } from "root/redux-store"; import ImageComponent from "core-components/image/ImageComponent"; import { Card } from "core-components/card/card"; import { Form } from "core-components/form/FormComponent"; import CoreValue from "create-recognition/coreValues"; -import { Row } from "core-components/grid/GridComponent"; import { Button } from "core-components/button/ButtonComponent"; import Image from "shared-components/user-image-name/UserImageName"; const Wrapper = styled.section` margin-left: 10%; margin-right: 10%; + align-items: center; `; const WrapperForSelectValue = styled.section` margin-left: 18%; margin-right: 18%; `; const CommentBoxWrapper = styled.div` - min-width: 50%; + max-width: 50%; `; -/*const CardWrapper = styled.section` - borderRadius: "36px 36px 0px 0px", - minHeight: "100vh", - width: "206px", - background: "linear-gradient(#00000 100px, var(--white) 0%)", -`;*/ const coreValues = [ { id: 1, @@ -64,41 +58,32 @@ const CreateRecognitionCardBody = ({ return ( - - - - - - - Select Value + + +
Select Value
- + - - + +
{comment ? ( { - addCommentText( - event - ); /*store.dispatch({type:"add_comment",payload: event.target.value})*/ + addCommentText(event); }} > ) : ( )} - - +
+
- +
); @@ -111,11 +96,3 @@ CreateRecognitionCardBody.propTypes = { }; export default CreateRecognitionCardBody; - -/** - * borderRadius: "36px 36px 0px 0px", - minHeight: "100vh", - width: "206px", - background: "linear-gradient(var(--sage) 100px, var(--white) 0%)", - * -*/ From e9d61eb6031590655ae36445ecc4df969c4e02f1 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 16:55:26 +0530 Subject: [PATCH 19/26] updated core values --- react-frontend/src/create-recognition/coreValues.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/react-frontend/src/create-recognition/coreValues.js b/react-frontend/src/create-recognition/coreValues.js index 066b9dbf2..9e9eb7f57 100644 --- a/react-frontend/src/create-recognition/coreValues.js +++ b/react-frontend/src/create-recognition/coreValues.js @@ -3,15 +3,22 @@ import PropTypes from "prop-types"; import CoreValue from "shared-components/core-value/coreValue"; -const CoreValues = ({ coreValues }) => +const CoreValues = ({ coreValues, fontSize, backgroundColor }) => coreValues.map((coreValue, index) => ( - + )); CoreValues.propTypes = { coreValues: PropTypes.arrayOf( PropTypes.shape({ coreValueName: PropTypes.string.isRequired, + fontSize: PropTypes.string, + backgroundColor: PropTypes.string, }) ), }; From 60bf3ac71f62af6a8f6bbb0e152e7a2b56d979b4 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 16:56:35 +0530 Subject: [PATCH 20/26] updated core value component --- .../shared-components/core-value/coreValue.js | 36 ++++++++++--------- 1 file changed, 20 insertions(+), 16 deletions(-) diff --git a/react-frontend/src/shared-components/core-value/coreValue.js b/react-frontend/src/shared-components/core-value/coreValue.js index bda36767b..17063416f 100644 --- a/react-frontend/src/shared-components/core-value/coreValue.js +++ b/react-frontend/src/shared-components/core-value/coreValue.js @@ -2,38 +2,42 @@ import React from "react"; import PropTypes from "prop-types"; import Styled from "styled-components"; -import CoreValueIcon from "shared-components/core-value-icon/coreValueIconComponent"; -import { Row, Container } from "core-components/grid/GridComponent"; +import CoreValueIcon from "shared-components/core-value-icon/coreValueIconComponent"; //todo: will work after core value addition +import CoreValueText from "shared-components/core-value/CoreValueText"; const Wrapper = Styled.div` - max-width: 60px; - min-height: 60px; + max-width: 70px; + min-height: 100px; border-radius: 10px; - border: 3px solid black; - display: flex; text-align: center; - font-size: 0.75em; + background-color: ${({ backgroundColor }) => backgroundColor}; + opacity: 1; `; -const CoreValueComponent = ({ coreValueName }) => { +const CoreValueComponent = ({ coreValueName, fontSize, backgroundColor }) => { const onClick = () => { // todo }; - return ( - - - - - - {coreValueName} - + + + ); }; +CoreValueComponent.defaultProps = { + backgroundColor: "var(--rust)", +}; + CoreValueComponent.propTypes = { coreValueName: PropTypes.string.isRequired, + fontSize: PropTypes.string, + backgroundColor: PropTypes.string, }; export default CoreValueComponent; From 73123b02bea1b9a16e253fb5eb064e3eeb133b03 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 17:02:33 +0530 Subject: [PATCH 21/26] deleted left panel --- .../LeftPanelCardHeader.js | 7 -- .../LeftPanelUserProfile.js | 83 ------------------- 2 files changed, 90 deletions(-) delete mode 100644 react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js delete mode 100644 react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js diff --git a/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js b/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js deleted file mode 100644 index dc1845187..000000000 --- a/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelCardHeader.js +++ /dev/null @@ -1,7 +0,0 @@ -import React from "react"; - -import { Card } from "core-components/card/card"; - -const LeftPanelCardHeader = () => ; - -export default React.memo(LeftPanelCardHeader); diff --git a/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js b/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js deleted file mode 100644 index 843b96629..000000000 --- a/react-frontend/src/shared-components/left-panel-user-profile/LeftPanelUserProfile.js +++ /dev/null @@ -1,83 +0,0 @@ -import React from "react"; -import styled from "styled-components"; - -import { Card } from "core-components/card/card"; -import Img from "shared-components/user-image-name/UserImageName"; -import { Row } from "core-components/grid/GridComponent"; -import PlusSign from "shared-components/plus-sign/PlusSign"; - -const ButtonComp = styled.div` - background: transparent - url("https://public-v2links.adobecc.com/b8bcaf62-377d-428f-41ee-f038352e2a2e/component?params=component_id%3Afa4d001b-9437-454d-9251-b1f4057910a7¶ms=version%3A0&token=1591073643_da39a3ee_3cbad380723b213550e5fc5179e925e038cf581d&api_key=CometServer1") - 90% 60% no-repeat padding-box; - opacity: 1; - box-shadow: 0px 3px 6px #0000004e; - width: 45px; - height: 45px; - background-color: #d97d54; - border: none; - border-radius: 50%; - margin-top: 7.5px; - margin-left: 7.5px; -`; - -const Plus = styled.div` - position: absolute; - margin-left: 10px; - margin-top: 8px; - font-size: 23px; - color: white; -`; - -const RoundCircle = styled.div` - background: #fffff 0% 0% no-repeat padding-box; - box-shadow: 0px 3px 6px #0000004e; - opacity: 1; - border-radius: 50%; - width: 60px; - height: 60px; - display: "flex"; - justifycontent: "center"; - alignitems: "center"; -`; -const CardStyle = styled(Card)` -"border-top-left-radius": "10%"; -"height": "100vh"; - "border-top-right-radius": "10%"; - "border": "2px solid black"; -`; - -const LeftPanelUserProfile = () => { - const onClick = () => { - onClick(); - }; - return ( - - - - - - - - - - - - - - - - - - ); -}; - -export default LeftPanelUserProfile; From 3e6c72c31896136f558685b7284340b964ede4c2 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 18:42:17 +0530 Subject: [PATCH 22/26] updated card body of create recognition by adding modal button inside it --- .../CreateRecognitionCardBody.js | 33 +++++++++++-------- 1 file changed, 19 insertions(+), 14 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index affc09dbd..7f849e50f 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -10,6 +10,7 @@ import { Form } from "core-components/form/FormComponent"; import CoreValue from "create-recognition/coreValues"; import { Button } from "core-components/button/ButtonComponent"; import Image from "shared-components/user-image-name/UserImageName"; +import AddRecognition from "create-recognition/AddRecognitionPopup"; const Wrapper = styled.section` margin-left: 10%; @@ -20,9 +21,6 @@ const WrapperForSelectValue = styled.section` margin-left: 18%; margin-right: 18%; `; -const CommentBoxWrapper = styled.div` - max-width: 50%; -`; const coreValues = [ { @@ -49,11 +47,14 @@ const CreateRecognitionCardBody = ({ Hi5Image, }) => { const [comment, addComment] = useState(false); + const [show, setShow] = useState(false); + const handleClose = () => setShow(false); + const handleShow = () => setShow(true); const onClickAddComment = () => { addComment(true); }; const addCommentText = (event) => { - addCommentText(event.target.value); + addCommentText(event.target); }; return ( @@ -68,23 +69,27 @@ const CreateRecognitionCardBody = ({
{comment ? ( - - { - addCommentText(event); - }} - > - + { + addCommentText(event); + }} + > ) : ( )}
- +
+ ); }; From f0ad077f16802202973333ac602b639cb8a5ec8f Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Thu, 4 Jun 2020 18:42:57 +0530 Subject: [PATCH 23/26] created a component to show popup of comment --- .../create-recognition/AddRecognitionPopup.js | 49 +++++++++++++++++++ 1 file changed, 49 insertions(+) create mode 100644 react-frontend/src/create-recognition/AddRecognitionPopup.js diff --git a/react-frontend/src/create-recognition/AddRecognitionPopup.js b/react-frontend/src/create-recognition/AddRecognitionPopup.js new file mode 100644 index 000000000..338d8e1e8 --- /dev/null +++ b/react-frontend/src/create-recognition/AddRecognitionPopup.js @@ -0,0 +1,49 @@ +import React from "react"; +import PropTypes from "prop-types"; +import styled from "styled-components"; + +import { Modal } from "react-bootstrap"; +import { Button } from "core-components/button/ButtonComponent"; + +const Border = styled.fieldset` + border: 1px solid; + border-radius: 8px; + opacity: 1; + margin-left: 5%; + margin-right: 5%; +`; + +const Legend = styled.legend` + width: auto; + margin-left: 10%; + font-size: 0.75em; +`; + +const AddRecognition = ({ show, handleClose }) => ( + + + Modal heading + + + + Your Note + hii + + + + + + + +); + +AddRecognition.propTypes = { + show: PropTypes.bool, + handleClose: PropTypes.func, +}; + +export default AddRecognition; From 12b7d6e2db83bcbe626176dc6d639f783f93c18e Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 5 Jun 2020 18:58:55 +0530 Subject: [PATCH 24/26] added props --- .../create-recognition/AddRecognitionPopup.js | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/react-frontend/src/create-recognition/AddRecognitionPopup.js b/react-frontend/src/create-recognition/AddRecognitionPopup.js index 338d8e1e8..f14844dbe 100644 --- a/react-frontend/src/create-recognition/AddRecognitionPopup.js +++ b/react-frontend/src/create-recognition/AddRecognitionPopup.js @@ -2,7 +2,8 @@ import React from "react"; import PropTypes from "prop-types"; import styled from "styled-components"; -import { Modal } from "react-bootstrap"; +import Image from "shared-components/user-image-name/UserImageName"; +import { Modal } from "core-components/modal/ModalComponent"; import { Button } from "core-components/button/ButtonComponent"; const Border = styled.fieldset` @@ -19,31 +20,30 @@ const Legend = styled.legend` font-size: 0.75em; `; -const AddRecognition = ({ show, handleClose }) => ( - - - Modal heading - +const AddRecognition = ({ show, handleClose, recognitionToImage, comment }) => ( + + + Your Note - hii + {comment} - - - - + + ); AddRecognition.propTypes = { show: PropTypes.bool, handleClose: PropTypes.func, + comment: PropTypes.string, + recognitionToImage: PropTypes.string, }; export default AddRecognition; From df9423e3b85f5df02474eb591f6b0ac6858a7b85 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 5 Jun 2020 18:59:34 +0530 Subject: [PATCH 25/26] added props for create recognition image component and comments --- .../src/create-recognition/CreateRecognitionCardBody.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js index 7f849e50f..c560aea56 100644 --- a/react-frontend/src/create-recognition/CreateRecognitionCardBody.js +++ b/react-frontend/src/create-recognition/CreateRecognitionCardBody.js @@ -45,6 +45,7 @@ const CreateRecognitionCardBody = ({ EmployeeName, EmployeeImage, Hi5Image, + recognitionToImage, }) => { const [comment, addComment] = useState(false); const [show, setShow] = useState(false); @@ -54,7 +55,7 @@ const CreateRecognitionCardBody = ({ addComment(true); }; const addCommentText = (event) => { - addCommentText(event.target); + addComment(event.target.value); }; return ( @@ -87,8 +88,9 @@ const CreateRecognitionCardBody = ({ ); @@ -97,6 +99,8 @@ const CreateRecognitionCardBody = ({ CreateRecognitionCardBody.propTypes = { EmployeeName: PropTypes.string, EmployeeImage: PropTypes.string, + recognitionToImage: PropTypes.string, + comment: PropTypes.string, Hi5Image: PropTypes.string, }; From 105ae5c3e0079bb7499e51d276010415930cf9a0 Mon Sep 17 00:00:00 2001 From: onkar-josh Date: Fri, 5 Jun 2020 19:00:07 +0530 Subject: [PATCH 26/26] added a modal in core components --- react-frontend/src/core-components/modal/ModalComponent.js | 1 + 1 file changed, 1 insertion(+) create mode 100644 react-frontend/src/core-components/modal/ModalComponent.js diff --git a/react-frontend/src/core-components/modal/ModalComponent.js b/react-frontend/src/core-components/modal/ModalComponent.js new file mode 100644 index 000000000..f50366564 --- /dev/null +++ b/react-frontend/src/core-components/modal/ModalComponent.js @@ -0,0 +1 @@ +export { Modal } from "react-bootstrap";