diff --git a/picture-gallery-client/public/index.html b/picture-gallery-client/public/index.html index 62bacfd..36d1bc7 100644 --- a/picture-gallery-client/public/index.html +++ b/picture-gallery-client/public/index.html @@ -2,12 +2,12 @@ - + - React App + Simple Picture Gallery diff --git a/picture-gallery-client/src/env.ts b/picture-gallery-client/src/env.ts index 6e44107..4de3358 100644 --- a/picture-gallery-client/src/env.ts +++ b/picture-gallery-client/src/env.ts @@ -8,8 +8,27 @@ declare global { type EnvType = { REACT_APP_TITLE: string; REACT_APP_APPBAR_COLOR: string; + REACT_APP_FAVICON_HREF: string | undefined; }; const env: EnvType = { ...process.env, ...window.env }; +function getTitleElement() { + return document.getElementById("appTitle")!; +} + +function getFaviconElement() { + return document.getElementById("favicon") as HTMLAnchorElement; +} + +export const setGalleryTitleAndFavicon = () => { + if (env.REACT_APP_FAVICON_HREF !== undefined) { + const favicon = getFaviconElement(); + favicon.href = env.REACT_APP_FAVICON_HREF; + } + + const title = getTitleElement(); + title.textContent = env.REACT_APP_TITLE; +}; + export default env; diff --git a/picture-gallery-client/src/index.tsx b/picture-gallery-client/src/index.tsx index 2d645eb..bc7a182 100644 --- a/picture-gallery-client/src/index.tsx +++ b/picture-gallery-client/src/index.tsx @@ -4,6 +4,9 @@ import "./index.css"; import { BrowserRouter } from "react-router-dom"; import reportWebVitals from "./reportWebVitals"; import ImageGalleryLayout from "./ImageGalleryLayout"; +import { setGalleryTitleAndFavicon } from "./env"; + +setGalleryTitleAndFavicon(); const root = ReactDOM.createRoot( document.getElementById("root") as HTMLElement