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

Allow Differently Typed Selectors #274

Merged
merged 5 commits into from
Apr 19, 2018
Merged

Allow Differently Typed Selectors #274

merged 5 commits into from
Apr 19, 2018

Conversation

benshope
Copy link
Contributor

@benshope benshope commented Jul 28, 2017

Here is the related issue #264

Right now we have to do typings like this:

const selectorOne = (state: State) => state.something;
const selectorTwo = (state: State) => state.other;
createSelector([selectorOne, selectorTwo], () => ...);

This PR allows us to do typings like this:

const selectorOne = (state: { something: string }) => state.something;
const selectorTwo = (state: { other: number }) => state.other;
createSelector([selectorOne, selectorTwo], () => ...);

Let me know if I should change anything, thanks!

@aikoven
Copy link
Contributor

aikoven commented Jul 29, 2017

This is a breaking change since generic arguments changed. We should include both old and new signatures.

@benshope
Copy link
Contributor Author

@aikoven Yep! Added them back

@aikoven
Copy link
Contributor

aikoven commented Aug 3, 2017

I've tested these against a fairly large project with lots of selectors and it worked fine.

There's a failing test that should be fixed. Also, I guess some tests for the new signatures should be added as well.

@benshope
Copy link
Contributor Author

benshope commented Aug 7, 2017

@aikoven Cool! I fixed the broken tests and added both a failing-case and a passing-case test for both parametric and array selectors

@coveralls
Copy link

coveralls commented Aug 7, 2017

Coverage Status

Coverage remained the same at 100.0% when pulling 5cd0696 on relateiq:typings into c60c851 on reactjs:master.

@codecov-io
Copy link

codecov-io commented Aug 7, 2017

Codecov Report

Merging #274 into master will not change coverage.
The diff coverage is n/a.

Impacted file tree graph

@@          Coverage Diff          @@
##           master   #274   +/-   ##
=====================================
  Coverage     100%   100%           
=====================================
  Files           1      1           
  Lines          15     15           
=====================================
  Hits           15     15

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update c60c851...7dad148. Read the comment docs.

@benshope
Copy link
Contributor Author

benshope commented Aug 7, 2017

Also, I put the Python script I threw together into a Gist - in case someone wants to refer back to this and change the types at some point https://gist.github.com/benshope/9712ed6d725a263467447ac6473502a9

@aikoven
Copy link
Contributor

aikoven commented Aug 8, 2017

Nice work @benshope! It's 👍 to me, I hope someone else would also test these in their projects.

@seepel
Copy link

seepel commented Aug 15, 2017

@aikoven I tacked on an additional commit to this PR to cover typescript 2.4's new strict generic checks and added a test here: 5ec2b1f

You can see relevant discussion on the topic in this typescript issue: microsoft/TypeScript#17509

@coveralls
Copy link

coveralls commented Aug 15, 2017

Coverage Status

Coverage remained the same at 100.0% when pulling 5ec2b1f on relateiq:typings into c60c851 on reactjs:master.

2 similar comments
@coveralls
Copy link

Coverage Status

Coverage remained the same at 100.0% when pulling 5ec2b1f on relateiq:typings into c60c851 on reactjs:master.

@coveralls
Copy link

Coverage Status

Coverage remained the same at 100.0% when pulling 5ec2b1f on relateiq:typings into c60c851 on reactjs:master.

@aikoven
Copy link
Contributor

aikoven commented Aug 15, 2017

Changing the generic signature of defaultMemoize is a breaking change.

It could potentially be solved via generic defaults, although it would break for users of TS 2.2 and below.

@seepel
Copy link

seepel commented Aug 15, 2017

That's fair, I hadn't considered the case where some one might be calling defaultMemoize with the generic:

defualtMemoize<MyFunction>

I've reverted the commit.

@coveralls
Copy link

coveralls commented Aug 15, 2017

Coverage Status

Coverage remained the same at 100.0% when pulling 7dad148 on relateiq:typings into c60c851 on reactjs:master.

@benshope
Copy link
Contributor Author

@aikoven Hey! Any updates on the status of this?

Copy link
Contributor

@aikoven aikoven left a comment

Choose a reason for hiding this comment

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

@benshope I am so sorry, I've completely lost this thread.

As far as I can remember and see, these changes are backward compatible, aren't they?

Approving.

@benshope
Copy link
Contributor Author

@aikoven Cool! Yes these changes should be backwards compatible

@ellbee ellbee merged commit d78c8f7 into reduxjs:master Apr 19, 2018
@ellbee
Copy link
Collaborator

ellbee commented Apr 19, 2018

Sorry to be so slow to this. As @aikoven has approved, I'll go ahead and commit. Thanks!

@benshope
Copy link
Contributor Author

@ellbee Thanks!!

github-merge-queue bot pushed a commit to MetaMask/metamask-extension that referenced this pull request Dec 13, 2024
… support (#29094)

## Motivation

#### Homogenous selector types:

```ts
const selectorOne = (state: State) => state.something;
const selectorTwo = (state: State) => state.other;
createSelector([selectorOne, selectorTwo], () => ...);
```

#### Heterogenous selector types: 

```ts
const selectorOne = (state: { something: string }) => state.something;
const selectorTwo = (state: { other: number }) => state.other;
createSelector([selectorOne, selectorTwo], () => ...);
```

Support for heterogenous typing is essential for selectors to function
properly, because selectors must be both mergeable and atomic. Without
heterogenous selectors, these becoming conflicting objectives.

- **Mergeable:** 
- Without heterogenous typing for selectors, the size of the state type
for all selectors tend to inflate. This is because a selector's state
must be a supertype for the intersection of the state types of all of
its merged selectors, including selectors nested in the definitions of
merged selectors.
- Eventually, many selectors end up being defined with a state type that
is close to the entire Redux state.
- Paradoxically, selectors that only need access to very few properties
end up needing to have the widest state type, because they tend to be
merged into the most selectors across several nested levels.
  
- **Atomic:**
- When selectors are actually invoked, including in test files, it's not
always practical to prepare and pass in a very large state object.
- It's both safer and more convenient to restrict the state being passed
into the selector to the minimum size required for the selector to
function.
- This requirement becomes incompatible with the mergeability
requirement if all selectors must share a common state type.
  
Enabling merged selectors to accept different, even disjoint state types
resolves this issue.

> [!NOTE]
> See the
[`MultichainState`](https://github.com/MetaMask/metamask-extension/blob/4f970df0acec3e3bc80da08373aa3b16f23aae41/ui/selectors/multichain.ts#L53)
type for an example of a bloated selector state type which will become
unnecessary with this update.

## **Description**

- `reselect@4.0.0` supports heterogenous typing for selector inputs to
`createSelector` and `createDeepEqualSelector`.
  - reduxjs/reselect#351
    - reduxjs/reselect#274
    - reduxjs/reselect#315
- Upgrade to `^5.1.1` (latest) is necessary to fix type issues in
`4.0.0`
-
https://app.circleci.com/jobs/github/MetaMask/metamask-extension/4320173

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/29094?quickstart=1)

## **Related issues**

- Blocks TypeScript conversion of selectors for
MetaMask/MetaMask-planning#2894.
  - #29014

## **Manual testing steps**

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [x] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

---------

Co-authored-by: MetaMask Bot <metamaskbot@users.noreply.github.com>
danjm pushed a commit to MetaMask/metamask-extension that referenced this pull request Dec 18, 2024
… support (#29094)

## Motivation

#### Homogenous selector types:

```ts
const selectorOne = (state: State) => state.something;
const selectorTwo = (state: State) => state.other;
createSelector([selectorOne, selectorTwo], () => ...);
```

#### Heterogenous selector types: 

```ts
const selectorOne = (state: { something: string }) => state.something;
const selectorTwo = (state: { other: number }) => state.other;
createSelector([selectorOne, selectorTwo], () => ...);
```

Support for heterogenous typing is essential for selectors to function
properly, because selectors must be both mergeable and atomic. Without
heterogenous selectors, these becoming conflicting objectives.

- **Mergeable:** 
- Without heterogenous typing for selectors, the size of the state type
for all selectors tend to inflate. This is because a selector's state
must be a supertype for the intersection of the state types of all of
its merged selectors, including selectors nested in the definitions of
merged selectors.
- Eventually, many selectors end up being defined with a state type that
is close to the entire Redux state.
- Paradoxically, selectors that only need access to very few properties
end up needing to have the widest state type, because they tend to be
merged into the most selectors across several nested levels.
  
- **Atomic:**
- When selectors are actually invoked, including in test files, it's not
always practical to prepare and pass in a very large state object.
- It's both safer and more convenient to restrict the state being passed
into the selector to the minimum size required for the selector to
function.
- This requirement becomes incompatible with the mergeability
requirement if all selectors must share a common state type.
  
Enabling merged selectors to accept different, even disjoint state types
resolves this issue.

> [!NOTE]
> See the
[`MultichainState`](https://github.com/MetaMask/metamask-extension/blob/4f970df0acec3e3bc80da08373aa3b16f23aae41/ui/selectors/multichain.ts#L53)
type for an example of a bloated selector state type which will become
unnecessary with this update.

## **Description**

- `reselect@4.0.0` supports heterogenous typing for selector inputs to
`createSelector` and `createDeepEqualSelector`.
  - reduxjs/reselect#351
    - reduxjs/reselect#274
    - reduxjs/reselect#315
- Upgrade to `^5.1.1` (latest) is necessary to fix type issues in
`4.0.0`
-
https://app.circleci.com/jobs/github/MetaMask/metamask-extension/4320173

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/29094?quickstart=1)

## **Related issues**

- Blocks TypeScript conversion of selectors for
MetaMask/MetaMask-planning#2894.
  - #29014

## **Manual testing steps**

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [x] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

---------

Co-authored-by: MetaMask Bot <metamaskbot@users.noreply.github.com>
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.

6 participants