From 0cdc7ddc1863e41daa07401ad74b8927664f44f3 Mon Sep 17 00:00:00 2001 From: Sarah Gerrard Date: Mon, 4 May 2026 14:12:33 -0700 Subject: [PATCH 1/3] add img optimization for blog page --- src/routes/blog.index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/routes/blog.index.tsx b/src/routes/blog.index.tsx index ec628c81..8e337d0e 100644 --- a/src/routes/blog.index.tsx +++ b/src/routes/blog.index.tsx @@ -15,6 +15,7 @@ import { LibrariesWidget } from '~/components/LibrariesWidget' import { partners } from '~/utils/partners' import { PartnersRail, RightRail } from '~/components/RightRail' import { RecentPostsWidget } from '~/components/RecentPostsWidget' +import { getNetlifyImageUrl } from '~/utils/netlifyImage' type BlogFrontMatter = { slug: string @@ -109,7 +110,7 @@ function BlogIndex() { {headerImage ? (
Date: Mon, 4 May 2026 14:41:27 -0700 Subject: [PATCH 2/3] add lib badges to blogs --- content-collections.ts | 20 +++++++++ src/blog/ag-grid-partnership.md | 1 + src/blog/announcing-tanstack-form-v1.md | 1 + src/blog/announcing-tanstack-query-v4.md | 1 + src/blog/announcing-tanstack-query-v5.md | 1 + src/blog/announcing-tanstack-start-v1.md | 1 + src/blog/debug-logging-for-tanstack-ai.md | 1 + src/blog/from-docs-to-agents.md | 1 + src/blog/generation-hooks.md | 1 + ...-we-test-tanstack-ai-across-7-providers.md | 1 + src/blog/react-server-components.md | 1 + src/blog/search-params-are-state.md | 1 + src/blog/tanstack-ai-alpha-2.md | 1 + .../tanstack-ai-alpha-your-ai-your-way.md | 1 + src/blog/tanstack-ai-audio-generation.md | 1 + src/blog/tanstack-ai-code-mode.md | 1 + src/blog/tanstack-ai-lazy-tool-discovery.md | 1 + src/blog/tanstack-ai-middleware.md | 1 + src/blog/tanstack-ai-realtime-voice-chat.md | 1 + .../tanstack-ai-the-ai-function-postmortem.md | 1 + .../tanstack-ai-why-we-split-the-adapters.md | 1 + ...dded-client-database-for-tanstack-query.md | 1 + src/blog/tanstack-db-0.5-query-driven-sync.md | 1 + ...app-ready-with-persistence-and-includes.md | 1 + ...tack-router-route-matching-tree-rewrite.md | 1 + src/blog/tanstack-router-signal-graph.md | 1 + .../tanstack-router-typescript-performance.md | 1 + src/blog/tanstack-start-5x-ssr-throughput.md | 1 + src/blog/tanstack-start-solid-v2.md | 1 + .../type-safe-provider-tools-tanstack-ai.md | 1 + src/blog/who-owns-the-tree.md | 1 + src/blog/why-tanstack-start-and-router.md | 1 + ...why-tanstack-start-is-ditching-adapters.md | 1 + src/routes/blog.index.tsx | 42 ++++++++++++++++++- 34 files changed, 93 insertions(+), 1 deletion(-) diff --git a/content-collections.ts b/content-collections.ts index 5b57ffd7..ed389194 100644 --- a/content-collections.ts +++ b/content-collections.ts @@ -1,7 +1,26 @@ import { defineCollection, defineConfig } from '@content-collections/core' +import { libraryIds } from '~/libraries/libraries' import { normalizeRedirectFrom } from '~/utils/redirects' import { z } from 'zod' +const libraryIdSet = new Set(libraryIds) +const libraryListSchema = z.string().refine( + (value) => { + const libraries = value + .split(',') + .map((library) => library.trim()) + .filter(Boolean) + + return ( + libraries.length > 0 && + libraries.every((library) => libraryIdSet.has(library)) + ) + }, + { + message: `Expected comma-separated library ids: ${libraryIds.join(', ')}`, + }, +) + const posts = defineCollection({ name: 'posts', directory: './src/blog', @@ -12,6 +31,7 @@ const posts = defineCollection({ draft: z.boolean().optional(), excerpt: z.string(), authors: z.string().array(), + library: libraryListSchema.optional(), content: z.string(), redirect_from: z.string().array().optional(), }), diff --git a/src/blog/ag-grid-partnership.md b/src/blog/ag-grid-partnership.md index f9a30895..8dcf3e1d 100644 --- a/src/blog/ag-grid-partnership.md +++ b/src/blog/ag-grid-partnership.md @@ -2,6 +2,7 @@ title: TanStack Table + Ag-Grid Partnership published: 2022-06-17 excerpt: AG Grid is now the official TanStack Table open-source partner. Together we'll educate the ecosystem about the differences between the two libraries and when to choose which. +library: table authors: - Tanner Linsley - Niall Crosby diff --git a/src/blog/announcing-tanstack-form-v1.md b/src/blog/announcing-tanstack-form-v1.md index a69aadc8..d26fcd08 100644 --- a/src/blog/announcing-tanstack-form-v1.md +++ b/src/blog/announcing-tanstack-form-v1.md @@ -2,6 +2,7 @@ title: Announcing TanStack Form v1 published: 2025-03-03 excerpt: The first stable version of TanStack Form is live and ready for production. We support five frameworks at launch — React, Vue, Angular, Solid, and Lit. +library: form authors: - Corbin Crutchley --- diff --git a/src/blog/announcing-tanstack-query-v4.md b/src/blog/announcing-tanstack-query-v4.md index d570c423..2094f1ad 100644 --- a/src/blog/announcing-tanstack-query-v4.md +++ b/src/blog/announcing-tanstack-query-v4.md @@ -2,6 +2,7 @@ title: Announcing TanStack Query v4 published: 2022-07-14 excerpt: The next version of TanStack Query is here. The rebranding and monorepo restructuring finally allows us to bring the joy of react-query to other frameworks like Vue, Svelte, and Solid. +library: query authors: - Dominik Dorfmeister --- diff --git a/src/blog/announcing-tanstack-query-v5.md b/src/blog/announcing-tanstack-query-v5.md index 731c3091..b061bdea 100644 --- a/src/blog/announcing-tanstack-query-v5.md +++ b/src/blog/announcing-tanstack-query-v5.md @@ -2,6 +2,7 @@ title: Announcing TanStack Query v5 published: 2023-10-17 excerpt: After 91 alpha releases, 35 betas, and 16 release candidates, TanStack Query v5.0.0 is finally here — smaller, better, and more intuitive than ever. +library: query authors: - Dominik Dorfmeister --- diff --git a/src/blog/announcing-tanstack-start-v1.md b/src/blog/announcing-tanstack-start-v1.md index f36e81d0..eedc6956 100644 --- a/src/blog/announcing-tanstack-start-v1.md +++ b/src/blog/announcing-tanstack-start-v1.md @@ -2,6 +2,7 @@ title: TanStack Start v1 Release Candidate published: 2025-09-23 excerpt: TanStack Start has officially reached a v1.0 Release Candidate. This is the build we expect to ship as 1.0, pending your final feedback, docs polish, and a few last-mile fixes. +library: start authors: - Tanner Linsley --- diff --git a/src/blog/debug-logging-for-tanstack-ai.md b/src/blog/debug-logging-for-tanstack-ai.md index c9b952a0..a2b77690 100644 --- a/src/blog/debug-logging-for-tanstack-ai.md +++ b/src/blog/debug-logging-for-tanstack-ai.md @@ -2,6 +2,7 @@ title: 'One Flag, Every Chunk: Debug Logging Lands in TanStack AI' published: 2026-04-22 excerpt: "Your AI pipeline is a black box: a missing chunk, a middleware that doesn't fire, a tool call with mystery args. TanStack AI now ships pluggable, category-toggleable debug logging across every activity and adapter. Flip one flag and the pipeline prints itself." +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/from-docs-to-agents.md b/src/blog/from-docs-to-agents.md index e09c7a11..95ea15b6 100644 --- a/src/blog/from-docs-to-agents.md +++ b/src/blog/from-docs-to-agents.md @@ -2,6 +2,7 @@ title: 'Introducing TanStack Intent: Ship Agent Skills with your npm Packages' published: 2026-03-04 excerpt: Your docs are good. Your types are solid. Your agent still gets it wrong. TanStack Intent lets you ship agent skills alongside your npm packages so AI tools actually know how to use your library. +library: intent authors: - Sarah Gerrard - Kyle Mathews diff --git a/src/blog/generation-hooks.md b/src/blog/generation-hooks.md index ae32a064..2fdd1a8f 100644 --- a/src/blog/generation-hooks.md +++ b/src/blog/generation-hooks.md @@ -2,6 +2,7 @@ title: 'Generation Hooks: Type-Safe AI Beyond Chat' published: 2026-03-11 excerpt: Chat is just the beginning. Your AI app needs image generation, text-to-speech, transcription, and more. TanStack AI now ships generation hooks — a unified set of React hooks for every non-chat AI activity. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/how-we-test-tanstack-ai-across-7-providers.md b/src/blog/how-we-test-tanstack-ai-across-7-providers.md index 61aa0279..846b8e77 100644 --- a/src/blog/how-we-test-tanstack-ai-across-7-providers.md +++ b/src/blog/how-we-test-tanstack-ai-across-7-providers.md @@ -3,6 +3,7 @@ title: 'How We Test TanStack AI Across 7 Providers on Every PR' published: 2026-04-13 draft: false excerpt: "TanStack AI runs 147 deterministic E2E tests across 7 LLM providers in under 2 minutes. Here's the testing infrastructure that makes it possible." +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/react-server-components.md b/src/blog/react-server-components.md index fb8d40b5..fc9a1b9e 100644 --- a/src/blog/react-server-components.md +++ b/src/blog/react-server-components.md @@ -3,6 +3,7 @@ title: 'React Server Components Your Way' published: 2026-04-13 draft: false excerpt: RSCs are genuinely exciting — smaller bundles, streaming UI, moving heavy work off the client — but existing implementations force you into a one-size-fits-all pattern. What if you could fetch, cache, and compose them on your own terms? +library: start authors: - Manuel Schiller - Tanner Linsley diff --git a/src/blog/search-params-are-state.md b/src/blog/search-params-are-state.md index bd20daf3..176b77c1 100644 --- a/src/blog/search-params-are-state.md +++ b/src/blog/search-params-are-state.md @@ -2,6 +2,7 @@ title: Search Params Are State published: 2025-06-03 excerpt: Search params are global, serializable, and shareable — but in most apps they're hacked together with string parsing and brittle utils. They deserve to be treated as first-class state. +library: router authors: - Tanner Linsley --- diff --git a/src/blog/tanstack-ai-alpha-2.md b/src/blog/tanstack-ai-alpha-2.md index 0f5cdce3..f779deb1 100644 --- a/src/blog/tanstack-ai-alpha-2.md +++ b/src/blog/tanstack-ai-alpha-2.md @@ -2,6 +2,7 @@ title: 'TanStack AI Alpha 2: Every Modality, Better APIs, Smaller Bundles' published: 2025-12-19 excerpt: Two weeks since the first alpha and we've prototyped through 5-6 internal architectures. Alpha 2 brings every modality, better APIs, and smaller bundles. +library: ai authors: - Alem Tuzlak - Jack Herrington diff --git a/src/blog/tanstack-ai-alpha-your-ai-your-way.md b/src/blog/tanstack-ai-alpha-your-ai-your-way.md index d075eea0..7b75d45b 100644 --- a/src/blog/tanstack-ai-alpha-your-ai-your-way.md +++ b/src/blog/tanstack-ai-alpha-your-ai-your-way.md @@ -2,6 +2,7 @@ title: 'TanStack AI Alpha: Your AI, Your Way' published: 2025-12-04 excerpt: The current AI landscape has a problem — pick a framework, pick a cloud provider, and suddenly you're locked in. TanStack AI is a framework-agnostic toolkit built for developers who want control. +library: ai authors: - Jack Herrington - Alem Tuzlak diff --git a/src/blog/tanstack-ai-audio-generation.md b/src/blog/tanstack-ai-audio-generation.md index e2627011..78c84bec 100644 --- a/src/blog/tanstack-ai-audio-generation.md +++ b/src/blog/tanstack-ai-audio-generation.md @@ -2,6 +2,7 @@ title: 'TanStack AI Just Learned to Compose Music' published: 2026-04-24 excerpt: TanStack AI adds a new generateAudio activity with streaming, plus fal and Gemini Lyria adapters for music, sound effects, text-to-speech, and transcription. One typed API, any provider. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/tanstack-ai-code-mode.md b/src/blog/tanstack-ai-code-mode.md index cc523610..564bd9ee 100644 --- a/src/blog/tanstack-ai-code-mode.md +++ b/src/blog/tanstack-ai-code-mode.md @@ -2,6 +2,7 @@ title: 'Code Mode: Let Your AI Write Programs, Not Just Call Tools' published: 2026-04-08 excerpt: One tool call at a time is the bottleneck. TanStack AI Code Mode lets the LLM write and execute TypeScript programs in secure sandboxes, composing your tools with loops, conditionals, and Promise.all in a single shot. +library: ai authors: - Jack Herrington - Alem Tuzlak diff --git a/src/blog/tanstack-ai-lazy-tool-discovery.md b/src/blog/tanstack-ai-lazy-tool-discovery.md index 50a2baf5..8b7be141 100644 --- a/src/blog/tanstack-ai-lazy-tool-discovery.md +++ b/src/blog/tanstack-ai-lazy-tool-discovery.md @@ -2,6 +2,7 @@ title: 'Lazy Tool Discovery: Scaling AI Tool Systems Without Drowning in Tokens' published: 2026-03-12 excerpt: Every tool definition costs tokens and eats into the context window. Past a certain point it actually makes the model worse. Today we're shipping lazy tool discovery in TanStack AI. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/tanstack-ai-middleware.md b/src/blog/tanstack-ai-middleware.md index 68a82d08..244b5e5e 100644 --- a/src/blog/tanstack-ai-middleware.md +++ b/src/blog/tanstack-ai-middleware.md @@ -2,6 +2,7 @@ title: 'TanStack AI Just Got Middleware — And It Changes Everything' published: 2026-03-12 excerpt: Your chat endpoint starts simple, then you need logging, filtering, caching, rate limiting, and suddenly it's a 200-line monster. TanStack AI now ships a first-class middleware system. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/tanstack-ai-realtime-voice-chat.md b/src/blog/tanstack-ai-realtime-voice-chat.md index ff8a2779..78f831dd 100644 --- a/src/blog/tanstack-ai-realtime-voice-chat.md +++ b/src/blog/tanstack-ai-realtime-voice-chat.md @@ -2,6 +2,7 @@ title: 'Talk to Your AI: Realtime Voice Chat in TanStack AI' published: 2026-03-12 excerpt: Text-based chat is table stakes. TanStack AI now ships first-class support for realtime voice conversations — real voice, real time, with the AI hearing you, thinking, and responding naturally. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/tanstack-ai-the-ai-function-postmortem.md b/src/blog/tanstack-ai-the-ai-function-postmortem.md index fb8a9920..dfe7a804 100644 --- a/src/blog/tanstack-ai-the-ai-function-postmortem.md +++ b/src/blog/tanstack-ai-the-ai-function-postmortem.md @@ -2,6 +2,7 @@ title: 'The ai() Function That Almost Was' published: 2025-12-26 excerpt: We spent eight days building an API we had to kill. One function to rule them all, one function to control all adapters, one function to make it all typesafe — here's what happened. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/tanstack-ai-why-we-split-the-adapters.md b/src/blog/tanstack-ai-why-we-split-the-adapters.md index 93f4cf0a..fe2dcba1 100644 --- a/src/blog/tanstack-ai-why-we-split-the-adapters.md +++ b/src/blog/tanstack-ai-why-we-split-the-adapters.md @@ -2,6 +2,7 @@ title: 'TanStack AI: Why We Split the Adapters' published: 2026-01-02 excerpt: Instead of one monolithic adapter that does everything, we split into smaller adapters each in charge of a single functionality. Here's why that architectural change matters. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/tanstack-db-0.1-the-embedded-client-database-for-tanstack-query.md b/src/blog/tanstack-db-0.1-the-embedded-client-database-for-tanstack-query.md index 89e28998..eb838ea6 100644 --- a/src/blog/tanstack-db-0.1-the-embedded-client-database-for-tanstack-query.md +++ b/src/blog/tanstack-db-0.1-the-embedded-client-database-for-tanstack-query.md @@ -2,6 +2,7 @@ title: Stop Re-Rendering. TanStack DB, the Embedded Client Database for TanStack Query published: 2025-07-30 excerpt: Your React dashboard shouldn't grind to a halt because one TODO gets checked. TanStack DB is a client-side database powered by differential dataflow that plugs into your existing useQuery calls. +library: db authors: - Kyle Mathews - Sam Willis diff --git a/src/blog/tanstack-db-0.5-query-driven-sync.md b/src/blog/tanstack-db-0.5-query-driven-sync.md index 252e8c43..bb60765c 100644 --- a/src/blog/tanstack-db-0.5-query-driven-sync.md +++ b/src/blog/tanstack-db-0.5-query-driven-sync.md @@ -2,6 +2,7 @@ title: TanStack DB 0.5 . Query-Driven Sync published: 2025-11-12 excerpt: Your component's query is now the API call. No custom endpoint, no GraphQL resolver, no backend change. TanStack DB 0.5 introduces query-driven sync that eliminates the glue code between your UI and your data. +library: db authors: - Sam Willis - Kevin De Porre diff --git a/src/blog/tanstack-db-0.6-app-ready-with-persistence-and-includes.md b/src/blog/tanstack-db-0.6-app-ready-with-persistence-and-includes.md index 637d40e4..4972b9ce 100644 --- a/src/blog/tanstack-db-0.6-app-ready-with-persistence-and-includes.md +++ b/src/blog/tanstack-db-0.6-app-ready-with-persistence-and-includes.md @@ -3,6 +3,7 @@ title: TanStack DB 0.6 Now Includes Persistence, Offline Support, and Hierarchic excerpt: TanStack DB 0.6 adds SQLite-backed persistence across runtimes, hierarchical includes for projecting normalized data into UI-shaped trees, reactive effects, virtual props for sync state, and more. published: 2026-03-25 draft: false +library: db authors: - Sam Willis - Kevin De Porre diff --git a/src/blog/tanstack-router-route-matching-tree-rewrite.md b/src/blog/tanstack-router-route-matching-tree-rewrite.md index a1b9e49d..33cf5118 100644 --- a/src/blog/tanstack-router-route-matching-tree-rewrite.md +++ b/src/blog/tanstack-router-route-matching-tree-rewrite.md @@ -2,6 +2,7 @@ title: How we accidentally made route matching more performant by aiming for correctness published: 2025-11-18 excerpt: A rewrite aimed at fixing edge cases in route matching accidentally delivered a 20,000x performance improvement. Route matching is no longer bottlenecked by the number of routes in your application. +library: router authors: - Florian Pellet --- diff --git a/src/blog/tanstack-router-signal-graph.md b/src/blog/tanstack-router-signal-graph.md index 86c34e89..f6c38318 100644 --- a/src/blog/tanstack-router-signal-graph.md +++ b/src/blog/tanstack-router-signal-graph.md @@ -4,6 +4,7 @@ authors: - Florian Pellet title: "TanStack Router's New Reactive Core: A Signal Graph" excerpt: TanStack Router now uses a granular signal graph as its reactive core. State is derived from that graph, which narrows change propagation and makes client-side navigation faster in our benchmarks. +library: router --- ![veins of emerald as a signal graph embedded in the rock of a tropical island](/blog-assets/tanstack-router-signal-graph/header.jpg) diff --git a/src/blog/tanstack-router-typescript-performance.md b/src/blog/tanstack-router-typescript-performance.md index 587eaa4d..9a09550e 100644 --- a/src/blog/tanstack-router-typescript-performance.md +++ b/src/blog/tanstack-router-typescript-performance.md @@ -2,6 +2,7 @@ title: A milestone for TypeScript Performance in TanStack Router published: 2024-09-17 excerpt: TanStack Router pushes the boundaries on type-safe routing, but large route trees can slow down the editor. Here's how we achieved a major milestone in TypeScript performance. +library: router authors: - Christopher Horobin --- diff --git a/src/blog/tanstack-start-5x-ssr-throughput.md b/src/blog/tanstack-start-5x-ssr-throughput.md index 6cffce65..7799d484 100644 --- a/src/blog/tanstack-start-5x-ssr-throughput.md +++ b/src/blog/tanstack-start-5x-ssr-throughput.md @@ -5,6 +5,7 @@ authors: - Florian Pellet title: '5x SSR Throughput: Profiling SSR Hot Paths in TanStack Start' excerpt: 'How profiling under sustained load uncovered SSR hot paths in TanStack Start and led to a 5.5x throughput gain by removing unnecessary server-side work.' +library: start --- ![A flamegraph island in the tanstack universe](/blog-assets/tanstack-start-5x-ssr-throughput/header.png) diff --git a/src/blog/tanstack-start-solid-v2.md b/src/blog/tanstack-start-solid-v2.md index b71b8b43..c364c36e 100644 --- a/src/blog/tanstack-start-solid-v2.md +++ b/src/blog/tanstack-start-solid-v2.md @@ -2,6 +2,7 @@ title: 'Solid 2.0 Beta Support in TanStack Router, Start, and Query' published: 2026-04-10 excerpt: TanStack Router, Start, and Query now support the Solid 2.0 beta, so you can try Solid's next major release in real applications today. +library: router, start, query authors: - Brenley Dueck - Birk Skyum diff --git a/src/blog/type-safe-provider-tools-tanstack-ai.md b/src/blog/type-safe-provider-tools-tanstack-ai.md index e4c1412f..b356b262 100644 --- a/src/blog/type-safe-provider-tools-tanstack-ai.md +++ b/src/blog/type-safe-provider-tools-tanstack-ai.md @@ -2,6 +2,7 @@ title: 'Your AI Tool Calls Should Fail at Compile Time, Not in Production' published: 2026-04-22 excerpt: Provider tools like web search and code execution are supported on some models and silently ignored on others. TanStack AI now gates them per model at the type level, so incompatible pairings fail at compile time instead of in production. +library: ai authors: - Alem Tuzlak --- diff --git a/src/blog/who-owns-the-tree.md b/src/blog/who-owns-the-tree.md index 3f764c77..e3ece626 100644 --- a/src/blog/who-owns-the-tree.md +++ b/src/blog/who-owns-the-tree.md @@ -3,6 +3,7 @@ title: 'Who Owns the Tree? RSC as a Protocol, Not an Architecture' published: 2026-04-28 draft: false excerpt: RSC is usually framed as a single architecture where the server owns the tree. But it's also a protocol, and the protocol supports more than one composition model. The overlooked question is who owns the tree. +library: start authors: - Tanner Linsley redirect_from: diff --git a/src/blog/why-tanstack-start-and-router.md b/src/blog/why-tanstack-start-and-router.md index 6472a4f5..4e016837 100644 --- a/src/blog/why-tanstack-start-and-router.md +++ b/src/blog/why-tanstack-start-and-router.md @@ -2,6 +2,7 @@ title: Why choose TanStack Start and Router? published: 2024-12-03 excerpt: The frameworks we choose can make or break our developer experience. Here's why TanStack Start and Router offer a compelling alternative for building modern web applications. +library: start, router authors: - Tanner Linsley --- diff --git a/src/blog/why-tanstack-start-is-ditching-adapters.md b/src/blog/why-tanstack-start-is-ditching-adapters.md index 04165096..0621a2fd 100644 --- a/src/blog/why-tanstack-start-is-ditching-adapters.md +++ b/src/blog/why-tanstack-start-is-ditching-adapters.md @@ -2,6 +2,7 @@ title: Why TanStack Start is Ditching Adapters published: 2024-11-22 excerpt: Every cloud environment has its own quirky incantations to get things working. We're dropping custom adapters in TanStack Start and building on Nitro instead — here's why. +library: start authors: - Tanner Linsley --- diff --git a/src/routes/blog.index.tsx b/src/routes/blog.index.tsx index 8e337d0e..79a71303 100644 --- a/src/routes/blog.index.tsx +++ b/src/routes/blog.index.tsx @@ -11,6 +11,7 @@ import { PostNotFound } from './blog' import { createServerFn } from '@tanstack/react-start' import { setResponseHeaders } from '@tanstack/react-start/server' import { RssIcon } from 'lucide-react' +import { findLibrary, type LibrarySlim } from '~/libraries' import { LibrariesWidget } from '~/components/LibrariesWidget' import { partners } from '~/utils/partners' import { PartnersRail, RightRail } from '~/components/RightRail' @@ -24,6 +25,22 @@ type BlogFrontMatter = { excerpt: string headerImage: string | undefined authors: string[] + library: string | undefined +} + +function isLibrarySlim(library: LibrarySlim | undefined): library is LibrarySlim { + return library !== undefined +} + +function getBlogLibraries(library: string | undefined) { + if (!library) { + return [] + } + + return library + .split(',') + .map((libraryId) => findLibrary(libraryId.trim())) + .filter(isLibrarySlim) } const fetchFrontMatters = createServerFn({ method: 'GET' }).handler( @@ -44,6 +61,7 @@ const fetchFrontMatters = createServerFn({ method: 'GET' }).handler( excerpt: post.excerpt, headerImage: post.headerImage, authors: post.authors, + library: post.library, } }) @@ -98,7 +116,17 @@ function BlogIndex() {
{frontMatters.map( - ({ slug, title, published, excerpt, headerImage, authors }) => { + ({ + slug, + title, + published, + excerpt, + headerImage, + authors, + library, + }) => { + const blogLibraries = getBlogLibraries(library) + return ( + {blogLibraries.length ? ( +
+ {blogLibraries.map((library) => ( +
+ {library.name.replace('TanStack ', '')} +
+ ))} +
+ ) : null} {headerImage ? (
Date: Mon, 4 May 2026 14:41:55 -0700 Subject: [PATCH 3/3] formatting --- src/routes/blog.index.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/routes/blog.index.tsx b/src/routes/blog.index.tsx index 79a71303..ea4e5945 100644 --- a/src/routes/blog.index.tsx +++ b/src/routes/blog.index.tsx @@ -28,7 +28,9 @@ type BlogFrontMatter = { library: string | undefined } -function isLibrarySlim(library: LibrarySlim | undefined): library is LibrarySlim { +function isLibrarySlim( + library: LibrarySlim | undefined, +): library is LibrarySlim { return library !== undefined }