aboutsummaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx140
1 files changed, 73 insertions, 67 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx
index aa39c87dd0..cee46abc69 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx
@@ -20,80 +20,86 @@ import i18n from 'nfvo-utils/i18n/i18n.js';
import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
-
class SoftwareProductProcessesListView extends React.Component {
+ state = {
+ localFilter: ''
+ };
- state = {
- localFilter: ''
- };
-
- static propTypes = {
- onAddProcess: PropTypes.func.isRequired,
- onEditProcess: PropTypes.func.isRequired,
- onDeleteProcess: PropTypes.func.isRequired,
- isReadOnlyMode: PropTypes.bool.isRequired,
- currentSoftwareProduct:PropTypes.object,
- addButtonTitle: PropTypes.string
- };
-
- render() {
- const {localFilter} = this.state;
- let {onAddProcess, isReadOnlyMode, addButtonTitle} = this.props;
+ static propTypes = {
+ onAddProcess: PropTypes.func.isRequired,
+ onEditProcess: PropTypes.func.isRequired,
+ onDeleteProcess: PropTypes.func.isRequired,
+ isReadOnlyMode: PropTypes.bool.isRequired,
+ currentSoftwareProduct: PropTypes.object,
+ addButtonTitle: PropTypes.string
+ };
- return (
- <ListEditorView
- plusButtonTitle={addButtonTitle}
- filterValue={localFilter}
- placeholder={i18n('Filter Process')}
- onAdd={onAddProcess}
- isReadOnlyMode={isReadOnlyMode}
- title={i18n('Process Details')}
- onFilter={value => this.setState({localFilter: value})}>
- {this.filterList().map(processes => this.renderProcessListItem(processes, isReadOnlyMode))}
- </ListEditorView>);
- }
+ render() {
+ const { localFilter } = this.state;
+ let { onAddProcess, isReadOnlyMode, addButtonTitle } = this.props;
- renderProcessListItem(process, isReadOnlyMode) {
- let {id, name, description, artifactName = ''} = process;
- let {currentSoftwareProduct: {version}, onEditProcess, onDeleteProcess} = this.props;
- return (
- <ListEditorItemView
- key={id}
- className='list-editor-item-view'
- isReadOnlyMode={isReadOnlyMode}
- onSelect={() => onEditProcess(process)}
- onDelete={() => onDeleteProcess(process, version)}>
+ return (
+ <ListEditorView
+ plusButtonTitle={addButtonTitle}
+ filterValue={localFilter}
+ placeholder={i18n('Filter Process')}
+ onAdd={onAddProcess}
+ isReadOnlyMode={isReadOnlyMode}
+ title={i18n('Process Details')}
+ onFilter={value => this.setState({ localFilter: value })}>
+ {this.filterList().map(processes =>
+ this.renderProcessListItem(processes, isReadOnlyMode)
+ )}
+ </ListEditorView>
+ );
+ }
- <div className='list-editor-item-view-field'>
- <div className='title'>{i18n('Name')}</div>
- <div className='name'>{name}</div>
- </div>
- <div className='list-editor-item-view-field'>
- <div className='title'>{i18n('Artifact name')}</div>
- <div className='artifact-name'>{artifactName}</div>
- </div>
- <div className='list-editor-item-view-field'>
- <div className='title'>{i18n('Notes')}</div>
- <div className='description'>{description}</div>
- </div>
- </ListEditorItemView>
- );
- }
+ renderProcessListItem(process, isReadOnlyMode) {
+ let { id, name, description, artifactName = '' } = process;
+ let {
+ currentSoftwareProduct: { version },
+ onEditProcess,
+ onDeleteProcess
+ } = this.props;
+ return (
+ <ListEditorItemView
+ key={id}
+ className="list-editor-item-view"
+ isReadOnlyMode={isReadOnlyMode}
+ onSelect={() => onEditProcess(process)}
+ onDelete={() => onDeleteProcess(process, version)}>
+ <div className="list-editor-item-view-field">
+ <div className="title">{i18n('Name')}</div>
+ <div className="name">{name}</div>
+ </div>
+ <div className="list-editor-item-view-field">
+ <div className="title">{i18n('Artifact name')}</div>
+ <div className="artifact-name">{artifactName}</div>
+ </div>
+ <div className="list-editor-item-view-field">
+ <div className="title">{i18n('Notes')}</div>
+ <div className="description">{description}</div>
+ </div>
+ </ListEditorItemView>
+ );
+ }
- filterList() {
- let {processesList} = this.props;
- let {localFilter} = this.state;
+ filterList() {
+ let { processesList } = this.props;
+ let { localFilter } = this.state;
- if (localFilter.trim()) {
- const filter = new RegExp(escape(localFilter), 'i');
- return processesList.filter(({name = '', description = ''}) => {
- return escape(name).match(filter) || escape(description).match(filter);
- });
- }
- else {
- return processesList;
- }
- }
+ if (localFilter.trim()) {
+ const filter = new RegExp(escape(localFilter), 'i');
+ return processesList.filter(({ name = '', description = '' }) => {
+ return (
+ escape(name).match(filter) ||
+ escape(description).match(filter)
+ );
+ });
+ } else {
+ return processesList;
+ }
+ }
}
export default SoftwareProductProcessesListView;