TimelineExplorer defaults to showing all users (#1371)

Now instead of always defaulting to GitHub users, it shows all
user-typed nodes. This will make SourceCred work non-hackily when there
is e.g. just a Discourse plugin in scope.

I also fixed an issue where it was loading the GitHub declaration in a
hardcoded way, instead of properly getting it from the TimelineCred's
plugin array.

Test plan: Manual UI inspection.
This commit is contained in:
Dandelion Mané 2019-09-10 22:50:39 +02:00 committed by GitHub
parent 8de57fdb7b
commit b3ffd3758b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 23 deletions

View File

@ -4,11 +4,6 @@ import React from "react";
import type {Assets} from "../webutil/assets"; import type {Assets} from "../webutil/assets";
import {TimelineExplorer} from "./TimelineExplorer"; import {TimelineExplorer} from "./TimelineExplorer";
import {TimelineCred} from "../analysis/timeline/timelineCred"; import {TimelineCred} from "../analysis/timeline/timelineCred";
import {
declaration as githubDeclaration,
userNodeType,
repoNodeType,
} from "../plugins/github/declaration";
import {encodeProjectId, type ProjectId} from "../core/project"; import {encodeProjectId, type ProjectId} from "../core/project";
export type Props = {| export type Props = {|
@ -72,9 +67,6 @@ export class TimelineApp extends React.Component<Props, State> {
<TimelineExplorer <TimelineExplorer
initialTimelineCred={timelineCred} initialTimelineCred={timelineCred}
projectId={this.props.projectId} projectId={this.props.projectId}
declarations={[githubDeclaration]}
defaultNodeType={userNodeType}
filterableNodeTypes={[userNodeType, repoNodeType]}
/> />
); );
} }

View File

@ -10,7 +10,7 @@ import {TimelineCred} from "../analysis/timeline/timelineCred";
export type Props = {| export type Props = {|
+timelineCred: TimelineCred, +timelineCred: TimelineCred,
+selectedNodeFilter: NodeAddressT, +selectedNodeFilter: NodeAddressT | null,
|}; |};
const MAX_ENTRIES_PER_LIST = 100; const MAX_ENTRIES_PER_LIST = 100;
@ -33,7 +33,13 @@ const DEFAULT_ENTRIES_PER_CHART = 6;
export class TimelineCredView extends React.Component<Props> { export class TimelineCredView extends React.Component<Props> {
render() { render() {
const {selectedNodeFilter, timelineCred} = this.props; const {selectedNodeFilter, timelineCred} = this.props;
const nodes = timelineCred.credSortedNodes([selectedNodeFilter]); const nodes = (() => {
if (selectedNodeFilter == null) {
return timelineCred.userNodes();
} else {
return timelineCred.credSortedNodes([selectedNodeFilter]);
}
})();
const tableNodes = nodes.slice(0, MAX_ENTRIES_PER_LIST); const tableNodes = nodes.slice(0, MAX_ENTRIES_PER_LIST);
const chartNodes = nodes const chartNodes = nodes
.slice(0, DEFAULT_ENTRIES_PER_CHART) .slice(0, DEFAULT_ENTRIES_PER_CHART)

View File

@ -2,10 +2,7 @@
import React from "react"; import React from "react";
import deepEqual from "lodash.isequal"; import deepEqual from "lodash.isequal";
import { import {combineTypes} from "../analysis/pluginDeclaration";
type PluginDeclaration,
combineTypes,
} from "../analysis/pluginDeclaration";
import {type Weights, copy as weightsCopy} from "../analysis/weights"; import {type Weights, copy as weightsCopy} from "../analysis/weights";
import {type NodeAddressT} from "../core/graph"; import {type NodeAddressT} from "../core/graph";
import { import {
@ -16,14 +13,10 @@ import {TimelineCredView} from "./TimelineCredView";
import Link from "../webutil/Link"; import Link from "../webutil/Link";
import {WeightConfig} from "./weights/WeightConfig"; import {WeightConfig} from "./weights/WeightConfig";
import {WeightsFileManager} from "./weights/WeightsFileManager"; import {WeightsFileManager} from "./weights/WeightsFileManager";
import {type NodeType} from "../analysis/types";
export type Props = { export type Props = {
projectId: string, projectId: string,
initialTimelineCred: TimelineCred, initialTimelineCred: TimelineCred,
// TODO: Get this info from the TimelineCred
declarations: $ReadOnlyArray<PluginDeclaration>,
+defaultNodeType: NodeType,
}; };
export type State = { export type State = {
@ -33,7 +26,7 @@ export type State = {
intervalDecay: number, intervalDecay: number,
loading: boolean, loading: boolean,
showWeightConfig: boolean, showWeightConfig: boolean,
selectedNodeTypePrefix: NodeAddressT, selectedNodeTypePrefix: NodeAddressT | null,
}; };
/** /**
@ -48,9 +41,7 @@ export class TimelineExplorer extends React.Component<Props, State> {
constructor(props: Props) { constructor(props: Props) {
super(props); super(props);
const timelineCred = props.initialTimelineCred; const timelineCred = props.initialTimelineCred;
const {defaultNodeType} = props;
const {alpha, intervalDecay, weights} = timelineCred.params(); const {alpha, intervalDecay, weights} = timelineCred.params();
const selectedNodeTypePrefix = defaultNodeType.prefix;
this.state = { this.state = {
timelineCred, timelineCred,
alpha, alpha,
@ -61,7 +52,7 @@ export class TimelineExplorer extends React.Component<Props, State> {
weights: weightsCopy(weights), weights: weightsCopy(weights),
loading: false, loading: false,
showWeightConfig: false, showWeightConfig: false,
selectedNodeTypePrefix, selectedNodeTypePrefix: null,
}; };
} }
@ -90,7 +81,7 @@ export class TimelineExplorer extends React.Component<Props, State> {
); );
const weightConfig = ( const weightConfig = (
<WeightConfig <WeightConfig
declarations={this.props.declarations} declarations={this.state.timelineCred.plugins()}
nodeTypeWeights={this.state.weights.nodeTypeWeights} nodeTypeWeights={this.state.weights.nodeTypeWeights}
edgeTypeWeights={this.state.weights.edgeTypeWeights} edgeTypeWeights={this.state.weights.edgeTypeWeights}
onNodeWeightChange={(prefix, weight) => { onNodeWeightChange={(prefix, weight) => {
@ -164,6 +155,9 @@ export class TimelineExplorer extends React.Component<Props, State> {
this.setState({selectedNodeTypePrefix: e.target.value}) this.setState({selectedNodeTypePrefix: e.target.value})
} }
> >
<option key={null} value={null}>
All users
</option>
{nodeTypes.map(({prefix, pluralName}) => ( {nodeTypes.map(({prefix, pluralName}) => (
<option key={prefix} value={prefix}> <option key={prefix} value={prefix}>
{pluralName} {pluralName}