feat: formata o nome de download de midias com o padrao tipo_data_hora

public/app.js

@@ -11,6 +11,18 @@ function escapeHtml(text) {
     .replace(/'/g, "'");
 }
 
+// Função auxiliar para gerar nome de arquivo de download formatado como <nome_data_hora>.<extensao>
+function getDownloadFileName(type, ext) {
+  const now = new Date();
+  const year = now.getFullYear();
+  const month = String(now.getMonth() + 1).padStart(2, '0');
+  const day = String(now.getDate()).padStart(2, '0');
+  const hours = String(now.getHours()).padStart(2, '0');
+  const minutes = String(now.getMinutes()).padStart(2, '0');
+  const seconds = String(now.getSeconds()).padStart(2, '0');
+  return `${type}_${year}-${month}-${day}_${hours}-${minutes}-${seconds}.${ext}`;
+}
+
 renderer.code = function(code, language) {
   // Ajuste para lidar com as diferenças na assinatura do marked.js
   const codeContent = typeof code === 'object' ? code.text : code;
@@ -922,7 +934,7 @@ const initApp = () => {
               </div>
               <p class="media-caption">✨ "${escapeHtml(media.originalPrompt)}"</p>
               <div class="media-actions-row">
-                <a href="${media.url}" download="kemily_ilustracao.png" target="_blank" class="media-download-btn">
+                <a href="${media.url}" download="${getDownloadFileName('imagem', 'png')}" target="_blank" class="media-download-btn">
                   <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
                   </svg>
@@ -954,7 +966,7 @@ const initApp = () => {
               </div>
               <p class="media-caption">🎵 "${escapeHtml(media.originalPrompt)}"</p>
               <div class="media-actions-row">
-                <a href="${media.url}" download="kemily_musica.mp3" target="_blank" class="media-download-btn">
+                <a href="${media.url}" download="${getDownloadFileName('musica', 'mp3')}" target="_blank" class="media-download-btn">
                   <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
                   </svg>
@@ -971,7 +983,7 @@ const initApp = () => {
               </div>
               <p class="media-caption">🎥 "${escapeHtml(media.originalPrompt)}"</p>
               <div class="media-actions-row">
-                <a href="${media.url}" download="kemily_video.mp4" target="_blank" class="media-download-btn">
+                <a href="${media.url}" download="${getDownloadFileName('video', 'mp4')}" target="_blank" class="media-download-btn">
                   <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
                   </svg>
@@ -1353,7 +1365,7 @@ const initApp = () => {
                     </div>
                     <p class="media-caption">✨ "${escapeHtml(parsed.originalPrompt)}"</p>
                     <div class="media-actions-row">
-                      <a href="${parsed.url}" download="kemily_ilustracao.png" target="_blank" class="media-download-btn">
+                      <a href="${parsed.url}" download="${getDownloadFileName('imagem', 'png')}" target="_blank" class="media-download-btn">
                         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
                           <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
                         </svg>
@@ -1389,7 +1401,7 @@ const initApp = () => {
                     </div>
                     <p class="media-caption">🎵 "${escapeHtml(parsed.originalPrompt)}"</p>
                     <div class="media-actions-row">
-                      <a href="${parsed.url}" download="kemily_musica.mp3" target="_blank" class="media-download-btn">
+                      <a href="${parsed.url}" download="${getDownloadFileName('musica', 'mp3')}" target="_blank" class="media-download-btn">
                         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
                           <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
                         </svg>
@@ -1410,7 +1422,7 @@ const initApp = () => {
                     </div>
                     <p class="media-caption">🎥 "${escapeHtml(parsed.originalPrompt)}"</p>
                     <div class="media-actions-row">
-                      <a href="${parsed.url}" download="kemily_video.mp4" target="_blank" class="media-download-btn">
+                      <a href="${parsed.url}" download="${getDownloadFileName('video', 'mp4')}" target="_blank" class="media-download-btn">
                         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor">
                           <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
                         </svg>