perf(studio): defer import history and Nitro scale tools until opened

e2e/ui/studio.spec.ts

@@ -33,10 +33,28 @@ test("Studio opens and dismisses detail, Nitro editor and import review", async
 	const errors: string[] = [];
 	const mutations: string[] = [];
 	let metadataRequests = 0;
+	let qualityRequests = 0;
 	page.on("pageerror", (error) => errors.push(error.message));
 	await page.route("**/api/**", async (route) => {
 		const request = route.request();
 		const url = new URL(request.url());
+		if (url.pathname === "/api/admin/studio/nitro-quality") {
+			qualityRequests++;
+			return route.fulfill({
+				json: {
+					report: {
+						scales: [32, 64].map((size) => ({
+							size,
+							state: "missing",
+							assets: [],
+							animations: [],
+							directions: [],
+							issues: [],
+						})),
+					},
+				},
+			});
+		}
 		if (url.pathname === "/api/admin/studio/inspect") {
 			const { classnames } = request.postDataJSON() as { classnames: string[] };
 			return route.fulfill({
@@ -113,6 +131,17 @@ test("Studio opens and dismisses detail, Nitro editor and import review", async
 	await expect(
 		page.getByRole("button", { name: "View Fixture chair", exact: true }),
 	).toBeVisible();
+	const history = page.getByRole("button", {
+		name: "Refresh history",
+		includeHidden: true,
+	});
+	await expect(history).toHaveCount(0);
+	await page.locator("summary").filter({ hasText: "Import history" }).click();
+	await expect(history).toBeVisible();
+	await page.locator("summary").filter({ hasText: "Import history" }).click();
+	await expect(history).toBeHidden();
+	await page.locator("summary").filter({ hasText: "Import history" }).click();
+	await expect(history).toBeVisible();
 	expect(metadataRequests).toBe(0);
 	await page
 		.getByRole("button", { name: "View Fixture chair", exact: true })
@@ -138,6 +167,20 @@ test("Studio opens and dismisses detail, Nitro editor and import review", async
 		editor.getByRole("switch", { name: "Can Sit On", exact: true }),
 	).toBeVisible();
 	expect(metadataRequests).toBe(1);
+	expect(qualityRequests).toBe(0);
+	await editor.getByRole("tab", { name: "32 / 64", exact: true }).click();
+	await expect(
+		editor.getByRole("button", { name: "Preview generation", exact: true }),
+	).toBeVisible();
+	await expect(
+		editor.getByText("Scale 32 · Not included", { exact: true }),
+	).toBeVisible();
+	expect(qualityRequests).toBe(1);
+	await editor.getByRole("tab", { name: "Visual", exact: true }).click();
+	await expect(
+		editor.getByRole("switch", { name: "Can Sit On", exact: true }),
+	).toBeVisible();
+
 	await editor.getByRole("button", { name: "Cancel", exact: true }).click();
 	await expect(editor).toHaveCount(0);
 	await page