@cardstack/boxel-cli 0.9.0 → 0.10.0-unstable.0

package/bundled-test-harness/assets/operator-mode-acceptance-test-jjsYtt96.js

@@ -0,0 +1,1188 @@
+import { s as __toESM } from "./chunk-Rp0pCe6z.js";
+import { r as initializeDeferredDecorator, t as decorateFieldV2 } from "./runtime--fcdnjmJ-BoCBNIsz.js";
+import { Ar as testRealmURL, Dr as testRRI, Kn as APP_BOXEL_REALM_SERVER_EVENT_MSGTYPE } from "./runtime-common-ClpqhbwG.js";
+import { s as ensureTrailingSlash, y as rri } from "./paths-BYHDgqsT.js";
+import { t as config } from "./environment-DIUJgBKt.js";
+import { wt as setComponentTemplate } from "./cache-DtDz7X5V-Wn8jRDfL.js";
+import { H as templateFactory } from "./index-DaCZcoCY-CgzbilMy.js";
+import { n as src_default } from "./src-DPaAwa4H.js";
+import { h as SessionLocalStorageKey, m as ScrollPositions, n as AiAssistantOpen } from "./local-storage-keys-CS7XLz7J.js";
+import { n as Submodes } from "./submode-switcher-D-U9cXo0.js";
+import "./component-BJO47HTh.js";
+import "./template-factory-ds9s0u8l.js";
+import { A as FieldContainer } from "./components-Ct_agx0G.js";
+import { d as claimsFromRawToken } from "./card-prerender-Dke537bN.js";
+import { M as waitUntil, T as settled, d as click, k as visit, l as triggerEvent, o as waitFor, s as fillIn, y as currentURL } from "./dist-BOAdzfkP.js";
+import { t as require_qunit } from "./qunit-C-Foo4Nd.js";
+import { Ct as testRealmSecretSeed, D as realmConfigCardJSON, F as setupLocalIndexing, I as setupOnSave, L as setupRealmCacheTeardown, R as setupRealmServerEndpoints, St as createJWT, Z as withCachedRealmSetup, a as SYSTEM_CARD_FIXTURE_CONTENTS, ct as setupApplicationTest, j as setupAcceptanceTestRealm, pt as setupAuthEndpoints, st as visitOperatorMode, t as setupMockMatrix, wt as percySnapshot, z as setupUserSubscription } from "./mock-matrix-DPQ0j2MD.js";
+import { r as getService } from "./dist-CPfIHBla.js";
+import { t as getPageTitle } from "./test-support-C3PTOFHZ.js";
+import { a as getPlaygroundSelections, d as setPlaygroundSelections } from "./playground-DrsqZ4hE.js";
+import { n as getRecentCards, o as setRecentCards, r as getRecentFiles, s as setRecentFiles } from "./recent-files-cards-Ccqvv5_n.js";
+//#region tests/helpers/credential-fields.ts
+var import_qunit = /* @__PURE__ */ __toESM(require_qunit());
+async function signInThroughCredentialFields(userId = "@testuser:localhost") {
+	if (!document.querySelector("[data-test-credential-fields-frame=\"login\"]")) throw new Error("the sign-in fields are not on the page");
+	await getService("matrix-service").start({
+		auth: {
+			access_token: "mock-access-token",
+			device_id: "mock-device-id",
+			user_id: userId
+		},
+		refreshRoutes: true
+	});
+	await settled();
+}
+//#endregion
+//#region tests/acceptance/operator-mode-acceptance-test.gts
+var skillsRealmURL = ensureTrailingSlash(config.resolvedSkillsRealmURL);
+var matrixRoomId;
+var realm2URL = "http://test-realm/user/test2/";
+(0, import_qunit.module)("Acceptance | operator mode tests", function(hooks) {
+	let testRealm;
+	setupApplicationTest(hooks);
+	setupLocalIndexing(hooks);
+	setupRealmCacheTeardown(hooks);
+	setupOnSave(hooks);
+	let mockMatrixUtils = setupMockMatrix(hooks, {
+		loggedInAs: "@testuser:localhost",
+		activeRealms: [testRealmURL]
+	});
+	let { setActiveRealms, setExpiresInSec, createAndJoinRoom, simulateRemoteMessage, setRealmPermissions } = mockMatrixUtils;
+	hooks.beforeEach(async function() {
+		matrixRoomId = createAndJoinRoom({
+			sender: "@testuser:localhost",
+			name: "room-test"
+		});
+		setupUserSubscription();
+		setupAuthEndpoints();
+		setExpiresInSec(3600);
+		let loader = getService("loader-service").loader;
+		let cardApi;
+		let string;
+		cardApi = await loader.import("@cardstack/base/card-api");
+		string = await loader.import("@cardstack/base/string");
+		let { field, contains, linksTo, linksToMany, Component, FieldDef, CardDef } = cardApi;
+		let { default: StringField } = string;
+		class Pet extends CardDef {
+			static displayName = "Pet";
+			static headerColor = "#355e3b";
+			static {
+				decorateFieldV2(this.prototype, "name", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#name = (initializeDeferredDecorator(this, "name"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "cardTitle", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						return this.name;
+					} });
+				});
+			}
+			#cardTitle = (initializeDeferredDecorator(this, "cardTitle"), void 0);
+			static embedded = class Embedded extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "WFcmSB8C",
+						"block": "[[[10,\"h3\"],[15,\"data-test-pet\",[30,1,[\"name\"]]],[12],[1,\"\\n  \"],[8,[30,2,[\"name\"]],null,null,null],[1,\"\\n\"],[13]],[\"@model\",\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"isStrictMode": true
+					}), this);
+				}
+			};
+			static isolated = class Isolated extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "cjmf60Z+",
+						"block": "[[[10,0],[14,0,\"pet-isolated\"],[14,\"data-scopedcss-517b49417d-fb8b4d7f1e\",\"\"],[12],[1,\"\\n  \"],[10,\"h2\"],[15,\"data-test-pet-isolated\",[30,1,[\"name\"]]],[14,\"data-scopedcss-517b49417d-fb8b4d7f1e\",\"\"],[12],[1,\"\\n    \"],[8,[30,2,[\"name\"]],[[24,\"data-scopedcss-517b49417d-fb8b4d7f1e\",\"\"]],null,null],[1,\"\\n  \"],[13],[1,\"\\n\"],[13],[1,\"\\n\"]],[\"@model\",\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"isStrictMode": true
+					}), this);
+				}
+			};
+		}
+		class ShippingInfo extends FieldDef {
+			static displayName = "Shipping Info";
+			static {
+				decorateFieldV2(this.prototype, "preferredCarrier", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#preferredCarrier = (initializeDeferredDecorator(this, "preferredCarrier"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "remarks", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#remarks = (initializeDeferredDecorator(this, "remarks"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "cardTitle", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						return this.preferredCarrier;
+					} });
+				});
+			}
+			#cardTitle = (initializeDeferredDecorator(this, "cardTitle"), void 0);
+			static embedded = class Embedded extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "Yo8asini",
+						"block": "[[[10,1],[15,\"data-test-preferredCarrier\",[30,1,[\"preferredCarrier\"]]],[12],[13],[1,\"\\n\"],[8,[30,2,[\"preferredCarrier\"]],null,null,null]],[\"@model\",\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"isStrictMode": true
+					}), this);
+				}
+			};
+		}
+		class CountryWithNoEmbedded extends CardDef {
+			static displayName = "Country";
+			static {
+				decorateFieldV2(this.prototype, "name", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#name = (initializeDeferredDecorator(this, "name"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "cardTitle", [field], function() {
+					return contains(StringField, { computeVia() {
+						return this.name;
+					} });
+				});
+			}
+			#cardTitle = (initializeDeferredDecorator(this, "cardTitle"), void 0);
+		}
+		class AddressWithNoEmbedded extends FieldDef {
+			static displayName = "Address";
+			static {
+				decorateFieldV2(this.prototype, "city", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#city = (initializeDeferredDecorator(this, "city"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "country", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#country = (initializeDeferredDecorator(this, "country"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "shippingInfo", [field], function() {
+					return contains(ShippingInfo);
+				});
+			}
+			#shippingInfo = (initializeDeferredDecorator(this, "shippingInfo"), void 0);
+			static edit = class Edit extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "bBxvzewT",
+						"block": "[[[8,[32,0],[[24,\"data-test-boxel-input-city\",\"\"]],[[\"@label\",\"@tag\"],[\"city\",\"label\"]],[[\"default\"],[[[[1,\"\\n  \"],[8,[30,1,[\"city\"]],null,null,null],[1,\"\\n\"]],[]]]]],[1,\"\\n\"],[8,[32,0],[[24,\"data-test-boxel-input-country\",\"\"]],[[\"@label\",\"@tag\"],[\"country\",\"label\"]],[[\"default\"],[[[[1,\"\\n  \"],[8,[30,1,[\"country\"]],null,null,null],[1,\"\\n\"]],[]]]]],[1,\"\\n\"],[10,0],[14,\"data-test-shippingInfo-field\",\"\"],[12],[8,[30,1,[\"shippingInfo\"]],null,null,null],[13]],[\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"scope": () => [FieldContainer],
+						"isStrictMode": true
+					}), this);
+				}
+			};
+		}
+		class Address extends FieldDef {
+			static displayName = "Address";
+			static {
+				decorateFieldV2(this.prototype, "city", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#city = (initializeDeferredDecorator(this, "city"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "country", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#country = (initializeDeferredDecorator(this, "country"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "shippingInfo", [field], function() {
+					return contains(ShippingInfo);
+				});
+			}
+			#shippingInfo = (initializeDeferredDecorator(this, "shippingInfo"), void 0);
+			static embedded = class Embedded extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "sN9XNpHg",
+						"block": "[[[10,\"h3\"],[15,\"data-test-city\",[30,1,[\"city\"]]],[12],[1,\"\\n  \"],[8,[30,2,[\"city\"]],null,null,null],[1,\"\\n\"],[13],[1,\"\\n\"],[10,\"h3\"],[15,\"data-test-country\",[30,1,[\"country\"]]],[12],[1,\"\\n  \"],[8,[30,2,[\"country\"]],null,null,null],[1,\"\\n\"],[13],[1,\"\\n\"],[10,0],[14,\"data-test-shippingInfo-field\",\"\"],[12],[8,[30,2,[\"shippingInfo\"]],null,null,null],[13]],[\"@model\",\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"isStrictMode": true
+					}), this);
+				}
+			};
+			static edit = class Edit extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "bBxvzewT",
+						"block": "[[[8,[32,0],[[24,\"data-test-boxel-input-city\",\"\"]],[[\"@label\",\"@tag\"],[\"city\",\"label\"]],[[\"default\"],[[[[1,\"\\n  \"],[8,[30,1,[\"city\"]],null,null,null],[1,\"\\n\"]],[]]]]],[1,\"\\n\"],[8,[32,0],[[24,\"data-test-boxel-input-country\",\"\"]],[[\"@label\",\"@tag\"],[\"country\",\"label\"]],[[\"default\"],[[[[1,\"\\n  \"],[8,[30,1,[\"country\"]],null,null,null],[1,\"\\n\"]],[]]]]],[1,\"\\n\"],[10,0],[14,\"data-test-shippingInfo-field\",\"\"],[12],[8,[30,1,[\"shippingInfo\"]],null,null,null],[13]],[\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"scope": () => [FieldContainer],
+						"isStrictMode": true
+					}), this);
+				}
+			};
+		}
+		class Person extends CardDef {
+			static displayName = "Person";
+			static {
+				decorateFieldV2(this.prototype, "firstName", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#firstName = (initializeDeferredDecorator(this, "firstName"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "pet", [field], function() {
+					return linksTo(Pet);
+				});
+			}
+			#pet = (initializeDeferredDecorator(this, "pet"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "friends", [field], function() {
+					return linksToMany(Pet);
+				});
+			}
+			#friends = (initializeDeferredDecorator(this, "friends"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "firstLetterOfTheName", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						if (!this.firstName) return;
+						return this.firstName[0];
+					} });
+				});
+			}
+			#firstLetterOfTheName = (initializeDeferredDecorator(this, "firstLetterOfTheName"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "cardTitle", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						return this.firstName;
+					} });
+				});
+			}
+			#cardTitle = (initializeDeferredDecorator(this, "cardTitle"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "address", [field], function() {
+					return contains(Address);
+				});
+			}
+			#address = (initializeDeferredDecorator(this, "address"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "addressWithNoEmbedded", [field], function() {
+					return contains(AddressWithNoEmbedded);
+				});
+			}
+			#addressWithNoEmbedded = (initializeDeferredDecorator(this, "addressWithNoEmbedded"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "countryWithNoEmbedded", [field], function() {
+					return linksTo(CountryWithNoEmbedded);
+				});
+			}
+			#countryWithNoEmbedded = (initializeDeferredDecorator(this, "countryWithNoEmbedded"), void 0);
+			static isolated = class Isolated extends Component {
+				static {
+					setComponentTemplate(templateFactory({
+						"id": "B0UMD/Ej",
+						"block": "[[[10,\"h2\"],[15,\"data-test-person\",[30,1,[\"firstName\"]]],[12],[1,\"\\n  \"],[8,[30,2,[\"firstName\"]],null,null,null],[1,\"\\n\"],[13],[1,\"\\n\"],[10,2],[15,\"data-test-first-letter-of-the-name\",[30,1,[\"firstLetterOfTheName\"]]],[12],[1,\"\\n  \"],[8,[30,2,[\"firstLetterOfTheName\"]],null,null,null],[1,\"\\n\"],[13],[1,\"\\nPet:\\n\"],[8,[30,2,[\"pet\"]],null,null,null],[1,\"\\nFriends:\\n\"],[8,[30,2,[\"friends\"]],null,null,null],[1,\"\\nAddress:\\n\"],[8,[30,2,[\"address\"]],null,null,null],[1,\"\\n\"],[10,0],[14,\"data-test-address-with-no-embedded\",\"\"],[12],[1,\"\\n  Address With No Embedded:\\n  \"],[8,[30,2,[\"addressWithNoEmbedded\"]],null,null,null],[1,\"\\n\"],[13],[1,\"\\n\"],[10,0],[14,\"data-test-country-with-no-embedded\",\"\"],[12],[1,\"Country With No Embedded:\\n  \"],[8,[30,2,[\"countryWithNoEmbedded\"]],null,null,null],[1,\"\\n\"],[13]],[\"@model\",\"@fields\"],[]]",
+						"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/acceptance/operator-mode-acceptance-test.gts",
+						"isStrictMode": true
+					}), this);
+				}
+			};
+		}
+		class BoomPerson extends CardDef {
+			static displayName = "Boom Person";
+			static {
+				decorateFieldV2(this.prototype, "firstName", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#firstName = (initializeDeferredDecorator(this, "firstName"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "boom", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						throw new Error("Boom!");
+					} });
+				});
+			}
+			#boom = (initializeDeferredDecorator(this, "boom"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "cardTitle", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						return this.firstName;
+					} });
+				});
+			}
+			#cardTitle = (initializeDeferredDecorator(this, "cardTitle"), void 0);
+		}
+		class ExplodingPerson extends CardDef {
+			static displayName = "Exploding Person";
+			static {
+				decorateFieldV2(this.prototype, "firstName", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#firstName = (initializeDeferredDecorator(this, "firstName"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "status", [field], function() {
+					return contains(StringField);
+				});
+			}
+			#status = (initializeDeferredDecorator(this, "status"), void 0);
+			static {
+				decorateFieldV2(this.prototype, "cardTitle", [field], function() {
+					return contains(StringField, { computeVia: function() {
+						if (this.status === "boom") throw new Error("Boom!");
+						return this.firstName;
+					} });
+				});
+			}
+			#cardTitle = (initializeDeferredDecorator(this, "cardTitle"), void 0);
+		}
+		await withCachedRealmSetup(async () => {
+			({realm: testRealm} = await setupAcceptanceTestRealm({
+				mockMatrixUtils,
+				contents: {
+					...SYSTEM_CARD_FIXTURE_CONTENTS,
+					"address.gts": { Address },
+					"boom-person.gts": { BoomPerson },
+					"exploding-person.gts": { ExplodingPerson },
+					"country-with-no-embedded-template.gts": { CountryWithNoEmbedded },
+					"address-with-no-embedded-template.gts": { AddressWithNoEmbedded },
+					"person.gts": { Person },
+					"pet.gts": { Pet },
+					"shipping-info.gts": { ShippingInfo },
+					"README.txt": `Hello World`,
+					"person-entry.json": { data: {
+						type: "card",
+						attributes: {
+							cardTitle: "Person Card",
+							cardDescription: "Spec for Person Card",
+							specType: "card",
+							ref: {
+								module: testRRI("person"),
+								name: "Person"
+							}
+						},
+						meta: { adoptsFrom: {
+							module: "@cardstack/base/spec",
+							name: "Spec"
+						} }
+					} },
+					"Pet/mango.json": { data: {
+						attributes: { name: "Mango" },
+						meta: { adoptsFrom: {
+							module: testRRI("pet"),
+							name: "Pet"
+						} }
+					} },
+					"Pet/vangogh.json": { data: {
+						attributes: { name: "Van Gogh" },
+						meta: { adoptsFrom: {
+							module: testRRI("pet"),
+							name: "Pet"
+						} }
+					} },
+					"Person/fadhlan.json": { data: {
+						attributes: {
+							firstName: "Fadhlan",
+							address: {
+								city: "Bandung",
+								country: "Indonesia",
+								shippingInfo: {
+									preferredCarrier: "DHL",
+									remarks: `Don't let bob deliver the package--he's always bringing it to the wrong address`
+								}
+							}
+						},
+						relationships: { pet: { links: { self: `${testRealmURL}Pet/mango` } } },
+						meta: { adoptsFrom: {
+							module: testRRI("person"),
+							name: "Person"
+						} }
+					} },
+					"Person/error.json": { data: {
+						attributes: {
+							firstName: "Error",
+							status: "boom"
+						},
+						meta: { adoptsFrom: {
+							module: testRRI("exploding-person"),
+							name: "ExplodingPerson"
+						} }
+					} },
+					"boom.json": { data: {
+						attributes: { firstName: "Boom!" },
+						meta: { adoptsFrom: {
+							module: "./boom-person",
+							name: "BoomPerson"
+						} }
+					} },
+					"grid.json": { data: {
+						type: "card",
+						attributes: {},
+						meta: { adoptsFrom: {
+							module: "@cardstack/base/cards-grid",
+							name: "CardsGrid"
+						} }
+					} },
+					"index.json": { data: {
+						type: "card",
+						meta: { adoptsFrom: {
+							module: "@cardstack/base/cards-grid",
+							name: "CardsGrid"
+						} }
+					} },
+					"realm.json": realmConfigCardJSON({
+						name: "Test Workspace B",
+						backgroundURL: "/test-fixtures/realm-images/pawel-czerwinski-Ly-ZLa-A5jti-Y-unsplash.jpg",
+						iconURL: "/test-fixtures/realm-images/boxel-logo.png"
+					})
+				}
+			}));
+			setActiveRealms([testRealmURL, realm2URL]);
+			await setupAcceptanceTestRealm({
+				mockMatrixUtils,
+				realmURL: realm2URL,
+				contents: {
+					...SYSTEM_CARD_FIXTURE_CONTENTS,
+					"person.gts": { Person },
+					"Person/1.json": { data: {
+						attributes: { firstName: "Fadhlan" },
+						meta: { adoptsFrom: {
+							module: rri(`${realm2URL}person`),
+							name: "Person"
+						} }
+					} }
+				}
+			});
+		});
+		setRealmPermissions({ [realm2URL]: ["read", "write"] });
+	});
+	(0, import_qunit.test)("visiting operator mode", async function(assert) {
+		await visit("/");
+		await click("[data-test-workspace-button=\"Test Workspace B\"]");
+		assert.dom("[data-test-operator-mode-stack]").exists();
+		assert.dom("[data-test-stack-card-index=\"0\"]").exists();
+		assert.strictEqual(getPageTitle(), "Test Workspace B");
+		await click("[data-test-boxel-filter-list-button=\"All Cards\"]");
+		await waitFor(`[data-test-cards-grid-item="${testRealmURL}Pet/mango"]`);
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}Pet/mango"]`).exists();
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}Pet/vangogh"]`).exists();
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}Person/fadhlan"]`).exists();
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}index"]`).doesNotExist("grid cards do not show other grid cards");
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}grid"]`).doesNotExist("grid cards do not show other grid cards");
+		await click("[data-test-open-ai-assistant]");
+		await click("[data-test-close-ai-assistant]");
+		await percySnapshot(assert);
+		assert.operatorModeParametersMatch(currentURL(), {
+			stacks: [[{
+				id: `${testRealmURL}index`,
+				format: "isolated"
+			}]],
+			submode: Submodes.Interact
+		});
+		await click(`[data-test-cards-grid-item="${testRealmURL}Pet/mango"] .field-component-card`);
+		await waitFor(`[data-test-stack-card="${testRealmURL}Pet/mango"]`);
+		await percySnapshot("Acceptance | operator mode tests | visiting operator mode - pet card opened in stack");
+		assert.operatorModeParametersMatch(currentURL(), {
+			stacks: [[{
+				id: `${testRealmURL}index`,
+				format: "isolated"
+			}, {
+				id: `${testRealmURL}Pet/mango`,
+				format: "isolated"
+			}]],
+			submode: Submodes.Interact
+		});
+		assert.strictEqual(getPageTitle(), "Mango");
+	});
+	(0, import_qunit.test)("renaming a realm updates the index card title without a reload", async function(assert) {
+		await visit("/");
+		await click("[data-test-workspace-button=\"Test Workspace B\"]");
+		assert.dom("[data-test-stack-card-index=\"0\"]").exists();
+		assert.strictEqual(getPageTitle(), "Test Workspace B", "index card title shows the original realm name");
+		await testRealm.write("realm.json", realmConfigCardJSON({
+			name: "Renamed Workspace B",
+			backgroundURL: "/test-fixtures/realm-images/pawel-czerwinski-Ly-ZLa-A5jti-Y-unsplash.jpg",
+			iconURL: "/test-fixtures/realm-images/boxel-logo.png"
+		}));
+		await settled();
+		assert.strictEqual(getPageTitle(), "Renamed Workspace B", "index card title reflects the new realm name without a reload");
+	});
+	(0, import_qunit.module)("card with an error that has a last known good state", function(hooks) {
+		setupRealmCacheTeardown(hooks);
+		hooks.beforeEach(async function() {
+			await testRealm.write("Person/fadhlan.json", JSON.stringify({ data: {
+				attributes: {
+					firstName: "Fadhlan",
+					status: "boom"
+				},
+				meta: { adoptsFrom: {
+					module: testRRI("exploding-person"),
+					name: "ExplodingPerson"
+				} }
+			} }));
+		});
+		(0, import_qunit.test)("index card shows last known good state for instances that have an error", async function(assert) {
+			await visit("/");
+			await click("[data-test-workspace-button=\"Test Workspace B\"]");
+			await click("[data-test-boxel-filter-list-button=\"All Cards\"]");
+			assert.dom(`[data-test-cards-grid-item="${testRealmURL}Person/fadhlan"][data-test-instance-error]`).exists("the instance with an error is displayed");
+			assert.dom(`[data-test-cards-grid-item="${testRealmURL}Person/fadhlan"][data-test-instance-error] [data-test-card-title]`).containsText("Fadhlan", "the last known good state of the instance is displayed");
+			await percySnapshot(assert);
+			await click(`[data-test-cards-grid-item="${testRealmURL}Person/fadhlan"] .field-component-card`);
+			assert.dom(`[data-test-card-error]`).exists();
+			assert.dom(`[data-test-error-message]`).includesText("Boom!");
+		});
+		(0, import_qunit.test)("can delete a card", async function(assert) {
+			await visit("/");
+			await click("[data-test-workspace-button=\"Test Workspace B\"]");
+			await click("[data-test-boxel-filter-list-button=\"All Cards\"]");
+			await triggerEvent(`[data-test-cards-grid-item="http://test-realm/test/Person/fadhlan"] .field-component-card`, "mouseenter");
+			await click("[data-test-overlay-card=\"http://test-realm/test/Person/fadhlan\"] [data-test-overlay-more-options]");
+			await click("[data-test-boxel-menu-item-text=\"Delete\"]");
+			await waitFor(`[data-test-delete-modal-container]`);
+			assert.dom(`[data-test-delete-modal-container]`).containsText("Delete the card Fadhlan?");
+			await click("[data-test-confirm-delete-button]");
+			assert.dom(`[data-test-cards-grid-item="${testRealmURL}Person/fadhlan"]`).doesNotExist("the card is deleted");
+		});
+	});
+	(0, import_qunit.test)("index card shows default error tile for instances that have an error and no last known good state", async function(assert) {
+		await visit("/");
+		await click("[data-test-workspace-button=\"Test Workspace B\"]");
+		await click("[data-test-boxel-filter-list-button=\"All Cards\"]");
+		await waitFor(`[data-test-cards-grid-item="${testRealmURL}Person/error"][data-test-instance-error]`);
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}Person/error"][data-test-instance-error]`).exists("the instance with an error is displayed");
+		assert.dom(`[data-test-cards-grid-item="${testRealmURL}Person/error"][data-test-instance-error] [data-test-instance-error-name]`).containsText("Person/error");
+	});
+	(0, import_qunit.test)("can visit a card in error state via canonical URL", async function(assert) {
+		await visit("/test/Person/error");
+		assert.dom(`[data-test-stack-card="${testRealmURL}Person/error"] [data-test-card-error]`).exists("the error state of the card is displayed");
+		assert.dom("[data-test-error-message]").includesText("Boom!");
+		await click("[data-test-toggle-details]");
+		assert.dom("[data-test-error-details]").includesText("Boom!");
+	});
+	(0, import_qunit.test)("error card header more-options menu includes Copy Card URL", async function(assert) {
+		await visit("/test/Person/error");
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/error"] [data-test-card-error]`);
+		await click(`[data-test-stack-card="${testRealmURL}Person/error"] [data-test-more-options-button]`);
+		assert.dom("[data-test-boxel-menu-item-text=\"Copy Card URL\"]").exists("Copy Card URL is available even when the card is an error doc");
+		assert.dom("[data-test-boxel-menu-item-text=\"Delete Card\"]").exists("Delete Card remains available on the error card menu");
+	});
+	(0, import_qunit.test)("can visit a card via canonical URL from second realm", async function(assert) {
+		await visit(`/user/test2/Person/1`);
+		assert.dom(`[data-test-stack-card="${realm2URL}Person/1"]`).exists();
+		assert.dom("[data-test-person]").hasText("Fadhlan");
+	});
+	(0, import_qunit.test)("can open code submode when card or field has no embedded template", async function(assert) {
+		await visitOperatorMode({ stacks: [[{
+			id: `${testRealmURL}Person/fadhlan`,
+			format: "isolated"
+		}]] });
+		await waitFor("[data-test-stack-card=\"http://test-realm/test/Person/fadhlan\"]");
+		await waitFor("[data-test-address-with-no-embedded]");
+		await waitFor("[data-test-address-with-no-embedded] [data-test-open-code-submode]");
+		await percySnapshot(assert);
+		assert.dom("[data-test-address-with-no-embedded] [data-test-missing-template-text]").hasText("Missing embedded component for FieldDef: Address");
+		assert.dom("[data-test-country-with-no-embedded] [data-test-empty-field]").exists();
+		await click("[data-test-address-with-no-embedded] [data-test-open-code-submode]");
+		await waitUntil(() => currentURL().includes("address-with-no-embedded-template.gts"));
+		assert.operatorModeParametersMatch(currentURL(), { codePath: `${testRealmURL}address-with-no-embedded-template.gts` });
+		assert.strictEqual(getPageTitle(), `address-with-no-embedded-template.gts in Test Workspace B`);
+	});
+	(0, import_qunit.test)("open workspace chooser when boxel icon is clicked", async function(assert) {
+		getService("network").mount(async (req) => {
+			if (document.querySelector("[data-test-workspace-chooser]") && req.url.includes("_info")) assert.dom(`[data-test-workspace-list] [data-test-workspace-loading-indicator]`).exists();
+			return null;
+		}, { prepend: true });
+		await visitOperatorMode({ stacks: [[{
+			id: `${testRealmURL}Person/fadhlan`,
+			format: "isolated"
+		}]] });
+		assert.dom(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`).exists();
+		assert.dom("[data-test-submode-layout-title]").doesNotExist();
+		assert.dom("[data-test-workspace-chooser]").doesNotExist();
+		let url = currentURL().split("?")[1].replace(/^\/\?/, "") ?? "";
+		let urlParameters = new URLSearchParams(url);
+		assert.false(Boolean(urlParameters.get("workspaceChooserOpened")));
+		await click("[data-test-workspace-chooser-toggle]");
+		assert.dom("[data-test-workspace-chooser]").exists();
+		await waitFor(`[data-test-workspace="Test Workspace B"]`);
+		assert.dom(`[data-test-workspace-list] [data-test-workspace-loading-indicator]`).doesNotExist();
+		url = currentURL().split("?")[1].replace(/^\/\?/, "") ?? "";
+		urlParameters = new URLSearchParams(url);
+		let operatorModeStateParam = urlParameters.get("operatorModeState");
+		assert.ok(operatorModeStateParam);
+		assert.true(JSON.parse(operatorModeStateParam ?? "{}").workspaceChooserOpened);
+		await percySnapshot(assert);
+	});
+	(0, import_qunit.test)("check code mode states when switching between workspaces", async function(assert) {
+		await visitOperatorMode({ stacks: [[{
+			id: `${testRealmURL}Person/fadhlan`,
+			format: "isolated"
+		}]] });
+		assert.dom(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`).exists();
+		await click("[data-test-submode-switcher] button");
+		await click("[data-test-boxel-menu-item-text=\"Code\"]");
+		await click("[data-test-file-browser-toggle]");
+		assert.dom(`[data-test-realm-name]`).hasText("In Test Workspace B");
+		await click("[data-test-file=\"boom-person.gts\"]");
+		await click("[data-test-file=\"Person/fadhlan.json\"]");
+		await click("[data-test-directory=\"Pet/\"]");
+		await click("[data-test-file=\"Pet/mango.json\"]");
+		await click("[data-test-file=\"Pet/vangogh.json\"]");
+		assert.dom("[data-test-recent-file]").exists({ count: 3 });
+		assert.dom(`[data-test-recent-file="${testRealmURL}Pet/mango.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}Person/fadhlan.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}boom-person.gts"]`).exists();
+		await click("[data-test-workspace-chooser-toggle]");
+		await click("[data-test-workspace-button=\"Boxel Skills\"]");
+		await click("[data-test-submode-switcher] button");
+		await click("[data-test-boxel-menu-item-text=\"Code\"]");
+		assert.dom(`[data-test-realm-name]`).includesText("In Boxel Skills");
+		assert.dom(`[data-test-file="index.json"]`).hasClass("selected");
+		assert.dom("[data-test-recent-file]").exists({ count: 4 });
+		assert.dom(`[data-test-recent-file="${testRealmURL}Pet/vangogh.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}Pet/mango.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}Person/fadhlan.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}boom-person.gts"]`).exists();
+		await click("[data-test-workspace-chooser-toggle]");
+		await click("[data-test-workspace-button=\"Test Workspace B\"]");
+		await click("[data-test-submode-switcher] button");
+		await click("[data-test-boxel-menu-item-text=\"Code\"]");
+		assert.dom(`[data-test-realm-name]`).hasText("In Test Workspace B");
+		assert.dom(`[data-test-file="index.json"]`).hasClass("selected");
+		assert.dom("[data-test-recent-file]").exists({ count: 5 });
+		assert.dom(`[data-test-recent-file="${testRealmURL}Pet/vangogh.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${skillsRealmURL}index.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}Pet/mango.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}Person/fadhlan.json"]`).exists();
+		assert.dom(`[data-test-recent-file="${testRealmURL}boom-person.gts"]`).exists();
+	});
+	(0, import_qunit.test)("should open interact mode with index card after choosing a workspace", async function(assert) {
+		await visitOperatorMode({ stacks: [[{
+			id: `${testRealmURL}Person/fadhlan`,
+			format: "isolated"
+		}]] });
+		await click("[data-test-workspace-chooser-toggle]");
+		await click("[data-test-workspace-button=\"Test Workspace B\"]");
+		assert.dom(`[data-test-stack-card="${testRealmURL}index"]`).exists();
+		assert.dom("[data-test-submode-switcher] button").hasText("Interact");
+		assert.dom("[data-test-code-mode]").doesNotExist();
+	});
+	(0, import_qunit.module)("2 stacks", function(hooks) {
+		setupRealmCacheTeardown(hooks);
+		(0, import_qunit.test)("Toggling submode will open code submode and toggling back will restore the stack", async function(assert) {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}], [{
+				id: `${testRealmURL}Pet/mango`,
+				format: "isolated"
+			}]] });
+			await waitFor("[data-test-submode-switcher]");
+			await click("[data-test-submode-switcher] button");
+			await click("[data-test-boxel-menu-item-text=\"Code\"]");
+			await waitFor("[data-test-submode-switcher]");
+			assert.dom("[data-test-code-mode]").exists();
+			assert.dom("[data-test-submode-switcher] button").hasText("Code");
+			assert.operatorModeParametersMatch(currentURL(), {
+				submode: Submodes.Code,
+				codePath: `${testRealmURL}Pet/mango.json`,
+				fileView: "inspector",
+				openDirs: { [testRealmURL]: ["Pet/"] }
+			});
+			await waitFor("[data-test-submode-switcher]");
+			await click("[data-test-submode-switcher] button");
+			await click("[data-test-boxel-menu-item-text=\"Interact\"]");
+			await waitFor("[data-test-operator-mode-stack]");
+			assert.dom("[data-test-operator-mode-stack]").exists({ count: 2 });
+			assert.operatorModeParametersMatch(currentURL(), { submode: Submodes.Interact });
+		});
+	});
+	(0, import_qunit.module)("realm session expiration", function(hooks) {
+		setupRealmCacheTeardown(hooks);
+		let refreshInSec = 2;
+		hooks.beforeEach(async function() {
+			delete globalThis.__boxelRenderContext;
+			delete globalThis.__renderInstance;
+			setExpiresInSec(302);
+		});
+		(0, import_qunit.test)("realm session refreshes within 5 minute window of expiration", async function(assert) {
+			await visit("/");
+			let originalToken = src_default.localStorage.getItem(SessionLocalStorageKey);
+			await waitUntil(() => src_default.localStorage.getItem(SessionLocalStorageKey) !== originalToken, { timeout: refreshInSec * 3 * 1e3 });
+			let newToken = src_default.localStorage.getItem(SessionLocalStorageKey);
+			assert.ok(newToken, "new session token obtained");
+			assert.notEqual(originalToken, newToken, "new session token is different than original session token");
+		});
+	});
+	(0, import_qunit.module)("account popover", function(hooks) {
+		setupRealmCacheTeardown(hooks);
+		let userResponseBody = {
+			data: {
+				type: "user",
+				id: 1,
+				attributes: {
+					matrixUserId: "@testuser:localhost",
+					stripeCustomerId: "stripe-id-1",
+					creditsAvailableInPlanAllowance: 1e3,
+					creditsIncludedInPlanAllowance: 1e3,
+					extraCreditsAvailableInBalance: 100
+				},
+				relationships: { subscription: { data: {
+					type: "subscription",
+					id: 1
+				} } }
+			},
+			included: [
+				{
+					type: "subscription",
+					id: 1,
+					attributes: {
+						startedAt: "2024-10-15T03:42:11.000Z",
+						endedAt: "2025-10-15T03:42:11.000Z",
+						status: "active"
+					},
+					relationships: { plan: { data: {
+						type: "plan",
+						id: 1
+					} } }
+				},
+				{
+					type: "plan",
+					id: 1,
+					attributes: {
+						name: "Starter",
+						monthlyPrice: 0,
+						creditsIncluded: 2500
+					}
+				},
+				{
+					type: "plan",
+					id: 1,
+					attributes: {
+						name: "Creator",
+						monthlyPrice: 12,
+						creditsIncluded: 6500
+					}
+				},
+				{
+					type: "plan",
+					id: 1,
+					attributes: {
+						name: "Power User",
+						monthlyPrice: 49,
+						creditsIncluded: 35e3
+					}
+				}
+			]
+		};
+		setupRealmServerEndpoints(hooks, [{
+			route: "_user",
+			getResponse: async (_req) => {
+				return new Response(JSON.stringify(userResponseBody));
+			}
+		}, {
+			route: "_server-session",
+			getResponse: async (req) => {
+				if (!(await req.json()).access_token) return new Response(JSON.stringify({ errors: [`Request body missing 'access_token' property`] }), { status: 400 });
+				return new Response(null, {
+					status: 201,
+					headers: { Authorization: createJWT({
+						user: "@testuser:localhost",
+						sessionRoom: matrixRoomId
+					}, "1d", testRealmSecretSeed) }
+				});
+			}
+		}]);
+		(0, import_qunit.test)("openProfileSettings deep link opens settings on the subscription section", async function(assert) {
+			await visit("/?openProfileSettings=subscription");
+			assert.dom("[data-test-settings-modal]").exists();
+			assert.strictEqual(getService("operator-mode-state-service").profileSettingsSection, "subscription", "the modal opened targeting the subscription section");
+			assert.notOk(currentURL().includes("openProfileSettings"), "the param is consumed on arrival");
+		});
+		(0, import_qunit.test)("a deep link arriving with the layout already mounted opens the modal", async function(assert) {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}]] });
+			assert.dom("[data-test-settings-modal]").doesNotExist();
+			await visit("/?openProfileSettings=subscription");
+			assert.dom("[data-test-settings-modal]").exists();
+			assert.strictEqual(getService("operator-mode-state-service").profileSettingsSection, "subscription", "the modal opened targeting the subscription section");
+			assert.notOk(currentURL().includes("openProfileSettings"), "the param is consumed on arrival");
+		});
+		(0, import_qunit.test)("a closed settings modal stays closed when operator mode state persists", async function(assert) {
+			await visit("/?openProfileSettings=subscription");
+			assert.dom("[data-test-settings-modal]").exists();
+			await click("[data-test-confirm-cancel-button]");
+			assert.dom("[data-test-settings-modal]").doesNotExist();
+			getService("operator-mode-state-service").workspaceChooserOpened = true;
+			await settled();
+			assert.dom("[data-test-settings-modal]").doesNotExist();
+		});
+		(0, import_qunit.test)("a deep link arriving logged out waits for login, then opens the modal", async function(assert) {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}]] });
+			await click("[data-test-profile-icon-button]");
+			await click("[data-test-signout-button]");
+			assert.dom("[data-test-login-btn]").exists();
+			await visit("/?openProfileSettings=subscription");
+			assert.dom("[data-test-login-btn]").exists();
+			assert.dom("[data-test-settings-modal]").doesNotExist();
+			assert.ok(currentURL().includes("openProfileSettings=subscription"), "the param must outlive the login form");
+			await signInThroughCredentialFields();
+			let state;
+			try {
+				state = JSON.stringify({
+					url: currentURL(),
+					profileSettingsOpen: getService("operator-mode-state-service").profileSettingsOpen,
+					...getService("matrix-service").loginReadinessDebug
+				});
+			} catch (error) {
+				state = `<unavailable: ${String(error)}>`;
+			}
+			assert.dom("[data-test-settings-modal]").exists(`Element [data-test-settings-modal] exists — login state: ${state}`);
+			assert.strictEqual(getService("operator-mode-state-service").profileSettingsSection, "subscription", `the modal opened targeting the subscription section — login state: ${state}`);
+			assert.notOk(currentURL().includes("openProfileSettings"), "the param is consumed once it has been acted on");
+		});
+		(0, import_qunit.test)("can access and save settings via profile info popover", async function(assert) {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}]] });
+			await click("[data-test-profile-icon-button]");
+			await click("[data-test-settings-button]");
+			assert.dom("[data-test-profile-popover]").doesNotExist();
+			assert.dom("[data-test-settings-modal]").exists();
+			assert.strictEqual(getService("operator-mode-state-service").profileSettingsSection, void 0, "a plain open does not target a section");
+			assert.dom("[data-test-profile-icon]").hasText("T");
+			assert.dom("[data-test-profile-display-name]").hasText("");
+			assert.dom("[data-test-profile-icon]").hasStyle({ backgroundColor: "rgb(88, 226, 29)" });
+			assert.dom("[data-test-profile-icon-handle]").hasText("@testuser:localhost");
+			await fillIn("[data-test-display-name-field]", "");
+			assert.dom("[data-test-boxel-input-error-message]").hasText("Name is required");
+			await fillIn("[data-test-display-name-field]", "MAKEMECRASH");
+			assert.dom("[data-test-boxel-input-error-message]").doesNotExist();
+			await click("[data-test-profile-settings-save-button]");
+			assert.dom("[data-test-profile-save-error]").hasText("Failed to save profile. Please try again.");
+			await fillIn("[data-test-display-name-field]", "John");
+			await click("[data-test-profile-settings-save-button]");
+			assert.dom("[data-test-profile-save-error]").doesNotExist();
+			await waitUntil(() => document.querySelector("[data-test-profile-display-name]").textContent.trim() === "John");
+			assert.dom("[data-test-profile-icon]").hasText("J");
+		});
+		(0, import_qunit.test)("buy/subscribe links redirect to stripe checkout", async function(assert) {
+			await visitOperatorMode({
+				submode: "interact",
+				codePath: `${testRealmURL}employee.gts`
+			});
+			await waitFor("[data-test-profile-icon-button]");
+			await click("[data-test-profile-icon-button]");
+			await click("[data-test-buy-more-credits] button");
+			let stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/abcdef";
+			let realmServerService = getService("realm-server");
+			realmServerService.authedFetch = () => {
+				return Promise.resolve(new Response(JSON.stringify({ url: stripeCheckoutLinkExample })));
+			};
+			let redirectedToUrl = "";
+			let billingService = getService("billing-service");
+			billingService.redirectToUrl = (url) => {
+				redirectedToUrl = url;
+			};
+			stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/2500-credits";
+			await click("[data-test-buy-more-credits-button=\"2500\"]");
+			assert.strictEqual(redirectedToUrl, stripeCheckoutLinkExample);
+			stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/20000-credits";
+			await click("[data-test-buy-more-credits-button=\"20000\"]");
+			assert.strictEqual(redirectedToUrl, stripeCheckoutLinkExample);
+			stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/80000-credits";
+			await click("[data-test-buy-more-credits-button=\"80000\"]");
+			assert.strictEqual(redirectedToUrl, stripeCheckoutLinkExample);
+			await click("[data-test-close-modal]");
+			await click("[data-test-profile-icon-button]");
+			await click("[data-test-upgrade-plan-button]");
+			stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/starter-plan";
+			await click("[data-test-starter-plan-button]");
+			assert.strictEqual(redirectedToUrl, stripeCheckoutLinkExample);
+			stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/creator-plan";
+			await click("[data-test-creator-plan-button]");
+			assert.strictEqual(redirectedToUrl, stripeCheckoutLinkExample);
+			stripeCheckoutLinkExample = "https://checkout.stripe.com/c/pay/power-user-plan";
+			await click("[data-test-power-user-plan-button]");
+			assert.strictEqual(redirectedToUrl, stripeCheckoutLinkExample);
+		});
+		(0, import_qunit.test)(`displays credit info in account popover`, async function(assert) {
+			await visitOperatorMode({
+				submode: "interact",
+				codePath: `${testRealmURL}employee.gts`
+			});
+			await waitFor("[data-test-profile-icon-button]");
+			assert.dom("[data-test-profile-icon]").hasText("T");
+			assert.dom("[data-test-profile-icon]").hasStyle({ backgroundColor: "rgb(88, 226, 29)" });
+			assert.dom("[data-test-profile-popover]").doesNotExist();
+			await click("[data-test-profile-icon-button]");
+			assert.dom("[data-test-profile-popover]").exists();
+			assert.dom("[data-test-subscription-data=\"plan\"]").hasText("Starter");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasText("1,000 of 1,000 left");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasText("100");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasNoClass("out-of-credit");
+			await click("[data-test-upgrade-plan-button]");
+			assert.dom("[data-test-choose-subscription-plan-modal]").exists();
+			assert.dom("[data-test-starter-plan-button]").exists();
+			assert.dom("[data-test-creator-plan-button]").exists();
+			assert.dom("[data-test-power-user-plan-button]").exists();
+			assert.dom("[data-test-current-plan-badge]").exists("starter plan has current plan badge");
+			await click("[data-test-close-modal]");
+			await click("[data-test-profile-icon-button]");
+			assert.dom("[data-test-buy-more-credits]").exists();
+			assert.dom("[data-test-buy-more-credits]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-profile-popover]").exists();
+			await click("[data-test-buy-more-credits] button");
+			assert.dom("[data-test-profile-popover]").doesNotExist();
+			assert.dom("[data-test-boxel-card-container]").hasClass("profile-settings");
+			assert.dom("[data-test-subscription-data=\"plan\"]").hasText("Starter");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasText("1,000 of 1,000 left");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasText("100");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-manage-plan-button]").exists();
+			await click("[aria-label=\"close modal\"]");
+			userResponseBody.data.attributes.creditsAvailableInPlanAllowance = 0;
+			simulateRemoteMessage(matrixRoomId, "@realm-server:localhost", {
+				msgtype: APP_BOXEL_REALM_SERVER_EVENT_MSGTYPE,
+				body: JSON.stringify({ eventType: "billing-notification" })
+			});
+			await click("[data-test-profile-icon-button]");
+			assert.dom("[data-test-subscription-data=\"plan\"]").hasText("Starter");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasText("0 of 1,000 left");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasClass("out-of-credit");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasText("100");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-buy-more-credits]").hasNoClass("out-of-credit");
+			await click("[data-test-profile-icon-button]");
+			userResponseBody.data.attributes.extraCreditsAvailableInBalance = 0;
+			simulateRemoteMessage(matrixRoomId, "@realm-server:localhost", {
+				msgtype: APP_BOXEL_REALM_SERVER_EVENT_MSGTYPE,
+				body: JSON.stringify({ eventType: "billing-notification" })
+			});
+			await click("[data-test-profile-icon-button]");
+			assert.dom("[data-test-subscription-data=\"plan\"]").hasText("Starter");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasText("0 of 1,000 left");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasClass("out-of-credit");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasText("0");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasClass("out-of-credit");
+			assert.dom("[data-test-buy-more-credits]").hasClass("out-of-credit");
+			await click("[data-test-profile-icon-button]");
+			userResponseBody.data.attributes.creditsAvailableInPlanAllowance = 1e3;
+			simulateRemoteMessage(matrixRoomId, "@realm-server:localhost", {
+				msgtype: APP_BOXEL_REALM_SERVER_EVENT_MSGTYPE,
+				body: JSON.stringify({ eventType: "billing-notification" })
+			});
+			await click("[data-test-profile-icon-button]");
+			assert.dom("[data-test-subscription-data=\"plan\"]").hasText("Starter");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasText("1,000 of 1,000 left");
+			assert.dom("[data-test-subscription-data=\"monthly-credit\"]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasText("0");
+			assert.dom("[data-test-subscription-data=\"additional-credit\"]").hasNoClass("out-of-credit");
+			assert.dom("[data-test-buy-more-credits]").hasNoClass("out-of-credit");
+			userResponseBody.data.attributes.plan = "Starter";
+			simulateRemoteMessage(matrixRoomId, "@realm-server:localhost", {
+				msgtype: APP_BOXEL_REALM_SERVER_EVENT_MSGTYPE,
+				body: JSON.stringify({ eventType: "billing-notification" })
+			});
+			await click("[data-test-upgrade-plan-button]");
+			assert.dom("[data-test-starter-plan-column] [data-test-current-plan-badge]").exists();
+			assert.dom("[data-test-creator-plan-column] [data-test-current-plan-badge]").doesNotExist();
+			assert.dom("[data-test-power-user-plan-column] [data-test-current-plan-badge]").doesNotExist();
+			assert.dom("[data-test-starter-plan-button]").hasText("Manage Plan");
+			assert.dom("[data-test-creator-plan-button]").hasText("Get Started");
+			assert.dom("[data-test-power-user-plan-button]").hasText("Get Started");
+		});
+		(0, import_qunit.test)("shows daily grant note when user is below threshold", async function(assert) {
+			let originalAttributes = { ...userResponseBody.data.attributes };
+			let nowSeconds = Math.floor(Date.now() / 1e3);
+			userResponseBody.data.attributes = {
+				...originalAttributes,
+				creditsAvailableInPlanAllowance: 1e3,
+				creditsIncludedInPlanAllowance: 1e3,
+				extraCreditsAvailableInBalance: 100,
+				lowCreditThreshold: 2e3,
+				nextDailyCreditGrantAt: nowSeconds + 3600,
+				lastDailyCreditGrantAt: null
+			};
+			try {
+				await visitOperatorMode({
+					submode: "interact",
+					codePath: `${testRealmURL}employee.gts`
+				});
+				await waitFor("[data-test-profile-icon-button]");
+				await click("[data-test-profile-icon-button]");
+				assert.dom("[data-test-daily-grant-note]").exists();
+				assert.dom("[data-test-daily-grant-note]").includesText("top up your balance to 2,000 credits");
+			} finally {
+				userResponseBody.data.attributes = originalAttributes;
+			}
+		});
+		(0, import_qunit.test)("shows last daily grant note when user is above threshold", async function(assert) {
+			let originalAttributes = { ...userResponseBody.data.attributes };
+			let nowSeconds = Math.floor(Date.now() / 1e3);
+			userResponseBody.data.attributes = {
+				...originalAttributes,
+				creditsAvailableInPlanAllowance: 2e3,
+				creditsIncludedInPlanAllowance: 2e3,
+				extraCreditsAvailableInBalance: 200,
+				lowCreditThreshold: 2e3,
+				nextDailyCreditGrantAt: null,
+				lastDailyCreditGrantAt: nowSeconds - 3600,
+				dailyCreditGrantCount: 2
+			};
+			try {
+				await visitOperatorMode({
+					submode: "interact",
+					codePath: `${testRealmURL}employee.gts`
+				});
+				await waitFor("[data-test-profile-icon-button]");
+				await click("[data-test-profile-icon-button]");
+				assert.dom("[data-test-daily-grant-note]").exists();
+				assert.dom("[data-test-daily-grant-note]").includesText("We topped up your account to 2,000 credits since you were getting low.");
+				assert.dom("[data-test-daily-grant-note]").includesText("Last daily credits grant:");
+			} finally {
+				userResponseBody.data.attributes = originalAttributes;
+			}
+		});
+		(0, import_qunit.test)("does not show \"getting low\" for fresh users with only initial grant", async function(assert) {
+			let originalAttributes = { ...userResponseBody.data.attributes };
+			let nowSeconds = Math.floor(Date.now() / 1e3);
+			userResponseBody.data.attributes = {
+				...originalAttributes,
+				creditsAvailableInPlanAllowance: 2e3,
+				creditsIncludedInPlanAllowance: 2e3,
+				extraCreditsAvailableInBalance: 2e3,
+				lowCreditThreshold: 2e3,
+				nextDailyCreditGrantAt: null,
+				lastDailyCreditGrantAt: nowSeconds - 60,
+				dailyCreditGrantCount: 1
+			};
+			try {
+				await visitOperatorMode({
+					submode: "interact",
+					codePath: `${testRealmURL}employee.gts`
+				});
+				await waitFor("[data-test-profile-icon-button]");
+				await click("[data-test-profile-icon-button]");
+				assert.dom("[data-test-daily-grant-note]").exists();
+				assert.dom("[data-test-daily-grant-note]").includesText("We topped up your account to 2,000 credits.");
+				assert.dom("[data-test-daily-grant-note]").doesNotIncludeText("getting low");
+				assert.dom("[data-test-daily-grant-note]").includesText("Last daily credits grant:");
+			} finally {
+				userResponseBody.data.attributes = originalAttributes;
+			}
+		});
+		(0, import_qunit.test)(`ai panel continues being open when switching to code submode`, async function(assert) {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}]] });
+			await click("[data-test-open-ai-assistant]");
+			assert.dom("[data-test-ai-assistant-panel]").exists();
+			await click("[data-test-submode-switcher] button");
+			await click("[data-test-boxel-menu-item-text=\"Code\"]");
+			assert.dom("[data-test-ai-assistant-panel]").exists();
+			await click("[data-test-open-ai-assistant]");
+			assert.dom("[data-test-ai-assistant-panel]").doesNotExist();
+		});
+		(0, import_qunit.test)(`removes local storage when logging out`, async function(assert) {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}]] });
+			setRecentCards([[`${testRealmURL}Pet/mango.json`, Date.now()]]);
+			setRecentFiles([[
+				testRealmURL,
+				"Pet/mango.json",
+				{
+					line: 1,
+					column: 2
+				},
+				Date.now()
+			]]);
+			setPlaygroundSelections({ [`${testRealmURL}Pet/mango.json`]: {
+				cardId: rri(`${testRealmURL}Pet/mango.json`),
+				format: "edit"
+			} });
+			src_default.localStorage.setItem(ScrollPositions, JSON.stringify({ "file-tree": [`${testRealmURL}Pet/mango.json`, 2] }));
+			src_default.localStorage.setItem(AiAssistantOpen, "true");
+			await click("[data-test-profile-icon-button]");
+			await click("[data-test-signout-button]");
+			assert.strictEqual(getRecentCards(), null);
+			assert.strictEqual(getRecentFiles(), null);
+			assert.strictEqual(src_default.localStorage.getItem(ScrollPositions), null);
+			assert.strictEqual(getPlaygroundSelections(), null);
+			assert.strictEqual(src_default.localStorage.getItem(AiAssistantOpen), null, "AI assistant open preference is cleared on logout");
+			assert.dom("[data-test-login-btn]").exists();
+		});
+	});
+	(0, import_qunit.module)("signing out", function(hooks) {
+		setupRealmCacheTeardown(hooks);
+		let signOuts;
+		let answerSignOut;
+		let signOutAnswered;
+		hooks.beforeEach(function() {
+			signOuts = [];
+			signOutAnswered = new Promise((resolve) => answerSignOut = resolve);
+			getService("network").mount(async (req) => {
+				if (new URL(req.url).pathname !== "/_secure-sessions") return null;
+				let token = req.headers.get("Authorization")?.replace(/^Bearer /, "");
+				signOuts.push({
+					method: req.method,
+					url: req.url,
+					user: token ? claimsFromRawToken(token).user : void 0
+				});
+				return await signOutAnswered;
+			}, { prepend: true });
+		});
+		async function signOut() {
+			await visitOperatorMode({ stacks: [[{
+				id: `${testRealmURL}Person/fadhlan`,
+				format: "isolated"
+			}]] });
+			await click("[data-test-profile-icon-button]");
+			let signedOut = click("[data-test-signout-button]");
+			await waitFor("[data-test-login-btn]");
+			return signedOut;
+		}
+		(0, import_qunit.test)("signing out signs the user's secure windows out", async function(assert) {
+			answerSignOut(new Response(null, { status: 204 }));
+			await signOut();
+			assert.dom("[data-test-login-btn]").exists();
+			assert.strictEqual(signOuts.length, 1, "the realm server is told once");
+			let [{ method, url, user }] = signOuts;
+			assert.strictEqual(method, "DELETE");
+			assert.strictEqual(new URL(url).searchParams.get("client"), "window", "only the secure window's sessions are ended");
+			assert.strictEqual(user, "@testuser:localhost", "under the outgoing account's session");
+		});
+		(0, import_qunit.test)("a realm server that doesn't answer doesn't hold sign-out up", async function(assert) {
+			let signedOut = signOut();
+			await waitFor("[data-test-login-btn]");
+			assert.dom("[data-test-login-btn]").exists("signed out");
+			assert.strictEqual(signOuts.length, 1, "still waiting on the server");
+			answerSignOut(new Response(null, { status: 204 }));
+			await signedOut;
+		});
+		(0, import_qunit.test)("a realm server that refuses doesn't stop sign-out", async function(assert) {
+			answerSignOut(new Response("unavailable", { status: 503 }));
+			await signOut();
+			assert.dom("[data-test-login-btn]").exists("signed out");
+			assert.strictEqual(signOuts.length, 1);
+		});
+	});
+});
+//#endregion