+1 -1

apps/amethyst/app/(tabs)/(stamp)/stamp/index.tsx

··· 87 87 headerBackButtonDisplayMode: "generic", 88 88 }} 89 89 /> 90 90 - i {/* Search Form */} 90 90 + {/* Search Form */} 91 91 <View className="flex gap-2 max-w-2xl w-screen px-4"> 92 92 <Text className="font-bold text-lg">Search for a track</Text> 93 93 <Input

+38 -5

apps/amethyst/app/(tabs)/(stamp)/stamp/submit.tsx

··· 16 16 import { Switch, View } from "react-native"; 17 17 import { MusicBrainzRecording, PlaySubmittedData } from "@/lib/oldStamp"; 18 18 import { Text } from "@/components/ui/text"; 19 19 + import { Textarea } from "@/components/ui/textarea"; 19 20 import { ExternalLink } from "@/components/ExternalLink"; 20 21 import { StampContext, StampContextValue, StampStep } from "./_layout"; 21 22 import { Image } from "react-native"; 22 23 import { Artist } from "@teal/lexicons/src/types/fm/teal/alpha/feed/defs"; 24 24 + import { cn } from "@/lib/utils"; 23 25 24 26 type CardyBResponse = { 25 27 error: string; ··· 162 164 163 165 const [isSubmitting, setIsSubmitting] = useState<boolean>(false); 164 166 const [shareWithBluesky, setShareWithBluesky] = useState<boolean>(false); 167 167 + const [blueskyPostText, setBlueskyPostText] = useState<string>(""); 165 168 166 169 const [blueskyEmbedCard, setBlueskyEmbedCard] = useState<EmbedCard | null>( 167 170 null, ··· 170 173 const selectedTrack = 171 174 state.step === StampStep.SUBMITTING ? state.submittingStamp : null; 172 175 176 176 + // Effect to initialize blueskyPostText when selectedTrack changes 177 177 + useEffect(() => { 178 178 + if (selectedTrack) { 179 179 + const defaultText = `💮 now playing: 180 180 + ${selectedTrack.title} by ${selectedTrack["artist-credit"]?.map((a) => a.artist.name).join(", ")} 181 181 + 182 182 + powered by @teal.fm`; 183 183 + setBlueskyPostText(defaultText); 184 184 + } 185 185 + }, [selectedTrack]); 186 186 + 173 187 useEffect(() => { 174 188 const fetchEmbedData = async (id: string) => { 175 189 try { ··· 249 263 if (shareWithBluesky && agent) { 250 264 // lol this type 251 265 const rt = new RichText({ 252 252 - text: `💮 now playing: 253 253 - ${record.trackName} by ${record.artists?.map((a) => a.artistName).join(", ")} 254 254 - 255 255 - powered by @teal.fm`, 266 266 + text: blueskyPostText, 256 267 }); 257 268 await rt.detectFacets(agent); 258 269 let embedInfo = await getEmbedInfo(selectedTrack.id); ··· 330 341 </Text> 331 342 </View> 332 343 333 333 - <View className="flex-col gap-4 items-center"> 344 344 + <View className="flex-col gap-4 items-center w-full"> 334 345 {blueskyEmbedCard && shareWithBluesky ? ( 335 346 <View className="gap-2 w-full"> 336 347 <Text className="text-sm text-muted-foreground text-center"> ··· 359 370 jsyk: there won't be an embed card on your post. 360 371 </Text> 361 372 ) 373 373 + )} 374 374 + {shareWithBluesky && ( 375 375 + <View className="text-sm text-muted-foreground w-full items-end"> 376 376 + <Textarea 377 377 + className="w-full p-2 pb-4 border border-border rounded-md text-card-foreground bg-card min-h-[100px] max-h-[200px]" 378 378 + multiline 379 379 + value={blueskyPostText} 380 380 + onChangeText={setBlueskyPostText} 381 381 + placeholder="Enter your Bluesky post text here..." 382 382 + /> 383 383 + <Text 384 384 + className={cn( 385 385 + "text-sm text-muted-foreground text-center absolute bottom-1 right-2", 386 386 + blueskyPostText.length > 150 387 387 + ? "text-gray-600 dark:text-gray-300" 388 388 + : "", 389 389 + blueskyPostText.length > 290 ? "text-red-500" : "", 390 390 + )} 391 391 + > 392 392 + {blueskyPostText.length}/300 393 393 + </Text> 394 394 + </View> 362 395 )} 363 396 <View className="flex-row gap-2 items-center"> 364 397 <Switch

+1 -1

apps/amethyst/components/play/actorPlaysView.tsx

··· 42 42 {play.map((p) => ( 43 43 <PlayView 44 44 key={p.playedTime + p.trackName} 45 45 - releaseTitle={p.releaseName} 45 45 + dateListened={p.playedTime ? new Date(p.playedTime) : undefined} 46 46 trackTitle={p.trackName} 47 47 artistName={p.artists.map((a) => a.artistName).join(", ")} 48 48 releaseMbid={p.releaseMbId}

+6 -5

apps/amethyst/components/play/playView.tsx

··· 1 1 import { View, Image } from "react-native"; 2 2 import { Text } from "@/components/ui/text"; 3 3 + import { timeAgo } from "@/lib/utils"; 3 4 4 5 export default function PlayView({ 5 6 releaseMbid, 6 7 trackTitle, 7 8 artistName, 8 8 - releaseTitle, 9 9 + dateListened, 9 10 }: { 10 11 releaseMbid?: string; 11 12 trackTitle: string; 12 13 artistName?: string; 13 13 - releaseTitle?: string; 14 14 + dateListened?: Date; 14 15 }) { 15 16 return ( 16 17 <View className="flex flex-row gap-2 max-w-full"> ··· 27 28 {trackTitle} 28 29 </Text> 29 30 {artistName && ( 30 30 - <Text className=" text-left text-muted-foreground line-clamp-1 overflow-ellipsis"> 31 31 + <Text className="text-sm text-left text-foreground line-clamp-1 overflow-ellipsis"> 31 32 {artistName} 32 33 </Text> 33 34 )} 34 34 - {releaseTitle && ( 35 35 + {dateListened && ( 35 36 <Text className="text-sm text-left text-muted-foreground line-clamp-1 overflow-ellipsis"> 36 36 - {releaseTitle} 37 37 + played {timeAgo(dateListened)} 37 38 </Text> 38 39 )} 39 40 </View>

+37

apps/amethyst/lib/utils.ts

··· 10 10 let first = arr.shift()?.toUpperCase(); 11 11 return (first || "") + arr.join(""); 12 12 } 13 13 + 14 14 + export function timeAgo(date: Date) { 15 15 + const seconds = Math.floor((new Date().getTime() - date.getTime()) / 1000); 16 16 + let interval = Math.floor(seconds / 31536000); 17 17 + 18 18 + // return date.toLocaleDateString("en-US"); 19 19 + if (interval > 1) { 20 20 + const formatter = new Intl.DateTimeFormat("en-US", { 21 21 + year: "numeric", 22 22 + month: "short", 23 23 + day: "numeric", 24 24 + hour: "numeric", 25 25 + minute: "numeric", 26 26 + }); 27 27 + return "on " + formatter.format(date); 28 28 + } 29 29 + interval = Math.floor(seconds / 86400); 30 30 + // return date without years 31 31 + if (interval > 1) { 32 32 + const formatter = new Intl.DateTimeFormat("en-US", { 33 33 + month: "short", 34 34 + day: "numeric", 35 35 + hour: "numeric", 36 36 + minute: "numeric", 37 37 + }); 38 38 + return "on " + formatter.format(date); 39 39 + } 40 40 + interval = Math.floor(seconds / 3600); 41 41 + if (interval > 1) { 42 42 + return interval + " hours ago"; 43 43 + } 44 44 + interval = Math.floor(seconds / 60); 45 45 + if (interval > 1) { 46 46 + return interval + " minutes ago"; 47 47 + } 48 48 + return Math.floor(seconds) + " seconds ago"; 49 49 + }