SVG Rendering

SVG rendering draft for Config and operational policies management +
call to back-end

Issue-ID: CLAMP-422
Change-Id: Ia3ca4223e283d0cd56d98fb1871fd3b2880940ec
Signed-off-by: sebdet <sebastien.determe@intl.att.com>

6 files changed, 103 insertions, 543 deletions

diff --git a/ui-react/src/components/loop_viewer/logs/ClosedLoopLogs.js b/ui-react/src/components/loop_viewer/logs/ClosedLoopLogs.js
deleted file mode 100644
index ef7a3aefe..000000000
--- a/ui-react/src/components/loop_viewer/logs/ClosedLoopLogs.js
+++ /dev/null
@@ -1,54 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 2019 AT&T Intellectual Property. All rights
- *                             reserved.
- * ================================================================================
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- * ============LICENSE_END============================================
- * ===================================================================
- *
- */
-import React from 'react';
-import Table from 'react-bootstrap/Table';
-
-export default class ClosedLoopViewLogs extends React.Component {
-  render() {
-    return (
-      <div className="log_div">
-        <div className="log_table">
-          <label className="table_header">Loop Logs</label>
-          <Table striped hover id="loop-log-div">
-            <thead>
-  							<tr>
-  								<th><span align="left" className="text">Date</span></th>
-  								<th><span align="left" className="text">Type</span></th>
-  								<th><span align="left" className="text">Component</span></th>
-  								<th><span align="right" className="text">Log</span></th>
-  							</tr>
-  						</thead>
-  						<tbody>
-  							<tr>
-  								<td className="row_10_per">test</td>
-  								<td className="row_10_per">test</td>
-  								<td className="row_10_per">test</td>
-  								<td className="row_70_per">test</td>
-  							</tr>
-  						</tbody>
-            </Table>
-          </div>
-        </div>
-    );
-  }
-}
diff --git a/ui-react/src/components/loop_viewer/status/ClosedLoopStatus.css b/ui-react/src/components/loop_viewer/status/LoopStatus.css
index 14add0f53..14add0f53 100644
--- a/ui-react/src/components/loop_viewer/status/ClosedLoopStatus.css
+++ b/ui-react/src/components/loop_viewer/status/LoopStatus.css
diff --git a/ui-react/src/components/loop_viewer/status/ClosedLoopStatus.js b/ui-react/src/components/loop_viewer/status/LoopStatus.js
index da5969e46..f904d6740 100644
--- a/ui-react/src/components/loop_viewer/status/ClosedLoopStatus.js
+++ b/ui-react/src/components/loop_viewer/status/LoopStatus.js
@@ -22,9 +22,9 @@
 */
 import React from 'react';
 import Table from 'react-bootstrap/Table';
-import './ClosedLoopStatus.css';
+import './LoopStatus.css';
 
-export default class ClosedLoopStatus extends React.Component {
+export default class LoopStatus extends React.Component {
   render() {
   	return (
       <div>
diff --git a/ui-react/src/components/loop_viewer/svg/ClosedLoopSvg.js b/ui-react/src/components/loop_viewer/svg/ClosedLoopSvg.js
deleted file mode 100644
index d9f5eaf80..000000000
--- a/ui-react/src/components/loop_viewer/svg/ClosedLoopSvg.js
+++ /dev/null
@@ -1,43 +0,0 @@
-/*-
- * ============LICENSE_START=======================================================
- * ONAP CLAMP
- * ================================================================================
- * Copyright (C) 2019 AT&T Intellectual Property. All rights
- *                             reserved.
- * ================================================================================
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- * ============LICENSE_END============================================
- * ===================================================================
- *
- */
-import React from 'react';
-import styled from 'styled-components';
-import { ReactComponent as SvgExample } from './example.svg';
-const LoopViewSvgDivStyle = styled.div`
-
-	overflow: hidden;
-	background-color: ${props => (props.theme.loopViewerBackgroundColor)};
-	border: 1px solid transparent;
-	border-color: ${props => (props.theme.loopViewerHeaderColor)};
-`
-
-export default class ClosedLoopViewSvg extends React.Component {
-  render() {
-    return (
-    	<LoopViewSvgDivStyle id="loop_svg">
-    		<SvgExample />
-    	</LoopViewSvgDivStyle>
-    );
-  }
-}
-
diff --git a/ui-react/src/components/loop_viewer/svg/LoopSvg.js b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
new file mode 100644
index 000000000..2858ccd8a
--- /dev/null
+++ b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
@@ -0,0 +1,100 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * ONAP CLAMP
+ * ================================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights
+ *                             reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END============================================
+ * ===================================================================
+ *
+ */
+import React from 'react';
+import styled from 'styled-components';
+import { withRouter } from "react-router";
+import LoopCache from '../../../api/LoopCache'
+import LoopService from '../../../api/LoopService'
+
+const LoopViewSvgDivStyled = styled.div`
+	overflow: hidden;
+	background-color: ${props => (props.theme.loopViewerBackgroundColor)};
+	border: 1px solid;
+	border-color: ${props => (props.theme.loopViewerHeaderColor)};
+	height: 50%;
+`
+
+class LoopViewSvg extends React.Component {
+
+	static emptySvg = "<svg><text x=\"20\" y=\"40\">No LOOP (SVG)</text></svg>";
+	static operationalPolicyDataElementId = "OperationalPolicy";
+
+
+	state = {
+		svgContent: LoopViewSvg.emptySvg,
+		loopCache: this.props.loopCache,
+	}
+
+	constructor(props) {
+		super(props);
+		this.state.loopCache = props.loopCache;
+		this.handleSvgClick = this.handleSvgClick.bind(this);
+		this.getSvg = this.getSvg.bind(this);
+	}
+
+	shouldComponentUpdate(nextProps, nextState) {
+		return this.state.svgContent !== nextState.svgContent;
+	}
+
+	componentWillReceiveProps(newProps) {
+		this.state.loopCache = newProps.loopCache;
+		this.getSvg();
+	}
+
+	componentDidMount() {
+		this.getSvg();
+	}
+
+	getSvg() {
+		LoopService.getSvg(this.state.loopCache.getLoopName()).then(svgXml => {
+			if (svgXml.length != 0) {
+				this.setState({ svgContent: svgXml })
+			} else {
+				this.setState({ svgContent: LoopViewSvg.emptySvg })
+			}
+		});
+	}
+
+	handleSvgClick(event) {
+		console.debug("svg click event received");
+		var elementName = event.target.parentNode.parentNode.parentNode.getAttribute('data-element-id');
+		console.info("SVG element clicked", elementName);
+		if (typeof elementName === "undefined" || elementName === "VES") {
+			return;
+		} else if (elementName === LoopViewSvg.operationalPolicyDataElementId) {
+			this.props.history.push('/operationalPolicyModal');
+		} else {
+			this.props.history.push('/configurationPolicyModal');
+		}
+	}
+
+	render() {
+		return (
+			<LoopViewSvgDivStyled id="loop_svg" dangerouslySetInnerHTML={{ __html: this.state.svgContent }} onClick={this.handleSvgClick}>
+
+			</LoopViewSvgDivStyled>
+		);
+	}
+}
+
+export default withRouter(LoopViewSvg);
\ No newline at end of file
diff --git a/ui-react/src/components/loop_viewer/svg/example.svg b/ui-react/src/components/loop_viewer/svg/example.svg
index 2f5ebd037..a7c40ee27 100644
--- a/ui-react/src/components/loop_viewer/svg/example.svg
+++ b/ui-react/src/components/loop_viewer/svg/example.svg
@@ -1,444 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg">
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="start-circle"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<circle
-					fill="none"
-					r="17"
-					cx="18"
-					cy="41" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="Arrow-411c11ec-37fe-40bc-8544-417c2c05e4a7"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<line
-					y2="41"
-					fill="none"
-					x1="35"
-					x2="123"
-					y1="41" />
-				<polygon
-					fill="none"
-					points=" 121 39 121 43 125 41" />
-				<polygon
-					points=" 121 39 121 43 125 41"
-					stroke="none" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="VES"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<rect
-					fill="none"
-					x="127"
-					width="123"
-					y="1"
-					height="82" />
-			</g>
-			<g
-				fill-opacity="0"
-				fill="rgb(0,0,0)"
-				text-rendering="optimizeQuality"
-				shape-rendering="geometricPrecision"
-				stroke="rgb(0,0,0)"
-				stroke-opacity="0"
-				stroke-width="2">
-				<rect
-					x="127"
-					width="123"
-					y="1"
-					height="82"
-					stroke="none" />
-			</g>
-			<g
-				text-rendering="optimizeQuality"
-				stroke-width="2"
-				shape-rendering="geometricPrecision"
-				font-family="sans-serif">
-				<text
-					x="176.5"
-					xml:space="preserve"
-					y="46.5"
-					stroke="none">VES</text>
-				<line
-					y2="83"
-					fill="none"
-					x1="147"
-					x2="147"
-					y1="1" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="Arrow-17086665-1142-4cbf-9681-cf4462954c96"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<line
-					y2="41"
-					fill="none"
-					x1="250"
-					x2="338"
-					y1="41" />
-				<polygon
-					fill="none"
-					points=" 336 39 336 43 340 41" />
-				<polygon
-					points=" 336 39 336 43 340 41"
-					stroke="none" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="tca_k8s_aLs74_v1_0_ResourceInstanceName2_tca_2"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<rect
-					fill="none"
-					x="342"
-					width="123"
-					y="1"
-					height="82" />
-			</g>
-			<g
-				fill-opacity="0"
-				fill="rgb(0,0,0)"
-				text-rendering="optimizeQuality"
-				shape-rendering="geometricPrecision"
-				stroke="rgb(0,0,0)"
-				stroke-opacity="0"
-				stroke-width="2">
-				<rect
-					x="342"
-					width="123"
-					y="1"
-					height="82"
-					stroke="none" />
-			</g>
-			<g
-				text-rendering="optimizeQuality"
-				stroke-width="2"
-				shape-rendering="geometricPrecision"
-				font-family="sans-serif">
-				<text
-					x="379.5"
-					xml:space="preserve"
-					y="46.5"
-					stroke="none">tca_k8s</text>
-				<line
-					y2="61"
-					fill="none"
-					x1="342"
-					x2="465"
-					y1="61" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="Arrow-d48a7f5f-643d-4550-8045-ee46bb05ddfa"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<line
-					y2="41"
-					fill="none"
-					x1="465"
-					x2="553"
-					y1="41" />
-				<polygon
-					fill="none"
-					points=" 551 39 551 43 555 41" />
-				<polygon
-					points=" 551 39 551 43 555 41"
-					stroke="none" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="OperationalPolicy"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<rect
-					fill="none"
-					x="557"
-					width="123"
-					y="1"
-					height="82" />
-			</g>
-			<g
-				fill-opacity="0"
-				fill="rgb(0,0,0)"
-				text-rendering="optimizeQuality"
-				shape-rendering="geometricPrecision"
-				stroke="rgb(0,0,0)"
-				stroke-opacity="0"
-				stroke-width="2">
-				<rect
-					x="557"
-					width="123"
-					y="1"
-					height="82"
-					stroke="none" />
-			</g>
-			<g
-				text-rendering="optimizeQuality"
-				stroke-width="2"
-				shape-rendering="geometricPrecision"
-				font-family="sans-serif">
-				<text
-					x="564.5"
-					xml:space="preserve"
-					y="46.5"
-					stroke="none">OperationalPolicy</text>
-				<line
-					y2="1"
-					fill="none"
-					x1="557"
-					x2="618"
-					y1="42" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="Arrow-79f11b91-5a48-4945-9d2c-18a423105a7d"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="2">
-				<line
-					y2="41"
-					fill="none"
-					x1="680"
-					x2="768"
-					y1="41" />
-				<polygon
-					fill="none"
-					points=" 766 39 766 43 770 41" />
-				<polygon
-					points=" 766 39 766 43 770 41"
-					stroke="none" />
-			</g>
-		</g>
-	</g>
-	<g
-		fill-opacity="1"
-		color-rendering="auto"
-		color-interpolation="auto"
-		text-rendering="auto"
-		stroke="black"
-		stroke-linecap="square"
-		stroke-miterlimit="10"
-		shape-rendering="auto"
-		stroke-opacity="1"
-		fill="black"
-		stroke-dasharray="none"
-		font-weight="normal"
-		stroke-width="1"
-		font-family="'Dialog'"
-		font-style="normal"
-		data-element-id="stop-circle"
-		stroke-linejoin="miter"
-		font-size="12px"
-		image-rendering="auto"
-		stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator -->
-		<defs id="genericDefs" />
-		<g>
-			<g
-				shape-rendering="geometricPrecision"
-				text-rendering="optimizeQuality"
-				stroke-width="4">
-				<circle
-					fill="none"
-					r="17"
-					cx="789"
-					cy="41" />
-			</g>
-		</g>
-	</g>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg"><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="start-circle" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><circle fill="none" r="17" cx="18" cy="41"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="Arrow-82c14603-02fc-4df7-8977-9b10e4c775d1" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><line y2="41" fill="none" x1="35" x2="123" y1="41"/><polygon fill="none" points=" 121 39 121 43 125 41"/><polygon points=" 121 39 121 43 125 41" stroke="none"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="VES" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><rect fill="none" x="127" width="123" y="1" height="82"/></g><g fill-opacity="0" fill="rgb(0,0,0)" text-rendering="optimizeQuality" shape-rendering="geometricPrecision" stroke="rgb(0,0,0)" stroke-opacity="0" stroke-width="2"><rect x="127" width="123" y="1" height="82" stroke="none"/></g><g text-rendering="optimizeQuality" stroke-width="2" shape-rendering="geometricPrecision" font-family="sans-serif"><text x="176.5" xml:space="preserve" y="46.5" stroke="none">VES</text><line y2="83" fill="none" x1="147" x2="147" y1="1"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="Arrow-dbbb2d5a-e9c4-446d-92b9-c71908854434" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><line y2="41" fill="none" x1="250" x2="338" y1="41"/><polygon fill="none" points=" 336 39 336 43 340 41"/><polygon points=" 336 39 336 43 340 41" stroke="none"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="TCA_Jbv1z_v1_0_ResourceInstanceName1_tca" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><rect fill="none" x="342" width="123" y="1" height="82"/></g><g fill-opacity="0" fill="rgb(0,0,0)" text-rendering="optimizeQuality" shape-rendering="geometricPrecision" stroke="rgb(0,0,0)" stroke-opacity="0" stroke-width="2"><rect x="342" width="123" y="1" height="82" stroke="none"/></g><g text-rendering="optimizeQuality" stroke-width="2" shape-rendering="geometricPrecision" font-family="sans-serif"><text x="392" xml:space="preserve" y="46.5" stroke="none">TCA</text><line y2="61" fill="none" x1="342" x2="465" y1="61"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="Arrow-3892abbc-c49c-40df-984b-8959b6df44e6" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><line y2="41" fill="none" x1="465" x2="553" y1="41"/><polygon fill="none" points=" 551 39 551 43 555 41"/><polygon points=" 551 39 551 43 555 41" stroke="none"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="OperationalPolicy" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><rect fill="none" x="557" width="123" y="1" height="82"/></g><g fill-opacity="0" fill="rgb(0,0,0)" text-rendering="optimizeQuality" shape-rendering="geometricPrecision" stroke="rgb(0,0,0)" stroke-opacity="0" stroke-width="2"><rect x="557" width="123" y="1" height="82" stroke="none"/></g><g text-rendering="optimizeQuality" stroke-width="2" shape-rendering="geometricPrecision" font-family="sans-serif"><text x="564.5" xml:space="preserve" y="46.5" stroke="none">OperationalPolicy</text><line y2="1" fill="none" x1="557" x2="618" y1="42"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="Arrow-44a8b77e-d0eb-4c0d-82b6-0822ff35573f" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="2"><line y2="41" fill="none" x1="680" x2="768" y1="41"/><polygon fill="none" points=" 766 39 766 43 770 41"/><polygon points=" 766 39 766 43 770 41" stroke="none"/></g></g></g><g fill-opacity="1" color-rendering="auto" color-interpolation="auto" text-rendering="auto" stroke="black" stroke-linecap="square" stroke-miterlimit="10" shape-rendering="auto" stroke-opacity="1" fill="black" stroke-dasharray="none" font-weight="normal" stroke-width="1" font-family="'Dialog'" font-style="normal" data-element-id="stop-circle" stroke-linejoin="miter" font-size="12px" image-rendering="auto" stroke-dashoffset="0"><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/><g><g shape-rendering="geometricPrecision" text-rendering="optimizeQuality" stroke-width="4"><circle fill="none" r="17" cx="789" cy="41"/></g></g></g></svg>
\ No newline at end of file