pstream is dead; long live pstream taciturnaxolotl.github.io/pstream-ng/
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

Add id to media card menu

Pas e985f454 897d63fb

+34 -1
+34 -1
src/components/media/MediaCard.tsx
··· 75 75 76 76 const dotListContent = [t(`media.types.${media.type}`)]; 77 77 78 + const altDotListContent = [t(`ID: ${media.id}`)]; 79 + 78 80 const [searchQuery] = useSearchQuery(); 79 81 80 82 const [, copyToClipboard] = useCopyToClipboard(); 81 83 const [hasCopied, setHasCopied] = useState(false); 84 + 85 + const [hasCopiedID, setHasCopiedID] = useState(false); 82 86 83 87 if (closable) { 84 88 setOverlayVisible(false); ··· 113 117 copyToClipboard(link); 114 118 setHasCopied(true); 115 119 setTimeout(() => setHasCopied(false), 2000); 120 + }; 121 + 122 + const handleCopyIDClick = ( 123 + e: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>, 124 + ) => { 125 + e.preventDefault(); 126 + copyToClipboard(media.id); 127 + setHasCopiedID(true); 128 + setTimeout(() => setHasCopiedID(false), 2000); 116 129 }; 117 130 118 131 return ( ··· 292 305 <span>{media.title}</span> 293 306 </h1> 294 307 <div className="media-info-container justify-content-center flex flex-wrap"> 295 - <DotList className="text-xs" content={dotListContent} /> 308 + {!overlayVisible ? ( 309 + <DotList className="text-xs" content={dotListContent} /> 310 + ) : ( 311 + <button 312 + type="button" 313 + onClick={handleCopyIDClick} 314 + className="z-50" 315 + > 316 + {!hasCopiedID ? ( 317 + <DotList className="text-xs" content={altDotListContent} /> 318 + ) : ( 319 + <div className="flex items-center gap-1"> 320 + <DotList className="text-xs" content={altDotListContent} /> 321 + <Icon 322 + className="text-xs text-type-secondary" 323 + icon={Icons.CHECKMARK} 324 + /> 325 + </div> 326 + )} 327 + </button> 328 + )} 296 329 </div> 297 330 298 331 {!overlayVisible && !closable ? (