-
Notifications
You must be signed in to change notification settings - Fork 85
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
Migration to TypeScript: Sidebar_button migrated to Typescript #450
base: master
Are you sure you want to change the base?
Conversation
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #450 +/- ##
=======================================
Coverage 33.53% 33.53%
=======================================
Files 22 22
Lines 3996 3996
=======================================
Hits 1340 1340
Misses 2523 2523
Partials 133 133 ☔ View full report in Codecov by Sentry. |
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.
Thanks for this contribution @Willy-Wakam 👍
The changes look good. I have just one request type the related index.ts
(which is straightforward in this case), and a suggestion to convert an existing React class component into a function component. Please let me know what you think
@@ -1,6 +1,6 @@ | |||
import {connect} from 'react-redux'; | |||
|
|||
import SidebarHeader from './sidebar_header.jsx'; | |||
import SidebarHeader from './sidebar_header'; | |||
|
|||
function mapStateToProps(state) { | |||
const members = state.entities.teams.myMembers || {}; |
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.
@Willy-Wakam What are your thoughts on typing this file to index.ts
as well? We can use this type for the state
parameter:
import {GlobalState} from 'mattermost-redux/types/store';
function mapStateToProps(state: GlobalState) {
interface SidebarHeaderProps{ | ||
show: boolean, | ||
theme: Theme | ||
} |
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.
Typically we would have the type like this to differentiate types from real data, though it's not configured in eslint for some reason
interface SidebarHeaderProps{ | |
show: boolean, | |
theme: Theme | |
} | |
interface SidebarHeaderProps { | |
show: boolean; | |
theme: Theme; | |
} |
export default class SidebarHeader extends PureComponent<SidebarHeaderProps> { | ||
render(): ReactElement | null { | ||
if (!this.props.show) { | ||
return 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.
Can we convert this into a function component in this PR?
export default class SidebarHeader extends PureComponent<SidebarHeaderProps> { | |
render(): ReactElement | null { | |
if (!this.props.show) { | |
return null; | |
export default function SidebarHeader(props: SidebarHeaderProps): React.ReactNode { | |
if (!props.show) { | |
return 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.
@Willy-Wakam This actually isn't necessary for this PR
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.
LGTM, apart from @mickmister comments.
@Willy-Wakam Are you planning to continue work on this PR anytime soon? |
Summary
The file sidebar_header.jsx was migrated into his appropriated Typescript version
All properties and classes were well typed
Ticket Link
Fixes #431