@growth-labs/cms 0.8.24 → 0.8.28

package/src/ui/client/mount.tsx

@@ -42,6 +42,7 @@ export async function mount(elementId = 'masthead-root') {
 		primaryTopic: config.primaryTopic,
 		contentMetadataSelects: config.contentMetadataSelects,
 		surveyId: config.surveyResults?.surveyId,
+		surveys: config.surveyResults?.surveys,
 	})
 	createRoot(el).render(<CmsApp initial={initial} screens={screens} boot={boot} />)
 }

package/src/ui/screens/PodcastListeningScreen.tsx

@@ -165,6 +165,14 @@ function PodcastListeningBody({ data }: { data: PodcastListening }) {
 
 	return (
 		<div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--gap)' }}>
+			<div className="page-sub">
+				{data.listeningStartedAt
+					? `Listening time has been recorded since ${new Date(data.listeningStartedAt).toLocaleDateString('en-GB', { day: 'numeric', month: 'short', year: 'numeric', timeZone: 'UTC' })} (UTC). `
+					: 'The start of listening-time coverage is unavailable. '}
+				Plays cover the selected range. Listening time counts content played on the website,
+				including at faster speeds. Listening inside podcast apps cannot be measured here; a feed
+				download is not a measured listen. Averages use only sessions with recorded listening time.
+			</div>
 			{!listeningMeasured && <ListeningPendingBanner />}
 			<PodcastTotalsCards data={data} />
 			<PodcastEpisodeTable episodes={data.episodes} />
@@ -211,6 +219,17 @@ function PodcastTotalsCards({ data }: { data: PodcastListening }) {
 			value: t.totalListeningSeconds === null ? '—' : formatDuration(t.totalListeningSeconds),
 			note: t.totalListeningSeconds === null ? 'not reported yet' : 'total, all episodes',
 		},
+		{
+			label: 'Avg / measured session',
+			value:
+				t.avgListeningSecondsPerListener == null
+					? '—'
+					: formatDuration(t.avgListeningSecondsPerListener),
+			note:
+				t.measuredListeners == null
+					? 'measurement unavailable'
+					: `${formatNumber(t.measuredListeners)} measured sessions`,
+		},
 	]
 	return (
 		<div className="grid-stats">
@@ -258,6 +277,7 @@ const COLUMNS: ColumnDef[] = [
 	{ key: 'completes', label: 'Done', align: 'right' },
 	{ key: 'completionRate', label: 'Rate', align: 'right' },
 	{ key: 'totalListeningSeconds', label: 'Listening', align: 'right' },
+	{ key: 'avgListeningSecondsPerListener', label: 'Avg / measured session', align: 'right' },
 ]
 
 export function PodcastEpisodeTable({
@@ -402,6 +422,16 @@ export function PodcastEpisodeTable({
 										formatDuration(episode.totalListeningSeconds)
 									)}
 								</td>
+								<td style={{ paddingRight: 18 }}>
+									{episode.avgListeningSecondsPerListener === null
+										? '—'
+										: formatDuration(episode.avgListeningSecondsPerListener)}
+									{episode.measuredListeners != null && (
+										<div className="kicker">
+											{formatNumber(episode.measuredListeners)} measured sessions
+										</div>
+									)}
+								</td>
 								<td style={{ paddingRight: 18 }}>
 									<DropoffBars episode={episode} />
 								</td>