Fix regression where selecting an exercise didnt populate reps/weight inputs with last set and resize progress graph on desktop

app.py

@@ -399,8 +399,8 @@ def get_most_recent_topset_for_exercise(person_id, workout_id):
     if not topset:
         return render_template('partials/new_set_form.html', person_id=person_id, workout_id=workout_id, exercises=exercises, exercise_id=exercise_id, has_value=False)
 
-    (repetitions, weight) = topset
+    (repetitions, weight, exercise_name) = topset
-    return render_template('partials/new_set_form.html', person_id=person_id, workout_id=workout_id, exercises=exercises, has_value=True, exercise_id=exercise_id, repetitions=repetitions, weight=weight)
+    return render_template('partials/new_set_form.html', person_id=person_id, workout_id=workout_id, has_value=True, exercise_id=exercise_id, exercise_name=exercise_name, repetitions=repetitions, weight=weight)
 
 
 def calculate_relative_positions(start_dates):

db.py

@@ -448,9 +448,11 @@ class DataBase():
         topset = self.execute("""
             SELECT 
                 t.repetitions, 
-                t.weight
+                t.weight,
+                e.name as "exercise_name"
             FROM 
                 topset t JOIN workout w ON t.workout_id = w.workout_id
+                JOIN exercise e ON t.exercise_id = e.exercise_id
             WHERE 
                 w.person_id = %s AND t.exercise_id = %s
             ORDER BY 
@@ -461,7 +463,7 @@ class DataBase():
         if not topset:
             return None
         else:
-            return (topset['repetitions'], topset['weight'])
+            return (topset['repetitions'], topset['weight'], topset['exercise_name'])
 
     def get_all_exercises(self):
         exercises = self.execute(

templates/partials/exercise/exercise_list_item.html

@@ -1,8 +1,7 @@
-<li class="py-2 px-4 hover:bg-gray-100 cursor-pointer flex items-center justify-between"
+<li class="py-2 px-4 hover:bg-gray-100 cursor-pointer flex items-center justify-between" _="on click set the innerHTML of #exercise-results to ''
-    _="on click set the innerHTML of #exercise-results to ''
     then set the value of #exercise-search to '{{ exercise.name }}'
     then set the value of #selected-exercise to '{{ exercise.exercise_id }}'
-    on click call htmx.ajax('GET', '{{ url_for('get_exercise_progress_for_user', person_id=person_id, exercise_id=exercise.exercise_id) }}', {target:'#exercise-progress', swap:'innerHTML'})">
+    on click call htmx.trigger(document.body, 'exerciseSelected')">
     <!-- Exercise Name -->
     <span>{{ exercise.name }}</span>
     <!-- Edit Icon -->

templates/partials/exercise/exercise_select.html

@@ -3,13 +3,15 @@
         class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
         id="exercise-search" type="text" name="query" placeholder="Search exercises..."
         hx-get="{{ url_for('get_exercises', person_id=person_id) }}" hx-target="#exercise-results"
-        hx-trigger="keyup changed delay:500ms" hx-swap="innerHTML" autocomplete="off">
+        hx-trigger="keyup changed delay:500ms" hx-swap="innerHTML" autocomplete="off" {% if has_value==True %}
+        value="{{ exercise_name }}" {% endif %}>
 
     <!-- Dropdown Menu -->
     <div id="exercise-results" class="absolute w-full bg-white  mt-1 rounded shadow-md z-10">
         <!-- Results will be injected here -->
     </div>
 
-    <input type="hidden" name="exercise_id" id="selected-exercise">
+    <input type="hidden" name="exercise_id" id="selected-exercise" {% if has_value==True %} value="{{ exercise_id }}" {%
+        endif %}>
 
 </div>

templates/partials/new_set_form.html

@@ -7,12 +7,13 @@
                     then reset() me
                     then trigger clearNewSetInputs">
 
-    <div class="flex flex-wrap -mx-3 mb-2" id="new-set-workout-{{ workout_id }}">
+    <div class="flex flex-wrap -mx-3 mb-2">
         <div class="w-full md:w-[30%] px-2 md:px-3 mb-6 md:mb-0">
             <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-state">
                 Exercise
             </label>
-            {{ render_partial('partials/exercise/exercise_select.html', person_id=person_id) }}
+            {{ render_partial('partials/exercise/exercise_select.html', person_id=person_id, has_value=has_value,
+            exercise_id=exercise_id, exercise_name=exercise_name) }}
         </div>
 
         <div class="w-full md:w-[30%] px-2 md:px-3 mb-6 md:mb-0">
@@ -50,9 +51,18 @@
 
 </form>
 
+<div hx-trigger="exerciseSelected from:body"
+    hx-get="{{ url_for('get_most_recent_topset_for_exercise', person_id=person_id, workout_id=workout_id) }}"
+    hx-target="#new-set-workout-{{ workout_id }}" hx-include="[name='exercise_id']">
+</div>
+
 {% if has_value==True %}
-<div class="hidden"
+<div class="flex items-center justify-center">
-    hx-get="{{ url_for('get_exercise_progress_for_user', person_id=person_id, exercise_id=exercise_id) }}"
+    <div class="md:w-full max-w-screen-sm">
-    hx-trigger="load" hx-target="#exercise-progress-{{ person_id }}" hx-swap="innerHTML">
+        <div class="hidden"
+            hx-get="{{ url_for('get_exercise_progress_for_user', person_id=person_id, exercise_id=exercise_id) }}"
+            hx-trigger="load" hx-target="this" hx-swap="outerHTML">
+        </div>
+    </div>
 </div>
 {% endif %}