Merge pull request #207 from D10S0VSkY-OSS/refactor/console-logs

🔥feat: console logs icons

.github/workflows/sld-dashboard-docker-image.yml

@@ -24,11 +24,11 @@ jobs:
 
     - name: Build the Docker image with tags
       working-directory: ./sld-dashboard
-      run: docker build . --file Dockerfile --tag ${{ secrets.DOCKER_USERNAME }}/sld-dashboard:2.28.0
+      run: docker build . --file Dockerfile --tag ${{ secrets.DOCKER_USERNAME }}/sld-dashboard:2.29.0
 
     - name: Docker Push with tags
       #if: github.event.pull_request.merged == true
-      run: docker push ${{ secrets.DOCKER_USERNAME }}/sld-dashboard:2.28.0
+      run: docker push ${{ secrets.DOCKER_USERNAME }}/sld-dashboard:2.29.0
     - name: Build the Docker image
       working-directory: ./sld-dashboard
       run: docker build . --file Dockerfile --tag ${{ secrets.DOCKER_USERNAME }}/sld-dashboard:latest

play-with-sld/kubernetes/k8s/sld-dashboard.yml

@@ -17,7 +17,7 @@ spec:
       subdomain: primary
       containers:
         - name: sld-dashboard
-          image: d10s0vsky/sld-dashboard:2.28.0
+          image: d10s0vsky/sld-dashboard:2.29.0
           env:
           - name: PATH
             value: "/home/sld/.asdf/shims:/home/sld/.asdf/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin"

sld-dashboard/app/base/static/assets/css/volt.css

@@ -41800,6 +41800,20 @@ pre {
     text-align: center; /* Centrar el texto dentro del tag */    
 }
 
+
+.tag-style-apply {
+    background-color:#172d34; /* Un gris oscuro */
+    color: white; /* Texto en color blanco para contraste */
+    padding: 5px 10px; /* Espaciado interno para dar forma al tag */
+    border-radius: 5px; /* Bordes redondeados para la apariencia de un tag */
+    font-weight: normal; /* Peso de la fuente, ajusta según necesidad */
+    display: inline-block; /* Para asegurar que el estilo se aplique correctamente */
+    margin: 2px; /* Un pequeño margen alrededor del tag */
+    width: 100px; /* Ancho fijo para el tag */
+    text-align: center; /* Centrar el texto dentro del tag */    
+}
+
+
 .tag-style-retry {
     background-color: var(--bs-warning); /* Un gris oscuro */
     color: white; /* Texto en color blanco para contraste */

sld-dashboard/app/home/routes.py

@@ -48,10 +48,21 @@ def index():
     )
 
 # stream SSE
-@blueprint.route('/deploy-stream/<task_id>')
+@blueprint.route('/deploy-stream/<deploy_id>')
 @login_required
-def deploy_stream(task_id):
-    return render_template('deploy-stream.html', task_id=task_id)
+def deploy_stream(deploy_id):
+        token = decrypt(r.get(current_user.id))
+        # Check if token no expired
+        check_unauthorized_token(token)
+        # Get defaults vars by deploy
+        endpoint = f"deploy/{deploy_id}"
+        # Get deploy data vars and set var for render
+        response = request_url(
+            verb="GET", uri=f"{endpoint}", headers={"Authorization": f"Bearer {token}"}
+        )
+        deploy = response.get("json")
+        return render_template('deploy-stream.html', deploy=deploy)
+
 
 @blueprint.route('/stream/<task_id>')
 @login_required
@@ -207,6 +218,32 @@ def destroy_deploy(deploy_id):
         return render_template("page-500.html"), 500
 
 
+@blueprint.route("/deploys/destroy_console/<int:deploy_id>")
+@login_required
+def destroy_deploy_console(deploy_id):
+    try:
+        token = decrypt(r.get(current_user.id))
+        # Check if token no expired
+        check_unauthorized_token(token)
+        endpoint = f"deploy/{deploy_id}"
+        response = request_url(
+            verb="PUT", uri=f"{endpoint}", headers={"Authorization": f"Bearer {token}"}
+        )
+        if response.get("status_code") == 202:
+            flash(f"Destroying infra")
+        else:
+            flash(response["json"]["detail"], "error")
+        return redirect(
+            url_for("home_blueprint.route_template", template=f"deploy-stream/{deploy_id}")
+        )
+    except TemplateNotFound:
+        return render_template("page-404.html"), 404
+    except TypeError:
+        return redirect(url_for("base_blueprint.logout"))
+    except Exception:
+        return render_template("page-500.html"), 500
+
+
 @blueprint.route("/deploys/unlock/<int:deploy_id>")
 @login_required
 def unlock_deploy(deploy_id):
@@ -275,6 +312,44 @@ def relaunch_deploy(deploy_id):
     except Exception:
         return render_template("page-500.html"), 500
 
+@blueprint.route("/deploys/console/redeploy/<int:deploy_id>")
+@login_required
+def relaunch_console_deploy(deploy_id):
+    try:
+        token = decrypt(r.get(current_user.id))
+        # Check if token no expired
+        check_unauthorized_token(token)
+        endpoint = f"deploy/{deploy_id}"
+
+        response = request_url(
+            verb="GET", uri=f"{endpoint}", headers={"Authorization": f"Bearer {token}"}
+        )
+        content = response.get("json")
+        data = {
+            "start_time": content["start_time"],
+            "destroy_time": content["destroy_time"],
+            "stack_branch": content["stack_branch"],
+            "tfvar_file": content["tfvar_file"],
+            "project_path": content["project_path"],
+            "variables": content["variables"],
+        }
+        response = request_url(
+            verb="PATCH",
+            uri=f"{endpoint}",
+            headers={"Authorization": f"Bearer {token}"},
+            json=data,
+        )
+
+        if response.get("status_code") == 202:
+            flash("Re-Launch Deploy")
+        else:
+            flash(response["json"]["detail"], "error")
+        return redirect(
+            url_for("home_blueprint.route_template", template=f"deploy-stream/{deploy_id}")
+        )
+    except Exception as err:
+        raise err
+
 
 @blueprint.route("/edit-deploy", methods=["GET", "POST"], defaults={"deploy_id": None})
 @blueprint.route("/edit-deploy/<deploy_id>", methods=["GET", "POST"])
@@ -458,6 +533,7 @@ def get_plan(deploy_id):
     except ValueError:
         return redirect(url_for("base_blueprint.logout"))
 
+
 @blueprint.route("/plan/redeploy/<int:deploy_id>")
 @login_required
 def relaunch_plan(deploy_id):
@@ -488,7 +564,7 @@ def relaunch_plan(deploy_id):
         )
 
         if response.get("status_code") == 202:
-            flash(f"planning deploy")
+            flash("planning deploy")
         else:
             flash(response["json"]["detail"], "error")
         return redirect(
@@ -502,6 +578,49 @@ def relaunch_plan(deploy_id):
         return render_template("page-500.html"), 500
 
 
+@blueprint.route("/plan/console/redeploy/<int:deploy_id>")
+@login_required
+def relaunch_console_plan(deploy_id):
+    try:
+        token = decrypt(r.get(current_user.id))
+        # Check if token no expired
+        check_unauthorized_token(token)
+        endpoint = f"deploy/{deploy_id}"
+
+        response = request_url(
+            verb="GET", uri=f"{endpoint}", headers={"Authorization": f"Bearer {token}"}
+        )
+        content = response.get("json")
+        data = {
+            "start_time": content["start_time"],
+            "destroy_time": content["destroy_time"],
+            "stack_branch": content["stack_branch"],
+            "tfvar_file": content["tfvar_file"],
+            "project_path": content["project_path"],
+            "variables": content["variables"],
+        }
+        endpoint = f"plan/{deploy_id}"
+        response = request_url(
+            verb="PATCH",
+            uri=f"{endpoint}",
+            headers={"Authorization": f"Bearer {token}"},
+            json=data,
+        )
+
+        if response.get("status_code") == 202:
+            flash(f"planning deploy")
+        else:
+            flash(response["json"]["detail"], "error")
+        return redirect(
+            url_for("home_blueprint.route_template", template=f"deploy-stream/{deploy_id}")
+        )
+    except TemplateNotFound:
+        return render_template("page-404.html"), 404
+    except TypeError:
+        return redirect(url_for("base_blueprint.logout"))
+    except Exception:
+        return render_template("page-500.html"), 500
+
 @blueprint.route("/clone-deploy", methods=["GET", "POST"], defaults={"deploy_id": None})
 @blueprint.route("/clone-deploy/<deploy_id>", methods=["GET", "POST"])
 @login_required

sld-dashboard/app/home/templates/deploy-stream.html

@@ -11,7 +11,7 @@
         border-radius: 4px;
         margin-top: 20px;
         overflow-y: auto;
-        max-height: 600px;
+        max-height: 530px;
     }
 
     #console-container h2 {
@@ -29,6 +29,24 @@
         margin-top: 5px; /* Top margin */
         overflow-y: auto;
     }
+.acciones-lineales .dropdown-item {
+    display: inline-block;
+    margin-right: 10px;
+    margin: 0 20px;
+}
+.acciones-lineales a {
+    display: inline-block;
+    margin-right: 10px; /* Ajusta el margen según tus necesidades */
+}
+
+.linea-divisoria {
+    display: inline-block;
+    width: 1px; /* Ancho de la línea */
+    height: 20px; /* Altura de la línea, ajusta según tus necesidades */
+    background-color: #000; /* Color de la línea */
+    margin-right: 10px; /* Espacio después de la línea, ajusta según tus necesidades */
+    vertical-align: middle; /* Alinea verticalmente con los enlaces */
+}
 </style>
 {% endblock stylesheets %}
 
@@ -47,8 +65,27 @@
     <div class="py-4">
         <nav aria-label="breadcrumb">
             <ol class="breadcrumb breadcrumb-dark breadcrumb-transparent">
-                <li class="breadcrumb-item"><a href="#"><span class="fas fa-home"></span></a></li>
+                <li class="breadcrumb-item"><a href="/deploys-list"><span class="fas fa-home"></span></a></li>
                 <li class="breadcrumb-item"><a href="/deploys-list">Deploy</a></li>
+                <li class="breadcrumb-item"><span class="fas fa-box-open"></span></li>
+                <li class="breadcrumb-item">
+                <a href="#" onclick="copyToClipboard('{{deploy.name}}')">{{deploy.name}}</a></li>
+                <li class="breadcrumb-item"><span class="fas fa-cloud"></span></li>
+                <li class="breadcrumb-item">
+                <a href="#" onclick="copyToClipboard('{{deploy.suqad}}_{{ deploy.environment}}')">{{deploy.squad}}_{{deploy.environment}}</a></li>
+                <li class="breadcrumb-item"><span class="fas fa-layer-group"></span></li>
+                <li class="breadcrumb-item">
+                <a href="#" onclick="copyToClipboard('{{deploy.stack_name}}')">{{deploy.stack_name}}</a></li>
+                <li class="breadcrumb-item"><span class="fa fa-code-branch"></span></li>
+                <li class="breadcrumb-item">
+                <a href="#" onclick="copyToClipboard('{{deploy.stack_name}}')">{{deploy.stack_branch}}</a></li>
+                <li class="breadcrumb-item"><span class="fas fa-tasks"></span></li>
+                <li class="breadcrumb-item">
+                <a href="#" onclick="copyToClipboard('{{deploy.task_id}}')">{{deploy.task_id}}</a></li>
+                <li class="breadcrumb-item"><span class="fas fa-sitemap"></span></li>
+                <li class="breadcrumb-item">
+                <a href="#" onclick="copyToClipboard('{{deploy.action}}')">{{deploy.action}}</a></li>
+
             </ol>
         </nav>
 
@@ -58,15 +95,41 @@ <h2>Deployment Output:</h2>
             <pre id="sse-data"></pre>
         </div>
     </div>
+<div class="acciones-lineales">
+    <a href="{{ url_for('.relaunch_console_plan', deploy_id=deploy.id) }}">
+       <span class="tag-style-status">PLAN</span>
+    </a>
+    <span class="linea-divisoria"></span> <!-- Elemento divisor -->
+    <a href="{{ url_for('.relaunch_console_deploy', deploy_id=deploy.id) }}">
+       <span class="tag-style-apply">APPLY</span>
+    </a>
+    <span class="linea-divisoria"></span> <!-- Elemento divisor -->
+    <a href="#" id="destroyLink">
+       <span class="tag-style-failure">DESTROY</span>
+    </a>
+</div>
 
+<!-- Modal de confirmación -->
+<!-- Backdrop for Modal -->
+<div id="modalBackdrop" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 2;"></div>
+
+<!-- Confirmation Modal -->
+<div id="confirmModal" style="display:none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 20px; border: 1px solid #ccc; border-radius: 5px; background-color: #f9f9f9; z-index: 3;">
+    <p>To confirm, enter the name of the deploy:</p>
+    <input type="text" id="deploymentNameInput" placeholder="Deploy Name" style="padding: 5px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 3px; width: 100%;">
+    <p id="errorMessage" style="color: red; display: none;">Name does not match.</p>
+    <button id="confirmDestroy" style="background-color: var(--bs-reddit); color: white; padding: 10px 15px; border: none; border-radius: 5px; cursor: pointer;">Confirm Destruction</button>
+    <button id="cancelDestroy" style="background-color: var(--bs-soft-green); color: white; padding: 10px 15px; margin-left: 10px; border: none; border-radius: 5px; cursor: pointer;">Cancel</button>
+</div>
     {% include 'includes/footer.html' %}
+
 </main>
 {% endblock content %}
 
 <!-- Specific Page JS goes HERE  -->
 {% block javascripts %}
 <script>
-    const taskId = "{{ task_id }}";
+    const taskId = "{{ deploy.task_id }}";
 
     // Establishes the SSE connection with the correct endpoint
     const eventSource = new EventSource(`/stream/${taskId}`);
@@ -104,5 +167,28 @@ <h2>Deployment Output:</h2>
         }
     };
 </script>
+<script src="/static/assets/js/copy_clipboard.js"></script>
 
+<script>
+    document.getElementById('destroyLink').addEventListener('click', function(event) {
+        event.preventDefault();
+        document.getElementById('modalBackdrop').style.display = 'block';
+        document.getElementById('confirmModal').style.display = 'block';
+    });
+
+    document.getElementById('confirmDestroy').addEventListener('click', function() {
+        var enteredName = document.getElementById('deploymentNameInput').value;
+        if (enteredName === '{{ deploy.name }}') {
+            window.location.href = '{{ url_for('.destroy_deploy_console', deploy_id=deploy.id) }}';
+        } else {
+            document.getElementById('errorMessage').style.display = 'block';
+        }
+    });
+
+    document.getElementById('cancelDestroy').addEventListener('click', function() {
+        document.getElementById('modalBackdrop').style.display = 'none';
+        document.getElementById('confirmModal').style.display = 'none';
+        document.getElementById('errorMessage').style.display = 'none';
+    });
+</script>
 {% endblock javascripts %}

sld-dashboard/app/home/templates/deploys-list.html

@@ -268,7 +268,7 @@ <h2 class="h4">All Deploys</h2>
                                     <!-- Output-->
                                     <!-- SSE stream -->
                                     <span class="icon icon-sm">
-                                        <a title="Console Log Stream" class="dropdown-item" href="{{ url_for('.deploy_stream',task_id=deploy.task_id)}}">
+                                        <a title="Console Log Stream" class="dropdown-item" href="{{ url_for('.deploy_stream',deploy_id=deploy.id)}}">
                                             <span class="fab fa-searchengin mr-0"></span>
                                         </a>
                                     </span>