feat: use new design for FileContributors#14898
Conversation
github-actions
Bot
added
content 🖋️
✅ Deploy Preview for ethereumorg ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Hey @konopkja, could you take a look at this? Let me know if anything needs improvement! |
|
looks awesome! I think this gap could be 50% of what it is now, but overall its great! I noticed that the component is only visible on desktop, do you intend on preparing it for mobile also? I think there is enough space |
@konopkja Sure, I'll work on this soon! |
|
Hey @konopkja , I’ve adjusted the gap and made the updates for mobile. I also want to point out a few additional changes I made that you might not notice:
Could you take a look at those as well and let me know if everything looks fine? Appreciate your feedback! |
Hey @JoeChenJ it looks perfect! Really appreciate this particular contribution <3 |
|
shall we discuss extending this component to other pages outside developer docs or would it be better tackled in another PR? |
I think it would be best to merge this PR first, and then we can extend it in another one, as it might take a bit more time |
JoeChenJ
requested review from
corwintines,
minimalsm,
pettinarip and
wackerow
as code owners
…com/JoeChenJ/ethereum-org-website into Use_new_design_for_FileContributors
|
Hey @konopkja, I've made some progress on the extension—the component is now available at the end of the markdown pages. Since this PR is still open, I've pushed the changes here! |
|
|
|
@JoeChenJ, great contribution! Thank you From my side, this component should always be at the end of the content, before the callouts and widgets. I would add a border-top to it. See if this screenshot helps.
Are you thinking of all content pages? Something like all pages minus (homepage & Hubpages). Is this the goal? |
|
@nloureiro thank you for the guidance! Adding a border-top looks much better. I was planning to add this component on every page, but not sure if it fits well across all designs. Do you think we should exclude certain pages? Would love to get your thought on it! |
That's wierld, I think the changes in #14931 lead to this problem |
|
should be fine now |
corwintines
left a comment
corwintines
left a comment
There was a problem hiding this comment.
Great job on this so far @JoeChenJ!
I just have a couple changes, and one note.
I think for consistency sake across the site, we should have this above the feedback card. I think the pages I noticed where it wasn't and it looked odd for me was:
- /what-is-ethereum
- /run-a-node
- /get-eth
- /gas
- /wallets
There may have been some conflicting feedback on this before, but chatted with @nloureiro and @konopkja today to confirm this.
Thats the main design change for this, but I have one note to add to let you know about. We will be bringing in #15114 shortly, which changes the path for these react pages. I want to bring that PR in first, and then check if we need to make any changes to the getPageContributorInfo function in @/lib/utils/contributors.ts.
Overall, this is great and excited to get this in. For me just the little design cleanup, and then spot checking the functionality after that other PR is brought in.
|
Second that... Will try to help add clarity on the changes the above PR will bring. Page components are getting moved to a new location, but also being split into two files. One will be the base page (server component), and the other will contain any client-side logic. By example, let's look at the bug-bounty page:
@pettinarip Correct me if I'm wrong, but to my understand the existing page components ( |
Unfortunately, the commit history didn't carry over to the new path, if we merge |
JoeChenJ
force-pushed
the
Use_new_design_for_FileContributors
branch
2 times, most recently
from
1240255 to
0319ac9
Compare
wackerow
left a comment
wackerow
left a comment
There was a problem hiding this comment.
From a design / UI side this looks great..
From a data side, the GitHub API does not seem to be returning quite what we need here.
During the "app router" migration we used git mv to bring the git commit history along with the file, but we're not actually using the true git history here (since that isn't available to Netlify during build) but instead we're hitting the GitHub API, which does not seem to be bringing the commit history we need.
I think we need to figure that out a big more before we display this component with a bunch of inaccurate information.
One nuance to the API, it doesn't seem to bring git history when a file is move... you have to query for that old path. So as part of this we may (unfortunately) need to check src/pages/[locale]/<pagename>.tsx as well, for example:
... but again, the data returned isn't even correct... for example, I originally built the run-a-node.tsx page, but the above query returns only a few commits by Pablo.
cc: @pettinarip we may need to figure out another way to index this information 🤔
FYI if we query all of the following paths:
we can generally reconstruct the full commit history. For example:
That said, I'm wondering is there a more sustainable way to trace file history across renames/moves? |
wackerow
left a comment
wackerow
left a comment
There was a problem hiding this comment.
Ah, great catch @JoeChenJ!! Thanks for this reminder that there are even more paths we need to check... I found that there are actually two more missing from that list (the same two src paths but for when we nested an index):
src/pages/[locale]/<pagename>/index.tsxsrc/pages/<pagename>/index.tsx
So, I went ahead and pulled these SIX paths out into a separate function so we can pass a pagePath and get the list of paths that we need to fetch... then it uses a reducer to fetch each one and spread it into a single array.
^ Testing locally this is working great now, pulling alll the contributors for all the React pages, which was my primary blocker.... approving and pulling this in, thanks again for the help!
wackerow
left a comment
wackerow
left a comment
There was a problem hiding this comment.
All the pages that this touches are not loading in the current build, despite them working for me locally.. need to investigate before pulling in
refactor to more precise naming. Create getAppPageLastCommitDate for react page history fetches. Throw error at build if contributor information not available.
make date required for last commit from github data; 0 date fallback from crowdin contributor data
wackerow
left a comment
wackerow
left a comment
There was a problem hiding this comment.
Great! I think this is finally working.. had to adjust how we checked the "last edit date" for these files... with the markdown files, they live in /public/content so the git log approach works, but with these files we don't have access to the git history, so we need to use the last GitHub contribution.
I've updated to account for this, and double checked the pages we were having problems with and it looks good to go.. thanks for the help here @JoeChenJ!
5 participants
Description
Use new design for
FileContributorsRelated Issue
#8024 & #14473