npm - @quilted/create - Versions diffs - 0.3.0 → 0.3.2 - Mend

@quilted/create 0.3.0 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (71) hide show

package/templates/app-graphql/tests/render/types.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import type {TestRouter} from '@quilted/quilt/navigation/testing';
 import type {BrowserTestMock} from '@quilted/quilt/browser/testing';
 import type {GraphQLCache} from '@quilted/quilt/graphql';
-import type {AppContext} from '~/shared/context.ts';
+import type {AppContext} from '~/context/types.ts';
 import type {GraphQLController} from '../graphql.ts';
@@ -58,7 +58,7 @@ export interface RenderContext extends AppContext {
   /**
    * The router used for this component test.
    */
-  readonly router: TestRouter;
+  readonly navigation: {router: TestRouter};
   /**
    * The browser environment for this component test.
@@ -66,9 +66,14 @@ export interface RenderContext extends AppContext {
   readonly browser: BrowserTestMock;
   /**
-   * The GraphQL controller used for this component test.
+   * The GraphQL context used for this component test.
    */
-  readonly graphQLController: GraphQLController;
+  readonly graphql: AppContext['graphql'] & {
+    /**
+     * The GraphQL controller used for this component test.
+     */
+    readonly controller: GraphQLController;
+  };
 }
 export interface RenderActions extends Record<string, never> {}

package/templates/app-graphql/tsconfig.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "jsxImportSource": "preact",
     "paths": {
-      "~/shared/*": ["./shared/*"],
+      "~/context/*": ["./context/*"],
       "~/tests/*": ["./tests/*"],
       "react": ["./node_modules/preact/compat"],
       "react-dom": ["./node_modules/preact/compat"]

package/templates/app-trpc/App.tsx CHANGED Viewed

@@ -9,12 +9,10 @@ import {Frame} from './foundation/frame.ts';
 import {Home} from './features/home.ts';
-import {trpc} from './shared/trpc.ts';
-import {
-  AppContextPreact,
-  type AppContext as AppContextType,
-} from './shared/context.ts';
-import {routeWithAppContext} from './shared/navigation.ts';
+import {trpc} from './context/trpc.ts';
+import type {AppContext as AppContextType} from './context/types.ts';
+import {AppContextPreact} from './context/preact.ts';
+import {routeWithAppContext} from './context/navigation.ts';
 export interface AppProps {
   context: AppContextType;
@@ -47,7 +45,7 @@ export function App({context}: AppProps) {
           <Localization>
             <Head />
             <Navigation
-              router={context.router}
+              router={context.navigation.router}
               routes={routes}
               context={context}
             />

package/templates/app-trpc/browser.css ADDED Viewed

@@ -0,0 +1,10 @@
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+html,
+body {
+  margin: 0;
+}

package/templates/app-trpc/browser.tsx CHANGED Viewed

@@ -1,29 +1,12 @@
+import './browser.css';
 import type {ComponentChild} from 'preact';
 import {hydrate} from '@quilted/quilt/browser';
-import {Router} from '@quilted/quilt/navigation';
-import {httpBatchLink} from '@trpc/client';
-import {QueryClient} from '@tanstack/react-query';
-import type {AppContext} from '~/shared/context.ts';
-import {trpc} from '~/shared/trpc.ts';
+import {BrowserAppContext} from '~/context/browser.ts';
 import {App} from './App.tsx';
-class BrowserAppContext implements AppContext {
-  readonly router: Router;
-  readonly trpc: AppContext['trpc'];
-  readonly queryClient: QueryClient;
-  constructor() {
-    this.router = new Router();
-    this.queryClient = new QueryClient();
-    this.trpc = trpc.createClient({
-      links: [httpBatchLink({url: new URL('/api', window.location.href).href})],
-    });
-  }
-}
 class BrowserApp {
   /**
    * The app's globally-available context.
@@ -44,7 +27,7 @@ class BrowserApp {
     // @example
     // ```js
     // // Log the current URL
-    // console.log(globalThis.app.context.router.currentRequest.url);
+    // console.log(globalThis.app.context.navigation.router.currentRequest.url);
     // ```
     Object.defineProperty(globalThis, 'app', {
       value: this,
@@ -53,8 +36,11 @@ class BrowserApp {
       writable: true,
     });
   }
+  hydrate() {
+    hydrate(this.rendered);
+  }
 }
 const app = new BrowserApp();
-hydrate(app.rendered);
+app.hydrate();

package/templates/app-trpc/context/browser.ts ADDED Viewed

@@ -0,0 +1,20 @@
+import {httpBatchLink} from '@trpc/client';
+import {QueryClient} from '@tanstack/react-query';
+import type {AppContext} from './types.ts';
+import {NavigationForApp} from './navigation.ts';
+import {trpc} from './trpc.ts';
+export class BrowserAppContext implements AppContext {
+  readonly navigation: NavigationForApp;
+  readonly trpc: AppContext['trpc'];
+  readonly queryClient: QueryClient;
+  constructor() {
+    this.navigation = new NavigationForApp();
+    this.queryClient = new QueryClient();
+    this.trpc = trpc.createClient({
+      links: [httpBatchLink({url: new URL('/api', window.location.href).href})],
+    });
+  }
+}

package/templates/app-trpc/context/navigation.ts ADDED Viewed

@@ -0,0 +1,17 @@
+import {createContextRouteFunction, Router} from '@quilted/quilt/navigation';
+import type {AppContext} from './types.ts';
+export interface Navigation {
+  readonly router: Router;
+}
+export class NavigationForApp implements Navigation {
+  readonly router: Router;
+  constructor(url?: string | URL) {
+    this.router = new Router(url);
+  }
+}
+export const routeWithAppContext = createContextRouteFunction<AppContext>();

package/templates/{app-graphql/shared/context.ts → app-trpc/context/preact.ts} RENAMED Viewed

@@ -1,6 +1,6 @@
 import {createOptionalContext} from '@quilted/quilt/context';
-export interface AppContext {}
+import type {AppContext} from './types.ts';
 export const AppContextPreact = createOptionalContext<AppContext>();
 export const useAppContext = AppContextPreact.use;

package/templates/app-trpc/context/server.ts ADDED Viewed

@@ -0,0 +1,18 @@
+import {createDirectClient} from '@quilted/trpc/server';
+import {QueryClient} from '@tanstack/react-query';
+import type {AppContext} from './types.ts';
+import {NavigationForApp} from './navigation.ts';
+import {appRouter} from '../trpc.ts';
+export class ServerAppContext implements AppContext {
+  readonly navigation: NavigationForApp;
+  readonly trpc: AppContext['trpc'];
+  readonly queryClient: QueryClient;
+  constructor(request: Request) {
+    this.navigation = new NavigationForApp(request.url);
+    this.trpc = createDirectClient(appRouter);
+    this.queryClient = new QueryClient();
+  }
+}

package/templates/app-trpc/context/trpc.ts ADDED Viewed

@@ -0,0 +1,6 @@
+import {createTRPCReact, type CreateTRPCReact} from '@trpc/react-query';
+import type {AppRouter} from '../trpc.ts';
+export const trpc: CreateTRPCReact<AppRouter, {}> =
+  createTRPCReact<AppRouter>();

package/templates/app-trpc/context/types.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type {Navigation} from './navigation.ts';
+import type {TRPCUntypedClient} from '@trpc/client';
+import type {QueryClient} from '@tanstack/react-query';
+import type {AppRouter} from '../trpc.ts';
+export interface AppContext {
+  readonly navigation: Navigation;
+  readonly trpc: TRPCUntypedClient<AppRouter>;
+  readonly queryClient: QueryClient;
+}

package/templates/app-trpc/features/home/Home.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import {trpc} from '~/shared/trpc.ts';
+import {trpc} from '~/context/trpc.ts';
 import styles from './Home.module.css';

package/templates/app-trpc/server.tsx CHANGED Viewed

@@ -6,34 +6,16 @@ import {
   PermissionsPolicyHeader,
   StrictTransportSecurityHeader,
 } from '@quilted/quilt/server';
-import {Router} from '@quilted/quilt/navigation';
 import Env from 'quilt:module/env';
 import {BrowserAssets} from 'quilt:module/assets';
-import {createDirectClient} from '@quilted/trpc/server';
 import {fetchRequestHandler} from '@trpc/server/adapters/fetch';
-import {QueryClient} from '@tanstack/react-query';
-import type {AppContext} from '~/shared/context.ts';
 import {appRouter} from './trpc.ts';
 const app = new Hono();
 const assets = new BrowserAssets();
-class ServerAppContext implements AppContext {
-  readonly router: Router;
-  readonly trpc: AppContext['trpc'];
-  readonly queryClient: QueryClient;
-  constructor(request: Request) {
-    this.router = new Router(request.url);
-    this.trpc = createDirectClient(appRouter);
-    this.queryClient = new QueryClient();
-  }
-}
 // TRPC API
 app.all('/api/*', async (c) => {
   const request = c.req.raw;
@@ -49,7 +31,10 @@ app.all('/api/*', async (c) => {
 app.get('*', async (c) => {
   const request = c.req.raw;
-  const [{App}] = await Promise.all([import('./App.tsx')]);
+  const [{App}, {ServerAppContext}] = await Promise.all([
+    import('./App.tsx'),
+    import('./context/server.ts'),
+  ]);
   const context = new ServerAppContext(request);

package/templates/app-trpc/tests/render/render.tsx CHANGED Viewed

@@ -8,8 +8,8 @@ import {Localization} from '@quilted/quilt/localize';
 import {QueryClient, QueryClientProvider} from '@tanstack/react-query';
-import {trpc} from '~/shared/trpc.ts';
-import {AppContextReact} from '~/shared/context.ts';
+import {trpc} from '~/context/trpc.ts';
+import {AppContextPreact} from '~/context/preact.ts';
 import {RenderOptions, RenderContext, RenderActions} from './types.ts';
@@ -28,7 +28,7 @@ export const renderApp = createRender<
   // React tree and your test code, and is ideal for mocking out global context providers.
   context({router = new TestRouter(), browser = new BrowserTestMock()}) {
     return {
-      router,
+      navigation: {router},
       browser,
       trpc: trpc.createClient(),
       queryClient: new QueryClient(),
@@ -36,10 +36,15 @@ export const renderApp = createRender<
   },
   // Render all of our app-wide context providers around each component under test.
   render(element, context, {locale = 'en'}) {
-    const {router, browser, trpc: trpcClient, queryClient} = context;
+    const {
+      navigation: {router},
+      browser,
+      trpc: trpcClient,
+      queryClient,
+    } = context;
     return (
-      <AppContextReact.Provider value={context}>
+      <AppContextPreact.Provider value={context}>
         <BrowserDetailsContext.Provider value={browser}>
           <Localization locale={locale}>
             <Navigation router={router}>
@@ -51,7 +56,7 @@ export const renderApp = createRender<
             </Navigation>
           </Localization>
         </BrowserDetailsContext.Provider>
-      </AppContextReact.Provider>
+      </AppContextPreact.Provider>
     );
   },
   async afterRender() {

package/templates/app-trpc/tests/render/types.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import type {TestRouter} from '@quilted/quilt/navigation/testing';
 import type {BrowserTestMock} from '@quilted/quilt/browser/testing';
 import type {QueryClient} from '@tanstack/react-query';
-import type {AppContext} from '~/shared/context.ts';
+import type {AppContext} from '~/context/types.ts';
 export interface RenderOptions {
   /**
@@ -28,7 +28,7 @@ export interface RenderContext extends AppContext {
   /**
    * The router used for this component test.
    */
-  readonly router: TestRouter;
+  readonly navigation: {router: TestRouter};
   /**
    * The browser environment for this component test.

package/templates/app-trpc/tsconfig.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "jsxImportSource": "preact",
     "paths": {
-      "~/shared/*": ["./shared/*"],
+      "~/context/*": ["./context/*"],
       "~/tests/*": ["./tests/*"],
       "react": ["./node_modules/preact/compat"],
       "react-dom": ["./node_modules/preact/compat"]

package/templates/github/_github/workflows/actions/prepare/action.yml CHANGED Viewed

@@ -2,12 +2,15 @@ name: Prepare repo
 runs:
   using: 'composite'
   steps:
-    - uses: pnpm/action-setup@v2.2.1
-    - uses: actions/setup-node@v2
+    - uses: pnpm/action-setup@v4.0.0
+    - uses: actions/setup-node@v4
       with:
         cache: pnpm
         registry-url: 'https://registry.npmjs.org'
         node-version-file: '.nvmrc'
+    - name: Enable Corepack
+      run: corepack enable && pnpm -v
+      shell: bash
     - name: Install dependencies
-      run: pnpm install
+      run: pnpm install --frozen-lockfile
       shell: bash

package/templates/github/_github/workflows/ci.yml CHANGED Viewed

@@ -1,10 +1,9 @@
 name: CI
 on:
-  push:
+  pull_request:
     branches:
-      - '**'
-      - '!main'
+      - main
   workflow_call:
     inputs:
       build:
@@ -16,6 +15,7 @@ jobs:
   lint:
     name: Lint 💅
     runs-on: ubuntu-latest
+    timeout-minutes: 5
     steps:
       - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/prepare
@@ -24,6 +24,7 @@ jobs:
   type-check:
     name: Type check 🧮
     runs-on: ubuntu-latest
+    timeout-minutes: 5
     steps:
       - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/prepare
@@ -32,6 +33,7 @@ jobs:
   unit-tests:
     name: Unit tests 🧪
     runs-on: ubuntu-latest
+    timeout-minutes: 5
     steps:
       - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/prepare
@@ -39,8 +41,9 @@ jobs:
   build:
     name: Build 🏗
-    if: ${{ inputs.build || github.event_name == 'push' }}
+    if: ${{ inputs.build || github.event_name == 'pull_request' }}
     runs-on: ubuntu-latest
+    timeout-minutes: 5
     steps:
       - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/prepare

package/templates/workspace/package.json CHANGED Viewed

@@ -13,15 +13,15 @@
     "typescript:watch": "tsx watch --conditions quilt:source"
   },
   "devDependencies": {
-    "@quilted/rollup": "^0.3.0",
-    "@quilted/vite": "^0.2.0",
+    "@quilted/rollup": "^0.4.0",
+    "@quilted/vite": "^0.3.0",
     "@quilted/typescript": "^0.4.0",
-    "rollup": "^4.34.0",
+    "rollup": "^4.46.0",
     "prettier": "^3.3.0",
     "tsx": "^4.19.0",
     "typescript": "^5.7.0",
-    "vite": "^6.1.0",
-    "vitest": "^3.0.0"
+    "vite": "^7.1.0",
+    "vitest": "^3.2.0"
   },
   "prettier": {
     "arrowParens": "always",

package/templates/app-basic/shared/navigation.ts DELETED Viewed

@@ -1,15 +0,0 @@
-import type {Router} from '@quilted/quilt/navigation';
-import {createContextRouteFunction} from '@quilted/quilt/navigation';
-import type {AppContext} from '~/shared/context.ts';
-declare module '~/shared/context.ts' {
-  interface AppContext {
-    /**
-     * The router used to control navigation throughout the application.
-     */
-    readonly router: Router;
-  }
-}
-export const routeWithAppContext = createContextRouteFunction<AppContext>();

package/templates/app-graphql/shared/graphql.ts DELETED Viewed

@@ -1,22 +0,0 @@
-import type {GraphQLFetch, GraphQLCache} from '@quilted/quilt/graphql';
-declare module '~/shared/context.ts' {
-  interface AppContext {
-    /**
-     * The app’s GraphQL client.
-     */
-    readonly graphql: {
-      /**
-       * A function to perform GraphQL operations.
-       */
-      readonly fetch: GraphQLFetch;
-      /**
-       * The app’s GraphQL cache.
-       */
-      readonly cache: GraphQLCache;
-    };
-  }
-}
-export {};

package/templates/app-graphql/shared/navigation.ts DELETED Viewed

@@ -1,15 +0,0 @@
-import type {Router} from '@quilted/quilt/navigation';
-import {createContextRouteFunction} from '@quilted/quilt/navigation';
-import type {AppContext} from '~/shared/context.ts';
-declare module '~/shared/context.ts' {
-  interface AppContext {
-    /**
-     * The router used to control navigation throughout the application.
-     */
-    readonly router: Router;
-  }
-}
-export const routeWithAppContext = createContextRouteFunction<AppContext>();

package/templates/app-trpc/shared/navigation.ts DELETED Viewed

@@ -1,15 +0,0 @@
-import type {Router} from '@quilted/quilt/navigation';
-import {createContextRouteFunction} from '@quilted/quilt/navigation';
-import type {AppContext} from '~/shared/context.ts';
-declare module '~/shared/context.ts' {
-  interface AppContext {
-    /**
-     * The router used to control navigation throughout the application.
-     */
-    readonly router: Router;
-  }
-}
-export const routeWithAppContext = createContextRouteFunction<AppContext>();

package/templates/app-trpc/shared/trpc.ts DELETED Viewed

@@ -1,18 +0,0 @@
-import type {TRPCUntypedClient} from '@trpc/client';
-import {createTRPCReact, type CreateTRPCReact} from '@trpc/react-query';
-import type {QueryClient} from '@tanstack/react-query';
-// Get access to our app’s router type signature, which will
-// provide strong typing on the queries and mutations we can
-// perform.
-import type {AppRouter} from '../trpc.ts';
-export const trpc: CreateTRPCReact<AppRouter, {}> =
-  createTRPCReact<AppRouter>();
-declare module '~/shared/context.ts' {
-  interface AppContext {
-    trpc: TRPCUntypedClient<AppRouter>;
-    queryClient: QueryClient;
-  }
-}