feat: About page #69
feat: About page #69
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Added access token and deployed |
IgboPharaoh
force-pushed
the
feat/about-page
branch
from
75f02f0 to
5a9e1ef
Compare
scripts/fetchReviewers.js
Outdated
| const url = `https://api.github.com/repos/bitcointranscripts/bitcointranscripts`; | ||
| const token = process.env.GITHUB_ACCESS_TOKEN; | ||
|
|
||
| if (!process.env.GITHUB_ACCESS_TOKEN) { |
There was a problem hiding this comment.
we can use the token variable declared earlier.
i.e if (!token)
There was a problem hiding this comment.
also add a check for prod.
i.e (!process.env. GITHUB_ACCESS_TOKEN && process.env.NODE_ENV === "production")
having dev contributors generate gh keys to run adds extra restrictions
scripts/fetchReviewers.js
Outdated
| for (const { | ||
| author: { avatar_url, login }, | ||
| } of commits) { | ||
| reviewers[login] = { image: avatar_url, title: trimText(login) }; |
There was a problem hiding this comment.
any specific reason why we are using objects and not an array
There was a problem hiding this comment.
Its a matter of choice. I am using the the key to add reviewer data to the object which makes the addition on one pass. Using an array I will have to define a condition before it is been added and but for an object, new items with the same key replace existing items with the same key inside the object ensuring every item is unique without setting an extra condition.
scripts/fetchReviewers.js
Outdated
| page++; | ||
| } | ||
|
|
||
| const trimText = (text) => (text.length > 15 ? text.substring(0, 15) + "..." : text); |
There was a problem hiding this comment.
lets modify the data in the FE so we don't lose information here
There was a problem hiding this comment.
There is no loss of information here as we are only trimming the string so reviewer title fits into the grid box
src/app/about/page.tsx
Outdated
| <div className='flex items-center justify-center pt-8 md:pt-14'> | ||
| <div className='flex gap-5 md:gap-5 max-w-[1060px] flex-wrap justify-center'> | ||
| {Object.values(data).map(({ title, image }) => ( | ||
| <div key={title} className='flex flex-col items-center justify-center w-[150px] md:w-[160px] max-[340px]:w-[130px] gap-2 md:px-[14px]'> |
There was a problem hiding this comment.
let's have a link to the contributor profile
src/app/about/page.tsx
Outdated
|
|
||
| <GroupedImageSection | ||
| title='Reviewers' | ||
| subText='Editors evaluate and finalize Reviewers submissions, ensuring they’re consistently high quality.' |
|
Nice work! which correlates with this comment it helps to have visual changes in the FE while we keep information intact. We can limit the characters with CSS in the component itself. This will be more dynamic and there won't be information loss |
IgboPharaoh
force-pushed
the
feat/about-page
branch
from
9042957 to
01369fa
Compare
Great point which I didn't factor in, I've made necessary changes to fix this. |
nice. You can also limit with CSS using max-width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;on the |
IgboPharaoh
force-pushed
the
feat/about-page
branch
from
01369fa to
c72549f
Compare
|
ACK! @IgboPharaoh this looks good. Merging! you can complete the dashed linking in a new PR |
This pr adds the About page :
The deployment is failing as a GITHUB_ACCESS_TOKEN will be needed to test this implementation.
A further discussion is needed to finalise on this implementation.