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

CPLAT-11374: Add makeMapStateToProps/WithOwnProps and makeMapDispatchToProps/WithOwnProps #618

Merged
merged 17 commits into from
Sep 8, 2020

Conversation

kealjones-wk
Copy link
Contributor

Motivation

React Redux allows you to return a function from mapStateToProps, allowing you to create a closure specific to that component instance, allowing you to set up a private copy of a memoized selector so that components don't invalidate each other's cache.

We should support this functionality so that consumers can follow the official React Redux tutorials for preventing unnecessary rerenders

Changes

  • Add makeMapStateToProps & makeMapStateToPropsWithOwnProps
  • Add makeMapDispatchToProps & makeMapDispatchToPropsWithOwnProps
  • Add tests for all added make factory functions
  • Update connect doc comments with make arguments
  • Update and Format over_react_redux_documentation.md with make arguments

Release Notes

  • Add makeMapStateToProps & makeMapStateToPropsWithOwnProps
  • Add makeMapDispatchToProps & makeMapDispatchToPropsWithOwnProps

Review

See CONTRIBUTING.md for more details on review types (+1 / QA +1 / +10) and code review process.

Please review:

QA Checklist

  • Tests were updated and provide good coverage of the changeset and other affected code
  • Manual testing was performed if needed

Merge Checklist

While we perform many automated checks before auto-merging, some manual checks are needed:

  • A Client Platform member has reviewed these changes
  • There are no unaddressed comments - this check can be automated if reviewers use the "Request Changes" feature
  • For release PRs - Version metadata in Rosie comment is correct

@aviary-wf
Copy link

Security Insights

No security relevant content was detected by automated scans.

Action Items

  • Review PR for security impact; comment "security review required" if needed or unsure
  • Verify aviary.yaml coverage of security relevant code

Questions or Comments? Reach out on Slack: #support-infosec.

log.onRecord.listen((rec) {
if (rec.level == Level.WARNING) {
window.console.warn('${log.name} [${rec.level.name}]: ${rec.message}');
callMethod(windowConsole, 'warn', ['${log.name} [${rec.level.name}]: ${rec.message}', if (rec.error != null) rec.error]);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

changed to this to allow for "grouping" the error with the warning using console.warns varargs

@@ -247,9 +317,41 @@ UiFactory<TProps> Function(UiFactory<TProps>) connect<TReduxState, TProps extend
connectOptions.areMergedPropsEqual = allowInterop(handleAreMergedPropsEqual);
}

dynamic interopMapStateToPropsHandler() {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

typed return as dynamic in case we ever want to allow for the object based syntax

Copy link
Contributor

Choose a reason for hiding this comment

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

Can you make this a code comment?

Copy link
Contributor

@greglittlefield-wf greglittlefield-wf left a comment

Choose a reason for hiding this comment

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

Looks awesome, just some minor comments!

unwrapInteropValue(initialJsState),
jsPropsToTProps(initialJsOwnProps)
);
return allowInteropWithArgCount((jsState) {
Copy link
Contributor

Choose a reason for hiding this comment

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

Can we name this function so that it's easier to tell what this function is in the factory?

```dart
import 'package:over_react/over_react_redux.dart';
```
```dart
Copy link
Contributor

Choose a reason for hiding this comment

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

There's a lot of indentation changes in this file from 4 to 3 in some places and 2 in others.

Was there a reason to move away from 4? Can we at least make it consistent?

@@ -247,9 +317,41 @@ UiFactory<TProps> Function(UiFactory<TProps>) connect<TReduxState, TProps extend
connectOptions.areMergedPropsEqual = allowInterop(handleAreMergedPropsEqual);
}

dynamic interopMapStateToPropsHandler() {
Copy link
Contributor

Choose a reason for hiding this comment

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

Can you make this a code comment?

@@ -145,8 +153,12 @@ typedef dynamic Dispatcher(dynamic action);
UiFactory<TProps> Function(UiFactory<TProps>) connect<TReduxState, TProps extends UiProps>({
Map Function(TReduxState state) mapStateToProps,
Map Function(TReduxState state, TProps ownProps) mapStateToPropsWithOwnProps,
Map Function(TReduxState state) Function(TReduxState initialState, TProps initialOwnProps) makeMapStateToProps,
Copy link
Contributor

Choose a reason for hiding this comment

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

Can we throw ArgumentError when a consumer specifies a "make" version as well as a non-"make" version?

Currently if they did both, one would silently be ignored

- Does a shallow Map equality check by default.
- Takes a function with the signature `(next: TProps, prev: TProps) => bool`.
- Can be passed in for small performance improvements. Two possible cases are to implement `deepEqual` or
`strictEqual`. > See: <https://react-redux.js.org/api/connect#aremergedpropsequal-next-object-prev-object-boolean>
Copy link
Contributor

Choose a reason for hiding this comment

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

This got messed up after formatting

@greglittlefield-wf
Copy link
Contributor

QA +1

@greglittlefield-wf
Copy link
Contributor

@Workiva/release-management-p

Copy link

@rmconsole-wf rmconsole-wf left a comment

Choose a reason for hiding this comment

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

+1 from RM

@rmconsole4-wk rmconsole4-wk merged commit 0779439 into master Sep 8, 2020
@rmconsole4-wk rmconsole4-wk deleted the CPLAT-11374-add-makeMapStateToProps branch September 8, 2020 23:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants