Convert Sparkline to typescript #2347
Conversation
rohitvinnakota-codecov
changed the title
| } | ||
|
|
||
| export interface SparklineProps { | ||
| datum: any[] |
There was a problem hiding this comment.
Prefer to avoid any but we need to support custom inputs.
There was a problem hiding this comment.
Hmm, could we pass Sparkline a generic? That way internally it could use that instead of any's
Example:
select?: (data: any) => NumberOrNullOrUndefined
could be
select?: (data: T) => NumberOrNullOrUndefined
There was a problem hiding this comment.
I did a little bit of digging to see if it was possible. If we pass a generic type to SparklineProps, we would have to define either a default type definition or specify a type in the component function. For example, something like export interface SparklineProps<T = any> or const Sparkline: React.FC<SparklineProps<any>>. One other thing to note is datum is an array of potentially different types, and what's being passed into select can be any type(different type from datum).
We could specify a default type that does not require the use of any doing something like T extends {value:...} but that would restrict the custom types we are able to support by forcing them to adhere to that type. My feeling is that this is a decent solution, but will require a few changes to other files.
Another path forward is refactoring the file to keep the same behaviour but make it work better with typescript, which I also think is valid but that could be considered as a separate issue.
I'm keen to hear your thoughts on these suggestions.
There was a problem hiding this comment.
Ok I took a look myself, you're correct I dont think we can properly use Typescript generics yet...
For now any is ok, long term I think the option to refactor the code is the best option. Properly use generics is important for this sort of data selection pattern. But we can spin that out into another tech debt ticket. Thanks for the investigation 👍
rohitvinnakota-codecov
force-pushed
the
rvinnakota/convert-sparkline-to-ts
branch
from
3108b58 to
a74de4c
Compare
✅ Deploy Preview for gazebo-staging ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
…ota/convert-sparkline-to-ts
✅ Deploy Preview for gazebo-staging ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for gazebo-staging ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
Codecov Report
@@ Coverage Diff @@
## main #2347 +/- ##
=======================================
Coverage 97.14% 97.15%
=======================================
Files 725 725
Lines 8666 8675 +9
Branches 2142 2142
=======================================
+ Hits 8419 8428 +9
- Misses 244 245 +1
+ Partials 3 2 -1
Continue to review full report in Codecov by Sentry.
|
Codecov Report
Additional details and impacted files@@ Coverage Diff @@
## main #2347 +/- ##
=======================================
Coverage 97.14% 97.15%
=======================================
Files 725 725
Lines 8666 8675 +9
Branches 2136 2142 +6
=======================================
+ Hits 8419 8428 +9
- Misses 244 245 +1
+ Partials 3 2 -1
Continue to review full report in Codecov by Sentry.
|
Codecov Report
@@ Coverage Diff @@
## main #2347 +/- ##
=======================================
Coverage 97.14% 97.15%
=======================================
Files 725 725
Lines 8666 8675 +9
Branches 2093 2130 +37
=======================================
+ Hits 8419 8428 +9
+ Misses 245 244 -1
- Partials 2 3 +1
Continue to review full report in Codecov by Sentry.
|
Codecov Report
@@ Coverage Diff @@
## main #2347 +/- ##
=====================================
Coverage 97.15 97.15
=====================================
Files 725 725
Lines 8666 8675 +9
Branches 2093 2099 +6
=====================================
+ Hits 8419 8428 +9
Misses 245 245
Partials 2 2
Continue to review full report in Codecov by Sentry.
|
| } | ||
|
|
||
| export interface SparklineProps { | ||
| datum: any[] |
There was a problem hiding this comment.
Ok I took a look myself, you're correct I dont think we can properly use Typescript generics yet...
For now any is ok, long term I think the option to refactor the code is the best option. Properly use generics is important for this sort of data selection pattern. But we can spin that out into another tech debt ticket. Thanks for the investigation 👍
* Convert sparkline to typescript * Consistent type defs * better variable names
* first pass, wheeeeeo * Sorting functionality * Update with tests * wrap up repos list: * Spelling correction (#2336) * 616 add patch setction pr page team tier (#2337) * feat: add header component for team tier customers * feat: converted Header.jsx to Header.tsx + tests * fix: add comparison schema types * fix: Filter out certain browser from sending events to Sentry (#2338) Filter out events for a given browser because they don't have all JS functions fully implemented causing issues that we cannot address. * feat: Hide Flag MultiSelect when on Team Plan on Commit Detail Page (#2327) We will need to hide the flag multi select on the commit detail page when the user is on the team plan as they are not an available feature to those users. GH codecov/engineering-team#687 * feat, ref: Disable Flag MultiSelect on Coverage Tab when on a Team Plan (#2329) Disable the flag multi-select on the coverage tab when users/orgs are on a team plan. GH codecov/engineering-team#685 * feat: Grab flags in IndirectChangesTable and pass along with request (#2335) Update indirect changes tab on the commit detail page to grab flags from the url params and pass along as query args. GH codecov/engineering-team#348 * feat: Update CommitDetailPage FilesChangedTable to pass along flags (#2334) Update the files changed tab on the commit detail page to grab flags url param and pass along as query args. GH codecov/engineering-team#347 * ref: Update TOS to work for service less users. (#2321) * Update with service less requests * Make sure hook supports service less * feat: Add Flag MultiSelect to CommitPageTabs (#2303) Add a feature flagged multi select to the CommitPageTabs component. GH codecov/engineering-team#344 * Add patch column to pulls table (#2308) * feat: add patch column to the pulls list page * uncomment development settings * feat: Create Team Plan Table for the Files Changed Table on the Commit Detail Page (#2309) Create new commit fetching hooks for the team plan, as well as creating a new table for files changed tab on the commit detail page for the new team plan. GH codecov/engineering-team#633 * Setup pull request page to pass around selected flags (#2282) * feat: setup pull request page to pass around selected flags in links * Feedback, fix passing links to files+folders, additional testing * fix file explorer test failing on href match due to new query param pass through * airplane commit, cant check local dev server: Resolve merge issues / tests + unify codebases missed of commitSHA and commitSha to just commitSha * Prevent multislect from collapsing + wire up PR details page to pass through flags links * Fix accidental removal of ref on usePrefetchPullFileEntry * Add patch column to pulls table (#2308) * feat: add patch column to the pulls list page * uncomment development settings * feat: Create Team Plan Table for the Files Changed Table on the Commit Detail Page (#2309) Create new commit fetching hooks for the team plan, as well as creating a new table for files changed tab on the commit detail page for the new team plan. GH codecov/engineering-team#633 --------- Co-authored-by: Adrian <[email protected]> Co-authored-by: nicholas-codecov <[email protected]> * chore: Remove segment from frontend (#2314) * Update with tests * test with support service less * adjust logic to handle original route * it's fine it works with no providers --------- Co-authored-by: nicholas-codecov <[email protected]> Co-authored-by: Adrian <[email protected]> Co-authored-by: Terry <[email protected]> * restructure folders anticipating second header component for team tier (#2340) * feat: add hook for commit detail page team tier (#2341) * build: Update PostCSS (#2346) Update PostCSS dependency. * Migrate TextInput to TypeScript (#2342) * Migrate textinput to TS * Add story * formatting * organize imports * Connect flag selector to flags filter on PR details page (#2343) * feat: Update impacted files resolver for use pull, connect the flag selector to the api. * update missing logic as requested + unknown flags message to be aligned with repo overview design * Noticed the changing the pull query broke impacted files while smoke testing, dupicated the same compatibility work for the new resolver. * Refactor to use a impacted files enum as requested. * fix: Attempting to fix CommitDetailPage and RepoPage Tests (#2350) Addressing flaky tests in CommitDetailPage and RepoPage. * Add patch section commit detail page team tier (#2344) * restructure folders anticipating second header component for team tier * feat: add patch coverage section to commit detail page for team tier customer * fix: rename HeaderDefault to HeaderTeam for team file * Convert Sparkline to typescript (#2347) * Convert sparkline to typescript * Consistent type defs * better variable names * use enum * quick fixes * Update use memo * Update tests with getSortingOption * pull out the function of the test block --------- Co-authored-by: Joe Becher <[email protected]> Co-authored-by: Adrian <[email protected]> Co-authored-by: nicholas-codecov <[email protected]> Co-authored-by: Terry <[email protected]> Co-authored-by: Rohit Vinnakota <[email protected]>
Description
Converts
Sparkline, spec, and stories to Typescript. Tested by checking relevant pages in app and storybook runs. This closes codecov/engineering-team#519.Legal Boilerplate
Look, I get it. The entity doing business as "Sentry" was incorporated in the State of Delaware in 2015 as Functional Software, Inc. In 2022 this entity acquired Codecov and as result Sentry is going to need some rights from me in order to utilize my contributions in this PR. So here's the deal: I retain all rights, title and interest in and to my contributions, and by keeping this boilerplate intact I confirm that Sentry can use, modify, copy, and redistribute my contributions, under Sentry's choice of terms.