Skip to content

Commit

Permalink
Resolving merge conflict
Browse files Browse the repository at this point in the history
  • Loading branch information
@dkhatri-crest
dkhatri-crest committed Mar 17, 2021
2 parents 47b9511 + 1970d9d commit dc67235
Show file tree
Hide file tree
Showing 19 changed files with 615 additions and 827 deletions.
1 change: 1 addition & 0 deletions splunk_add_on_ucc_framework/ucc_ui_lib/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
"@splunk/babel-preset": "^3.0.0",
"@splunk/eslint-config": "^4.0.0",
"@splunk/react-page": "^5.0.0",
"@splunk/react-toast-notifications": "^0.9.0",
"@splunk/react-ui": "^4.0.0",
"@splunk/splunk-utils": "^2.0.0",
"@splunk/stylelint-config": "^4.0.0",
Expand Down
118 changes: 63 additions & 55 deletions splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/BaseFormView.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,13 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Message from '@splunk/react-ui/Message';
import update from 'immutability-helper';
import CustomControl from './CustomControl';
import ControlWrapper from './ControlWrapper';
import { getUnifiedConfigs } from '../util/util';
import {
MODE_CLONE,
MODE_CREATE,
MODE_EDIT
} from "../constants/modes";

class BaseFormView extends Component {
constructor(props) {
Expand All @@ -20,6 +24,14 @@ class BaseFormView extends Component {
SetState: (state) => {
this.setState(state);
},
setErrorFieldMsg:this.setErrorFieldMsg,
clearAllErrorMsg:this.clearAllErrorMsg
};

this.utilControlWrapper = {
handleChange:this.handleChange,
addCustomValidator:this.addCustomValidator,
utilCustomFunctions:this.util
};

if (props.isInput) {
Expand All @@ -46,22 +58,30 @@ class BaseFormView extends Component {
this.entities.forEach((e) => {
const tempEntity = {};

if (props.mode === 'CREATE') {
tempEntity.value = (typeof e.defaultValue !== "undefined")?e.defaultValue:'';
if (props.mode === MODE_CREATE) {
tempEntity.value = (typeof e.defaultValue !== "undefined") ? e.defaultValue : null;
tempEntity.display = (typeof e?.options?.display !== "undefined")?e.options.display:true;
tempEntity.error = false;
tempEntity.disabled =false;
temState[e.field] = tempEntity;
} else if (props.mode === 'EDIT') {
tempEntity.value = (typeof props.currentInput[e.field] !== "undefined")? props.currentInput[e.field]:'';
}
else if (props.mode === MODE_EDIT) {
tempEntity.value = (typeof props.currentInput[e.field] !== "undefined") ? props.currentInput[e.field] : null;
tempEntity.display = (typeof e?.options?.display !== "undefined")?e.options.display:true;
tempEntity.error = false;
tempEntity.disabled = (typeof e?.options?.disableonEdit !== "undefined")?e.options.disableonEdit:false;
temState[e.field] = tempEntity;
} else {
}
else if (props.mode === MODE_CLONE){
tempEntity.value = e.field === 'name' ? '' : props.currentInput[e.field];
tempEntity.display = (typeof e?.options?.display !== "undefined")?e.options.display:true;
tempEntity.display = (typeof e?.options?.display !== "undefined") ? e.options.display:true;
tempEntity.error = false;
tempEntity.disabled =e.field==='name';
temState[e.field] = tempEntity;
}
else{
throw new Error('Invalid mode :',props.mode);
}
});

this.state = {
Expand Down Expand Up @@ -92,13 +112,17 @@ class BaseFormView extends Component {
return false;
}
}
// To DO :here We will validate data, save data to global state and also to backend
const datadict={};
Object.keys(this.state.data).forEach( (field)=> {
datadict[field] = this.state.data[field].value;
});


const saveSuccess = true;
const dataValues = {};

const returnValue = {
result: saveSuccess,
data: dataValues,
data: datadict,
};

if (saveSuccess) {
Expand All @@ -116,9 +140,9 @@ class BaseFormView extends Component {


handleChange = (field, targetValue)=> {
this.clearErrorMsg();
const newFields = update(this.state ,{ data: { [field] : { value: {$set: targetValue } } } } );
this.setState(newFields);
const tempState = this.clearAllErrorMsg(newFields);
this.setState(tempState);

if (this.hookDeferred) {
this.hookDeferred.then(() => {
Expand All @@ -129,6 +153,10 @@ class BaseFormView extends Component {
}
}

addCustomValidator = (field,validator) =>{
const index = this.entities.findIndex(x => x.field ===field);
this.entities[index].CustomValidator = validator;
}

// Set error message to display and set error in perticular field
setErrorFieldMsg = (field, msg) =>{
Expand Down Expand Up @@ -167,9 +195,7 @@ class BaseFormView extends Component {
const temData ={}
Object.keys(newData).forEach( (key) => {
if(newData[key].error){
const tem = {...newData[key]}
tem.error = false;
temData[key] = tem;
temData[key] = {...newData[key], error:false};
}
else{
temData[key] = newData[key];
Expand All @@ -183,7 +209,7 @@ class BaseFormView extends Component {
generateErrorMessage = () => {
if (this.state.ErrorMsg) {
return (
<div className="msg msg-err" >
<div >
<Message appearance="fill" type="error">
{this.state.ErrorMsg}
</Message>
Expand Down Expand Up @@ -214,7 +240,7 @@ class BaseFormView extends Component {
});
}

if (this.props.mode === 'EDIT') {
if (this.props.mode === MODE_EDIT) {
if (this.hookDeferred) {
this.hookDeferred.then(() => {
if (typeof this.hook.onCreate === 'function') {
Expand All @@ -226,46 +252,28 @@ class BaseFormView extends Component {
this.flag = false;
}

const rows = [];
return(
<div className="form-horizontal">
{this.generateErrorMessage()}
{
this.entities.map( (e) => {

this.entities.forEach( (e) => {
if (e.type === 'custom') {
rows.push(
<CustomControl
key={e.field}
handleChange={this.handleChange}
display={this.state.data[e.field].display}
error={this.state.data[e.field].error}
field={e.field}
helptext={e.help}
label={e.label}
controlOptions={e.options}
mode={this.props.mode}
/>
);
} else {
rows.push(
<ControlWrapper
key={e.field}
handleChange={this.handleChange}
value={this.state.data[e.field].value}
display={this.state.data[e.field].display}
error={this.state.data[e.field].error}
helptext={e.help || ""}
label={e.label}
field={e.field}
controlOptions={ e.options|| {} }
mode={this.props.mode}
tooltip={e.tooltip || ""}
type={e.type}
/>
);
const temState = this.state.data[e.field];

return ( <ControlWrapper
key={e.field}
utilityFuncts={this.utilControlWrapper}
value={temState.value}
display={temState.display}
error={temState.error}
entity={e}
serviceName={this.props.serviceName}
mode={this.props.mode}
disabled={temState.disbled}
/>)

})
}
});

return( <div className="form-horizontal">
{this.generateErrorMessage()}
{rows}
</div>
);
}
Expand Down
76 changes: 51 additions & 25 deletions splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/ControlWrapper.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,50 +7,76 @@ class ControlWrapper extends React.PureComponent {

constructor(props){
super(props);
this.controlType = this.isString(props.type) ? CONTROL_TYPE_MAP[props.type] : props.type;
this.controlType = this.isString(props.entity.type) ? CONTROL_TYPE_MAP[props.entity.type] : props.entity.type;
}

isString = (str)=>{
return !!((typeof str === 'string' || str instanceof String));
}

render(){
const isDisable = this.props.mode ==="EDIT" ? this.props.controlOptions.disableonEdit : false;
const rowView = this.controlType ? (
React.createElement(this.controlType,
{
handleChange:this.props.handleChange,
value:this.props.value,
field:this.props.field,
disabled:isDisable,
controlOptions:this.props.controlOptions,
})): `No View Found for ${this.props.type} type`;

const {field, options, type,label,tooltip, helptext,encrypted=false} = this.props.entity;
const {handleChange, addCustomValidator, utilCustomFunctions} = this.props.utilityFuncts;

let rowView;
if(this.props.entity.type==="custom"){

const data = {
value:this.props.value,
mode:this.props.mode,
serviceName:this.props.serviceName
}

rowView = this.controlType ? (
React.createElement(this.controlType,
{
data,
field,
handleChange,
addCustomValidator,
utilCustomFunctions,
controlOptions:options
})
): `No View Found for ${type} type`;
}
else{
rowView = this.controlType ? (
React.createElement(this.controlType,
{
handleChange,
value:this.props.value,
field,
controlOptions:options,
error:this.props.error,
disabled:this.props.disabled,
encrypted
})
): `No View Found for ${type} type`;
}

return (
this.props.display &&
<ControlGroup
label={this.props.label}
help={this.props.helptext}
tooltip={this.props.tooltip}
error={this.props.error} >
{rowView}
</ControlGroup>
<ControlGroup
label={label}
help={helptext}
tooltip={tooltip}
error={this.props.error} >
{rowView}
</ControlGroup>
)
}
}

ControlWrapper.propTypes = {
tooltip:PropTypes.string,
mode:PropTypes.string,
label:PropTypes.string,
handleChange:PropTypes.func,
utilityFuncts:PropTypes.object,
value : PropTypes.any,
display : PropTypes.bool,
error : PropTypes.bool,
helptext : PropTypes.string,
field : PropTypes.string,
type : PropTypes.string,
controlOptions : PropTypes.object
entity : PropTypes.object,
disabled : PropTypes.bool,
serviceName: PropTypes.string
}

export default ControlWrapper;

0 comments on commit dc67235

Please sign in to comment.