From eb20284a32c65df22c3e383b339754d8e4ebdf86 Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Mon, 9 Nov 2020 14:55:33 +0530 Subject: [PATCH 01/10] updated ProfileView --- .../components/ProfileView.web.jsx | 771 ++++++++++++++---- package.json | 1 + 2 files changed, 623 insertions(+), 149 deletions(-) diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index bdc68aaf3..c240768b6 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -1,51 +1,29 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import Helmet from 'react-helmet'; -import { Link } from 'react-router-dom'; -import { StripeSubscriptionProfile } from '@gqlapp/payments-client-react'; -import { translate } from '@gqlapp/i18n-client-react'; -import { - Card, - // CardGroup, - CardText, - // CardTitle, - PageLayout -} from '@gqlapp/look-client-react'; -import { Row, Col, Divider, Icon, Button, Spin as Loader } from 'antd'; -import UserVerificationsComponent from './verification/UserVerificationsComponent'; -import ProfileHeadComponent from './components/ProfileHeadComponent'; -// import UsersCardComponent from './UsersCardComponent'; -import settings from '../../../../settings'; -import AddressCardComponent from './components/AddressCardComponent'; -import userCardData from '../helpers/userCardData'; +import React from "react"; +import PropTypes from "prop-types"; +import Helmet from "react-helmet"; +import { translate } from "@gqlapp/i18n-client-react"; +import { PageLayout } from "@gqlapp/look-client-react"; +import { Spin as Loader } from "antd"; +import settings from "../../../../settings"; // To Do Abstract Out class ProfileView extends React.Component { - getUserId = () => { - let id = 0; - if (this.props.match) { - id = Number(this.props.match.params.id); - } else if (this.props.navigation) { - id = Number(this.props.navigation.state.params.id); - } - return id; - }; - render() { - const renderMetaData = t => { + const renderMetaData = (t) => { return ( ); }; + const { t } = this.props; const { currentUser, currentUserLoading } = this.props; @@ -53,7 +31,7 @@ class ProfileView extends React.Component { return ( {renderMetaData(t)} - + ); } else if (currentUser) { @@ -61,136 +39,631 @@ class ProfileView extends React.Component { {renderMetaData(t)} - - - -

+
+ {/*coverphoto*/} + +
+
+
+ + {/*middlepart*/} + +
+ {/*Avatar*/} + + + + + {/* avatar description*/} +
+
+
+

Yashwanth Sambaraj

+
+
+

Web developer STUDENT

+
+
+
+ +

+ + {/*Exit and edit buttons*/} + + + {/*About me and socialmedia links*/} +
- My Profile -
- - - + {/*About me */} +
+
+

+ About me?! Haha u already know! +

+
-

- - - - - -
-

- {t('profile.card.group.name')}: -

- {currentUser.username} + + {/*socialmedia links*/} +
+ -
-

- {t('profile.card.group.about')}: -

- - - {currentUser.profile && currentUser.profile.about ? currentUser.profile.about : 'Not Provided'} - + + -
-

- {t('profile.card.group.role')}: -

+ - {currentUser.role ? currentUser.role : 'Not Provided'} + - {/* Portfolios */} -

- {t('profile.card.group.portfolios.title')} -

- {currentUser.portfolios && currentUser.portfolios.length !== 0 - ? currentUser.portfolios.map((portfolio, key) => ( -
- - {portfolio.platform} : {portfolio.portfolioUrl} - -
- )) - : 'Not Provided'} - - -
-

- {t('profile.card.group.email')}: -

- - {currentUser.email ? currentUser.email : 'Not Provided'} + +
+
+ + {/*breakline*/} +
+ Info +
+ + {/*4 interests*/} +
+

+ ❤ Loves + -> myself +

+

+

+

+

+ 🔰 Lives in + -> Hyderabad +

+

+

+

+

+ 🏙 Owner of + -> my mind +

+

+

+

+

+ 💬 Speaks + -> telugu,hindi,english +

+
+ + {/* line breaker*/} +
+
+
+ +

+ + {/*portfolio*/} +
+

+ +
+
+
+

Portfolio

+
+ {/*add button*/} +
+ +
+
+ +

-
-

- Mobile -

- - {currentUser.profile && currentUser.profile.mobile - ? currentUser.profile.mobile - : 'Not Provided'} - + {/*list of portfolios*/} +
+ {/*1st portfolio*/} +
+
+
+
+
+ +
+
+
+
+ + + + +
+ +
    +
  • + + + + + +
    • +
  • + + + + + +
    • +
+
+
+ {/*2nd portfolio*/} +
+
+
+
+
+ +
+
+
+
+ + + + +
+
    +
  • + + + + + +
    • +
  • + + + + + +
    • +
- - - -

- {t('profile.card.group.addresses.title')} -

- - {currentUser.addresses && currentUser.addresses.length !== 0 - ? currentUser.addresses.map((address, key) => ( - - - - )) - : 'Not Provided'} - - - {/* Credit card info (Stripe subscription module)*/} - {settings.stripe.subscription.enabled && - settings.stripe.subscription.publicKey && - currentUser.role === 'user' && } - - - - - - - - - - +
+ {/*3rd portfolio*/} +
+
+
+
+
+ +
+
+
+
+ + + + +
+
    +
  • + + + + + +
    • +
  • + + + + + +
    • +
+
+
+
+
+
+ +
+ ); } else { return ( {renderMetaData(t)} -

{t('profile.errorMsg')}

+

{t("profile.errorMsg")}

 ); } @@ -202,6 +675,6 @@ ProfileView.propTypes = { currentUser: PropTypes.object, t: PropTypes.func, match: PropTypes.object, - navigation: PropTypes.object + navigation: PropTypes.object, }; -export default translate('user')(ProfileView); +export default translate("user")(ProfileView); diff --git a/package.json b/package.json index 13b07961b..8caac3be5 100644 --- a/package.json +++ b/package.json @@ -193,3 +193,4 @@ "watchpack": "https://github.com/Globegitter/watchpack" } } + From cdb73fd3151f2a536a7b206b8f4ef69a8cbc9510 Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Wed, 18 Nov 2020 20:02:15 +0530 Subject: [PATCH 02/10] Updated ProfileView --- .../client-react/ui-antd/styles/index.less | 2 +- .../client-react/ui-antd/styles/user.less | 51 ++ .../components/ProfileView.web.jsx | 816 ++++-------------- 3 files changed, 210 insertions(+), 659 deletions(-) create mode 100644 modules/look/client-react/ui-antd/styles/user.less diff --git a/modules/look/client-react/ui-antd/styles/index.less b/modules/look/client-react/ui-antd/styles/index.less index 1286cd9c7..70a095e4e 100644 --- a/modules/look/client-react/ui-antd/styles/index.less +++ b/modules/look/client-react/ui-antd/styles/index.less @@ -4,7 +4,7 @@ @import './antd-landing/antMotionStyle.less'; @import './scrollbar.less'; @import './layout.less'; - +@import './user.less'; diff --git a/modules/look/client-react/ui-antd/styles/user.less b/modules/look/client-react/ui-antd/styles/user.less new file mode 100644 index 000000000..1373c5c53 --- /dev/null +++ b/modules/look/client-react/ui-antd/styles/user.less @@ -0,0 +1,51 @@ +.card-cover { + width: 100%; +} + +.avatar { + margin-left: 24px; + margin-top: -90px; + border: 5px solid white; + cursor: pointer; +} + +.edit-export-buttons { + position: absolute; + top: 24px; + right: 24px; +} + +.icons-list { + position: absolute; + right: 24px; + font-size: 40px; + color: #41413c; + cursor: pointer; +} + +.portfolio-name { + font-size: 27px; +} + +.portfolio-add-button { + position: absolute; + top: 24px; + right: 24px; +} + +.portfolios { + margin-left: -12px; + margin-right: -12px; +} + +.portfolio-col { + margin-bottom: 10px; + padding-left: 12px; + padding-right: 12px; +} + +.portfolio-card { + position: relative; + cursor: pointer; + width: 100%; +} diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index c240768b6..6e2c9ecb6 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -1,680 +1,180 @@ -import React from "react"; -import PropTypes from "prop-types"; -import Helmet from "react-helmet"; -import { translate } from "@gqlapp/i18n-client-react"; +import React, { Component } from "react"; import { PageLayout } from "@gqlapp/look-client-react"; -import { Spin as Loader } from "antd"; -import settings from "../../../../settings"; - -// To Do Abstract Out +import { + Avatar, + Card, + Button, + Divider, + Descriptions, + Icon, + Row, + Col, +} from "antd"; +const { Meta } = Card; +const userData = { + coverSrc: + "https://img.freepik.com/free-vector/white-smoke-rings-from-cigarette-pipe-vape_1441-4221.jpg?size=626&ext=jpg&ga=GA1.2.12280400.1601510400", + avatarSrc: + "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", + title: "Yashwanth Sambaraj", + description: "Web Developer STUDENT", +}; -class ProfileView extends React.Component { +class ProfileView extends Component { render() { - const renderMetaData = (t) => { - return ( - - ); - }; - - const { t } = this.props; - const { currentUser, currentUserLoading } = this.props; - - if (currentUserLoading && !currentUser) { - return ( - - {renderMetaData(t)} - - - ); - } else if (currentUser) { - return ( - - {renderMetaData(t)} - -
-
- {/*coverphoto*/} - -
-
-
- - {/*middlepart*/} - -
- {/*Avatar*/} - - - - - {/* avatar description*/} -
-
-
-

Yashwanth Sambaraj

-
-
-

Web developer STUDENT

-
-
-
- -

- - {/*Exit and edit buttons*/} - + return ( + + {/*Cover photo*/} + + } + > + {/*Avatar*/} + + + + + {/*edit and export buttons*/} +
+
+ - {/*About me and socialmedia links*/} -
- {/*About me */} -
-
-

- About me?! Haha u already know! -

-
-
+ {/*Avatar description*/} + - {/*socialmedia links*/} -
- +

- + {/*about and socialmedia links*/} + + +

+ About Me!? Haha U already know! +

+ - +
+ {" "} + {" "} + +
+ - +

- -
-
+ {/*intrests*/} - {/*breakline*/} -
- Info -
+ info - {/*4 interests*/} -
-

- ❤ Loves - -> myself -

-

-

-

-

- 🔰 Lives in - -> Hyderabad -

-

-

-

-

- 🏙 Owner of - -> my mind -

-

-

-

-

- 💬 Speaks - -> telugu,hindi,english -

-
+ + -> No One + - {/* line breaker*/} -
-
-
+ + + -> Hyderabad + + -

+ + + -> My mind + + - {/*portfolio*/} -
-

+ + + -> Telugu,Hindi,English + + -
-
-
-

Portfolio

-
- {/*add button*/} -
- -
-
+ -

+ {/*Portfolio and add button*/} - {/*list of portfolios*/} -
- {/*1st portfolio*/} -
-
-
-
-
- -
-
-
-
- - - - -
+ + +

Portfolio

+ -
    -
  • - - - - - -
    • -
  • - - - - - -
    • -
-
-
- {/*2nd portfolio*/} -
-
-
-
-
- -
-
-
-
- - - - -
-
    -
  • - - - - - -
    • -
  • - - - - - -
    • -
-
-
- {/*3rd portfolio*/} -
-
-
-
-
- -
-
-
-
- - - - -
-
    -
  • - - - - - -
    • -
  • - - - - - -
    • -
-
-
-
-
+
+
- -
-
- - ); - } else { - return ( - - {renderMetaData(t)} -

{t("profile.errorMsg")}

- - ); - } + + +
+
+ + {/*portfolios*/} + + + + + } + actions={[ + , + , + ]} + > + + + + + + + } + actions={[ + , + , + ]} + > + + + + + + + } + actions={[ + , + , + ]} + > + + + + + + + ); } } -ProfileView.propTypes = { - currentUserLoading: PropTypes.bool, - currentUser: PropTypes.object, - t: PropTypes.func, - match: PropTypes.object, - navigation: PropTypes.object, -}; -export default translate("user")(ProfileView); +export default ProfileView; From 83661a53b8d202a17e8a00c3dd9c51feea8c1a5a Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Wed, 18 Nov 2020 20:25:25 +0530 Subject: [PATCH 03/10] minor changes in profileView --- .../components/ProfileView.web.jsx | 22 +++++++++++-------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index 6e2c9ecb6..15868cae7 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -16,8 +16,12 @@ const userData = { "https://img.freepik.com/free-vector/white-smoke-rings-from-cigarette-pipe-vape_1441-4221.jpg?size=626&ext=jpg&ga=GA1.2.12280400.1601510400", avatarSrc: "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", - title: "Yashwanth Sambaraj", - description: "Web Developer STUDENT", + avatarTitle: "Yashwanth Sambaraj", + avatarDescription: "Web Developer STUDENT", + portfolioSrc: "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", + portfolioTitle: "Title", + portfolioDescription: "Description" + }; class ProfileView extends Component { @@ -48,7 +52,7 @@ class ProfileView extends Component { {/*Avatar description*/} - +

@@ -123,7 +127,7 @@ class ProfileView extends Component { cover={ example } actions={[ @@ -131,7 +135,7 @@ class ProfileView extends Component { , ]} > - + @@ -141,7 +145,7 @@ class ProfileView extends Component { cover={ example } actions={[ @@ -149,7 +153,7 @@ class ProfileView extends Component { , ]} > - + @@ -159,7 +163,7 @@ class ProfileView extends Component { cover={ example } actions={[ @@ -167,7 +171,7 @@ class ProfileView extends Component { , ]} > - + From ba6eed2cd7552681aaf9a6fd241270db59793e3d Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Thu, 19 Nov 2020 17:28:19 +0530 Subject: [PATCH 04/10] replicated edgenus PublicProfileHead --- .../client-react/ui-antd/styles/user.less | 32 +++- .../components/ProfileView.web.jsx | 155 +++++++++++------- 2 files changed, 119 insertions(+), 68 deletions(-) diff --git a/modules/look/client-react/ui-antd/styles/user.less b/modules/look/client-react/ui-antd/styles/user.less index 1373c5c53..bd91b1738 100644 --- a/modules/look/client-react/ui-antd/styles/user.less +++ b/modules/look/client-react/ui-antd/styles/user.less @@ -1,12 +1,22 @@ .card-cover { + height: 33vw; width: 100%; + background-position: center; + background-size: cover; + background-image: url(https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png); +} + +.card-style { + margin-top: 54px; + border-radius: 0; + border: 0; + position: relative; } .avatar { - margin-left: 24px; - margin-top: -90px; + position: absolute; + top: -80px; border: 5px solid white; - cursor: pointer; } .edit-export-buttons { @@ -15,14 +25,18 @@ right: 24px; } -.icons-list { - position: absolute; - right: 24px; - font-size: 40px; - color: #41413c; - cursor: pointer; +.export-button { + margin-right: 24px; +} + +.profile-about { + margin-bottom: 24px; } +.social-icons { + font-size: 40px; + color: rgba(65, 65, 60, 0.5); +} .portfolio-name { font-size: 27px; } diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index 15868cae7..d45b4b1a5 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -1,5 +1,5 @@ import React, { Component } from "react"; -import { PageLayout } from "@gqlapp/look-client-react"; +import { PageLayout, Tooltip } from "@gqlapp/look-client-react"; import { Avatar, Card, @@ -12,16 +12,14 @@ import { } from "antd"; const { Meta } = Card; const userData = { - coverSrc: - "https://img.freepik.com/free-vector/white-smoke-rings-from-cigarette-pipe-vape_1441-4221.jpg?size=626&ext=jpg&ga=GA1.2.12280400.1601510400", avatarSrc: "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", - avatarTitle: "Yashwanth Sambaraj", + avatarTitle: "Yashwanth Sambaraj", avatarDescription: "Web Developer STUDENT", - portfolioSrc: "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", + portfolioSrc: + "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", portfolioTitle: "Title", - portfolioDescription: "Description" - + portfolioDescription: "Description", }; class ProfileView extends Component { @@ -31,52 +29,97 @@ class ProfileView extends Component { {/*Cover photo*/} } + cover={
} + className="card-style" + bodyStyle={{ + maxWidth: "1200px", + margin: "auto", + position: "inherit", + paddingTop: "104px", + }} > {/*Avatar*/} - - - - {/*edit and export buttons*/} -
-
- + {/*Avatar description*/} - + {userData.avatarTitle}} + description={

{userData.avatarDescription}

} + /> + +
+ + {/*edit and export buttons*/} +
+ + + -

+ +
{/*about and socialmedia links*/} - - -

+ + +
About Me!? Haha U already know! -

+
-
- {" "} - {" "} - -
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + -

- + + info + {/*intrests*/} - info - -> No One @@ -124,54 +167,48 @@ class ProfileView extends Component { - } + cover={example} actions={[ , , ]} > - + - } + cover={example} actions={[ , , ]} > - + - } + cover={example} actions={[ , , ]} > - + From d21bc366a9c06f560278b89fc48267c700ababd3 Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Thu, 19 Nov 2020 17:54:47 +0530 Subject: [PATCH 05/10] minor change --- modules/user/client-react/components/ProfileView.web.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index d45b4b1a5..66d420a91 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -25,7 +25,7 @@ const userData = { class ProfileView extends Component { render() { return ( - + {/*Cover photo*/} Date: Fri, 20 Nov 2020 19:40:43 +0530 Subject: [PATCH 06/10] created objects to the fields --- .../client-react/ui-antd/styles/user.less | 2 +- .../components/ProfileView.web.jsx | 41 ++++++++++++++----- 2 files changed, 32 insertions(+), 11 deletions(-) diff --git a/modules/look/client-react/ui-antd/styles/user.less b/modules/look/client-react/ui-antd/styles/user.less index bd91b1738..739bd44b1 100644 --- a/modules/look/client-react/ui-antd/styles/user.less +++ b/modules/look/client-react/ui-antd/styles/user.less @@ -3,7 +3,7 @@ width: 100%; background-position: center; background-size: cover; - background-image: url(https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png); + } .card-style { diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index 66d420a91..b23346c53 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -1,4 +1,5 @@ import React, { Component } from "react"; + import { PageLayout, Tooltip } from "@gqlapp/look-client-react"; import { Avatar, @@ -12,24 +13,43 @@ import { } from "antd"; const { Meta } = Card; const userData = { + coverSrc: "https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png", avatarSrc: "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", - avatarTitle: "Yashwanth Sambaraj", - avatarDescription: "Web Developer STUDENT", + facebook: "www.facebook.com", + instagram: "www.instagram.com", + linkedin: "www.linkedin.com", + twitter: "www.twitter.com", + youtube: "www.youtube.com", + portfolioSrc: "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", portfolioTitle: "Title", portfolioDescription: "Description", }; +const avatarTitle = { + firstName: "Yashwanth", + lastName: "Sambaraj", +}; + +const userType ={ + type: "STUDENT", +} + +const skillDisplay = { + skill: "Web Developer", +} + class ProfileView extends Component { + render() { return ( {/*Cover photo*/}
} + cover={
} className="card-style" bodyStyle={{ maxWidth: "1200px", @@ -49,8 +69,8 @@ class ProfileView extends Component { {/*Avatar description*/} {userData.avatarTitle}} - description={

{userData.avatarDescription}

} + title={

{avatarTitle && avatarTitle.firstName && avatarTitle.lastName ? avatarTitle.firstName +' '+ avatarTitle.lastName : 'No Name Provided'}

} + description={

{`${skillDisplay.skill || ""} ${userType.type}`}

} />
@@ -84,31 +104,31 @@ class ProfileView extends Component { - + - + - + - + - + @@ -218,4 +238,5 @@ class ProfileView extends Component { } } + export default ProfileView; From a1dd4ac7d5277148983d75201b8b534b8fda49a7 Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Fri, 20 Nov 2020 20:25:56 +0530 Subject: [PATCH 07/10] mminor changes --- .../components/ProfileView.web.jsx | 41 ++++++++++++------- 1 file changed, 26 insertions(+), 15 deletions(-) diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index b23346c53..0eb7c23f5 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -13,15 +13,15 @@ import { } from "antd"; const { Meta } = Card; const userData = { - coverSrc: "https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png", + coverSrc: + "https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png", avatarSrc: "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", - facebook: "www.facebook.com", - instagram: "www.instagram.com", - linkedin: "www.linkedin.com", - twitter: "www.twitter.com", - youtube: "www.youtube.com", - + facebook: "https://www.facebook.com", + instagram: "https://www.instagram.com", + linkedin: "https://www.linkedin.com", + twitter: "https://www.twitter.com", + youtube: "https://www.youtube.com", portfolioSrc: "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", portfolioTitle: "Title", @@ -33,23 +33,27 @@ const avatarTitle = { lastName: "Sambaraj", }; -const userType ={ +const userType = { type: "STUDENT", -} +}; const skillDisplay = { skill: "Web Developer", -} +}; class ProfileView extends Component { - render() { return ( {/*Cover photo*/} } + cover={ +
+ } className="card-style" bodyStyle={{ maxWidth: "1200px", @@ -69,8 +73,16 @@ class ProfileView extends Component { {/*Avatar description*/} {avatarTitle && avatarTitle.firstName && avatarTitle.lastName ? avatarTitle.firstName +' '+ avatarTitle.lastName : 'No Name Provided'}} - description={

{`${skillDisplay.skill || ""} ${userType.type}`}

} + title={ +

+ {avatarTitle && avatarTitle.firstName && avatarTitle.lastName + ? avatarTitle.firstName + " " + avatarTitle.lastName + : "No Name Provided"} +

+ } + description={ +

{`${skillDisplay.skill || ""} ${userType.type}`}

+ } />
@@ -238,5 +250,4 @@ class ProfileView extends Component { } } - export default ProfileView; From a8f0be4b3cd6bd3c859519455230dff785c1c2f1 Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Sat, 21 Nov 2020 18:04:04 +0530 Subject: [PATCH 08/10] minor changes --- .../client-react/ui-antd/styles/user.less | 24 ++-- .../components/ProfileView.web.jsx | 112 +++++++++--------- 2 files changed, 71 insertions(+), 65 deletions(-) diff --git a/modules/look/client-react/ui-antd/styles/user.less b/modules/look/client-react/ui-antd/styles/user.less index 739bd44b1..b187d0572 100644 --- a/modules/look/client-react/ui-antd/styles/user.less +++ b/modules/look/client-react/ui-antd/styles/user.less @@ -1,4 +1,4 @@ -.card-cover { +.profile-view-card-cover { height: 33vw; width: 100%; background-position: center; @@ -6,59 +6,59 @@ } -.card-style { +.profile-view-card-style { margin-top: 54px; border-radius: 0; border: 0; position: relative; } -.avatar { +.profile-view-avatar { position: absolute; top: -80px; border: 5px solid white; } -.edit-export-buttons { +.profile-view-edit-export-buttons { position: absolute; top: 24px; right: 24px; } -.export-button { +.profile-view-export-button { margin-right: 24px; } -.profile-about { +.profile-view-profile-about { margin-bottom: 24px; } -.social-icons { +.profile-view-social-icons { font-size: 40px; color: rgba(65, 65, 60, 0.5); } -.portfolio-name { +.profile-view-portfolio-name { font-size: 27px; } -.portfolio-add-button { +.profile-view-portfolio-add-button { position: absolute; top: 24px; right: 24px; } -.portfolios { +profile-view-.portfolios { margin-left: -12px; margin-right: -12px; } -.portfolio-col { +.profile-view-portfolio-col { margin-bottom: 10px; padding-left: 12px; padding-right: 12px; } -.portfolio-card { +.profile-view-portfolio-card { position: relative; cursor: pointer; width: 100%; diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index 0eb7c23f5..781e02773 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -12,11 +12,23 @@ import { Col, } from "antd"; const { Meta } = Card; -const userData = { + +const user = { coverSrc: "https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png", avatarSrc: "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", + username: "username", + avatarTitle: { + firstName: "Yashwanth", + lastName: "Sambaraj", + }, + userType: { + type: "STUDENT", + }, + skillDisplay: { + skill: "Web Developer", + }, facebook: "https://www.facebook.com", instagram: "https://www.instagram.com", linkedin: "https://www.linkedin.com", @@ -28,19 +40,6 @@ const userData = { portfolioDescription: "Description", }; -const avatarTitle = { - firstName: "Yashwanth", - lastName: "Sambaraj", -}; - -const userType = { - type: "STUDENT", -}; - -const skillDisplay = { - skill: "Web Developer", -}; - class ProfileView extends Component { render() { return ( @@ -50,11 +49,11 @@ class ProfileView extends Component { } - className="card-style" + className="profile-view-card-style" bodyStyle={{ maxWidth: "1200px", margin: "auto", @@ -65,33 +64,37 @@ class ProfileView extends Component { {/*Avatar*/} {/*Avatar description*/} - {avatarTitle && avatarTitle.firstName && avatarTitle.lastName - ? avatarTitle.firstName + " " + avatarTitle.lastName + {user.avatarTitle && + user.avatarTitle.firstName && + user.avatarTitle.lastName + ? user.avatarTitle.firstName + " " + user.avatarTitle.lastName : "No Name Provided"} } description={ -

{`${skillDisplay.skill || ""} ${userType.type}`}

+

{`${user.skillDisplay.skill || ""} ${ + user.userType.type + }`}

} />
{/*edit and export buttons*/} -
+
@@ -195,51 +201,51 @@ class ProfileView extends Component { {/*portfolios*/} - - + + } + className="profile-view-portfolio-card" + cover={example} actions={[ , , ]} > - + } + className="profile-view-portfolio-card" + cover={example} actions={[ , , ]} > - + } + className="profile-view-portfolio-card" + cover={example} actions={[ , , ]} > From 43316e71100512419a8b2977211ac0ff413ba31f Mon Sep 17 00:00:00 2001 From: Yashwanth Sambaraj Date: Mon, 23 Nov 2020 22:52:09 +0530 Subject: [PATCH 09/10] modified ProfileView --- .../client-react/ui-antd/styles/user.less | 5 +- .../components/ProfileView.web.jsx | 102 ++++------ .../user/client-react/containers/Profile.jsx | 180 ++---------------- 3 files changed, 55 insertions(+), 232 deletions(-) diff --git a/modules/look/client-react/ui-antd/styles/user.less b/modules/look/client-react/ui-antd/styles/user.less index b187d0572..61c3104c6 100644 --- a/modules/look/client-react/ui-antd/styles/user.less +++ b/modules/look/client-react/ui-antd/styles/user.less @@ -3,7 +3,6 @@ width: 100%; background-position: center; background-size: cover; - } .profile-view-card-style { @@ -29,10 +28,11 @@ margin-right: 24px; } -.profile-view-profile-about { +.profile-view-user-about { margin-bottom: 24px; } +/* .profile-view-social-icons { font-size: 40px; color: rgba(65, 65, 60, 0.5); @@ -63,3 +63,4 @@ profile-view-.portfolios { cursor: pointer; width: 100%; } +*/ diff --git a/modules/user/client-react/components/ProfileView.web.jsx b/modules/user/client-react/components/ProfileView.web.jsx index 781e02773..f5457d51f 100644 --- a/modules/user/client-react/components/ProfileView.web.jsx +++ b/modules/user/client-react/components/ProfileView.web.jsx @@ -1,47 +1,14 @@ import React, { Component } from "react"; +import PropTypes from "prop-types"; import { PageLayout, Tooltip } from "@gqlapp/look-client-react"; -import { - Avatar, - Card, - Button, - Divider, - Descriptions, - Icon, - Row, - Col, -} from "antd"; +import { Avatar, Card, Button, Divider, Icon, Row, Col } from "antd"; const { Meta } = Card; -const user = { - coverSrc: - "https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png", - avatarSrc: - "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", - username: "username", - avatarTitle: { - firstName: "Yashwanth", - lastName: "Sambaraj", - }, - userType: { - type: "STUDENT", - }, - skillDisplay: { - skill: "Web Developer", - }, - facebook: "https://www.facebook.com", - instagram: "https://www.instagram.com", - linkedin: "https://www.linkedin.com", - twitter: "https://www.twitter.com", - youtube: "https://www.youtube.com", - portfolioSrc: - "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", - portfolioTitle: "Title", - portfolioDescription: "Description", -}; - class ProfileView extends Component { render() { + const user = this.props.user; + return ( {/*Cover photo*/} @@ -50,8 +17,8 @@ class ProfileView extends Component { cover={
+ style={{ backgroundImage: `url("${user.profile.cover}")` }} + /> } className="profile-view-card-style" bodyStyle={{ @@ -67,25 +34,19 @@ class ProfileView extends Component { className="profile-view-avatar" size={160} icon="user" - src={user.avatarSrc} + src={user.profile.avatar} /> {/*Avatar description*/} - {user.avatarTitle && - user.avatarTitle.firstName && - user.avatarTitle.lastName - ? user.avatarTitle.firstName + " " + user.avatarTitle.lastName + {user.profile && user.profile.firstName && user.profile.lastName + ? user.profile.firstName + " " + user.profile.lastName : "No Name Provided"} } - description={ -

{`${user.skillDisplay.skill || ""} ${ - user.userType.type - }`}

- } + //description={

{`${user.skillDisplay.skill || ""} ${user.userType.type}`}

} />
@@ -112,20 +73,20 @@ class ProfileView extends Component { {/*about and socialmedia links*/} -
+
About Me!? Haha U already know!
- + {/*} - + - + - + - + - + +*/} info - {/*intrests*/} - + {/* + -> No One @@ -182,7 +144,7 @@ class ProfileView extends Component { - {/*Portfolio and add button*/} + @@ -199,13 +161,13 @@ class ProfileView extends Component {

- {/*portfolios*/} + } + cover={example} actions={[ , , @@ -221,7 +183,7 @@ class ProfileView extends Component { } + cover={example} actions={[ , , @@ -237,7 +199,7 @@ class ProfileView extends Component { } + cover={example} actions={[ , , @@ -250,10 +212,24 @@ class ProfileView extends Component { +*/} ); } } +ProfileView.propTypes = { + user: PropTypes.shape({ + username: PropTypes.string, + role: PropTypes.string, + profile: PropTypes.shape({ + firstName: PropTypes.string, + lastName: PropTypes.string, + cover: PropTypes.string, + avatar: PropTypes.string, + }), + }), +}; + export default ProfileView; diff --git a/modules/user/client-react/containers/Profile.jsx b/modules/user/client-react/containers/Profile.jsx index 92933f546..27f632396 100644 --- a/modules/user/client-react/containers/Profile.jsx +++ b/modules/user/client-react/containers/Profile.jsx @@ -1,174 +1,20 @@ -import React from 'react'; -import { graphql } from 'react-apollo'; -import PropTypes from 'prop-types'; +import React from "react"; +import ProfileView from "../components/ProfileView"; -import { compose } from '@gqlapp/core-common'; - -import ProfileView from '../components/ProfileView'; - -import CURRENT_USER_QUERY from '../graphql/CurrentUserQuery.graphql'; - -const Profile = props => { - const { currentUser } = props; - const { profile } = currentUser; - const profile_data = { - id: currentUser.id, - username: currentUser.role, - role: currentUser.role, - isActive: currentUser.isActive, - email: currentUser.id, +const Profile = (props) => { + const user = { + username: "username", + role: "user", profile: { - firstName: profile.firstName, - lastName: profile.lastName, - isVerified: true, - isAvailable: true, - website: 'www.google.com', - about: 'web developer', - designation: 'dev', + firstName: "Yashwanth", + lastName: "Sambaraj", + cover: + "https://res.cloudinary.com/dpvrqxttb/image/upload/v1604566920/edgenus/image/nkzfil4lqjf556ipjwi5.png", avatar: - 'https://images.unsplash.com/photo-1518806118471-f28b20a1d79d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=700&q=80', - rating: 5, - responseTime: 35, - acceptanceRate: 35, - mobile: 8888888888, - flag: 'good' - }, - - photoId: { - image: - 'https://images.unsplash.com/photo-1518806118471-f28b20a1d79d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=700&q=80', - isVerified: true, - error: null - }, - addresses: [ - { - streetAddress1: 'aaaaaaaa', - streetAddress2: 'bbbbbbb', - city: 'ccccc', - state: 'dddddd', - pinCode: 'eeeeee' - }, - { - streetAddress1: 'wwaaaaaa', - streetAddress2: 'wwwbbbbb', - city: 'wwccc', - state: 'wwdddd', - pinCode: 'wweeee' - } - ], - - identification: { - type: 'government', - documentUrl: - 'https://images.unsplash.com/photo-1518806118471-f28b20a1d79d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=700&q=80', - isVerified: true, - error: null - }, - verification: { - isEmailVerified: true, - isMobileVerified: false, - isPhotoIdVerified: false, - isAddressVerified: false, - isIdVerified: true, - isReferred: false + "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQV9IZZN1faELpjixZnAeYWoESqnPoIpFiPcw&usqp=CAU", }, - endorsements: [ - { - id: 5, - username: 'laluch', - profile: { - firstName: 'of', - lastName: 'rebellion', - avatar: null - } - } - ], - endorsed: [ - { - id: 5, - username: 'laluch', - profile: { - firstName: 'of', - lastName: 'rebellion', - avatar: null - } - } - ], - followers: [ - { - id: 5, - username: 'laluch', - profile: { - firstName: 'of', - lastName: 'rebellion', - avatar: null - } - } - ], - following: [ - { - id: 5, - username: 'laluch', - profile: { - firstName: 'of', - lastName: 'rebellion', - avatar: null - } - } - ], - - portfolios: [ - { - platform: 'google', - portfolioUrl: 'www.google.com' - } - ], - // authCertificate { - // serial - // } - // authFacebook { - // fbId - // displayName - // } - // authGoogle { - // googleId - // displayName - // } - // authGithub { - // ghId - // displayName - // } - // authLinkedin { - // lnId - // displayName - // } - createdAt: currentUser.createdAt, - updatedAt: currentUser.updatedAt }; - - return ; -}; - -Profile.propTypes = { - currentUser: PropTypes.object - // shape({ - // id: PropTypes.number, - // role: PropTypes.string, - // isActive: PropTypes.bool, - // createdAt: PropTypes.string, - // updatedAt: PropTypes.string, - // profile: PropTypes.shape({ - // firstName: PropTypes.string, - // lastName: PropTypes.string - // }) - // }) + return ; }; -export default compose( - graphql(CURRENT_USER_QUERY, { - props({ data: { loading, error, currentUser } }) { - if (error) throw new Error(error); - return { loading, currentUser }; - } - }) -)(Profile); +export default Profile; From 43ee0d8d777a950e0bacecb4ca9cedcf3160308e Mon Sep 17 00:00:00 2001 From: root Date: Wed, 25 Nov 2020 17:14:42 +0530 Subject: [PATCH 10/10] yarn lock updated --- .../client-react/ui-antd/styles/user.less | 132 +++++++++--------- yarn.lock | 3 +- 2 files changed, 67 insertions(+), 68 deletions(-) diff --git a/modules/look/client-react/ui-antd/styles/user.less b/modules/look/client-react/ui-antd/styles/user.less index 61c3104c6..1fae36464 100644 --- a/modules/look/client-react/ui-antd/styles/user.less +++ b/modules/look/client-react/ui-antd/styles/user.less @@ -1,66 +1,66 @@ -.profile-view-card-cover { - height: 33vw; - width: 100%; - background-position: center; - background-size: cover; -} - -.profile-view-card-style { - margin-top: 54px; - border-radius: 0; - border: 0; - position: relative; -} - -.profile-view-avatar { - position: absolute; - top: -80px; - border: 5px solid white; -} - -.profile-view-edit-export-buttons { - position: absolute; - top: 24px; - right: 24px; -} - -.profile-view-export-button { - margin-right: 24px; -} - -.profile-view-user-about { - margin-bottom: 24px; -} - -/* -.profile-view-social-icons { - font-size: 40px; - color: rgba(65, 65, 60, 0.5); -} -.profile-view-portfolio-name { - font-size: 27px; -} - -.profile-view-portfolio-add-button { - position: absolute; - top: 24px; - right: 24px; -} - -profile-view-.portfolios { - margin-left: -12px; - margin-right: -12px; -} - -.profile-view-portfolio-col { - margin-bottom: 10px; - padding-left: 12px; - padding-right: 12px; -} - -.profile-view-portfolio-card { - position: relative; - cursor: pointer; - width: 100%; -} -*/ +.profile-view-card-cover { + height: 33vw; + width: 100%; + background-position: center; + background-size: cover; +} + +.profile-view-card-style { + margin-top: 54px; + border-radius: 0; + border: 0; + position: relative; +} + +.profile-view-avatar { + position: absolute; + top: -80px; + border: 5px solid white; +} + +.profile-view-edit-export-buttons { + position: absolute; + top: 24px; + right: 24px; +} + +.profile-view-export-button { + margin-right: 24px; +} + +.profile-view-user-about { + margin-bottom: 24px; +} + +/* +.profile-view-social-icons { + font-size: 40px; + color: rgba(65, 65, 60, 0.5); +} +.profile-view-portfolio-name { + font-size: 27px; +} + +.profile-view-portfolio-add-button { + position: absolute; + top: 24px; + right: 24px; +} + +profile-view-.portfolios { + margin-left: -12px; + margin-right: -12px; +} + +.profile-view-portfolio-col { + margin-bottom: 10px; + padding-left: 12px; + padding-right: 12px; +} + +.profile-view-portfolio-card { + position: relative; + cursor: pointer; + width: 100%; +} +*/ diff --git a/yarn.lock b/yarn.lock index 2c9cca36f..b7bb844b4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -22573,7 +22573,6 @@ react-native-view-shot@3.1.2: "react-native@https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz": version "0.59.8" - uid cf62758ae75b5df304836ad9971239abdb240587 resolved "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz#cf62758ae75b5df304836ad9971239abdb240587" dependencies: "@babel/runtime" "^7.0.0" @@ -22940,7 +22939,7 @@ react@16.9.0: object-assign "^4.1.1" prop-types "^15.6.2" -react@^16.0.0, react@^16.8.3, react@^16.9.0: +react@^16.0.0, react@^16.8.3: version "16.13.1" resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e" integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==