wip-feat: mercure download progress

This commit is contained in:
2025-04-27 11:04:40 -05:00
parent c32ff2e464
commit 3384720c09
4 changed files with 38 additions and 31 deletions

View File

@@ -7,7 +7,7 @@ use Doctrine\ORM\Mapping as ORM;
use Symfony\UX\Turbo\Attribute\Broadcast; use Symfony\UX\Turbo\Attribute\Broadcast;
#[ORM\Entity(repositoryClass: DownloadRepository::class)] #[ORM\Entity(repositoryClass: DownloadRepository::class)]
#[Broadcast] #[Broadcast(template: 'broadcast/Download.stream.html.twig')]
class Download class Download
{ {
#[ORM\Id] #[ORM\Id]

View File

@@ -2,10 +2,16 @@
{% block create %} {% block create %}
<turbo-stream action="append" target="active_downloads"> <turbo-stream action="append" target="active_downloads">
<template> <template>
<twig:DownloadListRow <tr id="ad_download_{{ entity.id }}">
id="ad_download_{{ entity.id }}" <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-stone-800 min-w-[45ch] max-w-[45ch] truncate">
data="{{ entity.id }}"> {{ entity.title }}
</twig:DownloadListRow> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-end text-gray-800 dark:text-gray-50">
<span class="p-1.5 bg-purple-600 rounded-full">
<span class="w-4 inline-block text-center text-gray-50">{{ entity.progress }}</span>
</span>
</td>
</tr id="ad_download_{{ entity.id }}">
</template> </template>
</turbo-stream> </turbo-stream>
{% endblock %} {% endblock %}
@@ -14,12 +20,16 @@
{% if entity.status != "Complete" %} {% if entity.status != "Complete" %}
<turbo-stream action="update" target="ad_download_{{ id }}"> <turbo-stream action="update" target="ad_download_{{ id }}">
<template> <template>
<div class="title">{{ entity.title }}</div> <tr id="ad_download_{{ entity.id }}">
<div class="filename">{{ entity.filename }}</div> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-stone-800 min-w-[45ch] max-w-[45ch] truncate">
<div class="status"> {{ entity.title }}
<span class="pill {{ status_color_map[entity.status] }} status-badge">{{ entity.status }}</span> </td>
<span class="pill progress">{{ entity.progress }}%</span> <td class="px-6 py-4 whitespace-nowrap text-sm text-end text-gray-800 dark:text-gray-50">
</div> <span class="p-1.5 bg-purple-600 rounded-full">
<span class="w-4 inline-block text-center text-gray-50">{{ entity.progress }}</span>
</span>
</td>
</tr>
</template> </template>
</turbo-stream> </turbo-stream>
{% else %} {% else %}
@@ -28,28 +38,26 @@
<turbo-stream action="prepend" target="alert_list"> <turbo-stream action="prepend" target="alert_list">
<template> <template>
<li class="alert alert-success alert-dismissible" id="alert_{{ entity.id }}" data-controller="alert"> <twig:Alert title="Finished downloading" message="{{ entity.title }}" alert_id="{{ entity.id }}" data-controller="alert" />
<span class="alert-filename">{{ entity.filename }}</span> has finished downloading.
</li>
</template> </template>
</turbo-stream> </turbo-stream>
<turbo-stream action="prepend" target="complete_downloads_list"> {# <turbo-stream action="prepend" target="complete_downloads_list">#}
<template> {# <template>#}
<div class="result_group download-item" id="cd_download_{{ entity.id }}"> {# <div class="result_group download-item" id="cd_download_{{ entity.id }}">#}
<div class="title">{{ entity.title }}</div> {# <div class="title">{{ entity.title }}</div>#}
<div class="filename">{{ entity.filename }}</div> {# <div class="filename">{{ entity.filename }}</div>#}
<div class="status"> {# <div class="status">#}
<span class="pill {{ status_color_map[entity.status] }} status-badge">{{ entity.status }}</span> {# <span class="pill {{ status_color_map[entity.status] }} status-badge">{{ entity.status }}</span>#}
<span class="pill progress">{{ entity.progress }}%</span> {# <span class="pill progress">{{ entity.progress }}%</span>#}
</div> {# </div>#}
</div> {# </div>#}
</template> {# </template>#}
</turbo-stream> {# </turbo-stream>#}
{% endif %} {% endif %}
{% endblock %} {% endblock %}
{% block remove %} {% block remove %}
<turbo-stream action="remove" target="ad_download_{{ id }}"></turbo-stream> <turbo-stream action="remove" target="ad_download_{{ id }}"></turbo-stream>
<turbo-stream action="remove" target="cd_download_{{ id }}"></turbo-stream> {# <turbo-stream action="remove" target="cd_download_{{ id }}"></turbo-stream>#}
{% endblock %} {% endblock %}

View File

@@ -1,5 +1,5 @@
<div{{ attributes }} class="min-w-48" data-poll="getDownloads"> <div{{ attributes }} class="min-w-48">
<table class="divide-y divide-gray-200 dark:divide-gray-50 dark:bg-gray-50 table-fixed"> <table class="divide-y divide-gray-200 dark:divide-gray-50 dark:bg-gray-50 table-fixed" {{ turbo_stream_listen('App\\Download\\Framework\\Entity\\Download') }}>
<thead> <thead>
<tr class="dark:bg-gray-50"> <tr class="dark:bg-gray-50">
<th scope="col" <th scope="col"
@@ -15,7 +15,7 @@
<tbody class="divide-y divide-gray-200 dark:divide-gray-50"> <tbody class="divide-y divide-gray-200 dark:divide-gray-50">
{% if this.getDownloads()|length > 0 %} {% if this.getDownloads()|length > 0 %}
{% for download in this.getDownloads() %} {% for download in this.getDownloads() %}
<tr> <tr id="ad_download_{{ download.id }}">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-stone-800 min-w-[45ch] max-w-[45ch] truncate"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-stone-800 min-w-[45ch] max-w-[45ch] truncate">
{{ download.title }} {{ download.title }}
</td> </td>

View File

@@ -15,7 +15,6 @@
<div {{ turbo_stream_listen('alerts') }} class="absolute top-10 right-10 size-96"> <div {{ turbo_stream_listen('alerts') }} class="absolute top-10 right-10 size-96">
<div > <div >
<ul id="alert_list"> <ul id="alert_list">
<twig:Alert title="Added to queue" message="Severance has been added to the queue." alert_id="alert_id" data-controller="alert" />
</ul> </ul>
</div> </div>
</div> </div>