feat: auto-load charts from DB cache on page load, show cache date
Some checks are pending
NordaBiz Tests / Unit & Integration Tests (push) Waiting to run
NordaBiz Tests / E2E Tests (Playwright) (push) Blocked by required conditions
NordaBiz Tests / Smoke Tests (Production) (push) Blocked by required conditions
NordaBiz Tests / Send Failure Notification (push) Blocked by required conditions

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>
This commit is contained in:
Maciej Pienczyn 2026-02-20 09:18:54 +01:00
parent c324658f47
commit a8a434e99d
2 changed files with 25 additions and 14 deletions

View File

@ -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.'})

View File

@ -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 %}