Fix (#605)

Co-authored-by: Rajat Saxena <hi@rajatsaxena.dev>

Author: rajat1saxena

apps/web/app/(with-contexts)/(with-layout)/home-page-layout.tsx

@@ -12,6 +12,7 @@ import { BaseLayout } from "@components/public/base-layout";
 import { Profile } from "@courselit/common-models";
 import { getFullSiteSetup } from "@ui-lib/utils";
 import { useContext } from "react";
+import { CodeInjectorWrapper } from "@components/public/code-injector";
 
 export default function HomepageLayout({
     children,
@@ -60,6 +61,7 @@ export default function HomepageLayout({
             }}
         >
             {children}
+            <CodeInjectorWrapper />
         </BaseLayout>
     );
 }

apps/web/components/public/code-injector.tsx

@@ -1,22 +1,35 @@
-import React from "react";
+"use client";
+
+import React, { useContext } from "react";
 import { connect } from "react-redux";
 import { AppState } from "@courselit/state-management";
+import { usePathname } from "next/navigation";
+import { SiteInfoContext } from "@components/contexts";
 
 type InjectionSection = "head" | "body";
 
 interface CodeInjectorProps {
-    router: Record<string, unknown>;
+    isAdminPage?: boolean;
     head?: string;
     body?: string;
 }
 
-class CodeInjector extends React.Component<CodeInjectorProps> {
-    isAnAdminPage() {
-        return /^\/dashboard/.test(this.props.router.asPath as string);
-    }
+export const CodeInjectorWrapper = () => {
+    const siteInfo = useContext(SiteInfoContext);
+    const pathname = usePathname();
+
+    return (
+        <CodeInjector
+            isAdminPage={pathname?.startsWith("/dashboard")}
+            head={siteInfo?.codeInjectionHead}
+            body={siteInfo?.codeInjectionBody}
+        />
+    );
+};
 
+export class CodeInjector extends React.Component<CodeInjectorProps> {
     componentDidMount() {
-        if (!this.isAnAdminPage()) {
+        if (!this.props.isAdminPage) {
             const targetTagsForInjection: InjectionSection[] = ["head", "body"];
             for (const target of targetTagsForInjection) {
                 this.injectCodeIn(target);
@@ -36,7 +49,7 @@ class CodeInjector extends React.Component<CodeInjectorProps> {
                 this.copyAttributes(elem, script);
                 elem = script;
             }
-            (document as Record<string, any>)[targetHTMLTag].appendChild(elem);
+            (document as Record<string, any>)[targetHTMLTag]?.appendChild(elem);
         }
     }
 
@@ -52,7 +65,7 @@ class CodeInjector extends React.Component<CodeInjectorProps> {
     }
 
     render() {
-        return <></>;
+        return null;
     }
 }
 

apps/web/pages/_app.tsx

@@ -49,7 +49,9 @@ function MyApp({
                     >
                         <Component {...pageProps} />
                     </div>
-                    <CodeInjector router={router} />
+                    <CodeInjector
+                        isAdminPage={router.pathname.startsWith("/dashboard")}
+                    />
                 </ThemeProvider>
             </Provider>
         </SessionProvider>