change signature of predefined updaters

Author: KurtGokhan

examples/vite/src/examples/main/example.tsx

@@ -47,13 +47,13 @@ export const editArticleMutation = builder
     {
       type: 'articles',
       optimistic: true,
-      updater: 'update-body-by-id',
+      updater: 'update-with-body-by-id',
     },
     (ctx) => ({
       type: 'article',
       id: ctx.vars.params.id,
       optimistic: true,
-      updater: 'merge-body',
+      updater: 'merge-with-body',
     }),
   )
   .withMiddleware(async (ctx, next) => {
@@ -70,5 +70,5 @@ export const editArticleMutation = builder
 export const deleteArticleMutation = builder.withMethod('delete').withPath('/articles/:id').withUpdates({
   type: 'articles',
   optimistic: true,
-  updater: 'delete-params-by-id',
+  updater: 'delete-with-params-by-id',
 });

packages/tanstack-query-builder/src/tags/types.ts

@@ -39,11 +39,12 @@ export type QueryUpdater<TVars = unknown, TData = unknown, TErr = unknown, TTarg
   | QueryUpdaterFn<TVars, TData, TErr, TTarget>
   | PredefinedUpdater<TVars, TData, TErr, TTarget>;
 
+type FlatPredefinedOp = 'clear' | 'merge' | 'replace';
+type DeepPredefinedOp = 'create' | 'update' | 'upsert' | 'delete' | 'switch';
+
 export type PredefinedUpdater<TVars = unknown, TData = unknown, TErr = unknown, TTarget = unknown> =
-  | `clear-${UpdaterSelector<TVars>}`
-  | `merge-${UpdaterSelector<TVars>}`
-  | `replace-${UpdaterSelector<TVars>}`
-  | `${'create' | 'update' | 'upsert' | 'delete' | 'switch'}-${UpdaterSelector<TVars>}-by-${KeyOfTarget<TTarget>}`;
+  | `${FlatPredefinedOp}-with-${UpdaterSelector<TVars>}`
+  | `${DeepPredefinedOp}-with-${UpdaterSelector<TVars>}-by-${KeyOfTarget<TTarget>}`;
 
 type UpdaterSelector<TVars> = 'data' | 'vars' | Extract<KeysOfValue<TVars, Record<string, unknown> | undefined>, string>;
 type KeyOfTarget<TTarget> = KeyOfItem<TTarget> & string & {};

packages/tanstack-query-builder/src/tags/updateTags.ts

@@ -38,7 +38,7 @@ export function updateTags({
 
     const updater = typeof tag === 'object' && tag.updater;
     if (!updater) continue;
-    const updaterFn = getUpdater(updater, tag);
+    const updaterFn = getUpdater(updater);
     if (!updaterFn) continue;
 
     /**

packages/tanstack-query-builder/src/tags/updaters.ts

@@ -1,12 +1,11 @@
-import type { QueryTagObject, QueryUpdater, QueryUpdaterFn } from './types';
+import type { QueryUpdater, QueryUpdaterFn } from './types';
 
 export function getUpdater<TVars = unknown, TData = unknown, TErr = unknown, TTarget = unknown>(
   updater: QueryUpdater<TVars, TData, TErr, TTarget>,
-  tag: QueryTagObject,
 ): QueryUpdaterFn<TVars, TData, TErr, TTarget> | undefined {
   if (typeof updater === 'function') return updater;
 
-  const [_, updaterType, updaterKey, __, byKey] = updater.match(/^(\w+)-(\w+)(-by-(\w+))?$/) || [];
+  const [_, updaterType, updaterKey, __, byKey] = updater.match(/^(\w+)-with-(\w+)(-by-(\w+))?$/) || [];
 
   const getFromCtx = (ctx: any) => {
     if (updaterKey === 'data') return ctx.data;

website/docs/tags.mdx

@@ -97,7 +97,7 @@ const deleteArticleMutation = builder
   .withUpdates({
     type: "articles",
     // highlight-next-line
-    updater: "delete-params-by-id",
+    updater: "delete-with-params-by-id",
   });
 ```
 
@@ -106,15 +106,15 @@ const deleteArticleMutation = builder
 Explanation
 </summary>
 
-The predefined functions are referred as a string. This string has a format of `<operation>-<context>-by-<field>` which can be broken down as follows:
+The predefined functions are referred as a string. This string has a format of `<operation>-with-<context>-by-<field>` which can be broken down as follows:
 
 - `<operation>`: The operation to be performed. This can be one of `clear, merge, replace, create, update, upsert, delete, switch`.
 - `<context>`: The body of the update that will be used in the operation. This can be one of `data, vars, body, params, search, meta`
 - `<field>`: The field to be used in the context to match with the data in the cache. This is usually a unique identifier. This can be any field in the context.
 
 Some examples:
 
-- `delete-params-by-id`: remove the item from a list, where `params.id` matches the `id` field of the item.
-- `merge-body-by-id`: merge the `body` to the item in a list, where `body.id` matches the `id` field of the item.
+- `delete-with-params-by-id`: remove the item from a list, where `params.id` matches the `id` field of the item.
+- `merge-with-body-by-id`: merge the `body` to the item in a list, where `body.id` matches the `id` field of the item.
 
 </details>