Add in version history for http functions
and also load .env in dev mode
This commit is contained in:
Peter Stockings
@@ -24,6 +24,9 @@
|
||||
|
||||
<script src="https://unpkg.com/mithril/mithril.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">
|
||||
|
||||
<style>
|
||||
@import url("https://rsms.me/inter/inter.css");
|
||||
|
||||
|
||||
@@ -4,7 +4,8 @@
|
||||
|
||||
{{ render_partial('dashboard/http_functions/header.html', title='Update', user_id=user_id, function_id=function_id,
|
||||
name=name,
|
||||
refresh_url=url_for('get_http_function_edit_form', function_id=function_id), show_logs=True, show_client=True) }}
|
||||
refresh_url=url_for('get_http_function_edit_form', function_id=function_id), show_logs=True, show_client=True,
|
||||
show_history=True) }}
|
||||
|
||||
{{ render_partial('function_editor.html', function_id=function_id, name=name, script=script,
|
||||
environment_info=environment_info,
|
||||
|
||||
@@ -54,6 +54,19 @@
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if show_history|default(false, true) %}
|
||||
<div class="ml-2 cursor-pointer text-gray-500"
|
||||
hx-get="{{ url_for('get_http_function_history', function_id=function_id) }}" hx-target="#container"
|
||||
hx-swap="innerHTML" hx-push-url="true">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 512 512" stroke-width="25"
|
||||
stroke="currentColor" data-slot="icon" class="w-6 h-6">
|
||||
<path
|
||||
d="M416,160a64,64,0,1,0-96.27,55.24c-2.29,29.08-20.08,37-75,48.42-17.76,3.68-35.93,7.45-52.71,13.93V151.39a64,64,0,1,0-64,0V360.61a64,64,0,1,0,64.42.24c2.39-18,16-24.33,65.26-34.52,27.43-5.67,55.78-11.54,79.78-26.95,29-18.58,44.53-46.78,46.36-83.89A64,64,0,0,0,416,160ZM160,64a32,32,0,1,1-32,32A32,32,0,0,1,160,64Zm0,384a32,32,0,1,1,32-32A32,32,0,0,1,160,448ZM352,192a32,32,0,1,1,32-32A32,32,0,0,1,352,192Z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
<button
|
||||
class="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded flex mr-2 items-center ml-auto"
|
||||
|
||||
170
templates/dashboard/http_functions/history.html
Normal file
170
templates/dashboard/http_functions/history.html
Normal file
@@ -0,0 +1,170 @@
|
||||
{% extends 'dashboard.html' %}
|
||||
|
||||
{% block page %}
|
||||
|
||||
{{ render_partial('dashboard/http_functions/header.html', title='History', user_id=user_id, function_id=function_id,
|
||||
name=name,
|
||||
refresh_url=url_for('get_http_function_history', function_id=function_id), show_logs=True, show_client=True,
|
||||
show_edit_form=True) }}
|
||||
|
||||
<!-- Timeline -->
|
||||
<div>
|
||||
{% if http_function.version_number > 1 %}
|
||||
{% for entry in http_function_history %}
|
||||
<!-- Item -->
|
||||
<div class="flex gap-x-3">
|
||||
<!-- Left Content -->
|
||||
<div class="w-24 text-end">
|
||||
<span class="text-xs text-gray-500">{{ entry.updated_at.strftime('%b %d %Y %I:%M %p').lstrip("0").replace("
|
||||
0", " ") }}
|
||||
</span>
|
||||
</div>
|
||||
<!-- End Left Content -->
|
||||
|
||||
<!-- Icon -->
|
||||
<div
|
||||
class="relative last:after:hidden after:absolute after:top-7 after:bottom-0 after:start-3.5 after:w-px after:-translate-x-[0.5px] after:bg-gray-200">
|
||||
<div class="relative z-10 size-7 flex justify-center items-center">
|
||||
<div class="size-2 rounded-full bg-gray-400"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Icon -->
|
||||
|
||||
<!-- Right Content -->
|
||||
<div class="grow pt-0.5 pb-4 cursor-pointer">
|
||||
<h3 class="flex gap-x-1.5 font-semibold text-gray-800">
|
||||
v{{ entry.version_number }}
|
||||
</h3>
|
||||
<p class="mt-1 text-sm text-gray-600">
|
||||
</p>
|
||||
|
||||
<button type="button"
|
||||
class="mt-1 -ms-1 p-1 inline-flex items-center gap-x-2 text-xs rounded-lg border border-transparent text-gray-500 hover:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none">
|
||||
Revert
|
||||
</button>
|
||||
|
||||
</div>
|
||||
<!-- End Right Content -->
|
||||
</div>
|
||||
<div class="block">
|
||||
<div id="diff_{{ entry.version_id }}" class="relative h-80"></div>
|
||||
</div>
|
||||
<script>
|
||||
(function () {
|
||||
// Assigning JSON content to a JavaScript variable
|
||||
var preContent = '{{ entry.pre | tojson | safe }}';
|
||||
var postContent = '{{ entry.post | tojson | safe }}';
|
||||
|
||||
var aceDiffer = new AceDiff({
|
||||
element: '#diff_{{ entry.version_id }}',
|
||||
mode: "ace/mode/javascript",
|
||||
left: {
|
||||
content: preContent,
|
||||
editable: false,
|
||||
},
|
||||
right: {
|
||||
content: postContent,
|
||||
editable: false,
|
||||
},
|
||||
});
|
||||
|
||||
// Retrieve the individual editors
|
||||
var editors = aceDiffer.getEditors();
|
||||
|
||||
// Set the maxLines property on each editor
|
||||
editors.left.setOptions({
|
||||
maxLines: 20, // Set the maximum number of lines
|
||||
autoScrollEditorIntoView: true,
|
||||
});
|
||||
editors.left.session.setOption("useWorker", false);
|
||||
|
||||
editors.right.setOptions({
|
||||
maxLines: 20, // Set the maximum number of lines
|
||||
autoScrollEditorIntoView: true,
|
||||
});
|
||||
editors.right.session.setOption("useWorker", false);
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
<!-- End Item -->
|
||||
{% endfor %}
|
||||
<!-- Item -->
|
||||
<div class="flex gap-x-3">
|
||||
<!-- Left Content -->
|
||||
<div class="w-24 text-end">
|
||||
<span class="text-xs text-gray-500">{{ http_function.created_at.strftime('%b %d %Y %I:%M
|
||||
%p').lstrip("0").replace("
|
||||
0", " ") }}
|
||||
</span>
|
||||
</div>
|
||||
<!-- End Left Content -->
|
||||
|
||||
<!-- Icon -->
|
||||
<div
|
||||
class="relative last:after:hidden after:absolute after:top-7 after:bottom-0 after:start-3.5 after:w-px after:-translate-x-[0.5px] after:bg-gray-200">
|
||||
<div class="relative z-10 size-7 flex justify-center items-center">
|
||||
<div class="size-2 rounded-full bg-gray-400"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Icon -->
|
||||
|
||||
<!-- Right Content -->
|
||||
<div class="grow pt-0.5 pb-4 cursor-pointer">
|
||||
<h3 class="flex gap-x-1.5 font-semibold text-gray-800">
|
||||
v1
|
||||
</h3>
|
||||
<p class="mt-1 text-sm text-gray-600">
|
||||
</p>
|
||||
<button type="button"
|
||||
class="mt-1 -ms-1 p-1 inline-flex items-center gap-x-2 text-xs rounded-lg border border-transparent text-gray-500 hover:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none">
|
||||
Revert
|
||||
</button>
|
||||
</div>
|
||||
<!-- End Right Content -->
|
||||
</div>
|
||||
<!-- End Item -->
|
||||
{% else %}
|
||||
|
||||
<!-- Item -->
|
||||
<div class="flex gap-x-3">
|
||||
<!-- Left Content -->
|
||||
<div class="w-24 text-end">
|
||||
<span class="text-xs text-gray-500">{{ http_function.created_at.strftime('%b %d %Y %I:%M
|
||||
%p').lstrip("0").replace("
|
||||
0", " ") }}
|
||||
</span>
|
||||
</div>
|
||||
<!-- End Left Content -->
|
||||
|
||||
<!-- Icon -->
|
||||
<div
|
||||
class="relative last:after:hidden after:absolute after:top-7 after:bottom-0 after:start-3.5 after:w-px after:-translate-x-[0.5px] after:bg-gray-200">
|
||||
<div class="relative z-10 size-7 flex justify-center items-center">
|
||||
<div class="size-2 rounded-full bg-gray-400"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Icon -->
|
||||
|
||||
<!-- Right Content -->
|
||||
<div class="grow pt-0.5 pb-4 cursor-pointer">
|
||||
<h3 class="flex gap-x-1.5 font-semibold text-gray-800">
|
||||
v1
|
||||
</h3>
|
||||
<p class="mt-1 text-sm text-gray-600">
|
||||
</p>
|
||||
<button type="button"
|
||||
class="mt-1 -ms-1 p-1 inline-flex items-center gap-x-2 text-xs rounded-lg border border-transparent text-gray-500 hover:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none">
|
||||
Revert
|
||||
</button>
|
||||
</div>
|
||||
<!-- End Right Content -->
|
||||
</div>
|
||||
<!-- End Item -->
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
<!-- End Timeline -->
|
||||
|
||||
|
||||
{% endblock %}
|
||||
@@ -4,7 +4,8 @@
|
||||
|
||||
{{ render_partial('dashboard/http_functions/header.html', title='Logs', user_id=user_id, function_id=function_id,
|
||||
name=name,
|
||||
refresh_url=url_for('get_http_function_logs', function_id=function_id), show_edit_form=True, show_client=True) }}
|
||||
refresh_url=url_for('get_http_function_logs', function_id=function_id), show_edit_form=True, show_client=True,
|
||||
show_history=True) }}
|
||||
|
||||
<div class="block md:grid md:grid-cols-4 md:gap-4 p-4">
|
||||
<!-- Headers -->
|
||||
|
||||
Reference in New Issue
Block a user