mirror of
https://github.com/status-im/sourcecred.git
synced 2025-02-18 15:38:10 +00:00
5744d3c860
Summary: Closes #17; see discussion there. This commit uses the `babel-plugin-flow-react-proptypes` package to automatically create PropType definitions from components that are typed with Flow. It simultaneously updates all of our existing components to be typed with Flow. As a result, we have both static and dynamic type checking. Test Plan: Note that `yarn test` and `yarn flow` report no errors, and that there are no prop validation errors at runtime with `yarn start`. Then, apply the following patch: ```diff diff --git a/explorer/src/UserExplorer.js b/explorer/src/UserExplorer.js index bb574cd..636a10d 100644 --- a/explorer/src/UserExplorer.js +++ b/explorer/src/UserExplorer.js @@ -18,7 +18,7 @@ export class UserExplorer extends Component<{ .sort((a,b) => b[1] - a[1]); const entries = sortedUserWeightTuples.map(authorWeight => { const [author, weight] = authorWeight; - return <UserEntry userId={author} weight={weight} key={author}/> + return <UserEntry userId={55} weight={weight} key={author}/> }); return <div className="user-explorer"> <h3> User Explorer </h3> ``` Note that `yarn test` fails (the `App.test.js` E2E rendering test), `yarn flow` fails, and there is a runtime prop validation error. wchargin-branch: autogenerate-proptypes
47 lines
1.2 KiB
JavaScript
47 lines
1.2 KiB
JavaScript
// @flow
|
|
import React, { Component } from 'react';
|
|
import {commitWeight, userWeightForPath} from './commitUtils';
|
|
import type {CommitData, FileTree} from './commitUtils';
|
|
|
|
export class UserExplorer extends Component<{
|
|
selectedPath: string,
|
|
selectedUser: ?string,
|
|
onSelectUser: (newUser: string) => void,
|
|
data: CommitData,
|
|
}> {
|
|
|
|
render() {
|
|
const weights = userWeightForPath(this.props.selectedPath, this.props.data, commitWeight);
|
|
const sortedUserWeightTuples =
|
|
Object.keys(weights)
|
|
.map(k => [k, weights[k]])
|
|
.sort((a,b) => b[1] - a[1]);
|
|
const entries = sortedUserWeightTuples.map(authorWeight => {
|
|
const [author, weight] = authorWeight;
|
|
return <UserEntry userId={author} weight={weight} key={author}/>
|
|
});
|
|
return <div className="user-explorer">
|
|
<h3> User Explorer </h3>
|
|
{entries}
|
|
</div>
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Record the cred earned by the user in a given scope.
|
|
*/
|
|
class UserEntry extends Component<{
|
|
userId: string,
|
|
weight: number,
|
|
}> {
|
|
|
|
render() {
|
|
return <div className="user-entry">
|
|
<span> {this.props.userId} </span>
|
|
<span> {this.props.weight.toFixed(1)} </span>
|
|
</div>
|
|
}
|
|
|
|
}
|