title: Blazor server-side not routing to new page
body: <p>I'm banging my head because this should be so simple.  I created a new Razor page in my Blazor server-side app that live in <code>~/pages</code>.  Its very simple with a <code>@page &quot;/importhome&quot; </code> declaration at the top.  There are two issues which might be related, 1: when I navigate to the page <code>https://localhost:44348/importhome</code>, I get the default page for no route <code>Sorry there is nothing at this address</code>.  This is baffling me because with the @page declaration Blazor builds the routes at compile-time, yes?</p>
  <p>The second issue is, I added a Syncfusion Blazor Card and its not recognizing the <code>SfCard</code> element.  We've used cards all over the app and I verified the dependencies are installed.  I have my using statements for Syncfusion in the page.  I can't help but think these two things are related somehow? I've tried changing the page name in the directive and I've tried removing all the code except the  header and still doesn't work.  I've been sifting through google searches but 99% of the results are issues with parameters or conditional routing.  Here is the page.</p>
  <pre><code>@page &quot;/importhome&quot;
  
  @inherits BasePage
  
  @using Infinity.Pages
  @using Infinity.Model
  @using Syncfusion.Blazor
  @using Syncfusion.Blazor.Cards
  
  &lt;h3&gt;Import Your Data&lt;/h3&gt;
  
  &lt;div class=&quot;col-xs-6 col-sm-6 col-lg-6 col-md-6&quot;&gt;
      &lt;SfCard&gt;
          &lt;CardHeader&gt;
              Import All Your data
          &lt;/CardHeader&gt;
          &lt;CardContent&gt;
              From here, you can import your entire database.
          &lt;/CardContent&gt;
      &lt;/SfCard&gt;
  &lt;/div&gt;
  &lt;div class=&quot;col-xs-6 col-sm-6 col-lg-6 col-md-6&quot;&gt;
      &lt;SfCard&gt;
          &lt;CardHeader&gt;
              Just Update Your Assets
          &lt;/CardHeader&gt;
          &lt;CardContent&gt;
              Click here to update your assets only.
          &lt;/CardContent&gt;
      &lt;/SfCard&gt;
  &lt;/div&gt;
  
  @code {
  
  }
  </code></pre>
  <p>Update 1 **************  MrC requested the base page.  As you can see its mostly just injecting services.  We use this on every page in the app.</p>
  <pre><code>using Infinity.Data;
  using Infinity.Model;
  using Infinity.Services;
  using Infinity.Shared;
  using Microsoft.AspNetCore.Components;
  using Microsoft.AspNetCore.Components.Authorization;
  using Microsoft.AspNetCore.Http;
  using Microsoft.AspNetCore.Identity;
  using Microsoft.AspNetCore.Identity.UI.Services;
  using Microsoft.EntityFrameworkCore;
  using Microsoft.JSInterop;
  using System;
  using System.Linq;
  using System.Security.Policy;
  using System.Text;
  using System.Text.Encodings.Web;
  using System.Threading.Tasks;
  using Infinity.Areas.Identity.Pages.Account;
  using Microsoft.AspNetCore.Mvc;
  using Microsoft.AspNetCore.Mvc.RazorPages;
  using Microsoft.AspNetCore.WebUtilities;
  using SendGrid;
  
  namespace Infinity.Pages
  {
      public partial class BasePage : ComponentBase, IDisposable
      {
          [Inject] public IJSRuntime jSRuntime { get; set; }
          [Inject] public DataStoreService _dataStore { get; set; }
          [Inject] public IDbContextFactory&lt;InvictusDbContext&gt; DbFactory { get; set; }
          [Inject] private AuthenticationStateProvider AuthenticationStateProvider { get; set; }
          [Inject] public IHttpContextAccessor httpContextAccessor { get; set; }
          [Inject] public UserManager&lt;ApplicationUser&gt; UserManager { get; set; }
          [Inject] public IEmailSender IEmailSender { get; set; }
          [Inject] public BoxService BoxService { get; set; }
          public ApplicationUser _currentUser { get=&gt;IDS.User; }
          [Inject] public UserService UserService { get; set; }
          [Inject] public NavigationManager _navigationManager { get; set; }
          [Inject] public InvictusDataService IDS { get; set; }
          [Inject] public ValueAddService VAS { get; set; }
          [Inject] public UINotifications UINotifications { get; set; }
          public bool IsClient =&gt; IDS.User.UserRoles.Any(x =&gt; x.Role.UserRoles.Any(x =&gt; x.Role.Name == &quot;Clients&quot;));
          public bool IsAdvisor =&gt; IDS.User.UserRoles.Any(x =&gt; x.Role.UserRoles.Any(x =&gt; x.Role.Name == &quot;Advisor&quot;));
          public bool IsLeadAdvisor =&gt; IDS.User.UserRoles.Any(x =&gt; x.Role.UserRoles.Any(x =&gt; x.Role.Name == &quot;Lead Advisor&quot;));
          public bool IsAdministrator =&gt; IDS.User.UserRoles.Any(x =&gt; x.Role.UserRoles.Any(x =&gt; x.Role.Name == &quot;Administrator&quot;));
          public bool IsRTSAdmin =&gt; IDS.User.UserRoles.Any(x =&gt; x.Role.UserRoles.Any(x =&gt; x.Role.Name == &quot;RTSAdmin&quot;));
  
  
          //Needed to call Developer Exceptions  
          [CascadingParameter] public Error Error { get; set; }
  
          public BasePage()
          {
              UserService = new UserService();
  
          }
  
          public async Task CloseMyWindow()
          {
              await jSRuntime.InvokeAsync&lt;object&gt;(&quot;close&quot;);
          }
          protected override async Task OnInitializedAsync()
          {
          
              var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
              if (!authState.User.Identity.IsAuthenticated)
                  _navigationManager.NavigateTo(&quot;/&quot;);
  
              //var user = authState.User;
  
               //_currentUser = await UserManager.FindByNameAsync(httpContextAccessor.HttpContext.User.Identity.Name);
               //UserService.User = _currentUser;
              
              await base.OnInitializedAsync();
          }
  
  
          protected override async Task OnAfterRenderAsync(bool firstRender)
          {
              await base.OnAfterRenderAsync(firstRender);
          }
  
  
          public void Dispose()
          {
              //Todo: ReSharper Suggested this. 
              //UserManager?.Dispose();
          }
      }
  }
  </code></pre>