+8 -11

src/lib/cards/StatusphereCard/EditStatusphereCard.svelte

··· 26 } 27 }); 28 0 0 0 29 let showPopover = $state(false); 30 </script> 31 32 <div class="flex h-full w-full items-center justify-center p-4"> 33 <PopoverEmojiPicker 34 bind:open={showPopover} 35 - onpicked={(emoji) => { 36 - record ??= { 37 - value: {} 38 - }; 39 - 40 - record.value.status = emoji.unicode; 41 - 42 item.cardData.hasUpdate = true; 43 - item.cardData.emoji = emoji.unicode; 44 45 showPopover = false; 46 }} 47 > 48 {#snippet child({ props })} 49 - {@const animated = emojiToNotoAnimatedWebp(record?.value?.status)} 50 51 <button {...props} class="z-20 h-full max-h-40 w-full max-w-40"> 52 {#if animated} ··· 55 alt="" 56 class="hover:bg-base-500/10 h-full max-h-40 w-full max-w-40 rounded-2xl object-contain" 57 /> 58 - {:else if record?.value?.status} 59 <div class="text-9xl"> 60 - {record.value.status} 61 </div> 62 {:else} 63 <div>Click here to set a status</div>

··· 26 } 27 }); 28 29 + // Use card-specific emoji if set, otherwise fall back to PDS data 30 + let emoji = $derived(item.cardData?.emoji ?? record?.value?.status); 31 + 32 let showPopover = $state(false); 33 </script> 34 35 <div class="flex h-full w-full items-center justify-center p-4"> 36 <PopoverEmojiPicker 37 bind:open={showPopover} 38 + onpicked={(picked) => { 0 0 0 0 0 0 39 item.cardData.hasUpdate = true; 40 + item.cardData.emoji = picked.unicode; 41 42 showPopover = false; 43 }} 44 > 45 {#snippet child({ props })} 46 + {@const animated = emojiToNotoAnimatedWebp(emoji)} 47 48 <button {...props} class="z-20 h-full max-h-40 w-full max-w-40"> 49 {#if animated} ··· 52 alt="" 53 class="hover:bg-base-500/10 h-full max-h-40 w-full max-w-40 rounded-2xl object-contain" 54 /> 55 + {:else if emoji} 56 <div class="text-9xl"> 57 + {emoji} 58 </div> 59 {:else} 60 <div>Click here to set a status</div>

+5 -3

src/lib/cards/StatusphereCard/StatusphereCard.svelte

··· 9 // svelte-ignore state_referenced_locally 10 let record = $state(data[item.cardType] as any); 11 12 - let animated = $derived(emojiToNotoAnimatedWebp(record?.value?.status)); 0 0 13 </script> 14 15 <div class="flex h-full w-full items-center justify-center p-4"> 16 {#if animated} 17 <img src={animated} alt="" class="h-full max-h-40 w-full object-contain" /> 18 - {:else if record?.value?.status} 19 <div class="text-9xl"> 20 - {record?.value?.status} 21 </div> 22 {:else} 23 No status yet

··· 9 // svelte-ignore state_referenced_locally 10 let record = $state(data[item.cardType] as any); 11 12 + // Use card-specific emoji if set, otherwise fall back to PDS data 13 + let emoji = $derived(item.cardData?.emoji ?? record?.value?.status); 14 + let animated = $derived(emojiToNotoAnimatedWebp(emoji)); 15 </script> 16 17 <div class="flex h-full w-full items-center justify-center p-4"> 18 {#if animated} 19 <img src={animated} alt="" class="h-full max-h-40 w-full object-contain" /> 20 + {:else if emoji} 21 <div class="text-9xl"> 22 + {emoji} 23 </div> 24 {:else} 25 No status yet

+1 -1

src/lib/cards/StatusphereCard/index.ts

··· 36 } 37 }); 38 delete item.cardData.hasUpdate; 39 - delete item.cardData.emoji; 40 } 41 42 return item;

··· 36 } 37 }); 38 delete item.cardData.hasUpdate; 39 + // Keep item.cardData.emoji so each card can have its own status 40 } 41 42 return item;