ux improvements

README.md

@@ -8,9 +8,6 @@
 * Make it show which git SHA is currently deployed on the homepage
     * Or if there is currently a deploy happening
 * I want a way to “stop” the processes, can maybe do this with a replicas=0 setting
-* All the times need to show relative times, not absolute. It’s too hard to understand absolute times.
-* Whenever something is pushed, and deployed, we need to kill all one off containers because they are no longer running the correct source code
-* “Pending” should have some kind of active spinner animation just for the feels
 * Rebulid metrics tabs so it works for both clusters & pods
 https://overcast.blog/zero-downtime-deployments-with-kubernetes-a-full-guide-71019397b924?gi=95ab85c45634
 * Team mates features

app/javascript/controllers/new_add_ons_controller.js

@@ -14,6 +14,6 @@ export default class extends Controller {
     event.currentTarget.classList.add('ring', 'ring-primary')
     // Show Input
     this.element.querySelectorAll('.card-form').forEach(form => form.classList.add('hidden'))
-    this.element.querySelector(`#card-${event.currentTarget.dataset.cardName}`)?.classList.remove("hidden");
+    this.element.querySelectorAll(`.card-${event.currentTarget.dataset.cardName}`).forEach(form => form.classList.remove("hidden"));
   }
 }

app/jobs/projects/deployment_job.rb

@@ -63,11 +63,17 @@ class Projects::DeploymentJob < ApplicationJob
     elsif service.web_service?
       apply_deployment(service, kubectl)
       apply_service(service, kubectl)
-      if service.domains.any?
+      if service.domains.any? && service.allow_public_networking?
         apply_ingress(service, kubectl)
       end
       restart_deployment(service, kubectl)
     end
+    # Kill all one off containers
+    kill_one_off_containers(service, kubectl)
+  end
+
+  def kill_one_off_containers(service, kubectl)
+    kubectl.call("-n #{service.project.name} delete pods -l oneoff=true")
   end
 
   def apply_namespace(project, kubectl)

app/models/project.rb

@@ -48,6 +48,10 @@ class Project < ApplicationRecord
     deployments.order(created_at: :desc).where(status: :completed).first
   end
 
+  def last_build
+    builds.order(created_at: :desc).first
+  end
+
   def last_deployment
     deployments.order(created_at: :desc).first
   end

app/views/projects/_index.html.erb

@@ -31,7 +31,9 @@
           <td>
             <% if project.last_deployment_at %>
               <div>
-                <div class="text-sm"><%= "#{distance_of_time_in_words(project.last_deployment_at, Time.current)} ago" %></div>
+                <div role="tooltip" data-tip="<%= project.last_deployment_at.strftime("%B %d, %Y %I:%M %p") %>" class="tooltip">
+                  <div class="text-sm"><%= "#{distance_of_time_in_words(project.last_deployment_at, Time.current)} ago" %></div>
+                </div>
                 <div class="text-xs italic"><%= project.last_deployment.build.commit_message %></div>
               </div>
             <% else %>

app/views/projects/_status.html.erb

@@ -1,4 +1,8 @@
-<% if project.last_deployment&.in_progress? %>
+<% if project.last_build&.in_progress? %>
+  <div aria-label="Badge" class="badge border-0 bg-warning/10 font-medium capitalize text-warning">
+    Building <iconify-icon class="ml-1 animate-spin" icon="lucide:loader-circle"></iconify-icon>
+  </div>
+<% elsif project.last_deployment&.in_progress? %>
   <div aria-label="Badge" class="badge border-0 bg-warning/10 font-medium capitalize text-warning">
     Deploying <iconify-icon class="ml-1 animate-spin" icon="lucide:loader-circle"></iconify-icon>
   </div>

app/views/projects/deployments/index.html.erb

@@ -61,7 +61,9 @@
             </div>
           </td>
           <td>
-            <div class="text-sm capitalize"><%= build.created_at.strftime("%B %d, %Y %H:%M") %></div>
+            <div role="tooltip" data-tip="<%= build.created_at.strftime("%B %d, %Y %H:%M %p") %>" class="tooltip">
+              <div class="text-sm capitalize"><%= distance_of_time_in_words(build.created_at, Time.current) %> ago</div>
+            </div>
           </td>
           <td>
             <div class="text-sm capitalize">

app/views/projects/services/_show.html.erb

@@ -30,14 +30,24 @@
         <label class="label mt-1">
           <span class="label-text cursor-pointer">Allow public networking</span>
           <%= form.check_box :allow_public_networking, class: "checkbox" %>
+          <span class="label-text-alt">Checking this allows your service to be accessible from the public internet</span>
         </label>
       </div>
     <% end %>
+    <% if service.web_service? || service.background_service? %>
+    <div>
+      <h2 class="text-lg my-2 mt-4">Resources</h2>
+      <div class="form-control form-group">
+        <%= form.label :replicas %>
+        <%= form.number_field :replicas, class: "input input-bordered", placeholder: "1" %>
+      </div>
+    </div>
+    <% end %>
     <div class="form-footer">
       <%= form.submit class: "btn btn-primary" %>
     </div>
   <% end %>
-  <% if service.web_service? %>
+  <% if service.web_service? && service.allow_public_networking? %>
     <div class="my-8">
       <h2 class="text-lg my-2">Networking</h2>
 

app/views/projects/services/new.html.erb

@@ -74,7 +74,7 @@
           </label>
         </div>
 
-        <div id="card-web_service" class="card-form hidden">
+        <div class="card-form hidden card-web_service">
           <h3 class="text-lg font-bold">Networking</h3>
           <div class="form-group">
             <%= form.label :container_port %>
@@ -88,11 +88,24 @@
             <label class="label">
               <span class="label-text cursor-pointer">Allow public networking</span>
               <%= form.check_box :allow_public_networking, class: "toggle toggle-primary" %>
+              <span class="label-text-alt">Checking this allows your service to be accessible from the public internet</span>
             </label>
           </div>
+          <div class="form-group">
+            <%= form.label :replicas %>
+            <%= form.number_field :replicas, class: "input input-bordered", placeholder: "1" %>
+          </div>
         </div>
 
-        <div id="card-cron_job" class="card-form hidden">
+        <div class="card-form hidden card-web_service card-background_service">
+          <h3 class="text-lg font-bold">Resources</h3>
+          <div class="form-group">
+            <%= form.label :replicas %>
+            <%= form.number_field :replicas, class: "input input-bordered", placeholder: "1" %>
+          </div>
+        </div>
+
+        <div class="card-form hidden card-cron_job">
           <div class="form-group">
             <h3 class="text-lg font-bold">Cron job</h3>
             <%= form.fields_for :cron_schedule do |cron_schedule_form| %>

resources/k8/stateless/deployment.yaml

@@ -6,7 +6,12 @@ metadata:
   labels:
     app: <%= service.name %>
 spec:
-  replicas: 1
+  replicas: <%= service.replicas %>
+  strategy:
+    type: RollingUpdate
+    rollingUpdate:
+      maxUnavailable: 1
+      maxSurge: 1
   selector:
     matchLabels:
       app: <%= service.name %>
@@ -24,5 +29,19 @@ spec:
             name: <%= project.name %>
         ports:
         - containerPort: <%= service.container_port %>
+        <% if service.healthcheck_url.present? %>
+        livenessProbe:
+          httpGet:
+            path: <%= service.healthcheck_url %>
+            port: <%= service.container_port %>
+          initialDelaySeconds: 30
+          periodSeconds: 10
+        readinessProbe:
+          httpGet:
+            path: <%= service.healthcheck_url %>
+            port: <%= service.container_port %>
+          initialDelaySeconds: 30
+          periodSeconds: 10
+        <% end %>
       imagePullSecrets:
       - name: dockerconfigjson-github-com