CSS changes

src/registrar/assets/sass/_theme/_tables.scss

@@ -27,7 +27,7 @@
   }
 
   th.action-col-custom-width {
-    width: 27% !important;
+    width: 23.25% !important;
   }
 
   // Fix margins in mobile view

src/registrar/assets/sass/_theme/_usa-modal.scss

@@ -0,0 +1,12 @@
+@use "uswds-core" as *;
+
+.usa-modal.wider-modal {
+    width: 40% !important;
+    max-width: 40% !important;
+}
+
+.usa-modal {
+    .usa-modal__heading.blue-header{
+        color: $dhs-blue;
+    }
+}

src/registrar/assets/sass/_theme/styles.scss

@@ -17,6 +17,7 @@
 @forward "tables";
 @forward "sidenav";
 @forward "register-form";
+@forward "usa-modal";
 
 /*--------------------------------------------------
 --- Admin ---------------------------------*/

src/registrar/templates/home.html

@@ -48,6 +48,9 @@
           >
             <span class="usa-sr-only">Action</span>
           </th>
+          {% if has_deletable_applications %}
+          <th></th>
+          {% endif %}
         </tr>
       </thead>
       <tbody>
@@ -86,6 +89,9 @@
               {% endif %}
             </a>
           </td>
+          {% if has_deletable_applications %}
+          <td></td>
+          {% endif %}
         </tr>
         {% endfor %}
       </tbody>
@@ -119,7 +125,13 @@
         {% for application in domain_applications %}
         <tr>
           <th th scope="row" role="rowheader" data-label="Domain name">
-            {{ application.requested_domain.name|default:"New domain request" }}
+            {% if application.requested_domain and application.requested_domain.name %}
+              {{ application.requested_domain.name }}
+            {% elif forloop.counter != 1 %}
+              New domain request {{ forloop.counter }}
+            {% else %}
+              New domain request
+            {% endif %}
           </th>
           <td data-sort-value="{{ application.submission_date|date:"U" }}" data-label="Date submitted">
             {% if application.submission_date %}
@@ -135,7 +147,7 @@
               <svg class="usa-icon" aria-hidden="true" focusable="false" role="img" width="24">
                 <use xlink:href="{%static 'img/sprite.svg'%}#edit"></use>
               </svg>
-              Edit <span class="usa-sr-only">{{ application.requested_domain.name|default:"New domain request" }} </span>
+              Edit <span class="usa-sr-only">{{ application.requested_domain.name|default:"New domain request"|add:forloop.counter|add:"" }} </span>
 
             {% else %}
               <a href="{% url 'application-status' application.pk %}">
@@ -163,16 +175,18 @@
               </a>
 
               <div
-                class="usa-modal"
+                class="usa-modal wider-modal"
                 id="toggle-delete-domain-alert-{{ forloop.counter }}"
                 aria-labelledby="Are you sure you want to continue?"
                 aria-describedby="User will be removed"
                 data-force-action
               >
                 <form method="POST" action="{% url "application-delete" pk=application.id %}">
-                  {% with heading="Are you sure you want to delete "|add:application.requested_domain.name|add:"?" %}
-                    {% include 'includes/modal.html' with modal_heading=heading  modal_description="This will remove the domain request from the .gov registrar. This action cannot be undone." modal_button=modal_button|safe %}
-                  {% endwith %}
+                  {% if application.requested_domain %}
+                    {% include 'includes/modal.html' with modal_heading="Are you sure you want to delete "|add:application.requested_domain.name|add:"?"  modal_description="This will remove the domain request from the .gov registrar. This action cannot be undone." modal_button=modal_button|safe %}
+                  {% else %}
+                    {% include 'includes/modal.html' with modal_heading="Are you sure you want to delete your domain request?" modal_description="This will remove the domain request from the .gov registrar. This action cannot be undone." modal_button=modal_button|safe %}
+                  {% endif %}
                 </form>
               </div>
             {% endif %}

src/registrar/templates/includes/modal.html

@@ -2,7 +2,7 @@
 
 <div class="usa-modal__content">
     <div class="usa-modal__main">
-        <h2 class="usa-modal__heading" id="modal-1-heading">
+        <h2 class="usa-modal__heading blue-header" id="modal-1-heading">
             {{ modal_heading }}
         </h2>
         <div class="usa-prose">

src/registrar/views/index.py

@@ -21,7 +21,7 @@ def index(request):
 
         # Determine if the user will see applications that they can delete
         valid_statuses = [DomainApplication.ApplicationStatus.STARTED, DomainApplication.ApplicationStatus.WITHDRAWN]
-        has_deletable_applications = applications.filter(status__in=valid_statuses)
+        has_deletable_applications = applications.filter(status__in=valid_statuses).exists()
         context["has_deletable_applications"] = has_deletable_applications
 
         if has_deletable_applications:
@@ -32,4 +32,5 @@ def index(request):
             )
 
             context["modal_button"] = modal_button
+
     return render(request, "home.html", context)