diff --git a/package.json b/package.json index 134ccaf..10f9fc5 100644 --- a/package.json +++ b/package.json @@ -16,10 +16,15 @@ "@trpc/client": "^10.16.0", "@trpc/server": "^10.16.0", "astro": "^2.0.18", + "cloudflare-pages-plugin-trpc": "^0.3.2", "uuid": "^9.0.0", "zod": "^3.21.4" }, "devDependencies": { + "@cloudflare/workers-types": "^4.20230307.0", + "@databases/split-sql-query": "^1.0.3", + "@databases/sql": "^3.3.0", + "@types/uuid": "^9.0.1", "wrangler": "^2.12.3" } } \ No newline at end of file diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 79d6e9a..5ae000f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2,9 +2,14 @@ lockfileVersion: 5.4 specifiers: '@astrojs/cloudflare': ^6.2.1 + '@cloudflare/workers-types': ^4.20230307.0 + '@databases/split-sql-query': ^1.0.3 + '@databases/sql': ^3.3.0 '@trpc/client': ^10.16.0 '@trpc/server': ^10.16.0 + '@types/uuid': ^9.0.1 astro: ^2.0.18 + cloudflare-pages-plugin-trpc: ^0.3.2 uuid: ^9.0.0 wrangler: ^2.12.3 zod: ^3.21.4 @@ -14,10 +19,15 @@ dependencies: '@trpc/client': 10.16.0_@trpc+server@10.16.0 '@trpc/server': 10.16.0 astro: 2.1.3 + cloudflare-pages-plugin-trpc: 0.3.2_@trpc+server@10.16.0 uuid: 9.0.0 zod: 3.21.4 devDependencies: + '@cloudflare/workers-types': 4.20230307.0 + '@databases/split-sql-query': 1.0.3_@databases+sql@3.3.0 + '@databases/sql': 3.3.0 + '@types/uuid': 9.0.1 wrangler: 2.12.3 packages: @@ -356,6 +366,22 @@ packages: mime: 3.0.0 dev: true + /@cloudflare/workers-types/4.20230307.0: + resolution: {integrity: sha512-Go968aDDcqONHQcUdgIiPRkPdT4QTzD0ecHJsI1u7ZiHPMOoZn+Dy7hYsdUJ5ldX9wTZDrICBM1rDKTRaDUitg==} + dev: true + + /@databases/split-sql-query/1.0.3_@databases+sql@3.3.0: + resolution: {integrity: sha512-Q3UYX85e34yE9KXa095AJtJhBQ0NpLfC0kS9ydFKuNB25cto4YddY52RuXN81m2t0pS1Atg31ylNpKfNCnUPdA==} + peerDependencies: + '@databases/sql': '*' + dependencies: + '@databases/sql': 3.3.0 + dev: true + + /@databases/sql/3.3.0: + resolution: {integrity: sha512-vj9huEy4mjJ48GS1Z8yvtMm4BYAnFYACUds25ym6Gd/gsnngkJ17fo62a6mmbNNwCBS/8467PmZR01Zs/06TjA==} + dev: true + /@emmetio/abbreviation/2.2.3: resolution: {integrity: sha512-87pltuCPt99aL+y9xS6GPZ+Wmmyhll2WXH73gG/xpGcQ84DRnptBsI2r0BeIQ0EB/SQTOe2ANPqFqj3Rj5FOGA==} dependencies: @@ -1157,6 +1183,10 @@ packages: resolution: {integrity: sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==} dev: false + /@types/uuid/9.0.1: + resolution: {integrity: sha512-rFT3ak0/2trgvp4yYZo5iKFEPsET7vKydKF+VRCxlQ9bpheehyAJH89dAkaLEq/j/RZXJIqcgsmPJKUP1Z28HA==} + dev: true + /@types/yargs-parser/21.0.0: resolution: {integrity: sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA==} dev: false @@ -1473,6 +1503,14 @@ packages: engines: {node: '>=0.8'} dev: false + /cloudflare-pages-plugin-trpc/0.3.2_@trpc+server@10.16.0: + resolution: {integrity: sha512-3vNL8MsQGA1q3+Y14IsOWYSuYX1NMSDf1fdqoQZEla+8kfiSYXJbiBfN3lE8Ui6F5sGNIgVTmi4mGX76PQaZeA==} + peerDependencies: + '@trpc/server': 10.16.0 + dependencies: + '@trpc/server': 10.16.0 + dev: false + /color-convert/1.9.3: resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==} dependencies: diff --git a/src/pages/api/trpc/[trpc].ts b/src/pages/api/trpc/[trpc].ts index 070bfd5..222060e 100644 --- a/src/pages/api/trpc/[trpc].ts +++ b/src/pages/api/trpc/[trpc].ts @@ -1,8 +1,8 @@ import { initTRPC } from '@trpc/server'; -import { fetchRequestHandler } from '@trpc/server/adapters/fetch'; -import { Context, createContext } from './context'; +import { Context, createContext, Env } from './context'; import { z } from 'zod'; -import type { APIRoute } from 'astro'; +import tRPCPlugin from "cloudflare-pages-plugin-trpc"; + type User = { id: string; name: string; @@ -19,30 +19,34 @@ const appRouter = t.router({ getUserById: t.procedure.input(z.string()).query(({ input }) => { return users[input]; // input type is string }), + getUsers: t.procedure.query(({ctx}) => { + const result = ctx.db.exec('SELECT * FROM users'); + console.log({result}); + return result; + }), createUser: t.procedure - // validate input with Zod .input( z.object({ name: z.string().min(3), bio: z.string().max(142).optional(), }), ) - .mutation(({ input }) => { + .mutation(({ input, ctx }) => { const id = Date.now().toString(); + const statement = ctx.db.prepare("INSERT INTO users (id, title, body) VALUES (?, ?, ?)").bind(id, input.name, input.bio); + const result = statement.run(); + console.log({result}) + const user: User = { id, ...input }; users[user.id] = user; return id; }) }); -// The Astro API route, handling all incoming HTTP requests. -export const all: APIRoute = ({ request }) => { - return fetchRequestHandler({ - req: request, +export const all: PagesFunction = tRPCPlugin({ endpoint: '/api/trpc', router: appRouter, - createContext + createContext, }); -}; export type AppRouter = typeof appRouter; diff --git a/src/pages/api/trpc/context.ts b/src/pages/api/trpc/context.ts index 777b2ba..0936ecb 100644 --- a/src/pages/api/trpc/context.ts +++ b/src/pages/api/trpc/context.ts @@ -1,11 +1,21 @@ import type { inferAsyncReturnType } from '@trpc/server'; -import type { FetchCreateContextFnOptions } from '@trpc/server/adapters/fetch'; +import type { FetchCreateContextWithCloudflareEnvFnOptions } from 'cloudflare-pages-plugin-trpc'; -export function createContext({ +// Define binding to allow your worker to interact with Cloudflare D1. +export interface Env { + DB: D1Database; +} + +export async function createContext({ req, - resHeaders, -}: FetchCreateContextFnOptions) { + env +}: FetchCreateContextWithCloudflareEnvFnOptions) { const user = { name: req.headers.get('username') ?? 'anonymous' }; - return { req, resHeaders, user }; -} + + return { + db: env.DB, + req, + user + }; +}; export type Context = inferAsyncReturnType; \ No newline at end of file diff --git a/src/pages/index.astro b/src/pages/index.astro index cb419c5..f086868 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -10,7 +10,8 @@ const userId = await client.createUser.mutate({ bio: "gardener", }); const user = await client.getUserById.query(userId); - +const users = await client.getUsers.query(); +console.log({users}); // Logged server-side (in cloudflare) console.log({ user }); --- diff --git a/tsconfig.json b/tsconfig.json index 77da9dd..6f8eb32 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,3 +1,6 @@ { - "extends": "astro/tsconfigs/strict" + "extends": "astro/tsconfigs/strict", + "compilerOptions": { + "types": ["@cloudflare/workers-types"] + } } \ No newline at end of file