@btst/stack 1.1.6 → 1.1.8

package/dist/plugins/blog/query-keys.mjs

@@ -16,13 +16,13 @@ function toError(error) {
   }
   return new Error(String(error));
 }
-function createBlogQueryKeys(client) {
-  const posts = createPostsQueries(client);
-  const drafts = createDraftsQueries(client);
-  const tags = createTagsQueries(client);
+function createBlogQueryKeys(client, headers) {
+  const posts = createPostsQueries(client, headers);
+  const drafts = createDraftsQueries(client, headers);
+  const tags = createTagsQueries(client, headers);
   return mergeQueryKeys(posts, drafts, tags);
 }
-function createPostsQueries(client) {
+function createPostsQueries(client, headers) {
   return createQueryKeys("posts", {
     list: (params) => ({
       queryKey: [
@@ -43,7 +43,8 @@ function createPostsQueries(client) {
               limit: params?.limit ?? 10,
               published: params?.published !== void 0 ? params.published ? "true" : "false" : void 0,
               tagSlug: params?.tagSlug
-            }
+            },
+            headers
           });
           if (isErrorResponse(response)) {
             const errorResponse = response;
@@ -63,7 +64,8 @@ function createPostsQueries(client) {
         try {
           const response = await client("/posts", {
             method: "GET",
-            query: { slug, limit: 1 }
+            query: { slug, limit: 1 },
+            headers
           });
           if (isErrorResponse(response)) {
             const errorResponse = response;
@@ -85,7 +87,8 @@ function createPostsQueries(client) {
           method: "GET",
           query: {
             date: dateValue.toISOString()
-          }
+          },
+          headers
         });
         if (isErrorResponse(response)) {
           const errorResponse = response;
@@ -105,7 +108,8 @@ function createPostsQueries(client) {
             query: {
               limit: params?.limit ?? 5,
               published: "true"
-            }
+            },
+            headers
           });
           if (isErrorResponse(response)) {
             const errorResponse = response;
@@ -123,7 +127,7 @@ function createPostsQueries(client) {
     })
   });
 }
-function createDraftsQueries(client) {
+function createDraftsQueries(client, headers) {
   return createQueryKeys("drafts", {
     list: (params) => ({
       queryKey: [
@@ -140,7 +144,8 @@ function createDraftsQueries(client) {
               offset: pageParam ?? 0,
               limit: params?.limit ?? 10,
               published: "false"
-            }
+            },
+            headers
           });
           if (isErrorResponse(response)) {
             const errorResponse = response;
@@ -154,14 +159,15 @@ function createDraftsQueries(client) {
     })
   });
 }
-function createTagsQueries(client) {
+function createTagsQueries(client, headers) {
   return createQueryKeys("tags", {
     list: () => ({
       queryKey: ["tags"],
       queryFn: async () => {
         try {
           const response = await client("/tags", {
-            method: "GET"
+            method: "GET",
+            headers
           });
           if (isErrorResponse(response)) {
             const errorResponse = response;

package/dist/plugins/blog/style.css

@@ -11,11 +11,8 @@
 /* Scan this package's source files for Tailwind classes */
 @source "../../../src/**/*.{ts,tsx}";
 
-/* Scan UI package components (if in monorepo) */
-@source "../../../../@workspace/ui/src/**/*.{ts,tsx}";
-
-/* Scan UI package components (if installed as npm package) */
-@source "../../../node_modules/@workspace/ui/src/**/*.{ts,tsx}";
+/* Scan UI package components (when installed as npm package the UI package will be in this dir) */
+@source "../../packages/ui/src";
 
 /*
 * alternatively consumer can use @source "../node_modules/@btst/stack/src/**\/*.{ts,tsx}";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@btst/stack",
-  "version": "1.1.6",
+  "version": "1.1.8",
   "description": "A composable, plugin-based library for building full-stack applications.",
   "repository": {
     "type": "git",
@@ -157,7 +157,7 @@
     }
   },
   "dependencies": {
-    "@btst/db": "1.0.2",
+    "@btst/db": "1.0.3",
     "@lukemorales/query-key-factory": "^1.3.4",
     "@milkdown/crepe": "^7.17.1",
     "@milkdown/kit": "^7.17.1",
@@ -196,7 +196,7 @@
     "zod": ">=3.24.0"
   },
   "devDependencies": {
-    "@btst/adapter-memory": "1.0.2",
+    "@btst/adapter-memory": "1.0.3",
     "@btst/yar": "1.1.1",
     "@types/react": "^19.0.0",
     "@types/slug": "^5.0.9",

package/src/plugins/blog/api/plugin.ts

@@ -661,17 +661,27 @@ export const blogBackendPlugin = (hooks?: BlogBackendHooks) =>
 						}
 
 						const date = query.date;
-
-						// Get previous post (createdAt < date, newest first)
-						const previousPost = await adapter.findMany<Post>({
+						const targetTime = new Date(date).getTime();
+
+						// Window-based approach for finding next/previous posts
+						// This avoids relying on comparison operators (lt/gt) which may not be
+						// consistently implemented across all database adapters (e.g., Drizzle).
+						//
+						// Strategy:
+						// 1. Fetch a window of recent published posts (sorted by date DESC)
+						// 2. Filter in memory to find posts immediately before/after target date
+						//
+						// Trade-offs:
+						// - Works reliably across all adapters (only uses eq operator and sorting)
+						// - Efficient for typical blog sizes (100 most recent posts)
+						// - Limitation: If target post is outside the window, we may not find neighbors
+						//   (acceptable for typical blog navigation where users browse recent content)
+						const WINDOW_SIZE = 100;
+
+						const allPosts = await adapter.findMany<Post>({
 							model: "post",
-							limit: 1,
+							limit: WINDOW_SIZE,
 							where: [
-								{
-									field: "createdAt",
-									value: date,
-									operator: "lt" as const,
-								},
 								{
 									field: "published",
 									value: true,
@@ -684,30 +694,40 @@ export const blogBackendPlugin = (hooks?: BlogBackendHooks) =>
 							},
 						});
 
-						const nextPost = await adapter.findMany<Post>({
-							model: "post",
-							limit: 1,
-							where: [
-								{
-									field: "createdAt",
-									value: date,
-									operator: "gt" as const,
-								},
-								{
-									field: "published",
-									value: true,
-									operator: "eq" as const,
-								},
-							],
-							sortBy: {
-								field: "createdAt",
-								direction: "asc",
-							},
+						// Sort posts by createdAt descending (newest first)
+						const sortedPosts = allPosts.sort((a, b) => {
+							const timeA = new Date(a.createdAt).getTime();
+							const timeB = new Date(b.createdAt).getTime();
+							return timeB - timeA;
 						});
 
+						// Find posts immediately before and after the target date
+						// In DESC sorted array: newer posts come before, older posts come after
+						let previousPost: Post | null = null;
+						let nextPost: Post | null = null;
+
+						for (let i = 0; i < sortedPosts.length; i++) {
+							const post = sortedPosts[i];
+							if (!post) continue;
+
+							const postTime = new Date(post.createdAt).getTime();
+
+							if (postTime > targetTime) {
+								// This post is newer than target - it's a next post candidate
+								// Keep the last one we find (closest to target date)
+								nextPost = post;
+							} else if (postTime < targetTime) {
+								// This is the first post older than target - this is the previous post
+								previousPost = post;
+								// We've found both neighbors, no need to continue
+								break;
+							}
+							// Skip posts with exactly the same timestamp (the current post itself)
+						}
+
 						const postIds = [
-							...(previousPost?.[0] ? [previousPost[0].id] : []),
-							...(nextPost?.[0] ? [nextPost[0].id] : []),
+							...(previousPost ? [previousPost.id] : []),
+							...(nextPost ? [nextPost.id] : []),
 						];
 						const postTagsMap = await loadTagsForPosts(
 							postIds,
@@ -716,16 +736,16 @@ export const blogBackendPlugin = (hooks?: BlogBackendHooks) =>
 						);
 
 						return {
-							previous: previousPost?.[0]
+							previous: previousPost
 								? {
-										...previousPost[0],
-										tags: postTagsMap.get(previousPost[0].id) || [],
+										...previousPost,
+										tags: postTagsMap.get(previousPost.id) || [],
 									}
 								: null,
-							next: nextPost?.[0]
+							next: nextPost
 								? {
-										...nextPost[0],
-										tags: postTagsMap.get(nextPost[0].id) || [],
+										...nextPost,
+										tags: postTagsMap.get(nextPost.id) || [],
 									}
 								: null,
 						};

package/src/plugins/blog/client/components/pages/post-page.internal.tsx

@@ -84,7 +84,7 @@ export function PostPage({ slug }: { slug: string }) {
 					/>
 
 					{post.image && (
-						<div className="flex flex-col gap-2 mt-6 aspect-video w-full relative">
+						<div className="flex flex-col gap-2 my-6 aspect-video w-full relative">
 							<Image
 								src={post.image}
 								alt={post.title}
@@ -122,12 +122,12 @@ function PostHeaderTop({ post }: { post: SerializedPost }) {
 	});
 	const basePath = useBasePath();
 	return (
-		<div className="flex flex-row items-center gap-2 flex-wrap mt-8">
+		<div className="flex flex-row items-center justify-center gap-2 flex-wrap mt-8">
 			<span className="font-light text-muted-foreground text-sm">
 				{formatDate(post.createdAt, "MMMM d, yyyy")}
 			</span>
 			{post.tags && post.tags.length > 0 && (
-				<div className="flex flex-wrap gap-2">
+				<>
 					{post.tags.map((tag) => (
 						<Link key={tag.id} href={`${basePath}/blog/tag/${tag.slug}`}>
 							<Badge variant="secondary" className="text-xs">
@@ -135,7 +135,7 @@ function PostHeaderTop({ post }: { post: SerializedPost }) {
 							</Badge>
 						</Link>
 					))}
-				</div>
+				</>
 			)}
 		</div>
 	);

package/src/plugins/blog/client/components/shared/default-error.tsx

@@ -15,6 +15,9 @@ export function DefaultError({ error }: FallbackProps) {
 		localization: BLOG_LOCALIZATION,
 	});
 	const title = localization.BLOG_GENERIC_ERROR_TITLE;
-	const message = error?.message ?? localization.BLOG_GENERIC_ERROR_MESSAGE;
+	const message =
+		process.env.NODE_ENV === "production"
+			? localization.BLOG_GENERIC_ERROR_MESSAGE
+			: (error?.message ?? localization.BLOG_GENERIC_ERROR_MESSAGE);
 	return <ErrorPlaceholder title={title} message={message} />;
 }

package/src/plugins/blog/client/hooks/blog-hooks.tsx

@@ -86,7 +86,7 @@ export type PostUpdateInput = z.infer<typeof updatePostSchema>;
  * Hook for fetching paginated posts with load more functionality
  */
 export function usePosts(options: UsePostsOptions = {}): UsePostsResult {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
@@ -100,7 +100,7 @@ export function usePosts(options: UsePostsOptions = {}): UsePostsResult {
 		query,
 		published,
 	} = options;
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 
 	const queryParams = {
 		tag,
@@ -155,7 +155,7 @@ export function useSuspensePosts(options: UsePostsOptions = {}): {
 	isLoadingMore: boolean;
 	refetch: () => Promise<unknown>;
 } {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
@@ -169,7 +169,7 @@ export function useSuspensePosts(options: UsePostsOptions = {}): {
 		query,
 		published,
 	} = options;
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 
 	const queryParams = { tag, tagSlug, limit, query, published };
 	const basePosts = queries.posts.list(queryParams);
@@ -214,13 +214,13 @@ export function useSuspensePosts(options: UsePostsOptions = {}): {
  * Hook for fetching a single post by slug
  */
 export function usePost(slug?: string): UsePostResult {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
 		basePath: apiBasePath,
 	});
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 
 	const basePost = queries.posts.detail(slug ?? "");
 	const { data, isLoading, error, refetch } = useQuery<
@@ -247,13 +247,13 @@ export function useSuspensePost(slug: string): {
 	post: SerializedPost | null;
 	refetch: () => Promise<unknown>;
 } {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
 		basePath: apiBasePath,
 	});
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 	const basePost = queries.posts.detail(slug);
 	const { data, refetch, error, isFetching } = useSuspenseQuery<
 		SerializedPost | null,
@@ -283,13 +283,13 @@ export function useTags(): {
 	error: Error | null;
 	refetch: () => void;
 } {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
 		basePath: apiBasePath,
 	});
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 	const baseTags = queries.tags.list();
 	const { data, isLoading, error, refetch } = useQuery<
 		SerializedTag[] | null,
@@ -315,13 +315,13 @@ export function useSuspenseTags(): {
 	tags: SerializedTag[];
 	refetch: () => Promise<unknown>;
 } {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
 		basePath: apiBasePath,
 	});
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 	const baseTags = queries.tags.list();
 	const { data, refetch, error, isFetching } = useSuspenseQuery<
 		SerializedTag[] | null,
@@ -555,13 +555,13 @@ export function useNextPreviousPosts(
 	ref: (node: Element | null) => void;
 	inView: boolean;
 } {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
 		basePath: apiBasePath,
 	});
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 
 	const { ref, inView } = useInView({
 		// start a little early so the data is ready as it scrolls in
@@ -619,13 +619,13 @@ export function useRecentPosts(
 	ref: (node: Element | null) => void;
 	inView: boolean;
 } {
-	const { apiBaseURL, apiBasePath } =
+	const { apiBaseURL, apiBasePath, headers } =
 		usePluginOverrides<BlogPluginOverrides>("blog");
 	const client = createApiClient<BlogApiRouter>({
 		baseURL: apiBaseURL,
 		basePath: apiBasePath,
 	});
-	const queries = createBlogQueryKeys(client);
+	const queries = createBlogQueryKeys(client, headers);
 
 	const { ref, inView } = useInView({
 		// start a little early so the data is ready as it scrolls in

package/src/plugins/blog/client/overrides.ts

@@ -57,6 +57,10 @@ export interface BlogPluginOverrides {
 	 * Whether to show the attribution
 	 */
 	showAttribution?: boolean;
+	/**
+	 * Optional headers to pass with API requests (e.g., for SSR auth)
+	 */
+	headers?: HeadersInit;
 
 	// Lifecycle Hooks (optional)
 	/**

package/src/plugins/blog/client/plugin.tsx

@@ -58,6 +58,9 @@ export interface BlogClientConfig {
 
 	// Optional hooks
 	hooks?: BlogClientHooks;
+
+	// Optional headers for SSR (e.g., forwarding cookies)
+	headers?: HeadersInit;
 }
 
 /**
@@ -65,7 +68,7 @@ export interface BlogClientConfig {
  * All hooks are optional and allow consumers to customize behavior
  */
 export interface BlogClientHooks {
-	// Loader Hooks - called during data loading (SSR or CSR)
+	// Loader Hooks - called during data loading (SSR)
 	beforeLoadPosts?: (
 		filter: { published: boolean },
 		context: LoaderContext,
@@ -74,7 +77,7 @@ export interface BlogClientHooks {
 		posts: Post[] | null,
 		filter: { published: boolean },
 		context: LoaderContext,
-	) => Promise<void> | void;
+	) => Promise<boolean> | boolean;
 	beforeLoadPost?: (
 		slug: string,
 		context: LoaderContext,
@@ -83,7 +86,9 @@ export interface BlogClientHooks {
 		post: Post | null,
 		slug: string,
 		context: LoaderContext,
-	) => Promise<void> | void;
+	) => Promise<boolean> | boolean;
+	beforeLoadNewPost?: (context: LoaderContext) => Promise<boolean> | boolean;
+	afterLoadNewPost?: (context: LoaderContext) => Promise<boolean> | boolean;
 	onLoadError?: (error: Error, context: LoaderContext) => Promise<void> | void;
 }
 
@@ -91,7 +96,7 @@ export interface BlogClientHooks {
 function createPostsLoader(published: boolean, config: BlogClientConfig) {
 	return async () => {
 		if (typeof window === "undefined") {
-			const { queryClient, apiBasePath, apiBaseURL, hooks } = config;
+			const { queryClient, apiBasePath, apiBaseURL, hooks, headers } = config;
 
 			const context: LoaderContext = {
 				path: published ? "/blog" : "/blog/drafts",
@@ -116,7 +121,7 @@ function createPostsLoader(published: boolean, config: BlogClientConfig) {
 				});
 
 				// note: for a module not to be bundled with client, and to be shared by client and server we need to add it to build.config.ts as an entry
-				const queries = createBlogQueryKeys(client);
+				const queries = createBlogQueryKeys(client, headers);
 				const listQuery = queries.posts.list({
 					query: undefined,
 					limit,
@@ -140,7 +145,14 @@ function createPostsLoader(published: boolean, config: BlogClientConfig) {
 				if (hooks?.afterLoadPosts) {
 					const posts =
 						queryClient.getQueryData<Post[]>(listQuery.queryKey) || null;
-					await hooks.afterLoadPosts(posts, { published }, context);
+					const canContinue = await hooks.afterLoadPosts(
+						posts,
+						{ published },
+						context,
+					);
+					if (canContinue === false) {
+						throw new Error("Load prevented by afterLoadPosts hook");
+					}
 				}
 
 				// Check if there was an error after afterLoadPosts hook
@@ -170,7 +182,7 @@ function createPostsLoader(published: boolean, config: BlogClientConfig) {
 function createPostLoader(slug: string, config: BlogClientConfig) {
 	return async () => {
 		if (typeof window === "undefined") {
-			const { queryClient, apiBasePath, apiBaseURL, hooks } = config;
+			const { queryClient, apiBasePath, apiBaseURL, hooks, headers } = config;
 
 			const context: LoaderContext = {
 				path: `/blog/${slug}`,
@@ -193,7 +205,7 @@ function createPostLoader(slug: string, config: BlogClientConfig) {
 					baseURL: apiBaseURL,
 					basePath: apiBasePath,
 				});
-				const queries = createBlogQueryKeys(client);
+				const queries = createBlogQueryKeys(client, headers);
 				const postQuery = queries.posts.detail(slug);
 				await queryClient.prefetchQuery(postQuery);
 
@@ -205,7 +217,10 @@ function createPostLoader(slug: string, config: BlogClientConfig) {
 				if (hooks?.afterLoadPost) {
 					const post =
 						queryClient.getQueryData<Post>(postQuery.queryKey) || null;
-					await hooks.afterLoadPost(post, slug, context);
+					const canContinue = await hooks.afterLoadPost(post, slug, context);
+					if (canContinue === false) {
+						throw new Error("Load prevented by afterLoadPost hook");
+					}
 				}
 
 				// Check if there was an error after afterLoadPost hook
@@ -232,10 +247,50 @@ function createPostLoader(slug: string, config: BlogClientConfig) {
 	};
 }
 
+function createNewPostLoader(config: BlogClientConfig) {
+	return async () => {
+		if (typeof window === "undefined") {
+			const { apiBasePath, apiBaseURL, hooks } = config;
+
+			const context: LoaderContext = {
+				path: "/blog/new",
+				isSSR: true,
+				apiBaseURL,
+				apiBasePath,
+			};
+
+			try {
+				// Before hook
+				if (hooks?.beforeLoadNewPost) {
+					const canLoad = await hooks.beforeLoadNewPost(context);
+					if (!canLoad) {
+						throw new Error("Load prevented by beforeLoadNewPost hook");
+					}
+				}
+
+				// After hook
+				if (hooks?.afterLoadNewPost) {
+					const canContinue = await hooks.afterLoadNewPost(context);
+					if (canContinue === false) {
+						throw new Error("Load prevented by afterLoadNewPost hook");
+					}
+				}
+			} catch (error) {
+				// Error hook - log the error but don't throw during SSR
+				// Let Error Boundaries handle errors when components render
+				if (hooks?.onLoadError) {
+					await hooks.onLoadError(error as Error, context);
+				}
+				// Don't re-throw - let Error Boundary catch it during render
+			}
+		}
+	};
+}
+
 function createTagLoader(tagSlug: string, config: BlogClientConfig) {
 	return async () => {
 		if (typeof window === "undefined") {
-			const { queryClient, apiBasePath, apiBaseURL, hooks } = config;
+			const { queryClient, apiBasePath, apiBaseURL, hooks, headers } = config;
 
 			const context: LoaderContext = {
 				path: `/blog/tag/${tagSlug}`,
@@ -252,7 +307,7 @@ function createTagLoader(tagSlug: string, config: BlogClientConfig) {
 					basePath: apiBasePath,
 				});
 
-				const queries = createBlogQueryKeys(client);
+				const queries = createBlogQueryKeys(client, headers);
 				const listQuery = queries.posts.list({
 					query: undefined,
 					limit,
@@ -581,6 +636,7 @@ export const blogClientPlugin = (config: BlogClientConfig) =>
 			newPost: createRoute("/blog/new", () => {
 				return {
 					PageComponent: NewPostPageComponent,
+					loader: createNewPostLoader(config),
 					meta: createNewPostMeta(config),
 				};
 			}),