Web: As a funder of a bounty, I'd love to see an at a glance view of contributor stats so I can quickly decide who to approve for my bounty.

[PixelantDesign]

BUILD FRONT END

As a funder of a bounty, I'd love to see an at a glance view of contributor stats so I can quickly decide who to approve for my bounty.

Why is this needed?

There isn't a quick way to see this information right now. As a funder, I have to click on each individual contributor to go review their profile pages.

Definition of Done

• [ ] Use Muli font
• [ ] Use the correct font colors supplied in the file
• [ ] Use the correct font sizes (important for such a small space)
• [ ] Build a flyout that shows me all of this information pulled in from a user's data.
• [ ] Reuse the same flyout from the Issue Explorer
• [ ] The flyout should show as a hover state on a users avatar
• [ ] If the user has more funded bounties than completed bounties as a contributor, show the persona with more data.
• [ ] Ensure that links click through to the appropriate detailed information.
• [ ] Set it up so it fetches the user data from server on mouse over.
• [ ] Setup and endpoint to fetch user data (actual profile is not an ajax call)
• [ ] Don't use jquery-ui, use bootstrap popover instead.
• [ ] Display the project icons to show max of 3 of the most recently worked on tasks.
• [ ] fetch user data on the first mouse hover (not each time the user is overed)
• [ ] keep it in "component way" to be usable in other places.
• [ ] The flyout should be coded it up as a _reusable shared module across pages_
• [ ] Post screenshots of your progress on the PR
• [ ] This feature must pass all engineering required tests and PR review requirements
• [ ] Review with @PixelantDesign @danlipert @octavioamu

Please Ignore the Specialty text for right now.

Assets

FILE

ContributorFLyout.zip

[octavioamu]

An idea to don't overload the page loading with that data would be fetch the user data from server on mouse over.
Some things to have in mind for this task:

• Setup and endpoint to fetch user data (actual profile is not an ajax call)
• Don't use jquery-ui, use bootstrap popover instead. (we are removing jquery-ui as a dependency)
• fetch user data on the first mouse hover (not each time the user is overed)
• keep it in "component way" to be usable in other places.

[kuhnchris]

yeah, pop-over, make it reusable, nice idea, I like it. Do we not have something similar already for bounties in the issue explorer itself?

[octavioamu]

@kuhnchris we just have a popover and currently in tech debt work to change and use bootstrap instead of jquery-ui.

[kuhnchris]

Those? https://getbootstrap.com/docs/4.2/components/popovers/
They are very easily implementable ;-)

Also, if we'd switch to bootstrap components, should we also include the "Toasts" Components for the new Notifications?

https://getbootstrap.com/docs/4.2/components/popovers/
https://getbootstrap.com/docs/4.2/components/toasts/

[octavioamu]

@kuhnchris Yes but for the toast we need to update our bootstrap version to the newest release and don't really have a lot of value, maybe for others features we create.
But what is really interesting in that last release is the use of shadow dom for tooltips and negative margins.
Anyway we are going to update bootstrap soon for sure.

[octavioamu]

@kuhnchris are you interested in this one?

[kuhnchris]

👍
Anyways, this needs to be split into two parts:
A frontend part for the design / implementation of the HTML snippet and popover
and
A backend endpoint that provides the data for the snippet. Cleanest would be JSON and use Javascript + DOM to insert the values

[kuhnchris]

I would have interest but I'm far too cramped with stuff right now, so if someone got resources or wants to bounty it go ahead. (wouldn't be fair to keep blocking all this stuff)

[octavioamu]

Got it! Thanks for the sincerity

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__This issue now has a funding of 0.82 ETH (120.86 USD @ $147.39/ETH) attached to it.__

• If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
  
  
  
  • Want to chip in? Add your own contribution here.
  
  
  • Questions? Checkout Gitcoin Help or the Gitcoin Slack
  
  
  • $58,887.74 more funded OSS Work available on the Gitcoin Issue Explorer
  
  

[deeayeen]

Awesome feature implementation! +1!

If no one else is interested I'll be happy to do this.

[PixelantDesign]

@deeayeen I have other front-end work if you're interested!

[deeayeen]

@PixelantDesign Always!

[ovieokeh]

This looks interesting. Is @deeayeen still taking this? If not, I'm more than happy to jump on it.

[octavioamu]

now the issue explorer is using bootstrap popover, so can be used as a guide of how to use it for this feature.

[dvdptr]

@PixelantDesign
Hi, is this bounty for the design of the popover or the implementation of attached file? I'm a designer and interested in this one, if it's about the visual design. thanks!

[iamonuwa]

@gitcoinbot, work in progress. Will send in a PR before tomorrow

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__Work has been started__.

These users each claimed they can complete the work by 4 weeks, 1 day ago.
Please review their action plans below:

1) kziemianek has applied to start work _(Funders only: approve worker | reject worker)_.

I will follow the steps listed in Definition of done and I think I can deliver it in 2 weeks with the first WIP in a couple of days.

Learn more on the Gitcoin Issue Details page.

2) iamonuwa has been approved to start work.

If I don't apply for this task, wetin I gain? :thinking_face: :man-shrugging::skin-tone-6:

Learn more on the Gitcoin Issue Details page.

[ovieokeh]

@PixelantDesign Since there is no backend implementation to handle fetching of user data yet, how do you propose we get the data for the popover? Would dummy data be acceptable?

[gitcoinbot]

@iamonuwa Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

@iamonuwa due to inactivity, we have escalated this issue to Gitcoin's moderation team. Let us know if you believe this has been done in error!

• [x] reminder (3 days)
• [x] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[iamonuwa]

@gitcoinbot work is in progress. I need help to load the organizations as it only returns the org name from backend

[gitcoinbot]

@iamonuwa Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

@iamonuwa due to inactivity, we have escalated this issue to Gitcoin's moderation team. Let us know if you believe this has been done in error!

• [x] reminder (3 days)
• [x] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__Work for 0.82 ETH (113.02 USD @ $137.83/ETH) has been submitted by__:

1. @iamonuwa

@PixelantDesign please take a look at the submitted work:

• PR by @iamonuwa

---

• Learn more on the Gitcoin Issue Details page
• Want to chip in? Add your own contribution here.
• Questions? Checkout Gitcoin Help or the Gitcoin Slack
• $53,068.12 more funded OSS Work available on the Gitcoin Issue Explorer

[gitcoinbot]

⚡️ A *Hard Worker* Kudos has been sent to @iamonuwa for this issue from @PixelantDesign. ⚡️ The sender had the following public comments: > Great Job on the Flyout! Nice work @iamonuwa! Your Kudos has automatically been sent in the ETH address we have on file.

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__The funding of 0.82 ETH (142.03 USD @ $173.21/ETH) attached to this issue has been approved & issued to @iamonuwa.__

• Learn more on the Gitcoin Issue Details page
• Questions? Checkout Gitcoin Help or the Gitcoin Slack
• $99,630.40 more funded OSS Work available on the Gitcoin Issue Explorer