Arduano
Arduano
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
though I wrote this for trpc v11, you'd have to adjust it for v10
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
@Xavier
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
export function buildTrpcClientFromRouter<AppRouter extends AnyRouter>(router: AppRouter) {
function mockLink<TRouter extends AnyRouter>(): TRPCLink<TRouter> {
return () => {
return ({ op }) => {
return observable((observer) => {
const handler = async () => {
const result = await callTRPCProcedure({
procedures: appRouter._def.procedures,
ctx: {},
path: op.path,
input: op.input,
getRawInput: async () => op.input,
type: op.type,
signal: op.signal,
});

const isIterableResult = isAsyncIterable(result) || isObservable(result);

if (op.type !== 'subscription') {
if (isIterableResult) {
throw new TRPCError({
code: 'BAD_REQUEST',
message: 'Cannot return an async iterable in a non-subscription call',
});
}
observer.next({
result: {
type: 'data',
data: result,
},
context: op.context,
});
observer.complete();
} else {
if (!isIterableResult) {
throw new TRPCError({
code: 'BAD_REQUEST',
message: 'Cannot return a non-async iterable in a subscription call',
});
}

const iterable = isObservable(result) ? observableToAsyncIterable(result, op.signal) : result;
for await (const item of iterable) {
if (op.signal?.aborted) {
break;
}

observer.next({
result: {
type: 'data',
data: item,
},
context: op.context,
});
}
observer.complete();
}
};

void handler();

return () => {
observer.complete();
};
});
};
};
}

const trpcClient = createTRPCClient<AppRouter>({
links: [mockLink()],
});

return trpcClient;
}

const t = initTRPC.create({ isServer: true });

const appRouter = t.router({
hello: t.procedure.query(() => 'hi'),
});

const trpcClient = buildTrpcClientFromRouter(appRouter);
export function buildTrpcClientFromRouter<AppRouter extends AnyRouter>(router: AppRouter) {
function mockLink<TRouter extends AnyRouter>(): TRPCLink<TRouter> {
return () => {
return ({ op }) => {
return observable((observer) => {
const handler = async () => {
const result = await callTRPCProcedure({
procedures: appRouter._def.procedures,
ctx: {},
path: op.path,
input: op.input,
getRawInput: async () => op.input,
type: op.type,
signal: op.signal,
});

const isIterableResult = isAsyncIterable(result) || isObservable(result);

if (op.type !== 'subscription') {
if (isIterableResult) {
throw new TRPCError({
code: 'BAD_REQUEST',
message: 'Cannot return an async iterable in a non-subscription call',
});
}
observer.next({
result: {
type: 'data',
data: result,
},
context: op.context,
});
observer.complete();
} else {
if (!isIterableResult) {
throw new TRPCError({
code: 'BAD_REQUEST',
message: 'Cannot return a non-async iterable in a subscription call',
});
}

const iterable = isObservable(result) ? observableToAsyncIterable(result, op.signal) : result;
for await (const item of iterable) {
if (op.signal?.aborted) {
break;
}

observer.next({
result: {
type: 'data',
data: item,
},
context: op.context,
});
}
observer.complete();
}
};

void handler();

return () => {
observer.complete();
};
});
};
};
}

const trpcClient = createTRPCClient<AppRouter>({
links: [mockLink()],
});

return trpcClient;
}

const t = initTRPC.create({ isServer: true });

const appRouter = t.router({
hello: t.procedure.query(() => 'hi'),
});

const trpcClient = buildTrpcClientFromRouter(appRouter);
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
here:
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
"extending the router"? you can make a separate router probably, it's possible to make a router that calls a virtual server-side that's still running in your browser
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
cannot be implemented with tRPC due to legacy limitations
if it's because of the backend not supporting trpc, then react query is probably the best way to go
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
Oh nvm I misunderstood, disregard
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
with a trpc client connecting directly to the same instance in the same page?
15 replies
TtRPC
Created by Xavier on 1/9/2025 in #❓-help
How to handle consistency for client-side only APIs?
are you basically trying to run a trpc server instance in the browser?
15 replies