Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Lottery Factor chart for Repo pages #3343

Merged
merged 24 commits into from May 13, 2024
Merged

Conversation

zeucapua
Copy link
Contributor

@zeucapua zeucapua commented May 8, 2024

Description

Implement a new LotteryFactorChart that show the repository and top 4 contributors' lotto factor with a summary and segmented bar chart to see contributor distribution.

Related Tickets & Documents

Closes #3341
Closes #3365

Mobile & Desktop Screenshots/Recordings

Screen.Recording.2024-05-10.at.4.27.59.PM.mov

Steps to QA

  • Go to any repo page and see card at the top
  • Ensure the following values are calculated and displayed correctly:
    • The top four contributors' percentage of total combined + other contributors' = 100%
    • The bar shows (roughly) each contributor(s)' percentage as its width
    • Summary describes either the top 4 contributors' total if it's less than 50%, or the first few contributors to total above 50%
    • Colors displayed based on lotto factor level (see issue)

Tier (staff will fill in)

  • Tier 1
  • Tier 2
  • Tier 3
  • Tier 4

[optional] What gif best describes this PR or how it makes you feel?

Copy link

netlify bot commented May 8, 2024

Deploy Preview for design-insights ready!

Name Link
🔨 Latest commit 218eaab
🔍 Latest deploy log https://app.netlify.com/sites/design-insights/deploys/6642522e6c8be40008bf1557
😎 Deploy Preview https://deploy-preview-3343--design-insights.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented May 8, 2024

Deploy Preview for oss-insights ready!

Name Link
🔨 Latest commit 218eaab
🔍 Latest deploy log https://app.netlify.com/sites/oss-insights/deploys/6642522eb35465000881b0bd
😎 Deploy Preview https://deploy-preview-3343--oss-insights.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@isabensusan
Copy link
Member

I'll review it further, but just collecting on feedback from @bdougie -- Let's add an explainer tooltip to the title to explain what lottery factor is

@zeucapua zeucapua requested a review from a team May 10, 2024 02:02
@zeucapua zeucapua marked this pull request as ready for review May 10, 2024 02:06
@bdougie
Copy link
Member

bdougie commented May 10, 2024

Note for @jpmcb, we talked IRL. But we should filter out bots on the end point.

@isabensusan
Copy link
Member

One small comment is that if there hasn't been any commits for the time range selected, it breaks:
image

I'm designing both an empty state and the tooltip rn so we can work them in, put the chart in the layout and ship :)

components/Repositories/LotteryFactorChart.tsx Outdated Show resolved Hide resolved
components/Repositories/LotteryFactorChart.tsx Outdated Show resolved Hide resolved
components/molecules/DevProfile/dev-profile.tsx Outdated Show resolved Hide resolved
next-types.d.ts Outdated Show resolved Hide resolved
@isabensusan
Copy link
Member

isabensusan commented May 10, 2024

@zeucapua here's the empty state for this chart as well:

image

Image by itself:
empty-state

Copy link
Member

@nickytonline nickytonline left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking great on all screen sizes!

CleanShot 2024-05-10 at 16 05 14

CleanShot 2024-05-10 at 16 05 49

CleanShot 2024-05-10 at 16 06 12

@nickytonline
Copy link
Member

@zeucapua here's the empty state for this chart as well:

image Image by itself: ![empty-state](https://private-user-images.githubusercontent.com/27322879/329694255-9bd14794-04c1-4684-ada2-123e38cf6d65.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTUzNzMxNDAsIm5iZiI6MTcxNTM3Mjg0MCwicGF0aCI6Ii8yNzMyMjg3OS8zMjk2OTQyNTUtOWJkMTQ3OTQtMDRjMS00Njg0LWFkYTItMTIzZTM4Y2Y2ZDY1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA1MTAlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNTEwVDIwMjcyMFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTViMWJmZWE0MzYzMTgxMjNkNWM2NGFiY2QwMzFiYWJiYjI0ODQzN2EzNzI0YzZlMjJmMjI5MWZhM2UwNzFkNDQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.GoK1c4kQ9P-WHno35V4rGotLbcgZgGWYoAZS-Sm6fr0)

Can we add an empty state example to the Storybook stories as well?

Copy link
Member

@nickytonline nickytonline left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for making the updates @zeucapua.

One last thing. The loading state doesn't span the whole chart for contributor rows.

CleanShot 2024-05-13 at 12 24 41

@zeucapua zeucapua requested review from nickytonline and a team May 13, 2024 18:17
Copy link
Member

@nickytonline nickytonline left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for making the changes @zeucapua!

🚢

Copy link
Member

@isabensusan isabensusan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me!

@zeucapua zeucapua merged commit deda50e into beta May 13, 2024
19 checks passed
@zeucapua zeucapua deleted the feat/repo-pages-lotto branch May 13, 2024 18:58
open-sauced bot pushed a commit that referenced this pull request May 13, 2024
## [2.27.0-beta.1](v2.26.1-beta.1...v2.27.0-beta.1) (2024-05-13)

### 🍕 Features

* Lottery Factor chart for Repo pages ([#3343](#3343)) ([deda50e](deda50e))
open-sauced bot pushed a commit that referenced this pull request May 15, 2024
## [2.27.0](v2.26.0...v2.27.0) (2024-05-15)

### 🍕 Features

* Contributors tab for Repo pages ([#3342](#3342)) ([f1142c3](f1142c3))
* Lottery Factor chart for Repo pages ([#3343](#3343)) ([deda50e](deda50e))

### 🐛 Bug Fixes

* now opening workspace dropdown puts focus on search input ([#3364](#3364)) ([bafa0e4](bafa0e4))
* now StarSearch remains visible on smaller screens in the top menu ([#3374](#3374)) ([d6d0048](d6d0048))
* temporarily returning for event: function_call in readable stream from StarSearch ([#3379](#3379)) ([f6f4b01](f6f4b01))
* title for PR chart tooltip ([#3350](#3350)) ([56b2746](56b2746))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Feature: new "information" icon component for metric explainer tooltip Feature: Lottery Factor Chart
4 participants