klevze/SkinbaseNova
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Allow heading tags (h1-h6) in ContentSanitizer so news editor headings render

Browse Source
This commit is contained in:
Gregor Klevže
2026-06-04 07:52:57 +02:00
parent 0b33a1b074
commit 15870ddb1f
191 changed files with 15453 additions and 1786 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
resources/js/Pages/Admin/Academy/AnalyticsOverview.jsx
View File

@@ -12,6 +12,99 @@ function StatCard({ label, value }) {
)
}
function formatDelta(delta) {
if (delta === null || delta === undefined) {
return 'new'
}
if (Number(delta) === 0) {
return '0%'
}
return `${Number(delta) > 0 ? '+' : ''}${Number(delta).toLocaleString()}%`
}
function PromptLibraryTrend({ trend }) {
const current = trend?.current || {}
const deltas = trend?.deltas || {}
const items = [
{ label: 'Views', value: Number(current.views || 0).toLocaleString(), delta: deltas.views },
{ label: 'Unique Visitors', value: Number(current.uniqueVisitors || 0).toLocaleString(), delta: deltas.uniqueVisitors },
{ label: 'Engaged Views', value: Number(current.engagedViews || 0).toLocaleString(), delta: deltas.engagedViews },
{ label: 'Engagement Rate', value: `${Number(current.engagementRate || 0).toLocaleString()}%`, delta: deltas.engagementRate },
]
return (
<div className="rounded-[28px] border border-white/[0.08] bg-white/[0.03] p-6">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<p className="text-[11px] font-semibold uppercase tracking-[0.2em] text-slate-500">Prompt Library Trend</p>
<p className="mt-2 text-sm text-slate-300">{trend?.range?.current?.from} to {trend?.range?.current?.to} compared with {trend?.range?.previous?.from} to {trend?.range?.previous?.to}</p>
</div>
<div className="rounded-full border border-white/[0.08] bg-black/20 px-4 py-2 text-xs uppercase tracking-[0.18em] text-slate-400">
Popularity {Number(current.popularityScore || 0).toLocaleString()}
</div>
</div>
<div className="mt-5 grid gap-4 md:grid-cols-2 xl:grid-cols-4">
{items.map((item) => (
<div key={item.label} className="rounded-2xl border border-white/[0.08] bg-black/20 p-5">
<p className="text-[11px] font-semibold uppercase tracking-[0.2em] text-slate-500">{item.label}</p>
<p className="mt-3 text-2xl font-bold text-white">{item.value}</p>
<p className="mt-2 text-xs uppercase tracking-[0.18em] text-sky-200">{formatDelta(item.delta)} vs previous</p>
</div>
))}
</div>
</div>
)
}
function PopularPromptPeriodUsage({ usage }) {
const periods = usage?.periods || []
return (
<div className="rounded-[28px] border border-white/[0.08] bg-white/[0.03] p-6">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<p className="text-[11px] font-semibold uppercase tracking-[0.2em] text-slate-500">Popular Prompt Period Usage</p>
<p className="mt-2 text-sm text-slate-300">Which ranking window people actually open on the public popular-prompts page.</p>
</div>
<div className="rounded-full border border-white/[0.08] bg-black/20 px-4 py-2 text-xs uppercase tracking-[0.18em] text-slate-400">
{Number(usage?.totalViews || 0).toLocaleString()} views · {Number(usage?.totalVisitors || 0).toLocaleString()} visitors
</div>
</div>
<div className="mt-5 space-y-3">
{periods.length ? periods.map((period) => (
<div key={period.period} className="rounded-2xl border border-white/[0.08] bg-black/20 px-4 py-4">
<div className="flex flex-wrap items-center justify-between gap-3">
<div>
<p className="text-sm font-semibold text-white">{period.label}</p>
<p className="mt-1 text-xs uppercase tracking-[0.18em] text-slate-500">{period.period}</p>
</div>
<div className="grid gap-2 text-right sm:grid-cols-3 sm:gap-6">
<div>
<p className="text-sm font-semibold text-sky-100">{Number(period.views || 0).toLocaleString()}</p>
<p className="text-xs uppercase tracking-[0.18em] text-slate-500">Views</p>
</div>
<div>
<p className="text-sm font-semibold text-sky-100">{Number(period.uniqueVisitors || 0).toLocaleString()}</p>
<p className="text-xs uppercase tracking-[0.18em] text-slate-500">Visitors</p>
</div>
<div>
<p className="text-sm font-semibold text-sky-100">{Number(period.share || 0).toLocaleString()}%</p>
<p className="text-xs uppercase tracking-[0.18em] text-slate-500">Share</p>
</div>
</div>
</div>
</div>
)) : <p className="rounded-2xl border border-dashed border-white/[0.08] bg-black/20 px-4 py-6 text-sm text-slate-400">No popular prompt period events have been tracked in this range yet.</p>}
</div>
</div>
)
}
function ContentList({ title, items = [] }) {
return (
<div className="rounded-[28px] border border-white/[0.08] bg-white/[0.03] p-6">
@@ -36,7 +129,7 @@ function ContentList({ title, items = [] }) {
)
}
export default function AcademyAnalyticsOverview({ nav = [], range, stats, topContent = [], topWeek = [] }) {
export default function AcademyAnalyticsOverview({ nav = [], range, stats, promptLibraryTrend = null, popularPromptPeriodUsage = null, topContent = [], topWeek = [] }) {
return (
<AdminLayout title="Academy Analytics" subtitle="Daily rollup overview for Academy traffic, engagement, and subscription intent.">
<Head title="Admin · Academy Analytics" />
@@ -63,6 +156,9 @@ export default function AcademyAnalyticsOverview({ nav = [], range, stats, topCo
<StatCard label="Upgrade Clicks" value={stats.upgradeClicks} />
</div>
{promptLibraryTrend ? <PromptLibraryTrend trend={promptLibraryTrend} /> : null}
{popularPromptPeriodUsage ? <PopularPromptPeriodUsage usage={popularPromptPeriodUsage} /> : null}
<div className="grid gap-6 xl:grid-cols-2">
<ContentList title="Top Content In Range" items={topContent} />
<ContentList title="Top Content This Week" items={topWeek} />