From b3ff4baeb9cd1b18beb653d3020ee6bc14ce2670 Mon Sep 17 00:00:00 2001
From: Jeremy Ruppel <jeremyruppel@users.noreply.github.com>
Date: Thu, 16 Jul 2026 09:15:11 -0400
Subject: [PATCH] fix: smooth compose loader to files page transition (#27277)

## Summary

During the template builder compose flow, the transition into the
template
files page briefly flashed the wizard form again before the files page
settled.

Root cause: the loader was gated on `createMutation.isPending`. When the
compose
POST resolved, `isPending` flipped to `false` in the same commit that
`onSuccess` navigated to the files page, so `TemplateBuilderPageView`
repainted
the wizard form for a frame before the route change committed and
unmounted it.

Fix: keep the loader mounted while the mutation is pending **or**
succeeded
(`createMutation.isPending || createMutation.isSuccess`). Since
`onSuccess`
always navigates away, the loader stays until the component unmounts, so
the
form never reflashes. The error path is unaffected (`isSuccess` stays
false).

Resolves DEVEX-561.


https://github.com/user-attachments/assets/6d5ec04e-9f97-4864-bd18-e1e75055f079

## Scope

Targets the wizard form reflash only. Two adjacent items were identified
during
investigation and intentionally left out:

- The destination files page briefly shows its own `<Loader />` while it
fetches
template files. Smoothing that requires prefetching before navigation
and is a
  larger change.
- The `justCreated` "Awesome, you just created a template!" alert is
cleared by a
mount effect, so it renders one frame then disappears. Arguably its own
bug.

Happy to follow up on either if wanted.

## Testing

- Biome clean on the changed file.
- Manual: build a template through the wizard and confirm the loader
holds
  straight through to the files page with no form flash.

## Stack

Stacked on top of #27276 (DEVEX-593).

---

Generated by Coder Agents.
---
 site/src/pages/TemplateBuilder/TemplateBuilderPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/site/src/pages/TemplateBuilder/TemplateBuilderPage.tsx b/site/src/pages/TemplateBuilder/TemplateBuilderPage.tsx
index 561653e059..b8ed072757 100644
--- a/site/src/pages/TemplateBuilder/TemplateBuilderPage.tsx
+++ b/site/src/pages/TemplateBuilder/TemplateBuilderPage.tsx
@@ -86,7 +86,7 @@ const TemplateBuilderPage: FC = () => {
 				preselectedBase={preselectedBase}
 				onCreateTemplate={handleCreate}
 				createError={createMutation.error}
-				isCreating={createMutation.isPending}
+				isCreating={createMutation.isPending || createMutation.isSuccess}
 				onClearCreateError={() => createMutation.reset()}
 			/>
 		</>