@btst/stack 2.12.2 → 3.0.0-rc.1

package/dist/packages/stack/src/plugins/blog/client/plugin.mjs

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
-import { defineClientPlugin, createApiClient, runClientHookWithShim, isConnectionError } from '@btst/stack/plugins/client';
-import { createRoute } from '@btst/yar';
+import { defineClientPlugin, createApiClient, isConnectionError } from '@btst/stack/plugins/client';
+import { defineRoutes, defineRoute } from '@btst/yar';
 import { createSanitizedSSRLoaderError } from '../../utils.mjs';
 import { createBlogQueryKeys } from '../../../../../../plugins/blog/query-keys.mjs';
 import { HomePageComponent } from './components/pages/home-page.mjs';
@@ -33,10 +33,7 @@ function createPostsLoader(published, config) {
       });
       try {
         if (hooks?.beforeLoadPosts) {
-          await runClientHookWithShim(
-            () => hooks.beforeLoadPosts({ published }, context),
-            "Load prevented by beforeLoadPosts hook"
-          );
+          await hooks.beforeLoadPosts({ published }, context);
         }
         await queryClient.prefetchInfiniteQuery({
           ...listQuery,
@@ -46,10 +43,7 @@ function createPostsLoader(published, config) {
         await queryClient.prefetchQuery(tagsQuery);
         if (hooks?.afterLoadPosts) {
           const posts = queryClient.getQueryData(listQuery.queryKey) || null;
-          await runClientHookWithShim(
-            () => hooks.afterLoadPosts(posts, { published }, context),
-            "Load prevented by afterLoadPosts hook"
-          );
+          await hooks.afterLoadPosts(posts, { published }, context);
         }
         const queryState = queryClient.getQueryState(listQuery.queryKey);
         if (queryState?.error) {
@@ -95,10 +89,7 @@ function createPostLoader(slug, config, path) {
       };
       try {
         if (hooks?.beforeLoadPost) {
-          await runClientHookWithShim(
-            () => hooks.beforeLoadPost(slug, context),
-            "Load prevented by beforeLoadPost hook"
-          );
+          await hooks.beforeLoadPost(slug, context);
         }
         const client = createApiClient({
           baseURL: apiBaseURL,
@@ -109,10 +100,7 @@ function createPostLoader(slug, config, path) {
         await queryClient.prefetchQuery(postQuery);
         if (hooks?.afterLoadPost) {
           const post = queryClient.getQueryData(postQuery.queryKey) || null;
-          await runClientHookWithShim(
-            () => hooks.afterLoadPost(post, slug, context),
-            "Load prevented by afterLoadPost hook"
-          );
+          await hooks.afterLoadPost(post, slug, context);
         }
         const queryState = queryClient.getQueryState(postQuery.queryKey);
         if (queryState?.error) {
@@ -147,16 +135,10 @@ function createNewPostLoader(config) {
       };
       try {
         if (hooks?.beforeLoadNewPost) {
-          await runClientHookWithShim(
-            () => hooks.beforeLoadNewPost(context),
-            "Load prevented by beforeLoadNewPost hook"
-          );
+          await hooks.beforeLoadNewPost(context);
         }
         if (hooks?.afterLoadNewPost) {
-          await runClientHookWithShim(
-            () => hooks.afterLoadNewPost(context),
-            "Load prevented by afterLoadNewPost hook"
-          );
+          await hooks.afterLoadNewPost(context);
         }
       } catch (error) {
         if (hooks?.onLoadError) {
@@ -429,56 +411,45 @@ function createEditPostMeta(slug, config) {
 }
 const blogClientPlugin = (config) => defineClientPlugin({
   name: "blog",
-  routes: () => ({
-    posts: createRoute("/blog", () => {
-      const CustomPosts = config.pageComponents?.posts;
-      return {
-        PageComponent: CustomPosts ?? (() => /* @__PURE__ */ jsx(HomePageComponent, { published: true })),
+  routes: () => defineRoutes(
+    {
+      posts: defineRoute("/blog", {
+        page: () => /* @__PURE__ */ jsx(HomePageComponent, { published: true }),
         loader: createPostsLoader(true, config),
         meta: createPostsListMeta(true, config)
-      };
-    }),
-    drafts: createRoute("/blog/drafts", () => {
-      const CustomDrafts = config.pageComponents?.drafts;
-      return {
-        PageComponent: CustomDrafts ?? (() => /* @__PURE__ */ jsx(HomePageComponent, { published: false })),
+      }),
+      drafts: defineRoute("/blog/drafts", {
+        page: () => /* @__PURE__ */ jsx(HomePageComponent, { published: false }),
         loader: createPostsLoader(false, config),
         meta: createPostsListMeta(false, config)
-      };
-    }),
-    newPost: createRoute("/blog/new", () => {
-      const CustomNewPost = config.pageComponents?.newPost;
-      return {
-        PageComponent: CustomNewPost ?? NewPostPageComponent,
+      }),
+      newPost: defineRoute("/blog/new", {
+        page: NewPostPageComponent,
         loader: createNewPostLoader(config),
         meta: createNewPostMeta(config)
-      };
-    }),
-    editPost: createRoute("/blog/:slug/edit", ({ params: { slug } }) => {
-      const CustomEditPost = config.pageComponents?.editPost;
-      return {
-        PageComponent: CustomEditPost ? () => /* @__PURE__ */ jsx(CustomEditPost, { slug }) : () => /* @__PURE__ */ jsx(EditPostPageComponent, { slug }),
-        loader: createPostLoader(slug, config, `/blog/${slug}/edit`),
-        meta: createEditPostMeta(slug, config)
-      };
-    }),
-    tag: createRoute("/blog/tag/:tagSlug", ({ params: { tagSlug } }) => {
-      const CustomTag = config.pageComponents?.tag;
-      return {
-        PageComponent: CustomTag ? () => /* @__PURE__ */ jsx(CustomTag, { tagSlug }) : () => /* @__PURE__ */ jsx(TagPageComponent, { tagSlug }),
-        loader: createTagLoader(tagSlug, config),
-        meta: createTagMeta(tagSlug, config)
-      };
-    }),
-    post: createRoute("/blog/:slug", ({ params: { slug } }) => {
-      const CustomPost = config.pageComponents?.post;
-      return {
-        PageComponent: CustomPost ? () => /* @__PURE__ */ jsx(CustomPost, { slug }) : () => /* @__PURE__ */ jsx(PostPageComponent, { slug }),
-        loader: createPostLoader(slug, config),
-        meta: createPostMeta(slug, config)
-      };
-    })
-  }),
+      }),
+      editPost: defineRoute("/blog/:slug/edit", {
+        page: ({ params }) => /* @__PURE__ */ jsx(EditPostPageComponent, { slug: params.slug }),
+        loader: ({ params }) => createPostLoader(
+          params.slug,
+          config,
+          `/blog/${params.slug}/edit`
+        )(),
+        meta: ({ params }) => createEditPostMeta(params.slug, config)()
+      }),
+      tag: defineRoute("/blog/tag/:tagSlug", {
+        page: ({ params }) => /* @__PURE__ */ jsx(TagPageComponent, { tagSlug: params.tagSlug }),
+        loader: ({ params }) => createTagLoader(params.tagSlug, config)(),
+        meta: ({ params }) => createTagMeta(params.tagSlug, config)()
+      }),
+      post: defineRoute("/blog/:slug", {
+        page: ({ params }) => /* @__PURE__ */ jsx(PostPageComponent, { slug: params.slug }),
+        loader: ({ params }) => createPostLoader(params.slug, config)(),
+        meta: ({ params }) => createPostMeta(params.slug, config)()
+      })
+    },
+    { pages: config.pageComponents }
+  ),
   sitemap: async () => {
     const origin = `${config.siteBaseURL}${config.siteBasePath}`;
     const indexUrl = `${origin}/blog`;

package/dist/packages/stack/src/plugins/client/resource/errors.cjs

@@ -0,0 +1,74 @@
+'use strict';
+
+const SHARED_QUERY_CONFIG = {
+  retry: false,
+  refetchOnWindowFocus: false,
+  refetchOnMount: false,
+  refetchOnReconnect: false,
+  staleTime: 1e3 * 60 * 5,
+  // 5 minutes
+  gcTime: 1e3 * 60 * 10
+  // 10 minutes
+};
+function isErrorResponse(response) {
+  return typeof response === "object" && response !== null && "error" in response && response.error !== null && response.error !== void 0;
+}
+function issuePathToFieldName(issue) {
+  const path = Array.isArray(issue.path) ? issue.path : [];
+  return path.map(
+    (segment) => typeof segment === "object" && segment !== null ? String(segment.key) : String(segment)
+  ).join(".");
+}
+function issuesToFieldErrors(issues) {
+  if (!Array.isArray(issues) || issues.length === 0) return void 0;
+  const fieldErrors = {};
+  for (const issue of issues) {
+    if (typeof issue !== "object" || issue === null) continue;
+    const field = issuePathToFieldName(issue);
+    if (!field || typeof issue.message !== "string") continue;
+    (fieldErrors[field] ??= []).push(issue.message);
+  }
+  const entries = Object.entries(fieldErrors);
+  if (entries.length === 0) return void 0;
+  return Object.fromEntries(
+    entries.map(([field, messages]) => [
+      field,
+      messages.length === 1 ? messages[0] : messages
+    ])
+  );
+}
+function isFieldErrorRecord(value) {
+  if (typeof value !== "object" || value === null || Array.isArray(value)) {
+    return false;
+  }
+  return Object.values(value).every(
+    (v) => typeof v === "string" || Array.isArray(v) && v.every((m) => typeof m === "string")
+  );
+}
+function toError(error) {
+  if (error instanceof Error) {
+    return error;
+  }
+  if (typeof error === "object" && error !== null) {
+    const errorObj = error;
+    const message = (typeof errorObj.message === "string" ? errorObj.message : null) || (typeof errorObj.error === "string" ? errorObj.error : null) || JSON.stringify(error);
+    const err = new Error(message);
+    Object.assign(err, error);
+    const statusCode = typeof errorObj.statusCode === "number" ? errorObj.statusCode : typeof errorObj.status === "number" ? errorObj.status : void 0;
+    if (statusCode !== void 0) {
+      err.statusCode = statusCode;
+    }
+    const fieldErrors = isFieldErrorRecord(errorObj.errors) ? errorObj.errors : issuesToFieldErrors(errorObj.issues);
+    if (fieldErrors) {
+      err.errors = fieldErrors;
+    } else {
+      err.errors = void 0;
+    }
+    return err;
+  }
+  return new Error(String(error));
+}
+
+exports.SHARED_QUERY_CONFIG = SHARED_QUERY_CONFIG;
+exports.isErrorResponse = isErrorResponse;
+exports.toError = toError;

package/dist/packages/stack/src/plugins/client/resource/errors.mjs

@@ -0,0 +1,70 @@
+const SHARED_QUERY_CONFIG = {
+  retry: false,
+  refetchOnWindowFocus: false,
+  refetchOnMount: false,
+  refetchOnReconnect: false,
+  staleTime: 1e3 * 60 * 5,
+  // 5 minutes
+  gcTime: 1e3 * 60 * 10
+  // 10 minutes
+};
+function isErrorResponse(response) {
+  return typeof response === "object" && response !== null && "error" in response && response.error !== null && response.error !== void 0;
+}
+function issuePathToFieldName(issue) {
+  const path = Array.isArray(issue.path) ? issue.path : [];
+  return path.map(
+    (segment) => typeof segment === "object" && segment !== null ? String(segment.key) : String(segment)
+  ).join(".");
+}
+function issuesToFieldErrors(issues) {
+  if (!Array.isArray(issues) || issues.length === 0) return void 0;
+  const fieldErrors = {};
+  for (const issue of issues) {
+    if (typeof issue !== "object" || issue === null) continue;
+    const field = issuePathToFieldName(issue);
+    if (!field || typeof issue.message !== "string") continue;
+    (fieldErrors[field] ??= []).push(issue.message);
+  }
+  const entries = Object.entries(fieldErrors);
+  if (entries.length === 0) return void 0;
+  return Object.fromEntries(
+    entries.map(([field, messages]) => [
+      field,
+      messages.length === 1 ? messages[0] : messages
+    ])
+  );
+}
+function isFieldErrorRecord(value) {
+  if (typeof value !== "object" || value === null || Array.isArray(value)) {
+    return false;
+  }
+  return Object.values(value).every(
+    (v) => typeof v === "string" || Array.isArray(v) && v.every((m) => typeof m === "string")
+  );
+}
+function toError(error) {
+  if (error instanceof Error) {
+    return error;
+  }
+  if (typeof error === "object" && error !== null) {
+    const errorObj = error;
+    const message = (typeof errorObj.message === "string" ? errorObj.message : null) || (typeof errorObj.error === "string" ? errorObj.error : null) || JSON.stringify(error);
+    const err = new Error(message);
+    Object.assign(err, error);
+    const statusCode = typeof errorObj.statusCode === "number" ? errorObj.statusCode : typeof errorObj.status === "number" ? errorObj.status : void 0;
+    if (statusCode !== void 0) {
+      err.statusCode = statusCode;
+    }
+    const fieldErrors = isFieldErrorRecord(errorObj.errors) ? errorObj.errors : issuesToFieldErrors(errorObj.issues);
+    if (fieldErrors) {
+      err.errors = fieldErrors;
+    } else {
+      err.errors = void 0;
+    }
+    return err;
+  }
+  return new Error(String(error));
+}
+
+export { SHARED_QUERY_CONFIG, isErrorResponse, toError };

package/dist/packages/stack/src/plugins/client/resource/hooks.cjs

@@ -0,0 +1,123 @@
+"use client";
+'use strict';
+
+const reactQuery = require('@tanstack/react-query');
+const errors = require('./errors.cjs');
+const queries = require('./queries.cjs');
+const internal = require('./internal.cjs');
+const useForm = require('./use-form.cjs');
+const useSelect = require('./use-select.cjs');
+
+function createQueryHooks(plugin, resourceName, queryName, def) {
+  const useQueryConfig = (args) => {
+    const context = internal.useResourceContext(plugin);
+    return {
+      queryKey: queries.buildQueryKey(resourceName, queryName, def, args),
+      queryFn: (queryContext) => queries.runResourceQuery(
+        context.client,
+        def,
+        args,
+        queryContext?.pageParam,
+        context.headers
+      ),
+      ...errors.SHARED_QUERY_CONFIG
+    };
+  };
+  const infiniteExtras = (args) => {
+    const pageSize = queries.resolvePageSize(def, args);
+    return {
+      initialPageParam: 0,
+      getNextPageParam: (lastPage, allPages) => {
+        if (def.nextPageParam) {
+          return def.nextPageParam(lastPage, allPages, ...args);
+        }
+        const items = lastPage ?? [];
+        if (items.length < pageSize) return void 0;
+        return allPages.length * pageSize;
+      }
+    };
+  };
+  return {
+    use(args = [], options) {
+      return reactQuery.useQuery({
+        ...useQueryConfig(args),
+        ...options?.enabled !== void 0 ? { enabled: options.enabled } : {}
+      });
+    },
+    useSuspense(args = []) {
+      const result = reactQuery.useSuspenseQuery(useQueryConfig(args));
+      if (result.error && !result.isFetching) {
+        throw result.error;
+      }
+      return result;
+    },
+    useInfinite(args = [], options) {
+      return reactQuery.useInfiniteQuery({
+        ...useQueryConfig(args),
+        ...infiniteExtras(args),
+        ...options?.enabled !== void 0 ? { enabled: options.enabled } : {}
+      });
+    },
+    useSuspenseInfinite(args = []) {
+      const result = reactQuery.useSuspenseInfiniteQuery({
+        ...useQueryConfig(args),
+        ...infiniteExtras(args)
+      });
+      if (result.error && !result.isFetching) {
+        throw result.error;
+      }
+      return result;
+    }
+  };
+}
+function createMutationHook(plugin, resourceName, mutationName, resource, def) {
+  return {
+    use() {
+      const context = internal.useResourceContext(plugin);
+      return internal.useResourceMutationForDef(
+        context,
+        resourceName,
+        mutationName,
+        resource,
+        def
+      );
+    }
+  };
+}
+function createResource(config) {
+  const { plugin, resources } = config;
+  const handles = {};
+  for (const [resourceName, resource] of Object.entries(resources)) {
+    const handle = {};
+    for (const [queryName, def] of Object.entries(resource.queries)) {
+      handle[queryName] = createQueryHooks(
+        plugin,
+        resourceName,
+        queryName,
+        def
+      );
+    }
+    for (const [mutationName, def] of Object.entries(
+      resource.mutations ?? {}
+    )) {
+      if (handle[mutationName]) {
+        throw new Error(
+          `Resource "${resourceName}" declares both a query and a mutation named "${mutationName}"`
+        );
+      }
+      handle[mutationName] = createMutationHook(
+        plugin,
+        resourceName,
+        mutationName,
+        resource,
+        def
+      );
+    }
+    handle.useForm = useForm.createUseForm(plugin, resourceName, resource);
+    handle.useSelect = useSelect.createUseSelect(plugin, resourceName, resource);
+    handles[resourceName] = handle;
+  }
+  return handles;
+}
+
+exports.createResource = createResource;

package/dist/packages/stack/src/plugins/client/resource/hooks.mjs

@@ -0,0 +1,121 @@
+"use client";
+import { useSuspenseInfiniteQuery, useInfiniteQuery, useSuspenseQuery, useQuery } from '@tanstack/react-query';
+import { SHARED_QUERY_CONFIG } from './errors.mjs';
+import { resolvePageSize, runResourceQuery, buildQueryKey } from './queries.mjs';
+import { useResourceContext, useResourceMutationForDef } from './internal.mjs';
+import { createUseForm } from './use-form.mjs';
+import { createUseSelect } from './use-select.mjs';
+
+function createQueryHooks(plugin, resourceName, queryName, def) {
+  const useQueryConfig = (args) => {
+    const context = useResourceContext(plugin);
+    return {
+      queryKey: buildQueryKey(resourceName, queryName, def, args),
+      queryFn: (queryContext) => runResourceQuery(
+        context.client,
+        def,
+        args,
+        queryContext?.pageParam,
+        context.headers
+      ),
+      ...SHARED_QUERY_CONFIG
+    };
+  };
+  const infiniteExtras = (args) => {
+    const pageSize = resolvePageSize(def, args);
+    return {
+      initialPageParam: 0,
+      getNextPageParam: (lastPage, allPages) => {
+        if (def.nextPageParam) {
+          return def.nextPageParam(lastPage, allPages, ...args);
+        }
+        const items = lastPage ?? [];
+        if (items.length < pageSize) return void 0;
+        return allPages.length * pageSize;
+      }
+    };
+  };
+  return {
+    use(args = [], options) {
+      return useQuery({
+        ...useQueryConfig(args),
+        ...options?.enabled !== void 0 ? { enabled: options.enabled } : {}
+      });
+    },
+    useSuspense(args = []) {
+      const result = useSuspenseQuery(useQueryConfig(args));
+      if (result.error && !result.isFetching) {
+        throw result.error;
+      }
+      return result;
+    },
+    useInfinite(args = [], options) {
+      return useInfiniteQuery({
+        ...useQueryConfig(args),
+        ...infiniteExtras(args),
+        ...options?.enabled !== void 0 ? { enabled: options.enabled } : {}
+      });
+    },
+    useSuspenseInfinite(args = []) {
+      const result = useSuspenseInfiniteQuery({
+        ...useQueryConfig(args),
+        ...infiniteExtras(args)
+      });
+      if (result.error && !result.isFetching) {
+        throw result.error;
+      }
+      return result;
+    }
+  };
+}
+function createMutationHook(plugin, resourceName, mutationName, resource, def) {
+  return {
+    use() {
+      const context = useResourceContext(plugin);
+      return useResourceMutationForDef(
+        context,
+        resourceName,
+        mutationName,
+        resource,
+        def
+      );
+    }
+  };
+}
+function createResource(config) {
+  const { plugin, resources } = config;
+  const handles = {};
+  for (const [resourceName, resource] of Object.entries(resources)) {
+    const handle = {};
+    for (const [queryName, def] of Object.entries(resource.queries)) {
+      handle[queryName] = createQueryHooks(
+        plugin,
+        resourceName,
+        queryName,
+        def
+      );
+    }
+    for (const [mutationName, def] of Object.entries(
+      resource.mutations ?? {}
+    )) {
+      if (handle[mutationName]) {
+        throw new Error(
+          `Resource "${resourceName}" declares both a query and a mutation named "${mutationName}"`
+        );
+      }
+      handle[mutationName] = createMutationHook(
+        plugin,
+        resourceName,
+        mutationName,
+        resource,
+        def
+      );
+    }
+    handle.useForm = createUseForm(plugin, resourceName, resource);
+    handle.useSelect = createUseSelect(plugin, resourceName, resource);
+    handles[resourceName] = handle;
+  }
+  return handles;
+}
+
+export { createResource };

package/dist/packages/stack/src/plugins/client/resource/internal.cjs

@@ -0,0 +1,90 @@
+"use client";
+'use strict';
+
+const reactQuery = require('@tanstack/react-query');
+const utils = require('../../utils.cjs');
+const queries = require('./queries.cjs');
+const provider = require('../../../context/provider.cjs');
+
+function useResourceContext(plugin) {
+  const { api, router } = provider.useStack();
+  const { headers } = provider.usePluginOverrides(plugin);
+  const client = utils.createApiClient({
+    baseURL: api?.baseURL,
+    basePath: api?.basePath
+  });
+  return {
+    client,
+    headers,
+    navigate: router?.navigate,
+    refresh: router?.refresh
+  };
+}
+function invalidateTargetToKey(target) {
+  const dotIndex = target.indexOf(".");
+  if (dotIndex === -1) return [target];
+  return [target.slice(0, dotIndex), target.slice(dotIndex + 1)];
+}
+function useResourceMutationForDef(context, resourceName, mutationName, resource, def) {
+  const queryClient = reactQuery.useQueryClient();
+  const { client, headers, refresh } = context;
+  return reactQuery.useMutation({
+    mutationKey: [resourceName, mutationName],
+    mutationFn: (vars) => {
+      if (!def) {
+        throw new Error(
+          `Resource "${resourceName}" has no "${mutationName}" mutation declared`
+        );
+      }
+      return queries.runResourceMutation(client, def, vars, headers);
+    },
+    onSuccess: async (result, variables) => {
+      if (!def) return;
+      if (def.setData) {
+        const keyArgs = def.setData.args(result);
+        const targetName = def.setData.query ?? "detail";
+        const targetDef = resource.queries[targetName];
+        if (keyArgs && targetDef) {
+          const key = queries.buildQueryKey(
+            resourceName,
+            targetName,
+            targetDef,
+            keyArgs
+          );
+          queryClient.setQueryData(
+            key,
+            (previous) => def.setData?.updater ? def.setData.updater(previous, result) : result
+          );
+        }
+      }
+      if (def.removeData) {
+        const keyArgs = def.removeData.args(result, variables);
+        const targetName = def.removeData.query ?? "detail";
+        const targetDef = resource.queries[targetName];
+        if (keyArgs && targetDef) {
+          queryClient.removeQueries({
+            queryKey: queries.buildQueryKey(
+              resourceName,
+              targetName,
+              targetDef,
+              keyArgs
+            ),
+            exact: true
+          });
+        }
+      }
+      for (const target of def.invalidates ?? []) {
+        await queryClient.invalidateQueries({
+          queryKey: invalidateTargetToKey(target),
+          refetchType: def.refetchType
+        });
+      }
+      if (refresh && def.refresh !== false) {
+        await refresh();
+      }
+    }
+  });
+}
+
+exports.useResourceContext = useResourceContext;
+exports.useResourceMutationForDef = useResourceMutationForDef;