Don't use slug for canoncial url

Author: linkdotnet

src/LinkDotNet.Blog.Web/Features/Components/OgData.razor

@@ -1,4 +1,5 @@
-@inject NavigationManager NavigationManager
+@using System.IO
+@inject NavigationManager NavigationManager
 
 <HeadContent>
     <meta name="title" property="og:title" content="@Title" />
@@ -17,12 +18,12 @@
     {
         <meta name="description" property="og:description" content="@Description" />
     }
-    
+
     @if (ChildContent is not null)
     {
 	    @ChildContent
     }
-    
+
 </HeadContent>
 @code {
 
@@ -38,12 +39,20 @@
     [Parameter]
     public string Keywords { get; set; }
 
+    [Parameter]
+    public string CanonicalRelativeUrl { get; set; }
+
 	[Parameter]
 	public RenderFragment ChildContent { get; set; }
 
 	private string GetCanoncialUri()
     {
+	    if (!string.IsNullOrEmpty(CanonicalRelativeUrl))
+	    {
+		    return Path.Combine(NavigationManager.BaseUri, CanonicalRelativeUrl);
+	    }
+
         var uri = new Uri(NavigationManager.Uri);
         return uri.GetLeftPart(UriPartial.Path);
     }
-}
+}

src/LinkDotNet.Blog.Web/Features/ShowBlogPost/ShowBlogPostPage.razor

@@ -10,7 +10,7 @@
 @inject IOptions<ApplicationConfiguration> AppConfiguration
 @inject IOptions<ProfileInformation> ProfileInformation
 
-@if (BlogPost == null)
+@if (BlogPost is null)
 {
     <Loading></Loading>
 }
@@ -20,7 +20,8 @@ else
 	<OgData Title="@BlogPost.Title"
 	        AbsolutePreviewImageUrl="@OgDataImage"
 	        Description="@(Markdown.ToPlainText(BlogPost.ShortDescription))"
-	        Keywords="@BlogPost.TagsAsString">
+	        Keywords="@BlogPost.TagsAsString"
+	        CanonicalRelativeUrl="@BlogPostCanoncialUrl">
 		<StructuredData Headline="@BlogPost.Title"
 		                PreviewImage="@BlogPost.PreviewImageUrl"
 		                PreviewFallbackImage="@BlogPost.PreviewImageUrlFallback"
@@ -77,6 +78,7 @@ else
     public string Slug { get; set; }
 
 	private string OgDataImage => BlogPost.PreviewImageUrlFallback ?? BlogPost.PreviewImageUrl;
+	private string BlogPostCanoncialUrl => $"blogPost/{BlogPost.Id}";
 
     private BlogPost BlogPost { get; set; }
 

tests/LinkDotNet.Blog.UnitTests/Domain/BlogPostTests.cs

@@ -151,7 +151,7 @@ public void GivenBlogPostWithTags_WhenCreatingStringFromTags_ThenTagsAreSeparate
 
         var tags = bp.TagsAsString;
 
-        tags.Should().Be("tag 1, tag 2");
+        tags.Should().Be("tag 1,tag 2");
     }
 
     [Fact]

tests/LinkDotNet.Blog.UnitTests/Web/Features/ShowBlogPost/ShowBlogPostPageTests.cs

@@ -41,7 +41,6 @@ public void ShouldShowLoadingAnimation()
     [Fact]
     public void ShouldSetTitleToTag()
     {
-        JSInterop.Mode = JSRuntimeMode.Loose;
         var repositoryMock = Substitute.For<IRepository<BlogPost>>();
         var blogPost = new BlogPostBuilder().WithTitle("Title").Build();
         repositoryMock.GetByIdAsync("1").Returns(blogPost);
@@ -61,7 +60,6 @@ public void ShouldSetTitleToTag()
     [InlineData("url1", "url2", "url2")]
     public void ShouldUseFallbackAsOgDataIfAvailable(string preview, string fallback, string expected)
     {
-        JSInterop.Mode = JSRuntimeMode.Loose;
         var repositoryMock = Substitute.For<IRepository<BlogPost>>();
         var blogPost = new BlogPostBuilder()
             .WithPreviewImageUrl(preview)
@@ -135,6 +133,24 @@ public void ShowReadingIndicatorWhenEnabled(bool isEnabled)
         cut.HasComponent<ReadingIndicator>().Should().Be(isEnabled);
     }
 
+    [Fact]
+    public void ShouldSetCanoncialUrlOfOgDataWithoutSlug()
+    {
+        var repositoryMock = Substitute.For<IRepository<BlogPost>>();
+        var blogPost = new BlogPostBuilder()
+            .WithTitle("sample")
+            .Build();
+        blogPost.Id = "1";
+        repositoryMock.GetByIdAsync("1").Returns(blogPost);
+        Services.AddScoped(_ => repositoryMock);
+        SetupMocks();
+        
+        var cut = RenderComponent<ShowBlogPostPage>(
+            p => p.Add(s => s.BlogPostId, "1"));
+        
+        cut.FindComponent<OgData>().Instance.CanonicalRelativeUrl.Should().Be("blogPost/1");
+    }
+
     private void SetupMocks()
     {
         JSInterop.Mode = JSRuntimeMode.Loose;