From a8a434e99dc5d5ac66acdc8e2d2afb9c973e650f Mon Sep 17 00:00:00 2001
From: Maciej Pienczyn <maciej.pienczyn@inpi.pl>
Date: Fri, 20 Feb 2026 09:18:54 +0100
Subject: [PATCH] feat: auto-load charts from DB cache on page load, show cache
 date

Charts now render automatically on page load via AJAX from DB cache
(no click needed). Info bar above charts shows post count, cache date,
and hint to refresh. GET cache endpoint now returns cached_at date.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 blueprints/admin/routes_social_publisher.py |  3 +-
 templates/admin/social_publisher.html       | 36 +++++++++++++--------
 2 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/blueprints/admin/routes_social_publisher.py b/blueprints/admin/routes_social_publisher.py
index 38039c2..8184189 100644
--- a/blueprints/admin/routes_social_publisher.py
+++ b/blueprints/admin/routes_social_publisher.py
@@ -423,7 +423,8 @@ def social_publisher_get_posts_cache(company_id):
 
     cached = social_publisher.get_cached_posts(company_id)
     if cached and cached['posts']:
-        return jsonify({'success': True, 'posts': cached['posts'], 'total_count': cached['total_count']})
+        cached_at = cached['cached_at'].strftime('%d.%m.%Y %H:%M') if cached.get('cached_at') else None
+        return jsonify({'success': True, 'posts': cached['posts'], 'total_count': cached['total_count'], 'cached_at': cached_at})
     return jsonify({'success': False, 'error': 'Brak danych w cache. Kliknij Analityka aby pobrac.'})
 
 
diff --git a/templates/admin/social_publisher.html b/templates/admin/social_publisher.html
index c60c94c..190d438 100644
--- a/templates/admin/social_publisher.html
+++ b/templates/admin/social_publisher.html
@@ -461,6 +461,7 @@
             </div>
         </div>
         <div id="fbChartsSection-{{ company_id_key }}" style="display:none;">
+            <div id="fbChartsInfo-{{ company_id_key }}" style="text-align:center;margin-bottom:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-sm);color:var(--text-secondary);font-size:var(--font-size-sm);background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);"></div>
             <div class="fb-charts-grid">
                 <div class="fb-chart-card"><h4>Engagement w czasie</h4><canvas id="engagementChart-{{ company_id_key }}"></canvas></div>
                 <div class="fb-chart-card"><h4>Aktywnosc publikacji</h4><canvas id="activityChart-{{ company_id_key }}"></canvas></div>
@@ -896,7 +897,7 @@
                 renderFbPosts(companyId, cacheData.posts, null, false);
                 container.insertAdjacentHTML('beforeend',
                     '<div style="text-align:center;margin-top:var(--spacing-md);color:var(--text-secondary);font-size:var(--font-size-sm);">Wyswietlono ' + cacheData.posts.length + ' postow z cache</div>');
-                renderFbCharts(companyId, cacheData.posts);
+                renderFbCharts(companyId, cacheData.posts, cacheData.cached_at);
                 return;
             }
         } catch(e) {}
@@ -956,7 +957,7 @@
             renderFbPosts(companyId, allPosts, null, false);
             container.insertAdjacentHTML('beforeend',
                 '<div style="text-align:center;margin-top:var(--spacing-md);color:var(--text-secondary);font-size:var(--font-size-sm);">Zaladowano ' + allPosts.length + ' postow z Facebook API</div>');
-            renderFbCharts(companyId, allPosts);
+            renderFbCharts(companyId, allPosts, 'teraz (swiezo pobrane)');
             saveFbPostsToCache(companyId, allPosts);
         } catch (err) {
             btn.textContent = origText;
@@ -1024,7 +1025,13 @@
         }
     }
 
-    function renderFbCharts(companyId, posts) {
+    function renderFbCharts(companyId, posts, cachedAt) {
+        // Show cache date info
+        var infoEl = document.getElementById('fbChartsInfo-' + companyId);
+        if (infoEl) {
+            var dateStr = cachedAt || 'teraz';
+            infoEl.innerHTML = 'Wykresy na podstawie <strong>' + posts.length + '</strong> postow | Dane z: <strong>' + dateStr + '</strong> | Kliknij <strong>Odswiez wszystkie</strong> aby zaktualizowac';
+        }
         // Sort chronologically (oldest first)
         var sorted = posts.slice().sort(function(a, b) {
             return new Date(a.created_time) - new Date(b.created_time);
@@ -1339,24 +1346,27 @@
         }).catch(function() {});
     }
 
-    // Render cached posts preview on page load (max 10, no charts)
+    // Render cached posts preview + auto-load charts from DB cache
     document.addEventListener('DOMContentLoaded', function() {
         {% if cached_fb_posts %}
         {% for cid, cache_data in cached_fb_posts.items() %}
         (function() {
             var companyId = {{ cid }};
             var cachedPosts = {{ cache_data.posts | tojson }};
+            var total = {{ cache_data.total_count }};
             if (cachedPosts && cachedPosts.length > 0) {
                 renderFbPosts(companyId, cachedPosts, null, false);
-                var total = {{ cache_data.total_count }};
-                var msg = '';
-                if (total > cachedPosts.length) {
-                    msg = 'Podglad: ' + cachedPosts.length + ' z ' + total + ' postow z cache. Kliknij <strong>Analityka</strong> aby zobaczyc wykresy.';
-                } else {
-                    msg = 'Podglad z cache (' + cachedPosts.length + ' postow). Kliknij <strong>Odswiez wszystkie</strong> aby pobrac pelna historie, potem <strong>Analityka</strong> dla wykresow.';
-                }
-                document.getElementById('fbPostsContainer-' + companyId).insertAdjacentHTML('afterbegin',
-                    '<div style="text-align:center;margin-bottom:var(--spacing-md);padding:var(--spacing-sm);color:var(--text-secondary);font-size:var(--font-size-sm);background:var(--surface);border-radius:var(--radius);border:1px dashed var(--border);">' + msg + '</div>');
+            }
+            // Auto-load full cache via AJAX for charts (fast, from DB)
+            if (total > 0) {
+                fetch('/admin/social-publisher/fb-posts-cache/' + companyId)
+                .then(function(r) { return r.json(); })
+                .then(function(data) {
+                    if (data.success && data.posts && data.posts.length > 0) {
+                        renderFbPosts(companyId, data.posts, null, false);
+                        renderFbCharts(companyId, data.posts, data.cached_at);
+                    }
+                }).catch(function() {});
             }
         })();
         {% endfor %}