diff --git a/src/webui/service/link/routes.py b/src/webui/service/link/routes.py
index 0fda8958e2ab2609969d2c1f68aaae61b7360b68..3ab320d8b13d037e195f00ced9eb63bd14ecc0dd 100644
--- a/src/webui/service/link/routes.py
+++ b/src/webui/service/link/routes.py
@@ -13,8 +13,8 @@
# limitations under the License.
-from flask import render_template, Blueprint, flash, session, redirect, url_for
-from common.proto.context_pb2 import Empty, Link, LinkList
+from flask import current_app, render_template, Blueprint, flash, session, redirect, url_for
+from common.proto.context_pb2 import Empty, Link, LinkId, LinkList
from common.tools.context_queries.EndPoint import get_endpoint_names
from common.tools.context_queries.Link import get_link
from common.tools.context_queries.Topology import get_topology
@@ -65,3 +65,25 @@ def detail(link_uuid: str):
device_names, endpoints_data = get_endpoint_names(context_client, link_obj.link_endpoint_ids)
context_client.close()
return render_template('link/detail.html',link=link_obj, device_names=device_names, endpoints_data=endpoints_data)
+
+@link.get('<path:link_uuid>/delete')
+def delete(link_uuid):
+ try:
+
+ # first, check if link exists!
+ # request: LinkId = LinkId()
+ # request.link_uuid.uuid = link_uuid
+ # response: Link = client.GetLink(request)
+ # TODO: finalize implementation
+
+ request = LinkId()
+ request.link_uuid.uuid = link_uuid # pylint: disable=no-member
+ context_client.connect()
+ context_client.RemoveLink(request)
+ context_client.close()
+
+ flash(f'Link "{link_uuid}" deleted successfully!', 'success')
+ except Exception as e: # pylint: disable=broad-except
+ flash(f'Problem deleting link "{link_uuid}": {e.details()}', 'danger')
+ current_app.logger.exception(e)
+ return redirect(url_for('link.home'))
diff --git a/src/webui/service/templates/link/detail.html b/src/webui/service/templates/link/detail.html
index 916abafde05b3ec990346ff7966f207b1dafc10a..8ca7faee3e1871d11b819c6ca95668e654041f8c 100644
--- a/src/webui/service/templates/link/detail.html
+++ b/src/webui/service/templates/link/detail.html
@@ -13,62 +13,92 @@
See the License for the specific language governing permissions and
limitations under the License.
-->
- {% extends 'base.html' %}
-
- {% block content %}
- <h1>Link {{ link.name }} ({{ link.link_id.link_uuid.uuid }})</h1>
- <div class="row mb-3">
- <div class="col-sm-3">
- <button type="button" class="btn btn-success" onclick="window.location.href='{{ url_for('link.home') }}'">
- <i class="bi bi-box-arrow-in-left"></i>
- Back to link list
- </button>
- </div>
- </div>
- <br>
- <div class="row mb-3">
- <div class="col-sm-4">
- <b>UUID: </b>{{ link.link_id.link_uuid.uuid }}<br>
- <b>Name: </b>{{ link.name }}<br>
- </div>
- <div class="col-sm-8">
- <table class="table table-striped table-hover">
- <thead>
- <tr>
- <th scope="col">Endpoint UUID</th>
- <th scope="col">Name</th>
- <th scope="col">Device</th>
- <th scope="col">Endpoint Type</th>
- </tr>
- </thead>
- <tbody>
- {% for endpoint in link.link_endpoint_ids %}
- <tr>
- <td>
- {{ endpoint.endpoint_uuid.uuid }}
- </td>
- <td>
- {{ endpoints_data.get(endpoint.endpoint_uuid.uuid, (endpoint.endpoint_uuid.uuid, ''))[0] }}
- </td>
- <td>
- <a href="{{ url_for('device.detail', device_uuid=endpoint.device_id.device_uuid.uuid) }}">
- {{ device_names.get(endpoint.device_id.device_uuid.uuid, endpoint.device_id.device_uuid.uuid) }}
- <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye" viewBox="0 0 16 16">
- <path d="M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.133 13.133 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.133 13.133 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5c-2.12 0-3.879-1.168-5.168-2.457A13.134 13.134 0 0 1 1.172 8z"/>
- <path d="M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>
- </svg>
- </a>
- </td>
- <td>
- {{ endpoints_data.get(endpoint.endpoint_uuid.uuid, ('', '-'))[1] }}
- </td>
- </tr>
- {% endfor %}
- </tbody>
- </table>
+{% extends 'base.html' %}
+
+{% block content %}
+<h1>Link {{ link.name }} ({{ link.link_id.link_uuid.uuid }})</h1>
+<div class="row mb-3">
+ <div class="col-sm-3">
+ <button type="button" class="btn btn-success" onclick="window.location.href='{{ url_for('link.home') }}'">
+ <i class="bi bi-box-arrow-in-left"></i>
+ Back to link list
+ </button>
+ </div>
+ <div class="col-sm-3">
+ <!-- <button type="button" class="btn btn-danger"><i class="bi bi-x-square"></i>Delete link</button> -->
+ <button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteModal">
+ <i class="bi bi-x-square"></i>
+ Delete link
+ </button>
+ </div>
+</div>
+
+<br>
+<div class="row mb-3">
+ <div class="col-sm-4">
+ <b>UUID: </b>{{ link.link_id.link_uuid.uuid }}<br>
+ <b>Name: </b>{{ link.name }}<br>
+ </div>
+ <div class="col-sm-8">
+ <table class="table table-striped table-hover">
+ <thead>
+ <tr>
+ <th scope="col">Endpoint UUID</th>
+ <th scope="col">Name</th>
+ <th scope="col">Device</th>
+ <th scope="col">Endpoint Type</th>
+ </tr>
+ </thead>
+ <tbody>
+ {% for endpoint in link.link_endpoint_ids %}
+ <tr>
+ <td>
+ {{ endpoint.endpoint_uuid.uuid }}
+ </td>
+ <td>
+ {{ endpoints_data.get(endpoint.endpoint_uuid.uuid, (endpoint.endpoint_uuid.uuid, ''))[0] }}
+ </td>
+ <td>
+ <a href="{{ url_for('device.detail', device_uuid=endpoint.device_id.device_uuid.uuid) }}">
+ {{ device_names.get(endpoint.device_id.device_uuid.uuid, endpoint.device_id.device_uuid.uuid) }}
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye" viewBox="0 0 16 16">
+ <path d="M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.133 13.133 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.133 13.133 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5c-2.12 0-3.879-1.168-5.168-2.457A13.134 13.134 0 0 1 1.172 8z"/>
+ <path d="M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>
+ </svg>
+ </a>
+ </td>
+ <td>
+ {{ endpoints_data.get(endpoint.endpoint_uuid.uuid, ('', '-'))[1] }}
+ </td>
+ </tr>
+ {% endfor %}
+ </tbody>
+ </table>
+ </div>
+</div>
+
+
+<!-- Modal -->
+<div class="modal fade" id="deleteModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
+ aria-labelledby="staticBackdropLabel" aria-hidden="true">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h5 class="modal-title" id="staticBackdropLabel">Delete link?</h5>
+ <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+ </div>
+ <div class="modal-body">
+ Are you sure you want to delete the link "{{ link.link_id.link_uuid.uuid }}"?
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">No</button>
+ <a type="button" class="btn btn-danger"
+ href="{{ url_for('link.delete', link_uuid=link.link_id.link_uuid.uuid) }}"><i
+ class="bi bi-exclamation-diamond"></i>Yes</a>
</div>
</div>
+ </div>
+</div>
- {% endblock %}
-
\ No newline at end of file
+{% endblock %}