style: rename page-client.tsx -> page.client.tsx

requires extension because no bundler in this package

.npmrc

@@ -1 +0,0 @@
-auto-install-peers = true

README.md

@@ -35,3 +35,24 @@ This Turborepo has some additional tools already setup for you:
 - [Prettier](https://prettier.io) for code formatting
 - [shadcn/ui](https://ui.shadcn.com/docs/monorepo) for UI components
 - [Tailwind CSS v4](https://tailwindcss.com/) for styling and to use shadcn/ui
+
+### Setting up the monorepo
+
+To get started with this monorepo
+
+1. clone the repository:
+
+```bash
+git clone git@github.com:afiqzudinhadi/ecommerce-template.git
+```
+
+2. Add or remove `apps` and `packages` as needed. You can use the existing apps and packages as a reference for creating new ones.
+    - For example, to create a new app, you can copy the `next-template` directory and rename it to your desired app name. `admin-panel`, `public-site`, `landing-page`, `server` etc.
+    - Ensure that the new app's `package.json` has the correct name and version.
+    - Update the root `package.json` name to match your monorepo's name.
+
+3. Navigate to the root directory of the monorepo and install dependencies:
+
+```bash
+npm install
+```

TODO.md

@@ -0,0 +1,5 @@
+# TODO
+
+- [ ] Permissions
+- [ ] Stripe integration
+- [ ] Docker for deployment

apps/next-template/src/app/product/page.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { getProducts } from "@repo/db/index";
-import PageClient from "./page-client";
+import PageClient from "./page.client";
 import { Product } from "@repo/ui/components/products";
 import { PaginatedResponse } from "@repo/ui/components/template/table-show";
 

apps/remix-template/package.json

@@ -27,8 +27,8 @@
 	"devDependencies": {
 		"@remix-run/dev": "^2.15.2",
 		"@repo/eslint-config": "*",
-		"@types/react": "^18.3.18",
+		"@types/react": "^19.0.10",
-		"@types/react-dom": "^18.3.5",
+		"@types/react-dom": "^19.0.4",
 		"@typescript-eslint/eslint-plugin": "^8.34.0",
 		"@typescript-eslint/parser": "^8.34.0",
 		"autoprefixer": "^10.4.20",

apps/vite-template/package.json

@@ -18,8 +18,8 @@
 	"devDependencies": {
 		"@repo/eslint-config": "*",
 		"@repo/typescript-config": "*",
-		"@types/react": "^18.3.18",
+		"@types/react": "^19.0.10",
-		"@types/react-dom": "^18.3.5",
+		"@types/react-dom": "^19.0.4",
 		"@vitejs/plugin-react": "^4.5.1",
 		"eslint": "^9.29.0",
 		"typescript": "5.8.2",

apps/vite-template/tsconfig.json

@@ -1,29 +1,11 @@
 {
+	"extends": "@repo/typescript-config/vite.json",
 	"compilerOptions": {
 		"types": ["vite/client"],
-		"target": "ES2020",
-		"useDefineForClassFields": true,
-		"lib": ["ES2020", "DOM", "DOM.Iterable"],
-		"module": "ESNext",
-		"skipLibCheck": true,
 		"paths": {
 			"~/*": ["./src/*"],
 			"@repo/ui/*": ["../../packages/ui/src/*"]
-		},
+		}
-
-		/* Bundler mode */
-		"moduleResolution": "bundler",
-		"allowImportingTsExtensions": true,
-		"resolveJsonModule": true,
-		"isolatedModules": true,
-		"noEmit": true,
-		"jsx": "react-jsx",
-
-		/* Linting */
-		"strict": true,
-		"noUnusedLocals": true,
-		"noUnusedParameters": true,
-		"noFallthroughCasesInSwitch": true
 	},
 	"include": ["src"],
 	"references": [{ "path": "./tsconfig.node.json" }]

package.json

@@ -5,7 +5,7 @@
 		"reinstall": "npm run clean:node_modules && npm install",
 		"build": "turbo run build",
 		"clean": "turbo run clean",
-		"clean:node_modules": "find . -name 'node_modules' -type d -prune -exec rm -rf '{}' +",
+		"clean:node_modules": "find . -name 'node_modules' -type d -prune -exec rm -rf '{}' + && find . -name 'package-lock.json' -type f -delete && npm cache clean --force",
 		"dev": "turbo run dev",
 		"format": "prettier --write \"**/*.{ts,tsx,md}\"",
 		"lint": "turbo run lint",

packages/config-typescript/vite.json

@@ -1,21 +1,22 @@
 {
-  "compilerOptions": {
+	"compilerOptions": {
-    "target": "ES2020",
+		"target": "ES2020",
-    "useDefineForClassFields": true,
+		"useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+		"lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
+		"module": "ESNext",
-    "skipLibCheck": true,
+		"skipLibCheck": true,
-    "moduleResolution": "bundler",
+		"moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
+		"allowImportingTsExtensions": true,
-    "resolveJsonModule": true,
+		"resolveJsonModule": true,
-    "isolatedModules": true,
+		"isolatedModules": true,
-    "noEmit": true,
+		"noEmit": true,
-    "jsx": "react-jsx",
+		"jsx": "react-jsx",
-    "strict": true,
+		"strict": true,
-    "noUnusedLocals": true,
+		"noUnusedLocals": true,
-    "noUnusedParameters": true,
+		"noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true
+		"noFallthroughCasesInSwitch": true,
-  },
+		"forceConsistentCasingInFileNames": true
-  "include": ["src"],
+	},
-  "references": [{ "path": "./tsconfig.node.json" }]
+	"include": ["src"],
+	"references": [{ "path": "./tsconfig.node.json" }]
 }

packages/db/package.json

@@ -7,7 +7,7 @@
 	"license": "MIT",
 	"type": "module",
 	"exports": {
-		"./index.ts": "./src/index.ts"
+		"./index": "./src/index.ts"
 	},
 	"scripts": {
 		"lint": "eslint . --ext .ts,.tsx",

packages/db/src/database.ts

@@ -14,7 +14,11 @@ try {
 	console.warn("Failed to decode DATABASE_URL, using as is.");
 }
 
-console.log("Connecting to database URL:", db_url);
+const maskedUrl = db_url.replace(
+	/(postgresql:\/\/[^:]+:)[^@]+(@[^\/]+)/,
+	'$1***$2'
+);
+console.log("Connecting to database URL:", maskedUrl);
 
 const client = postgres(db_url!);
 

packages/db/src/index.ts

@@ -1,2 +1,2 @@
-export * from "./queries/users";
+export * from "./queries/users.ts";
-export * from "./queries/products";
+export * from "./queries/products.ts";

packages/db/src/queries/products.ts

@@ -1,6 +1,6 @@
+import { db } from "../database.ts";
+import { type InsertProduct, products } from "../schema/products.ts";
 import { count, desc } from "drizzle-orm";
-import { db } from "../database";
-import { InsertProduct, products } from "../schema/products";
 
 export async function createProduct(data: InsertProduct) {
 	await db.insert(products).values(data);

packages/db/src/queries/users.ts

@@ -1,5 +1,5 @@
-import { db } from "../database";
+import { db } from "../database.ts";
-import { InsertUser, users } from "../schema/users";
+import { type InsertUser, users } from "../schema/users.ts";
 import { eq } from "drizzle-orm";
 
 export async function createUser(data: InsertUser) {

packages/db/src/schema/products.ts

@@ -1,5 +1,5 @@
 import { pgTable, serial, text, numeric, boolean } from "drizzle-orm/pg-core";
-import { timestamps } from "./column.helpers";
+import { timestamps } from "./column.helpers.ts";
 
 export const products = pgTable("products", {
 	id: serial("id").primaryKey(),

packages/db/src/schema/users.ts

@@ -1,5 +1,5 @@
 import { pgTable, text } from "drizzle-orm/pg-core";
-import { timestamps } from "./column.helpers";
+import { timestamps } from "./column.helpers.ts";
 
 export const users = pgTable("users", {
 	id: text("id").primaryKey(), // Clerk user ID