Skip to content

Commit

Permalink
OHFJIRA-57 messages overview and message detail screen
Browse files Browse the repository at this point in the history
  • Loading branch information
bionaut authored and hanusto committed Jul 17, 2017
1 parent 40846ba commit d46d79e
Show file tree
Hide file tree
Showing 33 changed files with 1,144 additions and 347 deletions.
3 changes: 2 additions & 1 deletion admin-console/mock-server/index.js
Expand Up @@ -16,7 +16,8 @@ const sources = [
require('./errors/errorsOverview.mock'),
require('./nodes/nodes.mock'),
require('./config/console.mock'),
require('./wsdl/wsdl.mock')
require('./wsdl/wsdl.mock'),
require('./messages/messages.mock')
]

runServer(sources, opt_serverConfig)
97 changes: 97 additions & 0 deletions admin-console/mock-server/messages/messages.mock.js
@@ -0,0 +1,97 @@
module.exports = [
{
request: {
method: 'GET',
path: '/api/messages'
},
response: {
statusCode: 200,
body: JSON.stringify({
'data': [
{
'id': 5232,
'correlationId': '20301-2332-1321',
'sourceSystem': 'CRM',
'received': '2017-05-22T15:20:10',
'processingStarted': '2017-05-22T15:20:10',
'state': 'OK',
'errorCode': 'E114',
'serviceName': 'HELLO',
'operationName': 'check'
}
],
'limit': 100,
'totalElements': 50
})
}
},
{
request: {
method: 'GET',
path: '/api/messages/:id'
},
response: {
statusCode: 200,
body: JSON.stringify({
'id': 5232,
'allowedActions': [
'RESTART',
'CANCEL'
],
'correlationId': '20301-2332-1231',
'processId': '10231-2311-1144',
'state': 'OK',
'processingStarted': '2017-05-22T15:20:10',
'lastChange': '2017-05-22T15:20:10',
'errorCode': 'E114',
'failedCount': 3,
'sourceSystem': 'CRM',
'received': '2017-05-22T15:20:10',
'msgTimestamp': '2017-05-22T15:20:10',
'serviceName': 'HELLO',
'operationName': 'check',
'objectId': 'object1',
'entityType': 'ACCOUNT',
'funnelValue': 'MSISDN',
'funnelComponentId': 'componentId',
'guaranteedOrder': false,
'excludeFailedState': true,
'businessError': 'Not enough balance in the account',
'parentMsgId': 42,
'body': '<hel:hello>Hello</hel:hello>',
'envelope': '<note>\n<to>Tove</to>\n<from>X</from>\n<heading>Reminder</heading>\n<body>Dont forget this weekend!</body>\n</note>',
'failedDescription': 'Something went terribly wrong',
'requests': [
{
'id': 10233,
'uri': 'spring-ws:http://helloservice.com',
'timestamp': '2017-05-22T15:20:10',
'payload': '<hel:hello>Hello</hel:hello>',
'response': {
'timestamp': '2017-05-22T15:20:10',
'payload': '<hel:hello>Hello</hel:hello>'
}
}
],
'externalCalls': [
{
'id': 327,
'state': 'OK',
'operationName': 'direct:printGreeting',
'callId': 'CRM_4yEW32321',
'lastChange': '2017-05-22T15:20:10'
}
]
})
}
},
{
request: {
method: 'POST',
path: '/api/messages/:id/action'
},
response: {
statusCode: 200
}
}
]
6 changes: 5 additions & 1 deletion admin-console/package.json
Expand Up @@ -103,11 +103,13 @@
"better-npm-run": "0.0.13",
"compression": "^1.6.2",
"debug": "^2.2.0",
"es6-promise": "^4.1.0",
"fetch-mock": "^5.10.0",
"file-loader": "^0.9.0",
"fs-extra": "^1.0.0",
"html-webpack-plugin": "^2.22.0",
"imports-loader": "^0.6.5",
"input-moment": "^0.3.4",
"ip": "^1.1.2",
"json-loader": "^0.5.4",
"moment": "^2.17.1",
Expand All @@ -119,21 +121,23 @@
"react": "^15.0.0",
"react-animations": "^0.1.0",
"react-dom": "^15.0.0",
"react-flatpickr": "^3.4.0",
"react-icons": "^2.2.1",
"react-json-view": "^1.7.4",
"react-markdown": "^2.5.0",
"react-modal": "^1.6.5",
"react-redux": "^4.4.5",
"react-redux-toastr": "^6.2.6",
"react-router": "^3.0.0",
"react-syntax-highlighter": "^5.6.2",
"recharts": "^0.20.8",
"redux": "^3.6.0",
"redux-promise": "^0.5.3",
"redux-thunk": "^2.0.0",
"rimraf": "^2.5.4",
"tinycolor2": "^1.4.1",
"url-loader": "^0.5.6",
"valid-react-form": "^1.0.2",
"valid-react-form": "1.0.3",
"validator": "^7.0.0",
"webpack": "^1.12.14",
"whatwg-fetch": "^2.0.3",
Expand Down
38 changes: 18 additions & 20 deletions admin-console/src/common/components/LoginModal/LoginModal.js
Expand Up @@ -5,33 +5,31 @@ import styles from './loginModal.styles'
import Anchor from '../Anchor/Anchor'
import Button from '../Button/Button'
import ModalHeader from '../ModalHeader/ModalHeader'
import { ValidForm, Field, ValidStyles } from 'valid-react-form'
import { ValidForm, Field } from 'valid-react-form'

@Radium
class LoginModal extends Component {
render () {
const { loginModalOpen, actions } = this.props
return (
<Modal style={styles} contentLabel='Login' isOpen={loginModalOpen}>
<Modal style={styles} contentLabel='Login' isOpen={loginModalOpen} >
<ModalHeader title={'Login'} onClose={actions.toggleLoginModal} />
<ValidStyles>
<ValidForm style={styles.form} onSubmit={actions.submitLogin} autoComplete='off'>
<Field label='Username'
autoFocus
required
placeholder='Enter your username'
name='username' />
<Field label='Password'
required
type='password'
placeholder='Enter password'
name='password' />
<div style={styles.controls}>
<Button style={styles.controls.submit}>Submit</Button>
<Anchor style={styles.controls.cancel} onClick={actions.toggleLoginModal}>Cancel</Anchor>
</div>
</ValidForm>
</ValidStyles>
<ValidForm style={styles.form} onSubmit={actions.submitLogin} autoComplete='off' >
<Field label='Username'
autoFocus
required
placeholder='Enter your username'
name='username' />
<Field label='Password'
required
type='password'
placeholder='Enter password'
name='password' />
<div style={styles.controls} >
<Button style={styles.controls.submit} >Submit</Button>
<Anchor style={styles.controls.cancel} onClick={actions.toggleLoginModal} >Cancel</Anchor>
</div>
</ValidForm>
</Modal>
)
}
Expand Down
2 changes: 1 addition & 1 deletion admin-console/src/common/components/Panel/Panel.js
Expand Up @@ -26,7 +26,7 @@ class Panel extends Component {

Panel.propTypes = {
title: PropTypes.string,
children: PropTypes.element,
children: PropTypes.oneOfType([PropTypes.element, PropTypes.array]),
style: PropTypes.object
}

Expand Down
25 changes: 25 additions & 0 deletions admin-console/src/common/components/Row/Row.js
@@ -0,0 +1,25 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import Radium from 'radium'
import styles from './row.styles.js'

@Radium
class Row extends Component {

render () {
const { label, children } = this.props
return (
<div style={styles.row} >
{label && <div style={styles.label}>{label}</div>}
<div style={styles.children}>{children}</div>
</div>
)
}
}

Row.propTypes = {
label: PropTypes.string,
children: PropTypes.element
}

export default Row
21 changes: 21 additions & 0 deletions admin-console/src/common/components/Row/row.styles.js
@@ -0,0 +1,21 @@
import { smallGap } from '../../../styles/constants'

export default {
row: {
position: 'relative',
width: '100%',
marginTop: smallGap,
display: 'flex',
flexDirection: 'row',
boxSizing: 'border-box',
justifyContent: 'flex-start'
},
label: {
width: '50%',
fontWeight: 600,
lineHeight: '30px'
},
children: {
width: '50%'
}
}
19 changes: 11 additions & 8 deletions admin-console/src/common/containers/app.container.js
Expand Up @@ -2,6 +2,7 @@ import React, { Component, PropTypes } from 'react'
import { Router, hashHistory } from 'react-router'
import ReduxToastr from 'react-redux-toastr'
import { Provider } from 'react-redux'
import { ValidStyles } from 'valid-react-form'

class AppContainer extends Component {
static propTypes = {
Expand All @@ -19,15 +20,17 @@ class AppContainer extends Component {
return (
<Provider store={store}>
<div style={{ height: '100%' }}>
<ReduxToastr
timeOut={4000}
newestOnTop={false}
position='top-right'
transitionIn='fadeIn'
transitionOut='fadeOut'
progressBar
<ValidStyles>
<ReduxToastr
timeOut={4000}
newestOnTop={false}
position='top-right'
transitionIn='fadeIn'
transitionOut='fadeOut'
progressBar
/>
<Router history={hashHistory} children={routes} />
<Router history={hashHistory} children={routes} />
</ValidStyles>
</div>
</Provider>
)
Expand Down
2 changes: 1 addition & 1 deletion admin-console/src/index.html
Expand Up @@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,700,900" rel="stylesheet">
<link href="http://diegoddox.github.io/react-redux-toastr/5.0/react-redux-toastr.min.css" rel="stylesheet" type="text/css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/3.0.5-1/themes/material_blue.css" />
</head>
<body style="font-family: 'Roboto', sans-serif; position: absolute; margin: 0; padding: 0; height: 100%; width: 100%">
<div id="root" style="width: 100%; height: 100%"></div>
Expand Down
1 change: 1 addition & 0 deletions admin-console/src/main.js
Expand Up @@ -3,6 +3,7 @@ import ReactDOM from 'react-dom'
import ApiService from './services/api.service'
import createStore from './store/createStore'
import AppContainer from './common/containers/app.container'
import 'whatwg-fetch'

// ========================================================
// Store Instantiation
Expand Down
Expand Up @@ -2,7 +2,7 @@ import React, { Component } from 'react'
import PropTypes from 'prop-types'
import Radium from 'radium'
import { reverse, length, take } from 'ramda'
import { Field, ValidStyles } from 'valid-react-form'
import { Field } from 'valid-react-form'
import styles from './configLogging.styles.js'
import LoggerRow from '../LoggerRow/LoggerRow'

Expand Down Expand Up @@ -58,12 +58,10 @@ class ConfigLogging extends Component {
return (
<div style={styles.main}>
<div style={styles.searchBox}>
<ValidStyles>
<Field onChange={(val) => this.updateSearchQuery(val)}
value={value}
placeholder='filter'
name='searchQuery' />
</ValidStyles>
<Field onChange={(val) => this.updateSearchQuery(val)}
value={value}
placeholder='filter'
name='searchQuery' />
<div style={styles.counts}>{count}</div>
</div>
<div style={styles.loggers}>
Expand Down
@@ -1,7 +1,9 @@
import { secondaryColor, lightColor, primaryColor } from '../../../../styles/colors'
import styles from '../../../../styles/styles'
import { secondaryColor, lightColor } from '../../../../styles/colors'
import { gap, smallGap } from '../../../../styles/constants'

export default {
...styles,
main: {
boxSizing: 'border-box',
paddingTop: gap,
Expand Down Expand Up @@ -30,17 +32,5 @@ export default {
paddingBottom: gap,
paddingLeft: gap,
color: lightColor
},
table: {
position: 'relative',
width: '100%',
boxShadow: '0 2px 10px -2px silver',
borderSpacing: 1
},
header: {
fontSize: '0.7em',
textAlign: 'left',
backgroundColor: primaryColor,
minWidth: 80
}
}

0 comments on commit d46d79e

Please sign in to comment.