07220957

apps/server/package.json

@@ -27,7 +27,8 @@
     "reflect-metadata": "^0.2.0",
     "rxjs": "^7.8.1",
     "superjson-cjs": "^2.2.3",
-    "zod": "^3.23.8"
+    "zod": "^3.23.8",
+    "@nicestack/common": "workspace:^"
   },
   "devDependencies": {
     "@nestjs/cli": "^10.0.0",

apps/web-client/package.json

@@ -12,6 +12,9 @@
   "dependencies": {
     "@tanstack/react-form": "^0.26.3",
     "@tanstack/react-query": "^5.50.1",
+    "@tanstack/query-async-storage-persister": "^5.51.9",
+    "@tanstack/react-query-persist-client": "^5.51.9",
+    "@tanstack/react-virtual": "^3.8.3",
     "@tanstack/zod-form-adapter": "^0.26.3",
     "@trpc/client": "11.0.0-rc.456",
     "@trpc/react-query": "11.0.0-rc.456",
@@ -20,7 +23,9 @@
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.24.1",
     "superjson": "^2.2.1",
-    "zod": "^3.23.8"
+    "zod": "^3.23.8",
+    "idb-keyval": "^6.2.1",
+    "@nicestack/common": "workspace:^"
   },
   "devDependencies": {
     "@types/react": "^18.3.3",

apps/web-client/src/providers/query-provider.tsx

@@ -1,8 +1,10 @@
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { QueryClient } from '@tanstack/react-query';
 import { unstable_httpBatchStreamLink, loggerLink } from '@trpc/client';
 import React, { useState } from 'react';
 import { api } from '../utils/trpc';
 import superjson from 'superjson';
+import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client'
+import { createIDBPersister } from '../utils/idb';
 
 export default function QueryProvider({ children }: { children: React.ReactNode }) {
     const [queryClient] = useState(() => new QueryClient());
@@ -31,9 +33,9 @@ export default function QueryProvider({ children }: { children: React.ReactNode
     );
     return (
         <api.Provider client={trpcClient} queryClient={queryClient}>
-            <QueryClientProvider client={queryClient}>
+            <PersistQueryClientProvider client={queryClient} persistOptions={{ persister: createIDBPersister() }}>
                 {children}
-            </QueryClientProvider>
+            </PersistQueryClientProvider>
         </api.Provider>
     );
 }

apps/web-client/src/utils/idb.ts

@@ -0,0 +1,15 @@
+import { PersistedClient, Persister } from '@tanstack/react-query-persist-client'
+import { get, set, del } from 'idb-keyval'
+export function createIDBPersister(idbValidKey: IDBValidKey = 'reactQuery') {
+    return {
+        persistClient: async (client: PersistedClient) => {
+            await set(idbValidKey, client)
+        },
+        restoreClient: async () => {
+            return await get<PersistedClient>(idbValidKey)
+        },
+        removeClient: async () => {
+            await del(idbValidKey)
+        },
+    } as Persister
+}

packages/common/package.json

@@ -2,24 +2,33 @@
   "name": "@nicestack/common",
   "version": "1.0.0",
   "description": "",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "generate": "pnpm prisma generate",
-    "build": "pnpm generate && tsc -p tsconfig.json",
-    "build:watch": "tsc -p tsconfig.json -w --preserveWatchOutput",
+    "build:esm": "tsc -p tsconfig.esm.json",
+    "build:cjs": "tsc -p tsconfig.cjs.json",
+    "build": "pnpm run build:esm && pnpm run build:cjs",
     "studio": "pnpm prisma studio",
-    "db:clear": "rm -rf prisma/migrations && pnpm prisma migrate dev"
+    "db:clear": "rm -rf prisma/migrations && pnpm prisma migrate dev --name init",
+    "watch:esm": "nodemon --watch src -e ts,tsx --exec 'pnpm run build:esm'",
+    "watch:cjs": "nodemon --watch src -e ts,tsx --exec 'pnpm run build:cjs'",
+    "watch:prisma": "nodemon --watch prisma/schema.prisma  --exec 'pnpm run generate'",
+    "dev": "concurrently \"pnpm run watch:prisma\" \"pnpm run watch:esm\" \"pnpm run watch:cjs\" "
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@prisma/client": "^5.16.2"
+    "@prisma/client": "^5.16.2",
+    "prisma": "^5.16.2",
+    "zod": "^3.23.8"
   },
   "devDependencies": {
     "@types/node": "^20.3.1",
+    "concurrently": "^8.2.2",
+    "nodemon": "^3.1.4",
     "ts-node": "^10.9.1",
     "typescript": "^5.5.3"
   }

packages/common/src/db.ts

@@ -0,0 +1,16 @@
+import { PrismaClient } from "@prisma/client";
+
+let prisma: PrismaClient | null = null;
+
+const createPrismaClient = () => {
+  return new PrismaClient({
+    log: process.env.NODE_ENV === "development" ? ["error", "warn"] : ["error"],
+  });
+};
+
+export const db = (() => {
+  if (!prisma) {
+    prisma = createPrismaClient();
+  }
+  return prisma;
+})();

packages/common/src/index.ts

@@ -0,0 +1,4 @@
+export * from "./db"
+export * from '@prisma/client';
+
+export * from "./schema"

packages/common/src/schema.ts

@@ -0,0 +1 @@
+export { }

packages/common/tsconfig.cjs.json

@@ -1,14 +1,17 @@
 {
     "compilerOptions": {
-        "outDir": "./dist",
-        "target": "ES2021",
+        "outDir": "./dist/cjs",
+        "target": "ES2020",
         "module": "CommonJS",
         "declaration": true,
         "esModuleInterop": true,
         "allowSyntheticDefaultImports": true,
+        "strict": true,
+        "moduleResolution": "node",
+        "resolveJsonModule": true
     },
     "include": [
-        "."
+        "src"
     ],
     "exclude": [
         "prisma",

packages/common/tsconfig.esm.json

@@ -0,0 +1,22 @@
+{
+    "compilerOptions": {
+        "outDir": "./dist/esm",
+        "target": "ES2020",
+        "module": "ESNext",
+        "declaration": true,
+        "esModuleInterop": true,
+        "allowSyntheticDefaultImports": true,
+        "strict": true,
+        "moduleResolution": "node",
+        // Include JSON files as modules.
+        "resolveJsonModule": true,
+    },
+    "include": [
+        "src"
+    ],
+    "exclude": [
+        "prisma",
+        "node_modules",
+        "dist"
+    ]
+}