diff --git a/app.py b/app.py
index 31f54b8..9030d7d 100644
--- a/app.py
+++ b/app.py
@@ -219,7 +219,7 @@ def graph_user_workouts(user_id):
     if htmx:
         return f"""
         <img src="{request.full_path}"
-        loading="lazy" alt="No image" class="mx-auto">
+        loading="lazy" alt="No image" class="mx-auto" _="on click remove me">
         """
     user = User.query.get(user_id)
     workouts = user.workouts
@@ -236,6 +236,8 @@ def graph_user_workouts(user_id):
 
     attributes = request.args.getlist(
         'attributes', type=str)
+    if not attributes:
+        return ""
 
     period = request.args.get('period', default='day', type=str)
 
diff --git a/templates/partials/user_workouts_graphs.html b/templates/partials/user_workouts_graphs.html
index f0eabfd..5972f20 100644
--- a/templates/partials/user_workouts_graphs.html
+++ b/templates/partials/user_workouts_graphs.html
@@ -1,14 +1,11 @@
 <div class="flex flex-wrap mb-1">
-    <div class="w-full md:w-1/4 px-3 mb-6 md:mb-0">
+    <div class="w-full md:w-1/5 px-3 mb-6 md:mb-0">
         <div class="mb-1 w-full">
             <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-city">
                 Attributes
             </label>
             <select data-te-select-init data-te-select-size="lg" name="attributes"
-                class="bg-gray-50 border border-gray-300 " multiple
-                hx-get="{{ url_for('graph_user_workouts', user_id=user.id) }}"
-                hx-include="[name='start_date'],[name='end_date'],[name='period']"
-                hx-target="#user-workouts-overview-graphs-{{ user.id }}" hx-swap="innerHTML" _="init js(me)
+                class="bg-gray-50 border border-gray-300 " multiple _="init js(me)
                         te.Select.getOrCreateInstance(me).setValue({{ ['workout_count'] }})
                     end">
                 {% for val,name in user.attributes %}
@@ -17,7 +14,7 @@
             </select>
         </div>
     </div>
-    <div class="w-full md:w-1/4 px-3 mb-6 md:mb-0">
+    <div class="w-full md:w-1/5 px-3 mb-6 md:mb-0">
         <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-city">
             Start date
         </label>
@@ -32,13 +29,10 @@
             </div>
             <input type="date"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 w-full"
-                name="start_date" value="{{ user.first_workout_date }}"
-                hx-get="{{ url_for('graph_user_workouts', user_id=user.id) }}"
-                hx-include="[name='attributes'],[name='end_date'],[name='period']"
-                hx-target="#user-workouts-overview-graphs-{{ user.id }}" hx-swap="innerHTML" hx-trigger="change">
+                name="start_date" value="{{ user.first_workout_date }}">
         </div>
     </div>
-    <div class="w-full md:w-1/4 px-3 mb-6 md:mb-0">
+    <div class="w-full md:w-1/5 px-3 mb-6 md:mb-0">
         <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-zip">
             End date
         </label>
@@ -53,22 +47,16 @@
             </div>
             <input type="date"
                 class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 w-full"
-                name="end_date" value="{{ user.last_workout_date }}"
-                hx-get="{{ url_for('graph_user_workouts', user_id=user.id) }}"
-                hx-include="[name='start_date'],[name='attributes'],[name='period']"
-                hx-target="#user-workouts-overview-graphs-{{ user.id }}" hx-swap="innerHTML" hx-trigger="change">
+                name="end_date" value="{{ user.last_workout_date }}">
         </div>
     </div>
-    <div class="w-full md:w-1/4 px-3 mb-6 md:mb-0">
+    <div class="w-full md:w-1/5 px-3 mb-6 md:mb-0">
         <div class="mb-1 w-full">
             <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-city">
                 Period
             </label>
-            <select data-te-select-init data-te-select-size="lg" name="period"
-                class="bg-gray-50 border border-gray-300 "
-                hx-get="{{ url_for('graph_user_workouts', user_id=user.id) }}"
-                hx-include="[name='start_date'],[name='end_date'],[name='attributes']"
-                hx-target="#user-workouts-overview-graphs-{{ user.id }}" hx-swap="innerHTML" _="init js(me)
+            <select data-te-select-init data-te-select-size="lg" name="period" class="bg-gray-50 border border-gray-300"
+                _="init js(me)
                         te.Select.getOrCreateInstance(me).setValue({{ ['week'] }})
                     end">
 
@@ -78,11 +66,31 @@
             </select>
         </div>
     </div>
+
+    <div class="w-full md:w-1/5 px-3 mb-6 md:mb-0">
+        <div class="w-full h-full flex">
+            <button
+                class="shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded w-full ml-0 inline-flex items-center justify-center mt-0 md:mt-6 mb-0 md:mb-1"
+                type="submit" hx-get="{{ url_for('graph_user_workouts', user_id=user.id) }}"
+                hx-include="[name='attributes'],[name='start_date'],[name='end_date'],[name='period']"
+                hx-target="#user-workouts-overview-graphs-{{ user.id }}" hx-swap="afterbegin">
+
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
+                    stroke="currentColor" class="w-6 h-6 mr-2">
+                    <path stroke-linecap="round" stroke-linejoin="round"
+                        d="M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z" />
+                    <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+                </svg>
+
+                <span>Display</span>
+            </button>
+        </div>
+    </div>
 </div>
 
 <div id="user-workouts-overview-graphs-{{ user.id }}">
     <img src="{{ url_for('graph_user_workouts', user_id=user.id, period='week', attributes=['workout_count']) }}"
-        loading="lazy" alt="No image" class="mx-auto">
+        loading="lazy" alt="No image" class="mx-auto" _="on click remove me">
     <img src="{{ url_for('graph_user_workouts', user_id=user.id, period='month', attributes=['duration']) }}"
-        loading="lazy" alt="No image" class="mx-auto">
+        loading="lazy" alt="No image" class="mx-auto" _="on click remove me">
 </div>
\ No newline at end of file