Merge remote-tracking branch 'origin/main' into update-transpilation

.github/workflows/ci-lint.yaml

@@ -90,6 +90,14 @@ jobs:
         if: always()
         run: pnpm run lint
         working-directory: packages/runtime-common
+      - name: Lint Billing
+        if: always()
+        run: pnpm run lint
+        working-directory: packages/billing
+      - name: Lint Postgres
+        if: always()
+        run: pnpm run lint
+        working-directory: packages/postgres
       - name: Lint Base Realm
         if: always()
         run: pnpm run lint

.github/workflows/manual-deploy.yml

@@ -24,7 +24,7 @@ jobs:
       dockerfile: "packages/ai-bot/Dockerfile"
 
   deploy-ai-bot:
-    needs: [build-ai-bot]
+    needs: [build-ai-bot, migrate-db]
     name: Deploy ai-bot to AWS ECS
     uses: cardstack/gh-actions/.github/workflows/ecs-deploy.yml@main
     secrets: inherit
@@ -77,9 +77,30 @@ jobs:
       build-args: |
         "realm_server_script=start:${{ inputs.environment }}"
 
+  build-pg-migration:
+    name: Build pg-migration Docker image
+    uses: cardstack/gh-actions/.github/workflows/docker-ecr.yml@main
+    secrets: inherit
+    with:
+      repository: "boxel-pg-migration-${{ inputs.environment }}"
+      environment: ${{ inputs.environment }}
+      dockerfile: "packages/postgres/Dockerfile"
+
+  migrate-db:
+    needs: [build-pg-migration]
+    name: Deploy and run DB migrations
+    uses: cardstack/gh-actions/.github/workflows/ecs-deploy.yml@main
+    secrets: inherit
+    with:
+      container-name: "boxel-pg-migration"
+      environment: ${{ inputs.environment }}
+      cluster: ${{ inputs.environment }}
+      service-name: "boxel-pg-migration-${{ inputs.environment }}"
+      image: ${{ needs.build-pg-migration.outputs.image }}
+
   deploy-realm-server:
     name: Deploy realm server
-    needs: [build-realm-server, deploy-host]
+    needs: [build-realm-server, deploy-host, migrate-db]
     uses: cardstack/gh-actions/.github/workflows/ecs-deploy.yml@main
     secrets: inherit
     with:

docs/style-handling.md

@@ -0,0 +1,34 @@
+# Style Handling
+
+Most parts of Boxel use scoped CSS via [glimmer-scoped-css](https://github.com/cardstack/glimmer-scoped-css).
+
+But the actual implementation of how those styles get into the DOM varies wildly depending on context.
+
+## In realms
+
+A javascript module in a realm that uses scoped CSS goes through the realm's
+transpilation pipeline. This runs the AST transformation step from
+glimmer-scoped-css. It leaves the import resolution step alone, so the resulting
+code will contain imports that end with `*.glimmer-scoped.css`.
+
+At runtime, our loader has a custom middleware that knows how to satisfy these
+special URLs. Each of them already contains the base64 encoded stylesheeet so no
+extra requests are needed.
+
+When serving pre-rendered content, the realm server identifies all the special
+`*.glimmer-scoped.css` imports in the dependency graph of the given cards and
+returns them with the pre-rendered HTML so they can get loaded (by the usual
+middleware in the loader).
+
+However, the index is only aware of modules within realms. Wherever imports span
+outward to external dependencies, particularly all the shims provided via the
+host app (see host/app/lib/externals), we cannot traverse all the way to all the
+style dependencies. But this still results in valid styles in the browser, since
+the shimmed implementations are already all statically imported into the host
+app and thus their styles are already in the DOM.
+
+## In the host app and addons (like @boxel/ui)
+
+In the host app and its addons, the webpack-based implementation of
+glimmer-scoped-css is in use. This means styles will be delivered by webpack's
+usual style pipeline.

packages/base/cards-grid.gts

@@ -10,7 +10,6 @@ import {
   realmInfo,
   realmURL,
   type BaseDef,
-  linksToMany,
 } from './card-api';
 import {
   AddButton,
@@ -45,7 +44,6 @@ import { MenuItem } from '@cardstack/boxel-ui/helpers';
 import LayoutGridPlusIcon from '@cardstack/boxel-icons/layout-grid-plus';
 import Captions from '@cardstack/boxel-icons/captions';
 import CardsIcon from '@cardstack/boxel-icons/cards';
-import Star from '@cardstack/boxel-icons/star';
 import { registerDestructor } from '@ember/destroyable';
 
 type IconComponent = typeof Captions;
@@ -149,43 +147,41 @@ class Isolated extends Component<typeof CardsGrid> {
         </div>
 
         <ul class='cards' data-test-cards-grid-cards>
-          {{#if this.isShowingCards}}
-            {{#let
-              (component @context.prerenderedCardSearchComponent)
-              as |PrerenderedCardSearch|
-            }}
-              <PrerenderedCardSearch
-                @query={{this.query}}
-                @format='fitted'
-                @realms={{this.realms}}
-              >
-
-                <:loading>
-                  Loading...
-                </:loading>
-                <:response as |cards|>
-                  {{#each cards as |card|}}
-                    <li
-                      class='card'
-                      {{@context.cardComponentModifier
-                        cardId=card.url
-                        format='data'
-                        fieldType=undefined
-                        fieldName=undefined
-                      }}
-                      data-test-cards-grid-item={{removeFileExtension card.url}}
-                      {{! In order to support scrolling cards into view we use a selector that is not pruned out in production builds }}
-                      data-cards-grid-item={{removeFileExtension card.url}}
-                    >
-                      <CardContainer @displayBoundaries='true'>
-                        {{card.component}}
-                      </CardContainer>
-                    </li>
-                  {{/each}}
-                </:response>
-              </PrerenderedCardSearch>
-            {{/let}}
-          {{/if}}
+          {{#let
+            (component @context.prerenderedCardSearchComponent)
+            as |PrerenderedCardSearch|
+          }}
+            <PrerenderedCardSearch
+              @query={{this.query}}
+              @format='fitted'
+              @realms={{this.realms}}
+            >
+
+              <:loading>
+                Loading...
+              </:loading>
+              <:response as |cards|>
+                {{#each cards as |card|}}
+                  <li
+                    class='card'
+                    {{@context.cardComponentModifier
+                      cardId=card.url
+                      format='data'
+                      fieldType=undefined
+                      fieldName=undefined
+                    }}
+                    data-test-cards-grid-item={{removeFileExtension card.url}}
+                    {{! In order to support scrolling cards into view we use a selector that is not pruned out in production builds }}
+                    data-cards-grid-item={{removeFileExtension card.url}}
+                  >
+                    <CardContainer @displayBoundaries='true'>
+                      {{card.component}}
+                    </CardContainer>
+                  </li>
+                {{/each}}
+              </:response>
+            </PrerenderedCardSearch>
+          {{/let}}
         </ul>
 
         {{#if @context.actions.createCard}}
@@ -330,18 +326,6 @@ class Isolated extends Component<typeof CardsGrid> {
 
   filters: { displayName: string; icon: IconComponent; query: any }[] =
     new TrackedArray([
-      {
-        displayName: 'Favorites',
-        icon: Star,
-        query: {
-          filter: {
-            any:
-              this.args.model.favorites?.map((card) => {
-                return { eq: { id: card.id } } ?? {};
-              }) ?? [],
-          },
-        },
-      },
       {
         displayName: 'All Cards',
         icon: CardsIcon,
@@ -401,13 +385,6 @@ class Isolated extends Component<typeof CardsGrid> {
     return { ...this.activeFilter.query, sort: this.selectedSortOption.sort };
   }
 
-  private get isShowingCards() {
-    return (
-      this.activeFilter.displayName !== 'Favorites' ||
-      (this.args.model.favorites && this.args.model.favorites.length > 0)
-    );
-  }
-
   private createCard = restartableTask(async () => {
     let preselectedCardTypeQuery: Query | undefined;
     let activeFilterRef = this.activeFilter?.query?.filter?.type;
@@ -464,7 +441,9 @@ class Isolated extends Component<typeof CardsGrid> {
       `${baseRealm.url}cards-grid/CardsGrid`,
     ];
 
-    this.filters.splice(2, this.filters.length);
+    // Remove all filter items except the first one,
+    // as 'All Cards' is a predefined filter and not a result from the card type summary API.
+    this.filters.splice(1, this.filters.length);
     cardTypeSummaries.forEach((summary) => {
       if (excludedCardTypeIds.includes(summary.id)) {
         return;
@@ -513,7 +492,6 @@ export class CardsGrid extends CardDef {
       return this.realmName;
     },
   });
-  @field favorites = linksToMany(CardDef);
 
   static getDisplayName(instance: BaseDef) {
     if (isCardInstance(instance)) {

packages/base/links-to-editor.gts

@@ -14,14 +14,14 @@ import {
   type BaseDef,
   type Box,
   type Field,
-  CardContext,
-  realmURL,
+  type CardContext,
 } from './card-api';
 import {
   chooseCard,
   baseCardRef,
   identifyCard,
   CardContextName,
+  RealmURLContextName,
 } from '@cardstack/runtime-common';
 import { AddButton, IconButton } from '@cardstack/boxel-ui/components';
 import { IconMinusCircle } from '@cardstack/boxel-ui/icons';
@@ -38,6 +38,7 @@ interface Signature {
 
 export class LinksToEditor extends GlimmerComponent<Signature> {
   @consume(CardContextName) declare cardContext: CardContext;
+  @consume(RealmURLContextName) declare realmURL: URL | undefined;
 
   <template>
     <PermissionsConsumer as |permissions|>
@@ -149,9 +150,10 @@ export class LinksToEditor extends GlimmerComponent<Signature> {
         offerToCreate: {
           ref: type,
           relativeTo: undefined,
-          realmURL: this.args.model.value?.[realmURL],
+          realmURL: this.realmURL,
         },
         createNewCard: this.cardContext?.actions?.createCard,
+        consumingRealm: this.realmURL,
       },
     );
     if (chosenCard) {

packages/base/links-to-many-component.gts

@@ -3,8 +3,7 @@ import { on } from '@ember/modifier';
 import { fn } from '@ember/helper';
 import {
   BaseDef,
-  CardContext,
-  realmURL,
+  type CardContext,
   type Box,
   type BoxComponent,
   type CardDef,
@@ -29,6 +28,7 @@ import {
   identifyCard,
   getPlural,
   CardContextName,
+  RealmURLContextName,
 } from '@cardstack/runtime-common';
 import { IconMinusCircle, IconX, FourLines } from '@cardstack/boxel-ui/icons';
 import { eq } from '@cardstack/boxel-ui/helpers';
@@ -57,6 +57,7 @@ interface Signature {
 
 class LinksToManyEditor extends GlimmerComponent<Signature> {
   @consume(CardContextName) declare cardContext: CardContext;
+  @consume(RealmURLContextName) declare realmURL: URL | undefined;
 
   <template>
     <div class='links-to-many-editor' data-test-links-to-many={{@field.name}}>
@@ -101,10 +102,11 @@ class LinksToManyEditor extends GlimmerComponent<Signature> {
         offerToCreate: {
           ref: type,
           relativeTo: undefined,
-          realmURL: this.args.model.value[realmURL],
+          realmURL: this.realmURL,
         },
         multiSelect: true,
         createNewCard: this.cardContext?.actions?.createCard,
+        consumingRealm: this.realmURL,
       },
     );
     if (chosenCard) {

packages/billing/.eslintrc.js

@@ -0,0 +1,28 @@
+'use strict';
+
+module.exports = {
+  overrides: [
+    {
+      files: ['./.eslintrc.js'],
+      parserOptions: {
+        sourceType: 'script',
+      },
+      env: {
+        browser: false,
+        node: true,
+      },
+      extends: ['plugin:n/recommended'],
+      rules: {
+        '@typescript-eslint/no-var-requires': 'off',
+      },
+    },
+    {
+      files: ['tests/**/*-test.{js,ts}'],
+      extends: ['plugin:qunit/recommended'],
+      rules: {
+        'qunit/require-expect': 'off',
+        'qunit/no-conditional-assertions': 'off',
+      },
+    },
+  ],
+};