-
Notifications
You must be signed in to change notification settings - Fork 24.5k
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
[createReactClass] Converting ProgressbarAndroid #21600
Conversation
Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need the corporate CLA signed. If you have received this in error or have any questions, please contact us at cla@fb.com. Thanks! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code analysis results:
eslint
found some issues.
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { | ||
displayName = 'MovingBar'; | ||
_intervalID = IntervalID ? IntervalID : null; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
no-undef: 'IntervalID' is not defined.
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { | ||
displayName = 'MovingBar'; | ||
_intervalID = IntervalID ? IntervalID : null; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
no-undef: 'IntervalID' is not defined.
}, | ||
state = { | ||
progress: 0, | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
prettier/prettier: Insert ;
Generated by 🚫 dangerJS |
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { | ||
displayName = 'MovingBar'; | ||
_intervalID = IntervalID ? IntervalID : null; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think this is valid. I think it should be
_intervalID = (null: ?IntervalID)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@gugakatsi IntervalID
is a type (and not a JavaScript object). Since JavaScript doesn't understand Flow types, we can't assign Flow types to JavaScript properties, which is why this is invalid. Also, what we really want is what @TheSavior suggested.
var MovingBar = createReactClass({ | ||
displayName: 'MovingBar', | ||
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you make this an exact type so that people don't pass additional props? {||}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@gugakatsi It looks like MovingBar
just forwards the props to ProgressBar
. So, MovingBarProps
should probably be defined like this:
// Get the props of ProgressBar
type ProgressBarProps = React.ElementConfig<typeof ProgressBar>
// 1. Remove the `progress` prop from ProgressBarProp
// 2. Whenever you do C = $Diff<A, B>, C won't be read only (regardless of if A is read only). So, we have to explicitly call $ReadOnly on the result from 1.
type MovingBarProps = $ReadOnly<$Diff<ProgressBarProps, {
progress: $ElementType<ProgressBarProps, 'progress'>
}>>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is almost ready to land, but we should fix a few things.
var MovingBar = createReactClass({ | ||
displayName: 'MovingBar', | ||
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@gugakatsi It looks like MovingBar
just forwards the props to ProgressBar
. So, MovingBarProps
should probably be defined like this:
// Get the props of ProgressBar
type ProgressBarProps = React.ElementConfig<typeof ProgressBar>
// 1. Remove the `progress` prop from ProgressBarProp
// 2. Whenever you do C = $Diff<A, B>, C won't be read only (regardless of if A is read only). So, we have to explicitly call $ReadOnly on the result from 1.
type MovingBarProps = $ReadOnly<$Diff<ProgressBarProps, {
progress: $ElementType<ProgressBarProps, 'progress'>
}>>
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { | ||
displayName = 'MovingBar'; | ||
_intervalID = IntervalID ? IntervalID : null; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@gugakatsi IntervalID
is a type (and not a JavaScript object). Since JavaScript doesn't understand Flow types, we can't assign Flow types to JavaScript properties, which is why this is invalid. Also, what we really want is what @TheSavior suggested.
displayName: 'MovingBar', | ||
_intervalID: (null: ?IntervalID), | ||
class MovingBar extends React.Component<{}> { | ||
displayName = 'MovingBar'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think this should be:
static displayName = 'MovingBar';
But since we have a babel plugin to automatically generate the displayName
from components, we don't really need this. So, you should get rid of this line entirely.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@RSNara thanks for helping me out , will fix pull request soon , learned a lot.
@RSNara @TheSavior thanks for helping and understanding , your replies helped me lot , will fix it in few hrs. |
@gugakatsi, ping. It's been some time since there was activity on this PR. Do you still have time to work on this PR? |
Also, we can't import and make the fixes to this PR ourselves because you haven't signed the CLA. |
Due to inactivity, I'm closing this PR. |
Summary: Related to #21581 This PR was already opened here #21600 but seems to be inactive. Remove createReactClass from ProgressBarAndroidExample. - `yarn run flow` && `yarn run flow-check-android` succeed. - RNTester app ProgressBarAndroidExample on Android. [GENERAL] [ENHANCEMENT] [ProgressBarAndroidExample.android.js] - rm createReactClass Pull Request resolved: #21874 Reviewed By: TheSavior Differential Revision: D12827689 Pulled By: RSNara fbshipit-source-id: 46c70ea67dddf5d928fe936a28ef4a0a929d127f
Summary: Related to #21581 This PR was already opened here facebook/react-native#21600 but seems to be inactive. Remove createReactClass from ProgressBarAndroidExample. - `yarn run flow` && `yarn run flow-check-android` succeed. - RNTester app ProgressBarAndroidExample on Android. [GENERAL] [ENHANCEMENT] [ProgressBarAndroidExample.android.js] - rm createReactClass Pull Request resolved: facebook/react-native#21874 Reviewed By: TheSavior Differential Revision: D12827689 Pulled By: RSNara fbshipit-source-id: 46c70ea67dddf5d928fe936a28ef4a0a929d127f
Summary: Related to facebook#21581 This PR was already opened here facebook#21600 but seems to be inactive. Remove createReactClass from ProgressBarAndroidExample. - `yarn run flow` && `yarn run flow-check-android` succeed. - RNTester app ProgressBarAndroidExample on Android. [GENERAL] [ENHANCEMENT] [ProgressBarAndroidExample.android.js] - rm createReactClass Pull Request resolved: facebook#21874 Reviewed By: TheSavior Differential Revision: D12827689 Pulled By: RSNara fbshipit-source-id: 46c70ea67dddf5d928fe936a28ef4a0a929d127f
[Android] [RNTester] converted ProgressbarAndroid.js to class
but you own build is failing
relates to #21581