diff --git a/ui/src/visualizations/File-Evolution/chart/chart.js b/ui/src/visualizations/File-Evolution/chart/chart.js index 9ac8e06d..113e0506 100644 --- a/ui/src/visualizations/File-Evolution/chart/chart.js +++ b/ui/src/visualizations/File-Evolution/chart/chart.js @@ -43,11 +43,20 @@ export default class FileEvolution extends React.Component { function getCommitInfo(props, commit) { //TODO font size + const commitInfo = []; if (props.showCommitMessage === 'header') { - commitInfo.push({commit.messageHeader}); + commitInfo.push( + + {commit.messageHeader} + + ); } else if (props.showCommitMessage === 'all') { - commitInfo.push({commit.message}); + commitInfo.push( + + {commit.message} + + ); } if (props.showCommitDate) { if (commitInfo.length > 0) { @@ -61,6 +70,21 @@ export default class FileEvolution extends React.Component { } commitInfo.push({commit.signature}); } + if (props.showCommitFiles) { + if (commitInfo.length > 0) { + commitInfo.push(
); + } + const files = props.commitFiles[commit.sha]; + for (const f in files) { + const file = files[f]; + commitInfo.push( + + {file.path} + + ); + commitInfo.push(
); + } + } return commitInfo; } @@ -99,7 +123,7 @@ export default class FileEvolution extends React.Component { const height = this.props.commitBoxHeight; const commitRects = []; let x = 20; - let y = 20; + const y = 20; for (const i in commitData) { const commit = commitData[i]; if (this.props.selectedAuthors.indexOf(commit.signature) > -1) { diff --git a/ui/src/visualizations/File-Evolution/chart/index.js b/ui/src/visualizations/File-Evolution/chart/index.js index 14f5f569..7c1a7bcf 100644 --- a/ui/src/visualizations/File-Evolution/chart/index.js +++ b/ui/src/visualizations/File-Evolution/chart/index.js @@ -8,11 +8,13 @@ const mapStateToProps = (state /*, ownProps*/) => { const FileEvolutionState = state.visualizations.fileEvolution.state; console.log(FileEvolutionState); return { + files: FileEvolutionState.data.data.files, branches: FileEvolutionState.data.data.branches, committers: FileEvolutionState.data.data.committers, commits: FileEvolutionState.data.data.commits, authorsColorPalette: FileEvolutionState.data.data.authorsColorPalette, branchesColorPalette: FileEvolutionState.data.data.branchesColorPalette, + commitFiles: FileEvolutionState.data.data.commitFiles, selectedAuthors: FileEvolutionState.config.selectedAuthors, selectedBranches: FileEvolutionState.config.selectedBranches, commitBoxHeight: FileEvolutionState.config.commitBoxHeight, @@ -20,7 +22,8 @@ const mapStateToProps = (state /*, ownProps*/) => { commitBoxColor: FileEvolutionState.config.commitBoxColor, showCommitDate: FileEvolutionState.config.showCommitDate, showCommitAuthor: FileEvolutionState.config.showCommitAuthor, - showCommitMessage: FileEvolutionState.config.showCommitMessage + showCommitMessage: FileEvolutionState.config.showCommitMessage, + showCommitFiles: FileEvolutionState.config.showCommitFiles }; }; diff --git a/ui/src/visualizations/File-Evolution/config.js b/ui/src/visualizations/File-Evolution/config.js index 21f44b5c..78561637 100644 --- a/ui/src/visualizations/File-Evolution/config.js +++ b/ui/src/visualizations/File-Evolution/config.js @@ -11,7 +11,8 @@ import { setSelectedBranches, setShowCommitDate, setShowCommitMessage, - setShowCommitAuthor + setShowCommitAuthor, + setShowCommitFiles } from './sagas'; import React from 'react'; @@ -35,7 +36,8 @@ const mapStateToProps = (state /*, ownProps*/) => { commitBoxColor: FileEvolutionState.config.commitBoxColor, showCommitDate: FileEvolutionState.config.showCommitDate, showCommitAuthor: FileEvolutionState.config.showCommitAuthor, - showCommitMessage: FileEvolutionState.config.showCommitMessage + showCommitMessage: FileEvolutionState.config.showCommitMessage, + showCommitFiles: FileEvolutionState.config.showCommitFiles }; }; @@ -47,6 +49,7 @@ const mapDispatchToProps = (dispatch /*, ownProps*/) => { onSetCommitBoxWidth: commitBoxWidth => dispatch(setCommitBoxWidth(commitBoxWidth)), onClickShowCommitBoxDate: showCommitDate => dispatch(setShowCommitDate(showCommitDate)), onClickShowCommitBoxAuthor: showCommitAuthor => dispatch(setShowCommitAuthor(showCommitAuthor)), + onClickShowCommitBoxFiles: showCommitFiles => dispatch(setShowCommitFiles(showCommitFiles)), onSetShowCommitMessage: showCommitMessage => dispatch(setShowCommitMessage(showCommitMessage)), onClickCommitBoxColor: commitBoxColor => dispatch(setCommitBoxColor(commitBoxColor)) }; @@ -112,13 +115,22 @@ const FileEvolutionConfigComponent = props => { + _.assign({}, state, { selectedBranches: [...action.payload] }), SET_SHOW_COMMIT_DATE: (state, action) => _.assign({}, state, { showCommitDate: action.payload }), SET_SHOW_COMMIT_MESSAGE: (state, action) => _.assign({}, state, { showCommitMessage: action.payload }), - SET_SHOW_COMMIT_AUTHOR: (state, action) => _.assign({}, state, { showCommitAuthor: action.payload }) + SET_SHOW_COMMIT_AUTHOR: (state, action) => _.assign({}, state, { showCommitAuthor: action.payload }), + SET_SHOW_COMMIT_FILES: (state, action) => _.assign({}, state, { showCommitFiles: action.payload }) }, { - commitBoxWidth: 100, - commitBoxHeight: 100, + commitBoxWidth: 200, + commitBoxHeight: 200, commitBoxColor: 'author', selectedAuthors: [], selectedBranches: [], showCommitDate: true, showCommitMessage: 'header', - showCommitAuthor: false + showCommitAuthor: false, + showCommitFiles: true } ); diff --git a/ui/src/visualizations/File-Evolution/sagas/getFiles.js b/ui/src/visualizations/File-Evolution/sagas/getFiles.js new file mode 100644 index 00000000..bb147ca1 --- /dev/null +++ b/ui/src/visualizations/File-Evolution/sagas/getFiles.js @@ -0,0 +1,41 @@ +'use strict'; + +import { traversePages, graphQl } from '../../../utils'; + +/** + * Get files with commits from the database. + * @returns {*} + */ +export default function getFiles() { + const fileList = []; + + return traversePages(getFilesWithCommmits(), files => { + fileList.push(files); + }).then(function() { + return fileList; + }); +} + +const getFilesWithCommmits = until => (page, perPage) => { + return graphQl + .query( + `query ($page: Int, $perPage: Int) { + files(page: $page, perPage: $perPage) { + data{ + path + webUrl + commits{ + count + data{ + sha + date + } + } + } + } +} +`, + { page, perPage } + ) + .then(resp => resp.files); +}; diff --git a/ui/src/visualizations/File-Evolution/sagas/index.js b/ui/src/visualizations/File-Evolution/sagas/index.js index 8dc83439..7ce2cc7f 100644 --- a/ui/src/visualizations/File-Evolution/sagas/index.js +++ b/ui/src/visualizations/File-Evolution/sagas/index.js @@ -8,6 +8,7 @@ import { fetchFactory, timestampedActionFactory, mapSaga } from '../../../sagas/ import getCommitData from './getCommitData.js'; import getBranches from './getBranches.js'; import getCommiters from './getCommiters.js'; +import getFiles from './getFiles.js'; export const setCommitBoxHeight = createAction('SET_COMMIT_BOX_HEIGHT'); export const setCommitBoxWidth = createAction('SET_COMMIT_BOX_WIDTH'); @@ -19,6 +20,7 @@ export const setSelectedBranches = createAction('SET_SELECTED_BRANCHES'); export const setShowCommitDate = createAction('SET_SHOW_COMMIT_DATE'); export const setShowCommitMessage = createAction('SET_SHOW_COMMIT_MESSAGE'); export const setShowCommitAuthor = createAction('SET_SHOW_COMMIT_AUTHOR'); +export const setShowCommitFiles = createAction('SET_SHOW_COMMIT_FILES'); export const requestFileEvolutionData = createAction('REQUEST_FILE_EVOLUTION_DATA'); export const receiveFileEvolutionData = timestampedActionFactory('RECEIVE_FILE_EVOLUTION_DATA'); @@ -61,11 +63,15 @@ function* watchRefresh() { export const fetchFileEvolutionData = fetchFactory( function*() { //const commiters = yield getCommiters(); - return yield Promise.join(getCommitData(), getBranches(), getCommiters()) - .spread((commits, branches, commiters) => { + return yield Promise.join(getCommitData(), getBranches(), getCommiters(), getFiles()) + .spread((commits, branches, commiters, files) => { + console.log(files); const authorsColorPalette = getAuthorColorPalette(commiters); const branchesColorPalette = getBranchesColorPalette(branches); + const commitFiles = addFilesToCommit(files, commits); return { + files, + commitFiles, commits, branches, commiters, @@ -83,6 +89,22 @@ export const fetchFileEvolutionData = fetchFactory( receiveFileEvolutionDataError ); +function addFilesToCommit(files, commits) { + const commitFiles = {}; + for (const c in commits) { + const sha = '' + commits[c].sha; + commitFiles[sha] = []; + } + for (const f in files) { + const file = files[f]; + for (const c in files[f].commits.data) { + const fileSha = '' + files[f].commits.data[c].sha; + commitFiles[fileSha].push(file); + } + } + return commitFiles; +} + function getAuthorColorPalette(commiters) { //TODO Color??? const colorPalette = {};