refactor: prevent duplicated title for index page by making prop optional

This commit is contained in:
Danny Koppenhagen
2023-06-19 20:35:58 +02:00
committed by Stefan Rotsch
parent 810db6aea6
commit 0d2265c57e
5 changed files with 19 additions and 14 deletions

View File

@@ -5,9 +5,11 @@ exports.radarName = process.env.REACT_APP_RADAR_NAME || "AOE Technology Radar";
exports.radarNameShort = exports.radarName; exports.radarNameShort = exports.radarName;
exports.titleFormat = process.env.REACT_APP_RADAR_TITLE_FORMAT || "%TECHNOLOGY_NAME% | %APP_TITLE%"; exports.titleFormat = process.env.REACT_APP_RADAR_TITLE_FORMAT || "%TECHNOLOGY_NAME% | %APP_TITLE%";
function setTitle(document, title) { function setTitle(document, title) {
document.title = exports.titleFormat document.title = title
.replace("%TECHNOLOGY_NAME%", title) ? exports.titleFormat
.replace("%APP_TITLE%", exports.radarName); .replace("%TECHNOLOGY_NAME%", title)
.replace("%APP_TITLE%", exports.radarName)
: exports.radarName;
} }
exports.setTitle = setTitle; exports.setTitle = setTitle;
var getItemPageNames = function (items) { var getItemPageNames = function (items) {

View File

@@ -56,9 +56,9 @@ const createStaticFiles = async () => {
const document = dom.window.document; const document = dom.window.document;
const rootEl = document.getElementById("root"); const rootEl = document.getElementById("root");
document.title = 'test' document.title = "test";
setTitle(document, item.title) setTitle(document, item.title);
if (rootEl) { if (rootEl) {
const textNode = document.createElement("div"); const textNode = document.createElement("div");

View File

@@ -1,6 +1,6 @@
import { MomentInput } from "moment"; import { MomentInput } from "moment";
import { ConfigData, radarName, radarNameShort } from "../../config"; import { ConfigData, radarName } from "../../config";
import { useMessages } from "../../context/MessagesContext"; import { useMessages } from "../../context/MessagesContext";
import { formatRelease } from "../../date"; import { formatRelease } from "../../date";
import { HomepageOption, Item, featuredOnly } from "../../model"; import { HomepageOption, Item, featuredOnly } from "../../model";
@@ -38,7 +38,7 @@ export default function PageIndex({
config.homepageContent === HomepageOption.both; config.homepageContent === HomepageOption.both;
return ( return (
<Fadeable leaving={leaving} onLeave={onLeave}> <Fadeable leaving={leaving} onLeave={onLeave}>
<SetTitle title={radarNameShort} /> <SetTitle />
<div className="headline-group"> <div className="headline-group">
<HeroHeadline alt={`Version #${numberOfReleases}`}> <HeroHeadline alt={`Version #${numberOfReleases}`}>
{radarName} {radarName}

View File

@@ -3,12 +3,12 @@ import { useEffect } from "react";
import { setTitle } from "../config"; import { setTitle } from "../config";
type SetTitleProps = { type SetTitleProps = {
title: string; title?: string;
}; };
export default function SetTitle({ title }: SetTitleProps) { export default function SetTitle({ title }: SetTitleProps) {
useEffect(() => { useEffect(() => {
setTitle(document, title) setTitle(document, title);
}, [title]); }, [title]);
return null; return null;

View File

@@ -23,12 +23,15 @@ export interface ConfigData {
export const radarName = export const radarName =
process.env.REACT_APP_RADAR_NAME || "AOE Technology Radar"; process.env.REACT_APP_RADAR_NAME || "AOE Technology Radar";
export const radarNameShort = radarName; export const radarNameShort = radarName;
export const titleFormat = process.env.REACT_APP_RADAR_TITLE_FORMAT || "%TECHNOLOGY_NAME% | %APP_TITLE%" export const titleFormat =
process.env.REACT_APP_RADAR_TITLE_FORMAT || "%TECHNOLOGY_NAME% | %APP_TITLE%";
export function setTitle(document: Document, title: string) { export function setTitle(document: Document, title?: string) {
document.title = titleFormat document.title = title
.replace('%TECHNOLOGY_NAME%', title) ? titleFormat
.replace('%APP_TITLE%', radarName) .replace("%TECHNOLOGY_NAME%", title)
.replace("%APP_TITLE%", radarName)
: radarName;
} }
export const getItemPageNames = (items: Item[]) => export const getItemPageNames = (items: Item[]) =>