Personal Site
0
fork

Configure Feed

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

Render the embeds

+105
+105
src/components/home/feeds/BskyPost.astro
··· 229 229 style="clear:both;" 230 230 set:text={post.text.replace(/^\s*/g, "").replace(/\s*$/, "")} 231 231 /> 232 + 233 + { 234 + embed 235 + ? await (async () => { 236 + switch (embed?.$type) { 237 + case "app.bsky.embed.images": { 238 + return embed.images.map((image) => ( 239 + <img src={cidSrc(image.cid, author.did)} alt={image.alt} /> 240 + )); 241 + } 242 + 243 + case "app.bsky.embed.video": { 244 + return ( 245 + <video 246 + controls 247 + src={cidSrc(embed.cid, author.did)} 248 + crossorigin="anonymous" 249 + > 250 + {embed.subtitles && 251 + embed.subtitles.map((track, i) => { 252 + console.log(track, cidSrc(track.cid, author.did)); 253 + return ( 254 + <track 255 + default={i === 0} 256 + kind="captions" 257 + srclang={track.lang} 258 + src={cidSrc(track.cid, author.did)} 259 + /> 260 + ); 261 + })} 262 + </video> 263 + ); 264 + } 265 + 266 + case "app.bsky.embed.external": { 267 + return ( 268 + <a href={embed.url}> 269 + <pre 270 + set:html={`${embed.title}${embed.thumb ? `\n<img src="${cidSrc(embed.thumb, author.did)}" />` : ""}`} 271 + /> 272 + </a> 273 + ); 274 + } 275 + 276 + case "app.bsky.embed.record": { 277 + return ( 278 + <ul> 279 + <li> 280 + <Astro.self post={embed.record} author={embed.author} /> 281 + </li> 282 + </ul> 283 + ); 284 + } 285 + 286 + case "app.bsky.embed.recordWithMedia": { 287 + return ( 288 + <> 289 + {embed.media.$type === "app.bsky.embed.images" ? ( 290 + embed.media.images.map((image) => ( 291 + <img 292 + src={cidSrc(image.cid, author.did)} 293 + alt={image.alt} 294 + /> 295 + )) 296 + ) : embed.media.$type === "app.bsky.embed.video" ? ( 297 + <video 298 + controls 299 + src={cidSrc(embed.media.cid, author.did)} 300 + crossorigin="anonymous" 301 + > 302 + {embed.media.subtitles && 303 + embed.media.subtitles.map((track, i) => { 304 + console.log(track, cidSrc(track.cid, author.did)); 305 + return ( 306 + <track 307 + default={i === 0} 308 + kind="captions" 309 + srclang={track.lang} 310 + src={cidSrc(track.cid, author.did)} 311 + /> 312 + ); 313 + })} 314 + </video> 315 + ) : ( 316 + <a href={embed.media.url}> 317 + <pre 318 + set:html={`${embed.media.title}${embed.media.thumb ? `\n<img src="${cidSrc(embed.media.thumb, author.did)}" />` : ""}`} 319 + /> 320 + </a> 321 + )} 322 + <ul> 323 + <li> 324 + <Astro.self 325 + post={embed.record.record} 326 + author={embed.record.author} 327 + /> 328 + </li> 329 + </ul> 330 + </> 331 + ); 332 + } 333 + } 334 + })() 335 + : null 336 + } 232 337 </div> 233 338 234 339 <style>