Add User's projects to their profile #152

Closed
opened 2020-12-12 05:32:22 +01:00 by Irev-Dev · 10 comments
Irev-Dev commented 2020-12-12 05:32:22 +01:00 (Migrated from github.com)

See designs here
image

Currently, the only thing missing is the bottom section with the list of parts.
You should be able to re-use web/src/components/Parts/Parts.js to recreate the list, as this is already used on the homepage and looks almost exactly the same.

See designs [here](https://www.figma.com/file/VUh53RdncjZ7NuFYj0RGB9/CadHub?node-id=40%3A54) ![image](https://user-images.githubusercontent.com/29681384/101975275-4e810400-3c8f-11eb-87ba-0f4a3533f5a1.png) Currently, the only thing missing is the bottom section with the list of parts. You should be able to re-use `web/src/components/Parts/Parts.js` to recreate the list, as this is already used on the homepage and looks almost exactly the same.
YosephKS commented 2020-12-12 09:27:33 +01:00 (Migrated from github.com)

Hey @Irev-Dev, I am new to this repo and would love to contribute by resolving this issue.

Hey @Irev-Dev, I am new to this repo and would love to contribute by resolving this issue.
Irev-Dev commented 2020-12-12 09:34:26 +01:00 (Migrated from github.com)

Awesome @YosephKS, thanks for the help.

The instructions in the readme for how to get setup should be up-to-date, I'll be as responsive as I can if you hit any snags.

Just trying to think of any extra details that will be helpful to you for this one.

Are you familiar with GraphQL?
I ask because you'll need to update a GraphQL query to get the data for these parts

Awesome @YosephKS, thanks for the help. The instructions in the readme for how to get setup should be up-to-date, I'll be as responsive as I can if you hit any snags. Just trying to think of any extra details that will be helpful to you for this one. Are you familiar with GraphQL? I ask because you'll need to update a GraphQL query to get the data for these `parts`
Irev-Dev commented 2020-12-12 09:36:26 +01:00 (Migrated from github.com)

The user profile is in web/src/components/UserProfile/UserProfile.js

The user profile is in `web/src/components/UserProfile/UserProfile.js`
YosephKS commented 2020-12-12 09:36:36 +01:00 (Migrated from github.com)

@Irev-Dev Thank you very much for the opportunity!

And yes I am familiar with GraphQL, I usually use Apollo GraphQL for my projects.

Awesome, I'll have a check on that file.

@Irev-Dev Thank you very much for the opportunity! And yes I am familiar with GraphQL, I usually use Apollo GraphQL for my projects. Awesome, I'll have a check on that file.
Irev-Dev commented 2020-12-12 09:37:37 +01:00 (Migrated from github.com)

Perfect.

Perfect.
Irev-Dev commented 2020-12-12 09:48:03 +01:00 (Migrated from github.com)

So the query is in web/src/components/UserCell/UserCell.js and it gets passed down to the userProfile. You can either modify that to get the parts data or you can make a new "cell" that has it's own query and fetches data itself.

"Cell" is a redwoodjs term, so there would be a bit more to learn (unless you already are familiar with the framework). So probably just modifying the original query is easier. Your choice.

If you did want to make your own cell Redwood will do the heavy lifting for you and generate the start of a cell for you. once you have the project set up running yarn redwood generate cell userProfileParts will get you going, but again this is optional.

I also just noticed that the exact same query web/src/components/EditUserCell/EditUserCell.js too, so that will need to be updated as well as the UserCell (it's not great that there duplication here, but that's something I should clean up later)

So to dump all this info on you, just wouldn't want you getting lost, and I know it can be challenging finding you way around a new repo.

So the query is in `web/src/components/UserCell/UserCell.js` and it gets passed down to the userProfile. You can either modify that to get the parts data or you can make a new "cell" that has it's own query and fetches data itself. ["Cell"](https://redwoodjs.com/tutorial/cells) is a redwoodjs term, so there would be a bit more to learn (unless you already are familiar with the framework). So probably just modifying the original query is easier. Your choice. If you did want to make your own cell Redwood will do the heavy lifting for you and generate the start of a cell for you. once you have the project set up running `yarn redwood generate cell userProfileParts` will get you going, but again this is optional. I also just noticed that the exact same query `web/src/components/EditUserCell/EditUserCell.js` too, so that will need to be updated as well as the UserCell (it's not great that there duplication here, but that's something I should clean up later) So to dump all this info on you, just wouldn't want you getting lost, and I know it can be challenging finding you way around a new repo.
YosephKS commented 2020-12-12 12:47:58 +01:00 (Migrated from github.com)

@Irev-Dev btw does this looks good to you? maybe you want me to modify the margin/padding a bit?
Screenshot from 2020-12-12 17-08-44

@Irev-Dev btw does this looks good to you? maybe you want me to modify the margin/padding a bit? ![Screenshot from 2020-12-12 17-08-44](https://user-images.githubusercontent.com/48710170/101983015-7fbafd80-3caa-11eb-97cb-c3796f0047b2.png)
YosephKS commented 2020-12-12 12:48:58 +01:00 (Migrated from github.com)

@Irev-Dev also yeah for the GraphQL queries and mutations I think it would be better if they could be placed like in a seperate GraphQL folder, then it can be exported from there. I think it would look much nicer. If you want I can do that in a different PR later.

@Irev-Dev also yeah for the GraphQL queries and mutations I think it would be better if they could be placed like in a seperate `GraphQL` folder, then it can be exported from there. I think it would look much nicer. If you want I can do that in a different PR later.
Irev-Dev commented 2020-12-12 12:54:02 +01:00 (Migrated from github.com)

Yeah that looks great, Thanks @YosephKS. Padding wise if you could match the vertical padding between "parts:" and the cards to be the same as `bio:" and the bio that would be good.

And don't move any of the GraphQL queries. Thanks for the offer but moving them out of the "Cell" components would go against redwoods "cell" philosophy. I'm not too opinionated about it myself, except for the fact that I don't want to break with redwood conventions at this point in time.

Yeah that looks great, Thanks @YosephKS. Padding wise if you could match the vertical padding between "parts:" and the cards to be the same as `bio:" and the bio that would be good. And don't move any of the GraphQL queries. Thanks for the offer but moving them out of the "Cell" components would go against redwoods "cell" philosophy. I'm not too opinionated about it myself, except for the fact that I don't want to break with redwood conventions at this point in time.
YosephKS commented 2020-12-12 12:56:32 +01:00 (Migrated from github.com)

@Irev-Dev Oh I see cool, let me fix the padding a bit real quick then I'll make a PR.

Ah I see, I just know that about redwoods, maybe I can read more about it later because I haven't fully familiarized with the framework yet, but good to know.

@Irev-Dev Oh I see cool, let me fix the padding a bit real quick then I'll make a PR. Ah I see, I just know that about redwoods, maybe I can read more about it later because I haven't fully familiarized with the framework yet, but good to know.
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: h3n3/cadhub#152