create-cedar-app 0.7.1 → 0.7.2-next.49

package/templates/esm-js/redwood.toml

@@ -0,0 +1,21 @@
+# This file contains the configuration settings for your Redwood app.
+# This file is also what makes your Redwood app a Redwood app.
+# If you remove it and try to run `yarn rw dev`, you'll get an error.
+#
+# For the full list of options, see the "App Configuration: redwood.toml" doc:
+# https://redwoodjs.com/docs/app-configuration-redwood-toml
+
+[web]
+  title = "Cedar App"
+  port = 8910
+  apiUrl = "/.redwood/functions"
+  includeEnvironmentVariables = [
+    # Add any ENV vars that should be available to the web side to this array
+    # See https://redwoodjs.com/docs/environment-variables#web
+  ]
+[api]
+  port = 8911
+[browser]
+  open = true
+[notifications]
+  versionUpdates = ["latest"]

package/templates/esm-js/scripts/jsconfig.json

@@ -0,0 +1,54 @@
+{
+  "compilerOptions": {
+    "noEmit": true,
+    "esModuleInterop": true,
+    "target": "ES2023",
+    "module": "Node16",
+    "moduleResolution": "Node16",
+    "paths": {
+      "$api/*": [
+        "../api/*"
+      ],
+      "api/*": [
+        "../api/*"
+      ],
+      "$api/src/*": [
+        "../api/src/*",
+        "../.redwood/types/mirror/api/src/*"
+      ],
+      "api/src/*": [
+        "../api/src/*",
+        "../.redwood/types/mirror/api/src/*"
+      ],
+      "$web/*": [
+        "../web/*"
+      ],
+      "web/*": [
+        "../web/*"
+      ],
+      "$web/src/*": [
+        "../web/src/*",
+        "../.redwood/types/mirror/web/src/*"
+      ],
+      "web/src/*": [
+        "../web/src/*",
+        "../.redwood/types/mirror/web/src/*"
+      ],
+      "types/*": [
+        "../types/*",
+        "../web/types/*",
+        "../api/types/*"
+      ]
+    },
+    "typeRoots": [
+      "../node_modules/@types"
+    ],
+    "jsx": "preserve"
+  },
+  "include": [
+    ".",
+    "../.redwood/types/includes/all-*",
+    "../.redwood/types/includes/web-*",
+    "../types"
+  ]
+}

package/templates/esm-js/scripts/seed.js

@@ -0,0 +1,27 @@
+// import { db } from 'api/src/lib/db.js'
+
+// Manually apply seeds via the `yarn rw prisma db seed` command.
+//
+// Seeds automatically run the first time you run the `yarn rw prisma migrate dev`
+// command and every time you run the `yarn rw prisma migrate reset` command.
+//
+// See https://redwoodjs.com/docs/database-seeds for more info
+
+export default async () => {
+  try {
+    // Create your database records here! For example, seed some users:
+    //
+    // const users = [
+    //   { name: 'Alice', email: 'alice@cedarjs.com' },
+    //   { name: 'Bob', email: 'bob@cedarjs.com' },
+    // ]
+    //
+    // await db.user.createMany({ data: users })
+
+    console.info(
+      '\n  No seed data, skipping. See scripts/seed.js to start seeding your database!\n'
+    )
+  } catch (error) {
+    console.error(error)
+  }
+}

package/templates/esm-js/vitest.config.mjs

@@ -0,0 +1,7 @@
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  test: {
+    projects: ['<rootDir>/{*,!(node_modules)/**/}/vite?(st).config.{js,ts}'],
+  },
+})

package/templates/esm-js/web/jsconfig.json

@@ -0,0 +1,53 @@
+{
+  "compilerOptions": {
+    "noEmit": true,
+    "esModuleInterop": true,
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "skipLibCheck": false,
+    "rootDirs": [
+      "./src",
+      "../.redwood/types/mirror/web/src",
+      "../api/src",
+      "../.redwood/types/mirror/api/src"
+    ],
+    "paths": {
+      "src/*": [
+        "./src/*",
+        "../.redwood/types/mirror/web/src/*",
+        "../api/src/*",
+        "../.redwood/types/mirror/api/src/*"
+      ],
+      "$api/*": [
+        "../api/*"
+      ],
+      "types/*": [
+        "./types/*",
+        "../types/*"
+      ],
+      "@cedarjs/testing": [
+        "../node_modules/@cedarjs/testing/web"
+      ]
+    },
+    "typeRoots": [
+      "../node_modules/@types",
+      "./node_modules/@types",
+      "../node_modules/@testing-library"
+    ],
+    "types": [
+      "jest",
+      "jest-dom"
+    ],
+    "jsx": "preserve"
+  },
+  "include": [
+    "src",
+    "config",
+    ".storybook/**/*",
+    "../.redwood/types/includes/all-*",
+    "../.redwood/types/includes/web-*",
+    "../types",
+    "./types"
+  ]
+}

package/templates/esm-js/web/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "web",
+  "type": "module",
+  "version": "0.0.0",
+  "private": true,
+  "browserslist": {
+    "development": [
+      "last 1 version"
+    ],
+    "production": [
+      "defaults"
+    ]
+  },
+  "dependencies": {
+    "@cedarjs/forms": "0.0.5",
+    "@cedarjs/router": "0.0.5",
+    "@cedarjs/web": "0.0.5",
+    "react": "19.0.0-rc-f2df5694-20240916",
+    "react-dom": "19.0.0-rc-f2df5694-20240916"
+  },
+  "devDependencies": {
+    "@cedarjs/vite": "0.0.5",
+    "@types/react": "^18.2.55",
+    "@types/react-dom": "^18.2.19"
+  }
+}

package/templates/esm-js/web/public/README.md

@@ -0,0 +1,43 @@
+# Static Assets
+
+Use this folder to add static files directly to your app. All included files and folders will be copied directly into the `/dist` folder (created when Vite builds for production). They will also be available during development when you run `yarn rw dev`.
+
+> Note: files will _not_ hot reload while the development server is running. You'll need to manually stop/start to access file changes.
+
+### Example Use
+
+A file like `favicon.png` will be copied to `/dist/favicon.png`. A folder containing a file such as `static-files/my-logo.jpg` will be copied to `/dist/static-files/my-logo.jpg`. These can be referenced in your code directly without any special handling, e.g.
+
+```
+<link rel="icon" type="image/png" href="/favicon.png" />
+```
+
+and
+
+```
+<img src="/static-files/my-logo.jpg"> alt="Logo" />
+```
+
+## Best Practices
+
+Because assets in this folder are bypassing the javascript module system, **this folder should be used sparingly** for assets such as favicons, robots.txt, manifests, libraries incompatible with Vite, etc.
+
+In general, it's best to import files directly into a template, page, or component. This allows Vite to include that file in the bundle when small enough, or to copy it over to the `dist` folder with a hash.
+
+### Example Asset Import with Vite
+
+Instead of handling our logo image as a static file per the example above, we can do the following:
+
+```
+import React from "react"
+import logo from "./my-logo.jpg"
+
+
+function Header() {
+  return <img src={logo} alt="Logo" />
+}
+
+export default Header
+```
+
+See Vite's docs for [static asset handling](https://vitejs.dev/guide/assets.html)

package/templates/esm-js/web/public/robots.txt

@@ -0,0 +1,2 @@
+User-agent: *
+Disallow:

package/templates/esm-js/web/src/App.jsx

@@ -0,0 +1,16 @@
+import { FatalErrorBoundary, RedwoodProvider } from '@cedarjs/web'
+import { RedwoodApolloProvider } from '@cedarjs/web/apollo'
+
+import FatalErrorPage from 'src/pages/FatalErrorPage'
+
+import './index.css'
+
+const App = ({ children }) => (
+  <FatalErrorBoundary page={FatalErrorPage}>
+    <RedwoodProvider titleTemplate="%PageTitle | %AppTitle">
+      <RedwoodApolloProvider>{children}</RedwoodApolloProvider>
+    </RedwoodProvider>
+  </FatalErrorBoundary>
+)
+
+export default App

package/templates/esm-js/web/src/Routes.jsx

@@ -0,0 +1,20 @@
+// In this file, all Page components from 'src/pages` are auto-imported. Nested
+// directories are supported, and should be uppercase. Each subdirectory will be
+// prepended onto the component name.
+//
+// Examples:
+//
+// 'src/pages/HomePage/HomePage.js'         -> HomePage
+// 'src/pages/Admin/BooksPage/BooksPage.js' -> AdminBooksPage
+
+import { Router, Route } from '@cedarjs/router'
+
+const Routes = () => {
+  return (
+    <Router>
+      <Route notfound page={NotFoundPage} />
+    </Router>
+  )
+}
+
+export default Routes

package/templates/esm-js/web/src/entry.client.jsx

@@ -0,0 +1,35 @@
+import { hydrateRoot, createRoot } from 'react-dom/client'
+
+import App from './App'
+import Routes from './Routes'
+
+/**
+ * When `#redwood-app` isn't empty then it's very likely that you're using
+ * prerendering. So React attaches event listeners to the existing markup
+ * rather than replacing it.
+ * https://react.dev/reference/react-dom/client/hydrateRoot
+ */
+const redwoodAppElement = document.getElementById('redwood-app')
+
+if (!redwoodAppElement) {
+  throw new Error(
+    "Could not find an element with ID 'redwood-app'. Please ensure it " +
+      "exists in your 'web/src/index.html' file."
+  )
+}
+
+if (redwoodAppElement.children?.length > 0) {
+  hydrateRoot(
+    redwoodAppElement,
+    <App>
+      <Routes />
+    </App>
+  )
+} else {
+  const root = createRoot(redwoodAppElement)
+  root.render(
+    <App>
+      <Routes />
+    </App>
+  )
+}

package/templates/esm-js/web/src/index.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link rel="icon" type="image/png" href="/favicon.png" />
+</head>
+
+<body>
+  <!-- Please keep this div empty -->
+  <div id="redwood-app"></div>
+</body>
+
+</html>

package/templates/esm-js/web/src/pages/FatalErrorPage/FatalErrorPage.jsx

@@ -0,0 +1,58 @@
+// This page will be rendered when an error makes it all the way to the top of the
+// application without being handled by a Javascript catch statement or React error
+// boundary.
+//
+// You can modify this page as you wish, but it is important to keep things simple to
+// avoid the possibility that it will cause its own error. If it does, Redwood will
+// still render a generic error page, but your users will prefer something a bit more
+// thoughtful :)
+
+// This import will be automatically removed when building for production
+import { DevFatalErrorPage } from '@cedarjs/web/dist/components/DevFatalErrorPage'
+
+export default DevFatalErrorPage ||
+  (() => (
+    <main>
+      <style
+        dangerouslySetInnerHTML={{
+          __html: `
+              html, body {
+                margin: 0;
+              }
+              html * {
+                box-sizing: border-box;
+              }
+              main {
+                display: flex;
+                align-items: center;
+                font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
+                text-align: center;
+                background-color: #E2E8F0;
+                height: 100vh;
+              }
+              section {
+                background-color: white;
+                border-radius: 0.25rem;
+                width: 32rem;
+                padding: 1rem;
+                margin: 0 auto;
+                box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+              }
+              h1 {
+                font-size: 2rem;
+                margin: 0;
+                font-weight: 500;
+                line-height: 1;
+                color: #2D3748;
+              }
+            `,
+        }}
+      />
+
+      <section>
+        <h1>
+          <span>Something went wrong</span>
+        </h1>
+      </section>
+    </main>
+  ))

package/templates/esm-js/web/src/pages/NotFoundPage/NotFoundPage.jsx

@@ -0,0 +1,45 @@
+export default () => (
+  <main>
+    <style
+      dangerouslySetInnerHTML={{
+        __html: `
+              html, body {
+                margin: 0;
+              }
+              html * {
+                box-sizing: border-box;
+              }
+              main {
+                display: flex;
+                align-items: center;
+                font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
+                text-align: center;
+                background-color: #E2E8F0;
+                height: 100vh;
+              }
+              section {
+                background-color: white;
+                border-radius: 0.25rem;
+                width: 32rem;
+                padding: 1rem;
+                margin: 0 auto;
+                box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+              }
+              h1 {
+                font-size: 2rem;
+                margin: 0;
+                font-weight: 500;
+                line-height: 1;
+                color: #2D3748;
+              }
+            `,
+      }}
+    />
+
+    <section>
+      <h1>
+        <span>404 Page Not Found</span>
+      </h1>
+    </section>
+  </main>
+)

package/templates/esm-js/web/vite.config.js

@@ -0,0 +1,21 @@
+/// <reference types="vitest/config" />
+
+import dns from 'node:dns'
+
+import { defineConfig } from 'vite'
+
+import { cedar } from '@cedarjs/vite'
+
+// So that Vite will load on localhost instead of `127.0.0.1`.
+// See: https://vitejs.dev/config/server-options.html#server-host.
+dns.setDefaultResultOrder('verbatim')
+
+export default defineConfig(({ mode }) => ({
+  plugins: [cedar({ mode })],
+  test: {
+    environment: 'jsdom',
+    setupFiles: ['./vitest.setup.js'],
+    // Enables global test APIs like describe, it, expect
+    globals: true,
+  },
+}))

package/templates/esm-js/web/vitest.setup.js

@@ -0,0 +1,12 @@
+import '@testing-library/jest-dom/vitest'
+
+import { cleanup } from '@testing-library/react'
+import { afterEach } from 'vitest'
+
+afterEach(() => {
+  // If vitest globals are enabled testing-library will clean up after each
+  // test automatically, but we don't enable globals, so we have to manually
+  // clean up here
+  // https://testing-library.com/docs/react-testing-library/api/#cleanup
+  cleanup()
+})

package/templates/esm-ts/.editorconfig

@@ -0,0 +1,10 @@
+# editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true

package/templates/esm-ts/.env

@@ -0,0 +1,15 @@
+# THIS FILE SHOULD NOT BE CHECKED INTO YOUR VERSION CONTROL SYSTEM
+#
+# Environment variables set here will override those in .env.defaults.
+# Any environment variables you need in production you will need to setup with
+# your hosting provider. For example in Netlify you can add environment
+# variables in Settings > Build & Deploy > environment
+#
+# DATABASE_URL=postgres://user:pass@postgreshost.com:5432/database_name
+# TEST_DATABASE_URL=postgres://user:pass@postgreshost.com:5432/test_database_name
+#
+# Sets an app-specific secret used to sign and verify your own app's webhooks.
+# For example if you schedule a cron job with a signed payload that later will
+# then invoke your api-side webhook function you will use this secret to sign and the verify.
+# Important: Please change this default to a strong password or other secret
+# WEBHOOK_SECRET=THIS_IS_NOT_SECRET_PLEASE_CHANGE

package/templates/esm-ts/.env.defaults

@@ -0,0 +1,19 @@
+# These environment variables will be used by default if you do not create any
+# yourself in .env. This file should be safe to check into your version control
+# system. Any custom values should go in .env and .env should *not* be checked
+# into version control.
+
+# schema.prisma defaults
+DATABASE_URL=file:./dev.db
+
+# location of the test database for api service scenarios (defaults to ./.redwood/test.db if not set)
+# TEST_DATABASE_URL=file:./.redwood/test.db
+
+# disables Prisma CLI update notifier
+PRISMA_HIDE_UPDATE_MESSAGE=true
+
+# Option to override the current environment's default api-side log level
+# See: https://redwoodjs.com/docs/logger for level options, defaults to "trace" otherwise.
+# Most applications want "debug" or "info" during dev, "trace" when you have issues and "warn" in production.
+# Ordered by how verbose they are: trace | debug | info | warn | error | silent
+# LOG_LEVEL=debug

package/templates/esm-ts/.env.example

@@ -0,0 +1,4 @@
+# DATABASE_URL=file:./dev.db
+# TEST_DATABASE_URL=file:./.redwood/test.db
+# PRISMA_HIDE_UPDATE_MESSAGE=true
+# LOG_LEVEL=trace

package/templates/esm-ts/.redwood/README.md

@@ -0,0 +1,44 @@
+# .redwood
+
+## What is this directory?
+
+Redwood uses this `.redwood` directory to store transitory data that aids in the smooth and convenient operation of your Redwood project.
+
+## Do I need to do anything with this directory?
+
+No. You shouldn't have to create, edit or delete anything in this directory in your day-to-day work with Redwood.
+
+You don't need to commit any other contents of this directory to your version control system. It's ignored by default.
+
+## What's in this directory?
+
+### Files
+
+| Name              | Description                                                                                                        |
+| :---------------- | :----------------------------------------------------------------------------------------------------------------- |
+| commandCache.json | This file contains mappings to assist the Redwood CLI in efficiently executing commands.                           |
+| schema.graphql    | This is the GraphQL schema which has been automatically generated from your Redwood project.                       |
+| telemetry.txt     | Contains a unique ID used for telemetry. This value is rotated every 24 hours to protect your project's anonymity. |
+| test.db           | The sqlite database used when running tests.                                                                       |
+
+### Directories
+
+| Name        | Description                                                                                                                                      |
+| :---------- | :----------------------------------------------------------------------------------------------------------------------------------------------- |
+| locks       | Stores temporary files that Redwood uses to keep track of the execution of async/background tasks between processes.                             |
+| logs        | Stores log files for background tasks such as update checking.                                                                                   |
+| prebuild    | Stores transpiled JavaScript that is generated as part of Redwood's build process.                                                               |
+| telemetry   | Stores the recent telemetry that the Redwood CLI has generated. You may inspect these files to see everything Redwood is anonymously collecting. |
+| types       | Stores the results of type generation.                                                                                                           |
+| updateCheck | Stores a file which contains the results of checking for Redwood updates.                                                                        |
+| studio      | Used to store data for `rw studio`                                                                                                               |
+
+We try to keep this README up to date but you may, from time to time, find other files or directories in this `.redwood` directory that have not yet been documented here. This is likely nothing to worry about but feel free to let us know and we'll update this list.
+
+### Telemetry
+
+RedwoodJS collects completely anonymous telemetry data about general usage. For transparency, that data is viewable in the respective directories and files. To learn more and manage your project's settings, visit [telemetry.redwoodjs.com](https://telemetry.redwoodjs.com).
+
+### Have any questions?
+
+Feel free to reach out to us in the [RedwoodJS Community](https://community.redwoodjs.com/) forum if you have any questions.

package/templates/esm-ts/.vscode/extensions.json

@@ -0,0 +1,14 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "eamodio.gitlens",
+    "ofhumanbondage.react-proptypes-intellisense",
+    "mgmcdermott.vscode-language-babel",
+    "wix.vscode-import-cost",
+    "pflannery.vscode-versionlens",
+    "editorconfig.editorconfig",
+    "prisma.prisma",
+    "graphql.vscode-graphql"
+  ],
+  "unwantedRecommendations": []
+}

package/templates/esm-ts/.vscode/launch.json

@@ -0,0 +1,56 @@
+{
+  "version": "0.3.0",
+  "configurations": [
+    {
+      "command": "yarn redwood dev --apiDebugPort 18911", // you can add --fwd='--open=false' to prevent the browser from opening
+      "name": "Run Dev Server",
+      "request": "launch",
+      "type": "node-terminal"
+    },
+    {
+      "name": "Attach API debugger",
+      "port": 18911, // you can change this port, see https://redwoodjs.com/docs/project-configuration-dev-test-build#debugger-configuration
+      "request": "attach",
+      "skipFiles": [
+        "<node_internals>/**"
+      ],
+      "type": "node",
+      "localRoot": "${workspaceFolder}/node_modules/@cedarjs/api-server/dist",
+      "remoteRoot": "${workspaceFolder}/node_modules/@cedarjs/api-server/dist",
+      "sourceMaps": true,
+      "restart": true,
+      "preLaunchTask": "WaitForDevServer",
+    },
+    {
+      "name": "Launch Web debugger",
+      "type": "chrome",
+      "request": "launch",
+      "url": "http://localhost:8910",
+      "webRoot": "${workspaceRoot}/web/src",
+      "preLaunchTask": "WaitForDevServer",
+    },
+    {
+      "command": "yarn redwood test api",
+      "name": "Test api",
+      "request": "launch",
+      "type": "node-terminal"
+    },
+    {
+      "command": "yarn redwood test web",
+      "name": "Test web",
+      "request": "launch",
+      "type": "node-terminal"
+    },
+  ],
+  "compounds": [
+    {
+      "name": "Start Debug",
+      "configurations": [
+        "Run Dev Server",
+        "Attach API debugger",
+        "Launch Web debugger"
+      ],
+      "stopAll": true
+    }
+  ]
+}