Feature/resolve blog post titles (#1539)

* Resolve blog post titles

* Update changelog

CHANGELOG.md

@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Added support to manage the tags in the create or edit activity dialog
 - Added the tags to the admin control panel
 - Added a blog post: _The importance of tracking your personal finances_
+- Resolved the title of the blog post
 
 ### Changed
 

apps/api/src/app/frontend.middleware.ts

@@ -3,8 +3,10 @@ import * as path from 'path';
 
 import { ConfigurationService } from '@ghostfolio/api/services/configuration.service';
 import { DEFAULT_LANGUAGE_CODE } from '@ghostfolio/common/config';
+import { DATE_FORMAT } from '@ghostfolio/common/helper';
 import { Injectable, NestMiddleware } from '@nestjs/common';
 import { ConfigService } from '@nestjs/config';
+import { format } from 'date-fns';
 import { NextFunction, Request, Response } from 'express';
 
 @Injectable()
@@ -51,20 +53,26 @@ export class FrontendMiddleware implements NestMiddleware {
   }
 
   public use(request: Request, response: Response, next: NextFunction) {
+    const currentDate = format(new Date(), DATE_FORMAT);
     let featureGraphicPath = 'assets/cover.png';
+    let title = 'Ghostfolio – Open Source Wealth Management Software';
 
     if (request.path.startsWith('/en/blog/2022/08/500-stars-on-github')) {
       featureGraphicPath = 'assets/images/blog/500-stars-on-github.jpg';
+      title = `500 Stars - ${title}`;
     } else if (request.path.startsWith('/en/blog/2022/10/hacktoberfest-2022')) {
       featureGraphicPath = 'assets/images/blog/hacktoberfest-2022.png';
+      title = `Hacktoberfest 2022 - ${title}`;
     } else if (request.path.startsWith('/en/blog/2022/11/black-friday-2022')) {
       featureGraphicPath = 'assets/images/blog/black-friday-2022.jpg';
+      title = `Black Friday 2022 - ${title}`;
     } else if (
       request.path.startsWith(
         '/en/blog/2022/12/the-importance-of-tracking-your-personal-finances'
       )
     ) {
       featureGraphicPath = 'assets/images/blog/20221226.jpg';
+      title = `The importance of tracking your personal finances - ${title}`;
     }
 
     if (
@@ -77,7 +85,9 @@ export class FrontendMiddleware implements NestMiddleware {
     } else if (request.path === '/de' || request.path.startsWith('/de/')) {
       response.send(
         this.interpolate(this.indexHtmlDe, {
+          currentDate,
           featureGraphicPath,
+          title,
           languageCode: 'de',
           path: request.path,
           rootUrl: this.configurationService.get('ROOT_URL')
@@ -86,7 +96,9 @@ export class FrontendMiddleware implements NestMiddleware {
     } else if (request.path === '/es' || request.path.startsWith('/es/')) {
       response.send(
         this.interpolate(this.indexHtmlEs, {
+          currentDate,
           featureGraphicPath,
+          title,
           languageCode: 'es',
           path: request.path,
           rootUrl: this.configurationService.get('ROOT_URL')
@@ -95,7 +107,9 @@ export class FrontendMiddleware implements NestMiddleware {
     } else if (request.path === '/it' || request.path.startsWith('/it/')) {
       response.send(
         this.interpolate(this.indexHtmlIt, {
+          currentDate,
           featureGraphicPath,
+          title,
           languageCode: 'it',
           path: request.path,
           rootUrl: this.configurationService.get('ROOT_URL')
@@ -104,7 +118,9 @@ export class FrontendMiddleware implements NestMiddleware {
     } else if (request.path === '/nl' || request.path.startsWith('/nl/')) {
       response.send(
         this.interpolate(this.indexHtmlNl, {
+          currentDate,
           featureGraphicPath,
+          title,
           languageCode: 'nl',
           path: request.path,
           rootUrl: this.configurationService.get('ROOT_URL')
@@ -113,7 +129,9 @@ export class FrontendMiddleware implements NestMiddleware {
     } else {
       response.send(
         this.interpolate(this.indexHtmlEn, {
+          currentDate,
           featureGraphicPath,
+          title,
           languageCode: DEFAULT_LANGUAGE_CODE,
           path: request.path,
           rootUrl: this.configurationService.get('ROOT_URL')

apps/client/src/index.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html class="h-100 position-relative" lang="${languageCode}">
   <head>
-    <title>Ghostfolio – Open Source Wealth Management Software</title>
+    <title>${title}</title>
     <base href="/" />
     <meta charset="utf-8" />
     <meta content="yes" name="apple-mobile-web-app-capable" />
@@ -20,28 +20,19 @@
       name="twitter:description"
     />
     <meta content="${rootUrl}/${featureGraphicPath}" name="twitter:image" />
-    <meta
+    <meta content="${title}" name="twitter:title" />
-      content="Ghostfolio – Open Source Wealth Management Software"
-      name="twitter:title"
-    />
     <meta
       content="initial-scale=1, viewport-fit=cover, width=device-width"
       name="viewport"
     />
     <meta content="#FFFFFF" name="theme-color" />
     <meta content="" property="og:description" />
-    <meta
+    <meta content="${title}" property="og:title" />
-      content="Ghostfolio – Open Source Wealth Management Software"
-      property="og:title"
-    />
     <meta content="website" property="og:type" />
     <meta content="${rootUrl}${path}" property="og:url" />
     <meta content="${rootUrl}/${featureGraphicPath}" property="og:image" />
-    <meta content="2022-10-16T00:00:00+00:00" property="og:updated_time" />
+    <meta content="${currentDate}T00:00:00+00:00" property="og:updated_time" />
-    <meta
+    <meta content="${title}" property="og:site_name" />
-      content="Ghostfolio – Open Source Wealth Management Software"
-      property="og:site_name"
-    />
 
     <link
       href="../assets/apple-touch-icon.png"