@mundogamernetwork/shared-ui 1.6.0 → 1.8.0

package/components/MediaKit/MgMediaKitLinks.vue

@@ -93,9 +93,9 @@ const save = () => {
 </template>
 
 <style scoped lang="scss">
-.mk-links-editor { border: 1px solid rgba(140, 140, 160, .3); padding: 20px; background: rgba(255, 255, 255, .02); }
+.mk-links-editor { border: 1px solid rgba(140, 140, 160, .3); padding: 20px; background: rgba(255, 255, 255, .02); color: #f2f3f5; }
 .mk-links-head { display: flex; justify-content: space-between; gap: 20px; align-items: start; }
-.mk-links-head h3 { margin: 0 0 5px; font-size: 17px; }
+.mk-links-head h3 { margin: 0 0 5px; color: #f2f3f5; font-size: 17px; }
 .mk-links-head p, .mk-links-empty { margin: 0; color: #9292a4; font-size: 13px; line-height: 1.5; }
 .mk-link-add, .mk-link-save { border: 1px solid #ffb000; background: #ffb000; color: #090909; min-height: 38px; padding: 0 16px; font-weight: 750; cursor: pointer; white-space: nowrap; }
 button:disabled { opacity: .42; cursor: not-allowed; }
@@ -103,7 +103,8 @@ button:disabled { opacity: .42; cursor: not-allowed; }
 .mk-link-row { display: grid; grid-template-columns: 30px minmax(150px, .75fr) minmax(220px, 1.4fr) auto; gap: 10px; align-items: end; padding: 12px; border: 1px solid rgba(140, 140, 160, .25); }
 .mk-link-number { align-self: center; color: #ffb000; font-weight: 800; text-align: center; }
 .mk-link-row label { display: grid; gap: 6px; color: #9292a4; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
-.mk-link-row input { min-width: 0; height: 40px; border: 1px solid rgba(140, 140, 160, .35); background: rgba(0, 0, 0, .2); color: inherit; padding: 0 11px; outline: none; }
+.mk-link-row input { min-width: 0; height: 40px; border: 1px solid rgba(140, 140, 160, .35); background: rgba(0, 0, 0, .2); color: #f2f3f5; padding: 0 11px; outline: none; }
+.mk-link-row input::placeholder { color: #6f7480; }
 .mk-link-row input:focus { border-color: #ffb000; }
 .mk-link-actions { display: flex; gap: 5px; }
 .mk-link-actions button { width: 36px; height: 40px; border: 1px solid rgba(140, 140, 160, .35); background: transparent; color: inherit; cursor: pointer; }

package/components/indie-wall/IndieWallLeaderboard.vue

@@ -26,9 +26,7 @@ const ranked = computed<RankEntry[]>(() => {
 		const key = userId ? `u:${userId}` : email ? `e:${email}` : null
 		if (!key) continue
 
-		const name = s.is_anonymous
-			? t('tv.dashboard.indie_wall.anonymous')
-			: (s.title || s.user?.name || s.guest_name || 'Guest')
+		const name = supporterDisplayName(s)
 
 		if (map.has(key)) {
 			const entry = map.get(key)!
@@ -38,7 +36,7 @@ const ranked = computed<RankEntry[]>(() => {
 			map.set(key, {
 				key,
 				name,
-				avatarUrl: s.user?.avatar_url || null,
+				avatarUrl: supporterAvatarUrl(s),
 				totalPixels: s.pixel_count || 1,
 				purchases: 1,
 				position: 0,
@@ -57,6 +55,21 @@ const visible = computed(() => showAll.value ? ranked.value : ranked.value.slice
 function initials(name: string): string {
 	return name.trim().split(/\s+/).slice(0, 2).map(w => w[0]).join('').toUpperCase()
 }
+
+function supporterDisplayName(s: any): string {
+	if (s.is_anonymous) return t('tv.dashboard.indie_wall.anonymous')
+	return s.user?.nickname
+		|| s.user?.username
+		|| s.user?.full_name
+		|| s.user?.name
+		|| s.guest_name
+		|| 'Guest'
+}
+
+function supporterAvatarUrl(s: any): string | null {
+	if (s.is_anonymous) return null
+	return s.user?.avatar_url || s.user?.profile_image || s.user?.avatar || s.user?.image || null
+}
 </script>
 
 <template>

package/components/playtest/video/RecordedSessionPlayer.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 // Playback + clickable marker timeline for a Video Playtest recording.
-// Native <video> — plays HLS natively in Safari; other browsers need an
-// hls.js integration this first version doesn't include (documented
-// limitation, not silently broken: shows a note when playback fails).
-import { ref } from "vue";
+// Safari plays HLS natively; every other browser needs hls.js (MediaSource
+// Extensions) — falls back to a direct-link note only if neither path works
+// (very old browsers without MSE support).
+import { ref, onMounted, onBeforeUnmount, watch } from "vue";
+import Hls from "hls.js";
 
 const props = defineProps<{
 	playbackUrl: string | null;
@@ -14,6 +15,41 @@ const props = defineProps<{
 const videoEl = ref<HTMLVideoElement | null>(null);
 const playbackError = ref(false);
 
+let hls: Hls | null = null;
+
+function destroyPlayer() {
+	if (hls) {
+		hls.destroy();
+		hls = null;
+	}
+}
+
+function setupPlayback() {
+	destroyPlayer();
+	playbackError.value = false;
+
+	const video = videoEl.value;
+	if (!video || !props.playbackUrl) return;
+
+	if (Hls.isSupported()) {
+		hls = new Hls();
+		hls.on(Hls.Events.ERROR, (_event, data) => {
+			if (data.fatal) playbackError.value = true;
+		});
+		hls.loadSource(props.playbackUrl);
+		hls.attachMedia(video);
+	} else if (video.canPlayType("application/vnd.apple.mpegurl")) {
+		// Safari and other browsers with native HLS support.
+		video.src = props.playbackUrl;
+	} else {
+		playbackError.value = true;
+	}
+}
+
+onMounted(setupPlayback);
+watch(() => props.playbackUrl, setupPlayback);
+onBeforeUnmount(destroyPlayer);
+
 function seekTo(seconds: number) {
 	if (videoEl.value) {
 		videoEl.value.currentTime = seconds;
@@ -46,7 +82,6 @@ function severityClass(severity?: string | null): string {
 		<template v-else>
 			<video
 				ref="videoEl"
-				:src="playbackUrl"
 				controls
 				class="recorded-session-player__video"
 				@error="playbackError = true"

package/components/playtest/video/VideoPlaytestCapture.vue

@@ -16,6 +16,8 @@ const emit = defineEmits<{
 const rec = usePlaytestVideoRecording(props.campaignId);
 
 const markerDraft = ref("");
+const submitted = ref(false);
+const retryingMarkers = ref(false);
 const step = computed<"record" | "review" | "upload" | "done">(() => {
 	if (rec.recordedBlob.value && !rec.recordingId.value) return "review";
 	if (rec.recordingId.value) return "upload";
@@ -30,7 +32,23 @@ function addMarker() {
 
 async function submit() {
 	const result = await rec.submitVideoResponse();
-	if (result) emit("submitted");
+	if (!result) return;
+	submitted.value = true;
+	if (rec.markerSubmitErrors.value === 0) emit("submitted");
+}
+
+async function retryMarkers() {
+	retryingMarkers.value = true;
+	try {
+		await rec.retryPendingMarkers();
+		if (rec.markerSubmitErrors.value === 0) emit("submitted");
+	} finally {
+		retryingMarkers.value = false;
+	}
+}
+
+function continueAfterSubmit() {
+	emit("submitted");
 }
 
 function formatSeconds(s: number): string {
@@ -97,7 +115,7 @@ function formatSeconds(s: number): string {
 		</template>
 
 		<!-- Upload done, waiting on provider processing — submit -->
-		<template v-else-if="step === 'upload'">
+		<template v-else-if="step === 'upload' && !submitted">
 			<p class="video-capture__hint">
 				{{ $t("playtest.video_capture.processing_hint", "Your recording is uploaded and processing. Submit when you're ready — we'll finish confirming it's ready in the background.") }}
 			</p>
@@ -107,6 +125,23 @@ function formatSeconds(s: number): string {
 					: $t("playtest.video_capture.submit", "Submit response") }}
 			</button>
 		</template>
+
+		<!-- Response submitted, but one or more markers failed to save — offer a retry instead of silently dropping them -->
+		<template v-else-if="submitted && rec.markerSubmitErrors.value > 0">
+			<p class="video-capture__hint video-capture__error">
+				{{ $t("playtest.video_capture.marker_save_failed", "Response submitted, but {v} note(s) failed to save.", { v: rec.markerSubmitErrors.value }) }}
+			</p>
+			<div class="video-capture__actions">
+				<button type="button" class="btn primary" :disabled="retryingMarkers" @click="retryMarkers">
+					{{ retryingMarkers
+						? $t("playtest.video_capture.retrying", "Retrying…")
+						: $t("playtest.video_capture.retry_markers", "Retry saving notes") }}
+				</button>
+				<button type="button" class="btn" @click="continueAfterSubmit">
+					{{ $t("playtest.video_capture.continue_anyway", "Continue anyway") }}
+				</button>
+			</div>
+		</template>
 	</div>
 </template>
 
@@ -130,6 +165,7 @@ function formatSeconds(s: number): string {
 
 	&__actions {
 		display: flex;
+		gap: 8px;
 	}
 
 	&__recording {

package/composables/usePlaytestVideoRecording.ts

@@ -18,6 +18,8 @@ import {
  * audio only — a real limitation, not an oversight), duration capped
  * server-side (config playtest.video.max_duration_seconds).
  */
+type PendingMarker = { timestamp_seconds: number; comment: string; severity?: string };
+
 export function usePlaytestVideoRecording(campaignId: number) {
 	const capturing = ref(false);
 	const uploading = ref(false);
@@ -29,12 +31,45 @@ export function usePlaytestVideoRecording(campaignId: number) {
 	const recording = ref<PlaytestRecording | null>(null);
 	const recordedBlob = ref<Blob | null>(null);
 	const recordedDurationSeconds = ref(0);
-	const markers = ref<{ timestamp_seconds: number; comment: string; severity?: string }[]>([]);
+	const markers = ref<PendingMarker[]>([]);
+	// Markers a submitted response still needs posted — set when the post-submit
+	// loop hits an error partway through, so the UI can offer a retry instead of
+	// silently dropping the remainder (see storeRecordingMarker loop below).
+	const markerSubmitErrors = ref(0);
 
 	let mediaRecorder: MediaRecorder | null = null;
 	let chunks: BlobPart[] = [];
 	let captureStartedAt = 0;
 
+	// Markers only ever live in this Vue ref + localStorage until they're
+	// posted — a crash between adding a marker and a successful submit loses
+	// nothing beyond that point (the recording Blob itself is still
+	// memory-only and can't survive a reload; that's a separate, harder
+	// problem this doesn't attempt to solve).
+	const storageKey = `mgn_playtest_pending_markers_${campaignId}`;
+
+	function persistMarkers() {
+		try {
+			if (markers.value.length) {
+				localStorage.setItem(storageKey, JSON.stringify(markers.value));
+			} else {
+				localStorage.removeItem(storageKey);
+			}
+		} catch {
+			// localStorage unavailable (private mode / quota) — best-effort only.
+		}
+	}
+
+	/** Restores markers left over from a previous capture on this campaign that never made it to a submit. */
+	function restorePendingMarkers(): PendingMarker[] {
+		try {
+			const raw = localStorage.getItem(storageKey);
+			return raw ? (JSON.parse(raw) as PendingMarker[]) : [];
+		} catch {
+			return [];
+		}
+	}
+
 	function resetError() {
 		genericError.value = null;
 	}
@@ -50,6 +85,12 @@ export function usePlaytestVideoRecording(campaignId: number) {
 
 	async function startCapture() {
 		resetError();
+		// A previous capture on this campaign may have left markers behind
+		// (crash/reload before a successful submit) — recover them rather than
+		// silently starting from an empty list.
+		const leftover = restorePendingMarkers();
+		if (leftover.length) markers.value = leftover;
+
 		try {
 			const stream = await navigator.mediaDevices.getDisplayMedia({ video: true, audio: true });
 			chunks = [];
@@ -80,6 +121,7 @@ export function usePlaytestVideoRecording(campaignId: number) {
 	/** Adds a marker anchored to the current elapsed recording time. */
 	function markNow(comment: string, severity?: string) {
 		markers.value.push({ timestamp_seconds: elapsedSeconds(), comment, severity });
+		persistMarkers();
 	}
 
 	/** Requests the upload slot and uploads the recorded blob directly to the video provider. */
@@ -118,6 +160,60 @@ export function usePlaytestVideoRecording(campaignId: number) {
 		}
 	}
 
+	let lastSubmittedResponseId: number | null = null;
+
+	/**
+	 * Marker timestamps are wall-clock elapsed time from when capture started,
+	 * not the real position in the final encoded file — any delay before
+	 * MediaRecorder actually starts encoding, or a hiccup mid-recording, drifts
+	 * them apart. Once the provider confirms the real duration (post-submit,
+	 * since submit only succeeds once the recording is 'ready'), scale every
+	 * marker proportionally against the wall-clock duration we measured — a
+	 * practical correction, not frame-perfect, but far closer than raw elapsed
+	 * seconds once the two durations diverge.
+	 */
+	function correctForDrift(realDurationSeconds: number | null | undefined) {
+		if (!realDurationSeconds || !recordedDurationSeconds.value) return;
+		const scale = realDurationSeconds / recordedDurationSeconds.value;
+		if (!isFinite(scale) || scale <= 0 || scale === 1) return;
+		markers.value = markers.value.map((m) => ({
+			...m,
+			timestamp_seconds: Math.min(realDurationSeconds, Math.max(0, Math.round(m.timestamp_seconds * scale))),
+		}));
+		persistMarkers();
+	}
+
+	/**
+	 * Posts whatever's left in markers.value for responseId, one at a time.
+	 * A failure on one marker does NOT abort the rest — each is independent
+	 * feedback, so losing one shouldn't cost the others. Successfully-posted
+	 * markers are removed from the pending list (and localStorage) as they
+	 * succeed; anything left after this call can be retried via
+	 * retryPendingMarkers() instead of being silently dropped.
+	 */
+	async function postPendingMarkers(responseId: number) {
+		lastSubmittedResponseId = responseId;
+		const remaining: PendingMarker[] = [];
+		let failures = 0;
+		for (const m of markers.value) {
+			try {
+				await storeRecordingMarker(responseId, m as any);
+			} catch {
+				remaining.push(m);
+				failures++;
+			}
+		}
+		markers.value = remaining;
+		markerSubmitErrors.value = failures;
+		persistMarkers();
+	}
+
+	/** Retries any markers that failed to post during submitVideoResponse(). */
+	async function retryPendingMarkers() {
+		if (!lastSubmittedResponseId || !markers.value.length) return;
+		await postPendingMarkers(lastSubmittedResponseId);
+	}
+
 	/**
 	 * Submits the response once the backend confirms the recording is ready.
 	 * Processing is async (the provider's webhook updates our DB after
@@ -135,6 +231,7 @@ export function usePlaytestVideoRecording(campaignId: number) {
 			return null;
 		}
 		resetError();
+		markerSubmitErrors.value = 0;
 		submitting.value = true;
 		try {
 			for (let attempt = 1; attempt <= maxAttempts; attempt++) {
@@ -144,9 +241,13 @@ export function usePlaytestVideoRecording(campaignId: number) {
 						recording_id: recordingId.value,
 						...meta,
 					});
-					for (const m of markers.value) {
-						await storeRecordingMarker(data.id, m as any);
+					try {
+						const fetched = await fetchRecording(data.id);
+						correctForDrift(fetched.data.data?.duration_seconds ?? null);
+					} catch {
+						// Non-fatal — fall back to uncorrected (wall-clock) timestamps.
 					}
+					await postPendingMarkers(data.id);
 					return data;
 				} catch (e: any) {
 					if (attempt === maxAttempts) throw e;
@@ -179,11 +280,13 @@ export function usePlaytestVideoRecording(campaignId: number) {
 		recordedBlob,
 		recordedDurationSeconds,
 		markers,
+		markerSubmitErrors,
 		startCapture,
 		stopCapture,
 		markNow,
 		uploadRecording,
 		submitVideoResponse,
+		retryPendingMarkers,
 		loadRecording,
 	};
 }

package/error.vue

@@ -51,13 +51,13 @@ onUnmounted(() => {
 
 <template>
 	<NuxtLayout>
-		<errors401 v-if="statusCodeError === HttpStatusCode.Unauthorized" />
-		<errors403 v-else-if="statusCodeError === HttpStatusCode.Forbidden" />
-		<errors404 v-else-if="statusCodeError === HttpStatusCode.NotFound" />
-		<errors500 v-else-if="statusCodeError === HttpStatusCode.InternalServerError" />
-		<errors503 v-else-if="statusCodeError === HttpStatusCode.ServiceUnavailable" />
-		<errors504 v-else-if="statusCodeError === HttpStatusCode.GatewayTimeout" />
-		<errors500 v-else />
+		<Error401 v-if="statusCodeError === HttpStatusCode.Unauthorized" />
+		<Error403 v-else-if="statusCodeError === HttpStatusCode.Forbidden" />
+		<Error404 v-else-if="statusCodeError === HttpStatusCode.NotFound" />
+		<Error500 v-else-if="statusCodeError === HttpStatusCode.InternalServerError" />
+		<Error503 v-else-if="statusCodeError === HttpStatusCode.ServiceUnavailable" />
+		<Error504 v-else-if="statusCodeError === HttpStatusCode.GatewayTimeout" />
+		<Error500 v-else />
 
 		<p v-if="isRecoverableError" class="recovery-line">
 			{{ $t("errors.recovery_hint") }}

package/locales/de.json

@@ -240,5 +240,120 @@
   "common": {
     "video_thumbnail": "Video-Vorschaubild",
     "expanded_image": "Vergrößertes Bild"
+  },
+  "tv": {
+    "dashboard": {
+      "indie_wall": {
+        "about_section": "Über die Wall",
+        "anonymous": "Anonym",
+        "cancel": "Abbrechen",
+        "confirm_support": "Unterstützung bestätigen",
+        "cta_create_btn": "Create my account",
+        "cta_create_desc": "Create an account to track your support, receive updates, and join other walls.",
+        "cta_create_skip": "Continue without an account",
+        "cta_create_title": "Want to save your support?",
+        "drag_to_crop": "Drag to crop",
+        "error_area_occupied": "This area is already taken. Choose another space on the wall.",
+        "error_gateway": "Could not start payment. Try again.",
+        "error_save": "Could not save your support. Try again.",
+        "filled": "Gefüllt",
+        "footer_create_cta": "Create your own wall",
+        "footer_made_with": "Made with",
+        "goal_card_cta": "Dieses Ziel unterstützen",
+        "goal_card_goal": "Goal",
+        "goal_card_missing": "es fehlen {count} Pixel bis zur nächsten Lieferung",
+        "goal_card_missing_amount": "es fehlen {amount} bis zur nächsten Lieferung",
+        "goal_card_result": "Result",
+        "goal_card_select": "Select goal",
+        "goal_card_you_help": "You help",
+        "goals": "Ziele",
+        "guest_email_label": "Your email",
+        "guest_email_placeholder": "you@email.com",
+        "guest_intro": "You can support without creating an account. Use a name and email to receive confirmation.",
+        "guest_name_label": "Public name",
+        "guest_name_placeholder": "How do you want to appear on the wall?",
+        "just_supported": "Support received",
+        "leaderboard_pixels": "pixels",
+        "leaderboard_purchases": "support",
+        "leaderboard_purchases_plural": "supports",
+        "leaderboard_show_less": "Show less",
+        "leaderboard_show_more": "Show more",
+        "leaderboard_title": "Supporter",
+        "leaderboard_title_span": "leaderboard",
+        "message": "Message",
+        "message_placeholder": "Leave a message for the creator",
+        "mural_by": "by {name}",
+        "mural_click_hint": "Click a pixel to see who supported",
+        "mural_grid": "Wall",
+        "mural_legend_free": "Free",
+        "mural_legend_taken": "Taken",
+        "mural_position": "Position",
+        "mural_support_now": "Support now",
+        "mural_title_field": "Support title",
+        "mural_title_placeholder": "Ex: First pixels of the project",
+        "not_found": "Wall not found.",
+        "pay_agree": "I agree to the support and billing terms.",
+        "pay_agree_rights": "I understand the image and message may appear publicly on the wall.",
+        "pay_paypal": "PayPal",
+        "pay_paypal_meta": "Secure payment through PayPal",
+        "pay_pix": "Pix",
+        "pay_pix_soon": "Coming soon",
+        "pay_stripe": "Card",
+        "pay_stripe_meta": "Secure payment through Stripe",
+        "pixels_available": "Available pixels",
+        "processing_close": "Close",
+        "processing_desc": "We are confirming your support. This may take a few seconds.",
+        "processing_timeout_desc": "Confirmation is taking longer than usual. You can close this and check again later.",
+        "processing_timeout_title": "Still processing",
+        "processing_title": "Processing support",
+        "raised": "Gesammelt",
+        "reached": "Erreicht",
+        "recent_supporters": "Recent supporters",
+        "share_copy_link": "Copy link",
+        "share_join_cta": "Diese Wall ebenfalls unterstützen",
+        "share_pixel_cta": "Diese Unterstützung teilen",
+        "share_pixel_default_desc": "See who is supporting the {wall} wall.",
+        "share_pixel_text": "{name} supported the {wall} wall. Join in and support too.",
+        "share_pixel_title": "{name} supported {wall}",
+        "share_via_facebook": "Share on Facebook",
+        "share_via_twitter": "Share on X",
+        "share_via_whatsapp": "Share on WhatsApp",
+        "sold": "sold",
+        "spots_unit": "Pixel",
+        "step_back": "Back",
+        "step_block_auto": "Choose automatically",
+        "step_block_confirm": "Confirm position",
+        "step_block_help": "Choose where your {count} pixels will appear on the wall.",
+        "step_block_manual": "Choose manually",
+        "step_block_quantity": "Quantity",
+        "step_block_shape": "Shape",
+        "step_block_title": "Choose your space",
+        "step_block_total": "{total} pixels",
+        "step_customize_continue": "Continue",
+        "step_customize_help": "Upload your image, title, and message to appear on the wall.",
+        "step_customize_image": "Support image",
+        "step_customize_image_hint": "Use a square image or crop it before continuing.",
+        "step_customize_link": "Optional link",
+        "step_customize_link_error": "Enter a valid link.",
+        "step_customize_remove_image": "Remove image",
+        "step_customize_replace_image": "Replace image",
+        "step_customize_title": "Customize your support",
+        "step_customize_upload_image": "Upload image",
+        "step_goal_help": "Choose a goal to direct your support.",
+        "step_goal_skip_desc": "Your support goes to the general wall without linking to a specific goal.",
+        "step_goal_skip_title": "Support without a goal",
+        "step_goal_title": "Choose a goal",
+        "step_package_custom_cta": "Set quantity",
+        "step_package_custom_desc": "Choose how many pixels you want to buy.",
+        "step_package_custom_title": "Custom",
+        "step_package_help": "Choose a pixel package for the wall.",
+        "step_package_title": "Choose your package",
+        "step_pay_method": "Payment method",
+        "step_pay_title": "Payment",
+        "step_pay_total": "Total",
+        "supporters": "Unterstützer",
+        "tiers": "Packages"
+      }
+    }
   }
 }

package/locales/en.json

@@ -240,5 +240,120 @@
   "common": {
     "video_thumbnail": "Video thumbnail",
     "expanded_image": "Expanded image"
+  },
+  "tv": {
+    "dashboard": {
+      "indie_wall": {
+        "about_section": "About the wall",
+        "anonymous": "Anonymous",
+        "cancel": "Cancel",
+        "confirm_support": "Confirm support",
+        "cta_create_btn": "Create my account",
+        "cta_create_desc": "Create an account to track your support, receive updates, and join other walls.",
+        "cta_create_skip": "Continue without an account",
+        "cta_create_title": "Want to save your support?",
+        "drag_to_crop": "Drag to crop",
+        "error_area_occupied": "This area is already taken. Choose another space on the wall.",
+        "error_gateway": "Could not start payment. Try again.",
+        "error_save": "Could not save your support. Try again.",
+        "filled": "Filled",
+        "footer_create_cta": "Create your own wall",
+        "footer_made_with": "Made with",
+        "goal_card_cta": "Support this goal",
+        "goal_card_goal": "Goal",
+        "goal_card_missing": "missing {count} pixels for the next delivery",
+        "goal_card_missing_amount": "missing {amount} for the next delivery",
+        "goal_card_result": "Result",
+        "goal_card_select": "Select goal",
+        "goal_card_you_help": "You help",
+        "goals": "Goals",
+        "guest_email_label": "Your email",
+        "guest_email_placeholder": "you@email.com",
+        "guest_intro": "You can support without creating an account. Use a name and email to receive confirmation.",
+        "guest_name_label": "Public name",
+        "guest_name_placeholder": "How do you want to appear on the wall?",
+        "just_supported": "Support received",
+        "leaderboard_pixels": "pixels",
+        "leaderboard_purchases": "support",
+        "leaderboard_purchases_plural": "supports",
+        "leaderboard_show_less": "Show less",
+        "leaderboard_show_more": "Show more",
+        "leaderboard_title": "Supporter",
+        "leaderboard_title_span": "leaderboard",
+        "message": "Message",
+        "message_placeholder": "Leave a message for the creator",
+        "mural_by": "by {name}",
+        "mural_click_hint": "Click a pixel to see who supported",
+        "mural_grid": "Wall",
+        "mural_legend_free": "Free",
+        "mural_legend_taken": "Taken",
+        "mural_position": "Position",
+        "mural_support_now": "Support now",
+        "mural_title_field": "Support title",
+        "mural_title_placeholder": "Ex: First pixels of the project",
+        "not_found": "Wall not found.",
+        "pay_agree": "I agree to the support and billing terms.",
+        "pay_agree_rights": "I understand the image and message may appear publicly on the wall.",
+        "pay_paypal": "PayPal",
+        "pay_paypal_meta": "Secure payment through PayPal",
+        "pay_pix": "Pix",
+        "pay_pix_soon": "Coming soon",
+        "pay_stripe": "Card",
+        "pay_stripe_meta": "Secure payment through Stripe",
+        "pixels_available": "Available pixels",
+        "processing_close": "Close",
+        "processing_desc": "We are confirming your support. This may take a few seconds.",
+        "processing_timeout_desc": "Confirmation is taking longer than usual. You can close this and check again later.",
+        "processing_timeout_title": "Still processing",
+        "processing_title": "Processing support",
+        "raised": "Raised",
+        "reached": "Reached",
+        "recent_supporters": "Recent supporters",
+        "share_copy_link": "Copy link",
+        "share_join_cta": "Support this wall too",
+        "share_pixel_cta": "Share this support",
+        "share_pixel_default_desc": "See who is supporting the {wall} wall.",
+        "share_pixel_text": "{name} supported the {wall} wall. Join in and support too.",
+        "share_pixel_title": "{name} supported {wall}",
+        "share_via_facebook": "Share on Facebook",
+        "share_via_twitter": "Share on X",
+        "share_via_whatsapp": "Share on WhatsApp",
+        "sold": "sold",
+        "spots_unit": "pixels",
+        "step_back": "Back",
+        "step_block_auto": "Choose automatically",
+        "step_block_confirm": "Confirm position",
+        "step_block_help": "Choose where your {count} pixels will appear on the wall.",
+        "step_block_manual": "Choose manually",
+        "step_block_quantity": "Quantity",
+        "step_block_shape": "Shape",
+        "step_block_title": "Choose your space",
+        "step_block_total": "{total} pixels",
+        "step_customize_continue": "Continue",
+        "step_customize_help": "Upload your image, title, and message to appear on the wall.",
+        "step_customize_image": "Support image",
+        "step_customize_image_hint": "Use a square image or crop it before continuing.",
+        "step_customize_link": "Optional link",
+        "step_customize_link_error": "Enter a valid link.",
+        "step_customize_remove_image": "Remove image",
+        "step_customize_replace_image": "Replace image",
+        "step_customize_title": "Customize your support",
+        "step_customize_upload_image": "Upload image",
+        "step_goal_help": "Choose a goal to direct your support.",
+        "step_goal_skip_desc": "Your support goes to the general wall without linking to a specific goal.",
+        "step_goal_skip_title": "Support without a goal",
+        "step_goal_title": "Choose a goal",
+        "step_package_custom_cta": "Set quantity",
+        "step_package_custom_desc": "Choose how many pixels you want to buy.",
+        "step_package_custom_title": "Custom",
+        "step_package_help": "Choose a pixel package for the wall.",
+        "step_package_title": "Choose your package",
+        "step_pay_method": "Payment method",
+        "step_pay_title": "Payment",
+        "step_pay_total": "Total",
+        "supporters": "Supporters",
+        "tiers": "Packages"
+      }
+    }
   }
-}
+}