Add version and git sha to debug modal

We add the 'version' and 'gitSha' keys to the AppConfig record, and we
implement the appropriate selectors.  The old webpack version loader is
repurposed into a DefinePlugin which we use to define the VERSION and
GITSHA variables.  Those are read during store hydration, and their
values are stored in the app state.

Change-Id: I9fbef9c62c150aa89bc44bfb8065976a73efde25
Closes-Bug: #1731972
This commit is contained in:
Honza Pokorny 2017-11-14 19:50:51 -04:00
parent 0961857e3a
commit 65f90dc234
7 changed files with 59 additions and 17 deletions

View File

@ -0,0 +1,5 @@
---
fixes:
- |
Fixes `bug 1731972 <https://launchpad.net/bugs/1731972>`__
Add tripleo-ui version and git sha to debug modal

View File

@ -24,6 +24,7 @@ import { CloseModalXButton } from '../ui/Modals';
import LoggerActions from '../../actions/LoggerActions';
import { InlineLoader } from '../ui/Loader';
import { RoutedModal } from '../ui/Modals';
import { getAppVersion, getAppVersionGitSha } from '../../selectors/appConfig';
const messages = defineMessages({
debugPageTitle: {
@ -60,6 +61,14 @@ const messages = defineMessages({
downloadError: {
id: 'DebugScreen.error',
defaultMessage: 'An error has occurred while preparing the log download.'
},
version: {
id: 'DebugScreen.version',
defaultMessage: 'Version'
},
gitSha: {
id: 'DebugScreen.gitSha',
defaultMessage: 'Git Sha'
}
});
@ -120,6 +129,20 @@ class DebugScreen extends React.Component {
);
}
_renderVersion() {
const { version, gitSha } = this.props;
return (
<div>
<p>
<strong>
<FormattedMessage {...messages.version} />
</strong>
: {version} (<FormattedMessage {...messages.gitSha} />: {gitSha})
</p>
</div>
);
}
render() {
return (
<RoutedModal bsSize="lg">
@ -130,6 +153,7 @@ class DebugScreen extends React.Component {
</ModalTitle>
</ModalHeader>
<ModalBody>
{this._renderVersion()}
{this._renderDownloadButton()}
{this._renderMessage()}
</ModalBody>
@ -140,15 +164,19 @@ class DebugScreen extends React.Component {
DebugScreen.propTypes = {
downloadLogs: PropTypes.func,
gitSha: PropTypes.string.isRequired,
intl: PropTypes.object.isRequired,
isDownloadingLogs: PropTypes.bool,
logsUrl: PropTypes.string
logsUrl: PropTypes.string,
version: PropTypes.string.isRequired
};
function mapStateToProps(state) {
return {
gitSha: getAppVersionGitSha(state),
isDownloadingLogs: state.logger.isDownloadingLogs,
logsUrl: state.logger.logsUrl
logsUrl: state.logger.logsUrl,
version: getAppVersion(state)
};
}

View File

@ -27,5 +27,7 @@ export const AppConfig = Record({
zaqarDefaultQueue: 'tripleo',
zaqarLoggerQueue: 'tripleo-ui-logging',
excludedLanguages: List(),
loggers: List(['console', 'zaqar'])
loggers: List(['console', 'zaqar']),
version: undefined,
gitSha: undefined
});

View File

@ -17,6 +17,8 @@
'use strict';
var fs = require('fs');
var execSync = require('child_process').execSync;
var trim = require('lodash').trim;
function getVersion() {
var packageContents = fs.readFileSync('./package.json', 'utf8');
@ -24,15 +26,11 @@ function getVersion() {
return packageJson.version;
}
function getStringToInput() {
let version = getVersion();
return `
window.tripleOUiConfig = window.tripleOUiConfig || {};
window.tripleOUiConfig.version = '${version}';
`;
function getGitSha() {
return trim(execSync('git rev-parse --short HEAD', { encoding: 'utf8' }));
}
module.exports = function(content) {
content = content + getStringToInput();
return content;
module.exports = {
version: JSON.stringify(getVersion()),
gitSha: JSON.stringify(getGitSha())
};

View File

@ -26,3 +26,7 @@ export const getDefaultZaqarQueue = state =>
export const getLoggingZaqarQueue = state =>
state.appConfig.get('logger-zaqar-queue', 'tripleo-ui-logging');
export const getAppVersion = state => state.appConfig.get('version');
export const getAppVersionGitSha = state => state.appConfig.get('gitSha');

View File

@ -28,6 +28,10 @@ import { InitialLoginState } from './immutableRecords/login';
import { getIntl } from './selectors/i18n';
const hydrateStore = () => {
// VERSION and GITSHA are populated by webpack
window.tripleOUiConfig.version = VERSION;
window.tripleOUiConfig.gitSha = GITSHA;
return {
appConfig: new AppConfig(window && fromJS(window.tripleOUiConfig)),
plans: new InitialPlanState({

View File

@ -15,9 +15,11 @@
*/
require('es6-promise').polyfill(); // https://github.com/webpack/css-loader/issues/144
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const I18nPlugin = require('./src/js/plugins/i18n');
const path = require('path');
const version = require('./src/js/loaders/version');
module.exports = {
entry: __dirname + '/src/js/index.js',
@ -28,6 +30,10 @@ module.exports = {
sourceMapFilename: 'tripleo_ui.js.map'
},
plugins: [
new webpack.DefinePlugin({
VERSION: version.version,
GITSHA: version.gitSha
}),
new HtmlWebpackPlugin({
template: 'src/index.html',
favicon: 'src/img/owl.png'
@ -99,11 +105,6 @@ module.exports = {
{
test: /\.less$/,
use: ['style-loader', 'css-loader', 'less-loader?sourceMap']
},
{
loader: __dirname + '/src/js/loaders/version.js',
test: /src\/js\/index.js$/
}
]
}