Skip to content

Refactor (packages/ui/src/v2/components/select-v2.tsx): Function with high complexity: SelectV2 - #105

Open
nyonas-ny wants to merge 2 commits into
CMU-313:mainfrom
nyonas-ny:refactor/select-v2-complexity
Open

Refactor (packages/ui/src/v2/components/select-v2.tsx): Function with high complexity: SelectV2#105
nyonas-ny wants to merge 2 commits into
CMU-313:mainfrom
nyonas-ny:refactor/select-v2-complexity

Conversation

@nyonas-ny

Copy link
Copy Markdown

P1B: Starter Task: Refactoring PR

Use this pull request template to briefly answer the questions below in one to two sentences each.
Feel free to delete this text at the top after filling out the template.

1. Issue

Link to the associated GitHub issue:

#74

Full path to the refactored file:

(packages/ui/src/v2/components/select-v2.tsx)

What do you think this file does?
(Your answer does not have to be 100% correct; give a reasonable, evidence‑based guess.)

It deals with item rendering and callbacks.

What is the scope of your refactoring within that file?
(Name specific functions/blocks/regions touched.)

I pulled logic out of the SelectV2 function and moved teh drop down rendering into its own component

Which Qlty‑reported issue did you address?
(Name the rule/metric and include the BEFORE value; e.g., “Cognitive Complexity 18 in render()”.)

Function with high complexity (count = 33): SelectV2

2. Refactoring

How did the specific issue you chose impact the codebase’s maintainability?

Everything was crammed into one function, so it was hard to change around the function without understanding what it did.

What changes did you make to resolve the issue?

I split the function into 4 smaller functions, with 3 helper functions in a new file.

How do your changes improve maintainability? Did you consider alternatives?

Each piece can now be read, changed, and tested on its own without having to spend lots of time understanding one giant code block

3. Validation

How did you validate that the change is correct?

Wrote 16 unit tests for the three extracted functions and ran the entire test suite for that package.

Attach a screenshot of the test coverage showing the lines were executed by the tests.

testCoverage

Attach a screenshot showing the tests that cover the change passing during CI

Attach a screenshot of qlty smells --no-snippets <full/path/to/file.ts> showing fewer reported issues after the changes.
Before:
beforeRefactor

After:
afterRefactor

Splits createHighlightTracker, normalizeSelectValue, and
formatSelectedValue into select-v2-helpers.ts, and extracts the
itemComponent render prop into SelectItemV2. Addresses Qlty's
high-complexity smell (count=33) on SelectV2.

Adds select-v2-helpers.test.ts covering all extracted logic.
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.

2 participants