Trim description clutter: strip URLs in cards, tighter preview in Watch
- VideoCard list variant: strip URLs/affiliate links before rendering, collapse to 1 line (was 2 lines of raw text including https:// spam) - DescriptionBox collapsed preview: 2 lines / 200 chars before "Show more" (was 4 lines — too much affiliate crap before you can dismiss it) - Full description still shown when expanded in Watch view Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -4,6 +4,15 @@ import { useNavigate } from "react-router-dom";
|
|||||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||||
import { createDownload, toggleQueue, toggleLike, dismissDiscovery, getSettings } from "../api";
|
import { createDownload, toggleQueue, toggleLike, dismissDiscovery, getSettings } from "../api";
|
||||||
|
|
||||||
|
function snippetText(desc) {
|
||||||
|
if (!desc) return "";
|
||||||
|
return desc
|
||||||
|
.replace(/https?:\/\/\S+/g, "") // strip URLs
|
||||||
|
.replace(/\n+/g, " ") // flatten newlines
|
||||||
|
.replace(/\s{2,}/g, " ") // collapse whitespace
|
||||||
|
.trim();
|
||||||
|
}
|
||||||
|
|
||||||
function formatDuration(secs) {
|
function formatDuration(secs) {
|
||||||
if (!secs) return null;
|
if (!secs) return null;
|
||||||
const h = Math.floor(secs / 3600);
|
const h = Math.floor(secs / 3600);
|
||||||
@@ -302,10 +311,10 @@ export default function VideoCard({ video, size = "md", onDismiss, variant = "gr
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Description — desktop only, 2 lines max */}
|
{/* Description snippet — desktop only, URLs stripped */}
|
||||||
{video.description && (
|
{video.description && snippetText(video.description) && (
|
||||||
<p className="hidden sm:block text-[11px] leading-relaxed text-zinc-500 line-clamp-2">
|
<p className="hidden sm:block text-[11px] leading-relaxed text-zinc-500 line-clamp-1">
|
||||||
{video.description.replace(/\n+/g, " ")}
|
{snippetText(video.description)}
|
||||||
</p>
|
</p>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|||||||
@@ -66,8 +66,8 @@ function linkify(text) {
|
|||||||
function DescriptionBox({ text }) {
|
function DescriptionBox({ text }) {
|
||||||
const [expanded, setExpanded] = useState(false);
|
const [expanded, setExpanded] = useState(false);
|
||||||
const lines = text.split("\n");
|
const lines = text.split("\n");
|
||||||
const hasMore = lines.length > 4 || text.length > 300;
|
const hasMore = lines.length > 2 || text.length > 200;
|
||||||
const displayed = expanded ? text : lines.slice(0, 4).join("\n") + (hasMore ? "…" : "");
|
const displayed = expanded ? text : lines.slice(0, 2).join("\n") + (hasMore ? "…" : "");
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
|||||||
Reference in New Issue
Block a user