aboutsummaryrefslogtreecommitdiffstats
path: root/ui-react
diff options
context:
space:
mode:
authorsebdet <sebastien.determe@intl.att.com>2021-02-25 13:58:36 +0100
committerAjith Sreekumar <ajith.sreekumar@bell.ca>2021-03-08 10:49:33 +0000
commitea2969fd3bbfe52cbe4f41546dd40d68321c233b (patch)
tree2a8288ca4f1913176d5c3fb77a897af4c3177768 /ui-react
parentc39367c1eab308b9b66d571a496b0652cb728dde (diff)
Add "delete policy" feature in UI
Add delete policy functionality (call to backend) + insert Policies array in a tabs for future policy create operation + Ask column names during export of the test db Issue-ID: POLICY-2929 Signed-off-by: sebdet <sebastien.determe@intl.att.com> Change-Id: I4108c9fa2b986cc5aff11b8710bc6ad722c52f46 Signed-off-by: sebdet <sebastien.determe@intl.att.com>
Diffstat (limited to 'ui-react')
-rw-r--r--ui-react/src/api/PolicyService.js81
-rw-r--r--ui-react/src/components/dialogs/Policy/ViewAllPolicies.js102
2 files changed, 115 insertions, 68 deletions
diff --git a/ui-react/src/api/PolicyService.js b/ui-react/src/api/PolicyService.js
index 16cc1f322..a77a8bdb0 100644
--- a/ui-react/src/api/PolicyService.js
+++ b/ui-react/src/api/PolicyService.js
@@ -26,19 +26,22 @@ export default class PolicyService {
method: 'GET',
credentials: 'same-origin'
})
- .then(function (response) {
- console.debug("getPoliciesList response received: ", response.status);
- if (response.ok) {
- return response.json();
- } else {
- console.error("getPoliciesList query failed");
- return {};
- }
- })
- .catch(function (error) {
- console.error("getPoliciesList error received", error);
- return {};
- });
+ .then(function(response) {
+ console.debug("getPoliciesList response received: ", response.status);
+ if (response.ok) {
+ console.info("getPoliciesList query successful");
+ return response.json();
+ } else {
+ return response.text().then(responseBody => {
+ throw new Error("HTTP " + response.status + "," + responseBody);
+ })
+ }
+ })
+ .catch(function(error) {
+ console.error("getPoliciesList error occurred ", error);
+ alert("getPoliciesList error occurred " + error);
+ return "";
+ })
}
static createNewPolicy(policyModelType, policyModelVersion, policyJson) {
return fetch(window.location.pathname + 'restservices/clds/v2/policies/' + policyModelType + '/' + policyModelVersion, {
@@ -49,18 +52,44 @@ export default class PolicyService {
},
body: JSON.stringify(policyJson)
})
- .then(function (response) {
- console.debug("createNewPolicy response received: ", response.status);
- if (response.ok) {
- return response.text;
- } else {
- console.error("createNewPolicy query failed");
- return "";
- }
- })
- .catch(function (error) {
- console.error("createNewPolicy error received", error);
- throw new Error(error)
- });
+ .then(function (response) {
+ console.debug("createNewPolicy response received: ", response.status);
+ if (response.ok) {
+ console.info("createNewPolicy query successful");
+ return response.text();
+ } else {
+ return response.text().then(responseBody => {
+ throw new Error("HTTP " + response.status + "," + responseBody);
+ })
+ }
+ })
+ .catch(function (error) {
+ console.error("createNewPolicy error occurred ", error);
+ alert ("createNewPolicy error occurred " + error);
+ return "";
+ });
+ }
+ static deletePolicy(policyModelType, policyModelVersion, policyName, policyVersion) {
+ return fetch(window.location.pathname + 'restservices/clds/v2/policies/' + policyModelType + '/'
+ + policyModelVersion + '/' + policyName + '/' + policyVersion, {
+ method: 'DELETE',
+ credentials: 'same-origin'
+ })
+ .then(function (response) {
+ console.debug("deletePolicy response received: ", response.status);
+ if (response.ok) {
+ console.info("deletePolicy query successful");
+ return response.text();
+ } else {
+ return response.text().then(responseBody => {
+ throw new Error("HTTP " + response.status + "," + responseBody);
+ })
+ }
+ })
+ .catch(function (error) {
+ console.error("deletePolicy error occurred ", error);
+ alert ("deletePolicy error occurred " + error);
+ return "";
+ });
}
}
diff --git a/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js b/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js
index dfebc51d8..b159584dd 100644
--- a/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js
+++ b/ui-react/src/components/dialogs/Policy/ViewAllPolicies.js
@@ -49,9 +49,11 @@ import Select from 'react-select';
import JSONEditor from '@json-editor/json-editor';
import OnapUtils from '../../../utils/OnapUtils';
import Alert from 'react-bootstrap/Alert';
+import Tabs from 'react-bootstrap/Tabs';
+import Tab from 'react-bootstrap/Tab';
const DivWhiteSpaceStyled = styled.div`
- white-space: pre;
+ white-space: pre;
`
const ModalStyled = styled(Modal)`
@@ -259,7 +261,22 @@ export default class ViewAllPolicies extends React.Component {
}
handleDeletePolicy(event, rowData) {
- return null;
+ PolicyService.deletePolicy(rowData["type"], rowData["type_version"], rowData["name"],rowData["version"]).then(
+ respPolicyDeletion => {
+ if (respPolicyDeletion === "") {
+ //it indicates a failure
+ this.setState({
+ showFailAlert: true,
+ showMessage: 'Policy Deletion Failure'
+ });
+ } else {
+ this.setState({
+ showSuccessAlert: true,
+ showMessage: 'Policy successfully Deleted'
+ });
+ }
+ }
+ )
}
customValidation(editorData) {
@@ -324,53 +341,54 @@ export default class ViewAllPolicies extends React.Component {
<ModalStyled size="xl" show={this.state.show} onHide={this.handleClose} backdrop="static" keyboard={false}>
<Modal.Header closeButton>
</Modal.Header>
-
- <Modal.Body>
- <FormControlLabel
- control={<Switch checked={this.state.prefixGrouping} onChange={this.handlePrefixGrouping} />}
- label="Group by prefix"
- />
- <MaterialTable
- title={"View All Policies in Policy Engine"}
- data={this.state.policiesListData}
- columns={this.state.policyColumnsDefinition}
- icons={this.state.tableIcons}
- onRowClick={(event, rowData) => {this.handleOnRowClick(rowData)}}
- options={{
- grouping: true,
- exportButton: true,
- headerStyle:rowHeaderStyle,
- rowStyle: rowData => ({
- backgroundColor: (this.state.selectedRowId !== -1 && this.state.selectedRowId === rowData.tableData.id) ? '#EEE' : '#FFF'
- })
- }}
- actions={[
- {
- icon: forwardRef((props, ref) => <DeleteOutline {...props} ref={ref} />),
- tooltip: 'Delete Policy',
- onClick: (event, rowData) => this.handleDeletePolicy(event, rowData)
- }
- ]}
- />
+ <Tabs id="controlled-tab-example" activeKey={this.state.key} onSelect={key => this.setState({ key, selectedRowData: {} })}>
+ <Tab eventKey="policies" title="Policies in Policy Framework">
+ <Modal.Body>
+ <FormControlLabel
+ control={<Switch checked={this.state.prefixGrouping} onChange={this.handlePrefixGrouping} />}
+ label="Group by prefix"
+ />
+ <MaterialTable
+ title={"View All Policies in Policy Engine"}
+ data={this.state.policiesListData}
+ columns={this.state.policyColumnsDefinition}
+ icons={this.state.tableIcons}
+ onRowClick={(event, rowData) => {this.handleOnRowClick(rowData)}}
+ options={{
+ grouping: true,
+ exportButton: true,
+ headerStyle:rowHeaderStyle,
+ rowStyle: rowData => ({
+ backgroundColor: (this.state.selectedRowId !== -1 && this.state.selectedRowId === rowData.tableData.id) ? '#EEE' : '#FFF'
+ })
+ }}
+ actions={[
+ {
+ icon: forwardRef((props, ref) => <DeleteOutline {...props} ref={ref} />),
+ tooltip: 'Delete Policy',
+ onClick: (event, rowData) => this.handleDeletePolicy(event, rowData)
+ }
+ ]}
+ />
+ </Modal.Body>
+ </Tab>
+ </Tabs>
<JsonEditorDiv>
<h5>Policy Properties Editor</h5>
<div id="policy-editor" title="Policy Properties"/>
<Button variant="secondary" title="Create a new policy version from the defined parameters"
onClick={this.handleCreateNewVersion}>Create New Version</Button>
- <Button variant="secondary" title="Update the current policy version, BE CAREFUL this will undeploy the policy from PDP, delete it and then recreate the policy"
- onClick={this.handleUpdatePolicy}>Update Current Version</Button>
</JsonEditorDiv>
<Alert variant="success" show={this.state.showSuccessAlert} onClose={this.disableAlert} dismissible>
- <DivWhiteSpaceStyled>
- {this.state.showMessage}
- </DivWhiteSpaceStyled>
- </Alert>
- <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
- <DivWhiteSpaceStyled>
- {this.state.showMessage}
- </DivWhiteSpaceStyled>
- </Alert>
- </Modal.Body>
+ <DivWhiteSpaceStyled>
+ {this.state.showMessage}
+ </DivWhiteSpaceStyled>
+ </Alert>
+ <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible>
+ <DivWhiteSpaceStyled>
+ {this.state.showMessage}
+ </DivWhiteSpaceStyled>
+ </Alert>
<Modal.Footer>
<Button variant="secondary" onClick={this.handleClose}>Close</Button>
</Modal.Footer>