Add version history view for timer functions

- Implement `/history/<function_id>` route in timer routes to fetch and display function versions
- Create new Mithril `DiffView` component for comparing script versions
- Add new history template for timer functions with version comparison
- Include version diff functionality using AceDiff library
- Update header and edit templates to include history URL for timer functions

templates/base.html

@@ -26,7 +26,7 @@
     <script src="/static/js/mithril/editor.js"></script>
     <script src="/static/js/mithril/responseView.js"></script>
     <script src="/static/js/mithril/alert.js"></script>
-
+    <script src="/static/js/mithril/diffView.js"></script>
 
     <script src="https://unpkg.com/ace-diff@^2"></script>
     <link href="https://unpkg.com/ace-diff@^2/dist/ace-diff.min.css" rel="stylesheet">

templates/dashboard/http_functions/client.html

@@ -9,8 +9,9 @@ show_logs=True,
 show_client=True,
 show_history=True,
 edit_url=url_for('http_function_editor', function_id=function_id),
-cancel_url=url_for('dashboard_http_functions',
-logs_url=url_for('get_http_function_logs', function_id=function_id))) }}
+cancel_url=url_for('dashboard_http_functions'),
+logs_url=url_for('get_http_function_logs', function_id=function_id),
+history_url=url_for('get_http_function_history', function_id=function_id)) }}
 
 <div class="mx-auto w-full pt-4" id="client-u{{ user_id }}-f{{ function_id }}">
 </div>

templates/dashboard/http_functions/editor.html

@@ -10,7 +10,8 @@ show_client=True,
 show_history=True,
 edit_url=edit_url,
 cancel_url=cancel_url,
-logs_url=url_for('get_http_function_logs', function_id=function_id)) }}
+logs_url=url_for('get_http_function_logs', function_id=function_id),
+history_url=url_for('get_http_function_history', function_id=function_id)) }}
 
 
 <div id="app" class="p-1">

templates/dashboard/http_functions/header.html

@@ -59,8 +59,7 @@
             {% if show_history|default(false, true) %}
             <button
                 class="group flex flex-col items-center {% if active_tab == 'history' %}text-blue-600{% else %}text-gray-500 hover:text-blue-600{% endif %}"
-                hx-get="{{ url_for('get_http_function_history', function_id=function_id) }}" hx-target="#container"
-                hx-swap="innerHTML" hx-push-url="true">
+                hx-get="{{ history_url }}" hx-target="#container" hx-swap="innerHTML" hx-push-url="true">
                 <div
                     class="p-2 rounded-lg {% if active_tab == 'history' %}bg-blue-50{% else %}group-hover:bg-blue-50{% endif %}">
                     <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 512 512"

templates/dashboard/http_functions/history.html

@@ -10,7 +10,8 @@ show_client=True,
 show_history=True,
 edit_url=url_for('http_function_editor', function_id=function_id),
 cancel_url=url_for('dashboard_http_functions'),
-logs_url=url_for('get_http_function_logs', function_id=function_id)) }}
+logs_url=url_for('get_http_function_logs', function_id=function_id),
+history_url=url_for('get_http_function_history', function_id=function_id)) }}
 
 <!-- Timeline -->
 <div>

templates/dashboard/http_functions/logs.html

@@ -9,8 +9,9 @@ show_logs=True,
 show_client=True,
 show_history=True,
 edit_url=url_for('http_function_editor', function_id=function_id),
-cancel_url=url_for('dashboard_http_functions',
-logs_url=url_for('get_http_function_logs', function_id=function_id))) }}
+cancel_url=url_for('dashboard_http_functions'),
+logs_url=url_for('get_http_function_logs', function_id=function_id),
+history_url=url_for('get_http_function_history', function_id=function_id)) }}
 
 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">

templates/dashboard/timer_functions/edit.html

@@ -11,7 +11,8 @@ show_client=False,
 show_history=True,
 edit_url=url_for('timer.edit', function_id=function_id),
 cancel_url=url_for('timer.overview'),
-logs_url=url_for('timer.logs', function_id=function_id)) }}
+logs_url=url_for('timer.logs', function_id=function_id),
+history_url=url_for('timer.history', function_id=function_id)) }}
 
 
 <div id="app" class="p-1">

templates/dashboard/timer_functions/history.html

@@ -0,0 +1,26 @@
+{% extends 'dashboard.html' %}
+
+{% block page %}
+
+{{ render_partial('dashboard/http_functions/header.html',
+user_id=user_id,
+function_id=function_id,
+active_tab='history',
+show_edit_form=True,
+show_logs=True,
+show_history=True,
+edit_url=url_for('timer.edit', function_id=function_id),
+cancel_url=url_for('timer.overview'),
+logs_url=url_for('timer.logs', function_id=function_id),
+history_url=url_for('timer.history', function_id=function_id))
+}}
+
+<div id="version-diff"></div>
+
+<script>
+    // Mount the Mithril component with versions as an attribute
+    m.mount(document.getElementById("version-diff"), {
+        view: () => m(DiffView, { versions: {{ versions| tojson }} })
+    });
+</script>
+{% endblock %}

templates/dashboard/timer_functions/logs.html

@@ -9,7 +9,8 @@ show_logs=True,
 show_history=True,
 edit_url=url_for('timer.edit', function_id=function_id),
 cancel_url=url_for('timer.overview'),
-logs_url=url_for('timer.logs', function_id=function_id)) }}
+logs_url=url_for('timer.logs', function_id=function_id),
+history_url=url_for('timer.history', function_id=function_id)) }}
 
 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">