From 42508d00734664feaa7b2536553169875957a982 Mon Sep 17 00:00:00 2001
From: Luke Latham <1622880+guardrex@users.noreply.github.com>
Date: Thu, 20 Jun 2024 12:27:56 -0400
Subject: [PATCH] Interactive SSR RCs in global WASM/Auto projects (#32844)

---
 aspnetcore/blazor/components/render-modes.md          | 11 ++++++++++-
 .../blazor/security/blazor-web-app-with-oidc.md       | 10 ++++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/aspnetcore/blazor/components/render-modes.md b/aspnetcore/blazor/components/render-modes.md
index 8ff3cb5a35..e94129f108 100644
--- a/aspnetcore/blazor/components/render-modes.md
+++ b/aspnetcore/blazor/components/render-modes.md
@@ -397,7 +397,16 @@ In the following example, the render mode is set interactive SSR by adding `@ren
 }
 ```
 
-If using the preceding component locally in a Blazor Web App, place the component in the server project's `Components/Pages` folder. The server project is the solution's project with a name that doesn't end in `.Client`. When the app is running, navigate to `/render-mode-2` in the browser's address bar.
+If using the preceding component in a Blazor Web App, place the component in the server project's `Components/Pages` folder&dagger;. The server project is the solution's project with a name that doesn't end in `.Client`. When the app is running, navigate to `/render-mode-2` in the browser's address bar.
+
+> [!IMPORTANT]
+> &dagger;If the app adopts global WebAssembly or global Auto rendering via the `Routes` component, individual components that specify interactive SSR (`@rendermode InteractiveServer`) in their component definition file (`.razor`) are *placed in the `.Client` project's `Pages` folder*.
+>
+> Placing interactive SSR components in the `.Client` project is counter-intuitive because such components are only rendered on the server.
+>
+> If you place an interactive SSR component in the server project's `Components/Pages` folder of a global WebAssembly or Auto app, the component is prerendered normally and briefly displayed in the user's browser. However, the client-side router isn't able to find the component, ultimately resulting in a *404 - Not Found* in the browser.
+>
+> Therefore, place interactive SSR components in the `.Client` project's `Pages` folder if the app adopts global WebAssembly or global Auto rendering via the `Routes` component.
 
 ## Client-side rendering (CSR)
 
diff --git a/aspnetcore/blazor/security/blazor-web-app-with-oidc.md b/aspnetcore/blazor/security/blazor-web-app-with-oidc.md
index 2a73853dbe..e7bd3a5cd0 100644
--- a/aspnetcore/blazor/security/blazor-web-app-with-oidc.md
+++ b/aspnetcore/blazor/security/blazor-web-app-with-oidc.md
@@ -581,6 +581,16 @@ The <xref:Microsoft.AspNetCore.Builder.AuthorizationEndpointConventionBuilderExt
 
 :::zone-end
 
+## Adding components that adopt interactive server-side rendering
+
+Because the app uses global Interactive Auto rendering via the `Routes` component, individual components that specify interactive server-side rendering (interactive SSR, `@rendermode InteractiveServer`) in their component definition file (`.razor`) are *placed in the `.Client` project's `Pages` folder*.
+
+Placing interactive SSR components in the `.Client` project is counter-intuitive because such components are only rendered on the server.
+
+If you place an interactive SSR component in the server project's `Components/Pages` folder, the component is prerendered normally and briefly displayed in the user's browser. However, the client-side router isn't able to find the component, ultimately resulting in a *404 - Not Found* in the browser.
+
+Therefore, place interactive SSR components in the `.Client` project's `Pages` folder.
+
 ## Redirect to the home page on signout
 
 When a user navigates around the app, the `LogInOrOut` component (`Layout/LogInOrOut.razor`) sets a hidden field for the return URL (`ReturnUrl`) to the value of the current URL (`currentURL`). When the user signs out of the app, the identity provider returns them to the page from which they signed out.