@rebasepro/cli 0.0.1-canary.1 → 0.0.1-canary.4d4fb3e

package/templates/template/frontend/src/App.tsx

@@ -10,10 +10,8 @@ import {
 } from "@rebasepro/auth";
 import {
     AppBar,
-    CircularProgressCenter,
     Drawer,
     Rebase,
-    RebaseRoute,
     ModeControllerProvider,
     NotFoundPage,
     Scaffold,
@@ -21,16 +19,17 @@ import {
     RebaseRoutes,
     SnackbarProvider,
     ContentHomePage,
-    useBackendStorageSource,
-    useBuildCMSUrlController,
+    useBuildUrlController,
     useBuildCollectionRegistryController,
     useBuildLocalConfigurationPersistence,
     useBuildModeController,
     useBuildNavigationStateController
 } from "@rebasepro/core";
-import { usePostgresClientDataSource } from "@rebasepro/postgresql";
+import { RebaseRoute } from "@rebasepro/cms";
+import { CircularProgressCenter } from "@rebasepro/ui";
 import { collections } from "virtual:rebase-collections";
 import { Route, Outlet } from "react-router-dom";
+import { createRebaseClient } from "@rebasepro/client";
 
 // Configuration from environment
 const API_URL = import.meta.env.VITE_API_URL || "http://localhost:3001";
@@ -40,33 +39,27 @@ export function App() {
     const modeController = useBuildModeController();
     const userConfigPersistence = useBuildLocalConfigurationPersistence();
 
+    const rebaseClient = React.useMemo(() => createRebaseClient({
+        baseUrl: API_URL,
+        websocketUrl: API_URL.replace(/^http/, "ws")
+    }), [API_URL]);
+
     const authController = useRebaseAuthController({
-        apiUrl: API_URL,
+        client: rebaseClient,
         googleClientId: GOOGLE_CLIENT_ID
     });
 
-    const storageSource = useBackendStorageSource({
-        apiUrl: API_URL,
-        getAuthToken: authController.getAuthToken
-    });
-
     const userManagement = useBackendUserManagement({
-        apiUrl: API_URL,
-        getAuthToken: authController.getAuthToken,
+        client: rebaseClient,
         currentUser: authController.user
     });
 
-    const postgresDelegate = usePostgresClientDataSource({
-        websocketUrl: API_URL.replace(/^http/, "ws"),
-        getAuthToken: authController.initialLoading ? undefined : authController.getAuthToken
-    });
-
     const collectionsBuilder = useCallback(() => {
         return [...collections];
     }, []);
 
     const collectionRegistryController = useBuildCollectionRegistryController({ userConfigPersistence });
-    const cmsUrlController = useBuildCMSUrlController({
+    const urlController = useBuildUrlController({
         basePath: "/",
         baseCollectionPath: "/c",
         collectionRegistryController
@@ -75,9 +68,9 @@ export function App() {
     const navigationStateController = useBuildNavigationStateController({
         collections: collectionsBuilder,
         authController,
-        dataSource: postgresDelegate,
+        data: rebaseClient.data,
         collectionRegistryController,
-        cmsUrlController,
+        urlController,
         userManagement
     });
 
@@ -85,13 +78,14 @@ export function App() {
         <SnackbarProvider>
             <ModeControllerProvider value={modeController}>
                 <Rebase
+                    client={rebaseClient}
+                    apiUrl={API_URL}
                     collectionRegistryController={collectionRegistryController}
-                    cmsUrlController={cmsUrlController}
+                    urlController={urlController}
                     navigationStateController={navigationStateController}
                     authController={authController}
                     userConfigPersistence={userConfigPersistence}
-                    dataSource={postgresDelegate}
-                    storageSource={storageSource}
+                    storageSource={rebaseClient.storage}
                 >
                     {({ loading }) => {
                         if (loading || authController.initialLoading) {

package/templates/template/frontend/src/index.css

@@ -1,2 +1,16 @@
 @import "tailwindcss";
-@import "@rebasepro/ui/index.css";
+@import "@rebasepro/ui/index.css" layer(base);
+
+@source "../node_modules/@rebasepro";
+
+@custom-variant dark (&:where(.dark, .dark *));
+
+@layer utilities {
+    body {
+        @apply w-full min-h-screen bg-surface-50 dark:bg-surface-900 flex flex-col items-center justify-center;
+    }
+
+    a {
+        @apply text-primary dark:text-primary;
+    }
+}

package/templates/template/package.json

@@ -4,25 +4,20 @@
     "description": "Rebase application with PostgreSQL backend",
     "private": true,
     "type": "module",
-    "workspaces": [
-        "frontend",
-        "backend",
-        "shared"
-    ],
     "scripts": {
-        "dev": "concurrently \"pnpm run dev:backend\" \"pnpm run dev:frontend\"",
-        "dev:frontend": "cd frontend && pnpm run dev",
-        "dev:backend": "cd backend && pnpm run dev",
-        "build": "pnpm run build:shared && pnpm run build:frontend && pnpm run build:backend",
-        "build:shared": "cd shared && pnpm run build",
-        "build:frontend": "cd frontend && pnpm run build",
-        "build:backend": "cd backend && pnpm run build",
-        "start": "cd backend && pnpm start",
-        "db:generate": "cd backend && pnpm run db:generate",
-        "db:migrate": "cd backend && pnpm run db:migrate",
-        "db:studio": "cd backend && pnpm run db:studio"
+        "dev": "rebase dev",
+        "build": "pnpm -r run build",
+        "start": "pnpm --filter \"*-backend\" start",
+        "db:generate": "rebase db generate",
+        "db:migrate": "rebase db migrate",
+        "db:pull": "rebase db pull",
+        "db:push": "rebase db push",
+        "db:studio": "rebase db studio",
+        "schema:generate": "rebase schema generate",
+        "generate:sdk": "rebase generate-sdk"
     },
     "devDependencies": {
+        "@rebasepro/cli": "workspace:*",
         "concurrently": "^8.2.2",
         "typescript": "^5.9.2"
     },

package/templates/template/pnpm-workspace.yaml

@@ -0,0 +1,4 @@
+packages:
+  - "frontend"
+  - "backend"
+  - "shared"

package/templates/template/shared/collections/posts.ts

@@ -4,7 +4,7 @@ const postsCollection: EntityCollection = {
     name: "Posts",
     singularName: "Post",
     slug: "posts",
-    dbPath: "posts",
+    table: "posts",
     icon: "Article",
     properties: {
         id: {

package/templates/template/shared/package.json

@@ -1,28 +1,28 @@
 {
-  "name": "{{PROJECT_NAME}}-shared",
-  "version": "1.0.0",
-  "description": "Shared collections for frontend and backend",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "type": "module",
-  "private": true,
-  "scripts": {
-    "build": "tsc",
-    "dev": "tsc --watch",
-    "clean": "rm -rf dist"
-  },
-  "dependencies": {
-    "@rebasepro/types": "^4.0.0"
-  },
-  "devDependencies": {
-    "typescript": "^5.9.2"
-  },
-  "exports": {
-    ".": {
-      "import": "./dist/index.js",
-      "types": "./dist/index.d.ts",
-      "default": "./dist/index.js"
+    "name": "{{PROJECT_NAME}}-shared",
+    "version": "1.0.0",
+    "description": "Shared collections for frontend and backend",
+    "main": "dist/index.js",
+    "types": "dist/index.d.ts",
+    "type": "module",
+    "private": true,
+    "scripts": {
+        "build": "tsc",
+        "dev": "tsc --watch",
+        "clean": "rm -rf dist"
     },
-    "./package.json": "./package.json"
-  }
+    "dependencies": {
+        "@rebasepro/types": "workspace:*"
+    },
+    "devDependencies": {
+        "typescript": "^5.9.2"
+    },
+    "exports": {
+        ".": {
+            "import": "./dist/index.js",
+            "types": "./dist/index.d.ts",
+            "default": "./dist/index.js"
+        },
+        "./package.json": "./package.json"
+    }
 }

package/templates/template/backend/scripts/db-generate.ts

@@ -1,60 +0,0 @@
-#!/usr/bin/env node
-import { spawn } from "child_process";
-
-// --- Helper Functions ---
-const formatTerminalText = (text: string, options: {
-    bold?: boolean;
-    backgroundColor?: "blue" | "green" | "red" | "yellow" | "cyan" | "magenta";
-    textColor?: "white" | "black" | "red" | "green" | "yellow" | "blue" | "magenta" | "cyan";
-} = {}): string => {
-    let codes = "";
-    if (options.bold) codes += "\x1b[1m";
-    if (options.backgroundColor) {
-        const bgColors = {
-            blue: "\x1b[44m",
-            green: "\x1b[42m",
-            red: "\x1b[41m",
-            yellow: "\x1b[43m",
-            cyan: "\x1b[46m",
-            magenta: "\x1b[45m"
-        } as const;
-        codes += bgColors[options.backgroundColor];
-    }
-    if (options.textColor) {
-        const textColors = {
-            white: "\x1b[37m",
-            black: "\x1b[30m",
-            red: "\x1b[31m",
-            green: "\x1b[32m",
-            yellow: "\x1b[33m",
-            blue: "\x1b[34m",
-            magenta: "\x1b[35m",
-            cyan: "\x1b[36m"
-        } as const;
-        codes += textColors[options.textColor];
-    }
-    return `${codes}${text}\x1b[0m`;
-};
-
-// Run drizzle-kit generate with the correct env path
-const child = spawn("npx", ["drizzle-kit", "generate"], {
-    stdio: "inherit",
-    env: {
-        ...process.env,
-        DOTENV_CONFIG_PATH: "../.env"
-    },
-    shell: true
-});
-
-child.on("close", (code) => {
-    if (code === 0) {
-        console.log("");
-        console.log(`You can now run ${formatTerminalText("pnpm db:migrate", {
-            bold: true,
-            backgroundColor: "green",
-            textColor: "black"
-        })} to apply the migrations to your database.`);
-        console.log("");
-    }
-    process.exit(code ?? 0);
-});