Change the way routing works, so ad will fit better for everyone, we gotta find away to refresh it so we can use <Link> but right now quick and dirty solution
This commit is contained in:
parent
b7f7fd1989
commit
01dc9c9749
8
global.d.ts
vendored
8
global.d.ts
vendored
@ -8,6 +8,14 @@ declare namespace NodeJS {
|
||||
interface Window {
|
||||
kofiWidgetOverlay: any;
|
||||
dataLayer: any[];
|
||||
googletag: {
|
||||
cmd: any[];
|
||||
pubads: () => {
|
||||
refresh: () => void;
|
||||
enableSingleRequest: () => void;
|
||||
};
|
||||
enableServices: () => void;
|
||||
};
|
||||
}
|
||||
}
|
||||
export {};
|
||||
@ -4,7 +4,6 @@ import { encodeId, formatDateToMonthDayYear, markdownToHtml } from "@/lib/utils"
|
||||
import ChapterDropdown from "@/components/ChapterDropdown";
|
||||
import { Ad } from "@/lib/types";
|
||||
import { Countdown } from "@/components/Countdown";
|
||||
import Link from "next/link";
|
||||
|
||||
export type paramsType = Promise<{ bookId: string }>;
|
||||
|
||||
@ -106,7 +105,7 @@ export default async function BookPage(props: { params: paramsType }) {
|
||||
<Countdown release_datetime={chapter.release_datetime} />
|
||||
</p>
|
||||
{chapter.number === next_chapter?.number ? (
|
||||
<Link
|
||||
<a
|
||||
href={'/early?bookId=' + encodeId(bookId)}
|
||||
className={`
|
||||
bg-red-500 text-white py-2 px-4 mx-2 rounded
|
||||
@ -115,10 +114,10 @@ export default async function BookPage(props: { params: paramsType }) {
|
||||
`}
|
||||
>
|
||||
Unlock Early AdWalled Chapter
|
||||
</Link>
|
||||
</a>
|
||||
)
|
||||
: (
|
||||
<Link
|
||||
<a
|
||||
href={Ad.patreon}
|
||||
className={`
|
||||
bg-yellow-500 text-white py-2 px-4 mx-2 rounded
|
||||
@ -127,7 +126,7 @@ export default async function BookPage(props: { params: paramsType }) {
|
||||
`}
|
||||
>
|
||||
Join Patreon for More Early Chapters
|
||||
</Link>
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
@ -174,7 +173,7 @@ export default async function BookPage(props: { params: paramsType }) {
|
||||
<Countdown release_datetime={chapter.release_datetime} />
|
||||
</p>
|
||||
{chapter.number === next_chapter?.number ? (
|
||||
<Link
|
||||
<a
|
||||
href={'/early?bookId=' + encodeId(bookId)}
|
||||
className={`
|
||||
bg-red-500 text-white py-2 px-4 mx-2 rounded
|
||||
@ -183,10 +182,10 @@ export default async function BookPage(props: { params: paramsType }) {
|
||||
`}
|
||||
>
|
||||
Unlock Early Ad-Walled Chapter
|
||||
</Link>
|
||||
</a>
|
||||
)
|
||||
: (
|
||||
<Link
|
||||
<a
|
||||
href={Ad.patreon}
|
||||
className={`
|
||||
bg-yellow-500 text-white py-2 px-4 mx-2 rounded
|
||||
@ -195,7 +194,7 @@ export default async function BookPage(props: { params: paramsType }) {
|
||||
`}
|
||||
>
|
||||
Join Patreon for More Early Chapters
|
||||
</Link>
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
|
||||
@ -35,18 +35,17 @@ export default function RootLayout({ children }: { children: React.ReactNode })
|
||||
|
||||
const Default_Fallback = () => (
|
||||
<div className="flex items-center justify-center min-h-screen bg-gray-200 dark:bg-gray-800 text-gray-600 dark:text-gray-300">
|
||||
<img
|
||||
src="/logo.png" // Replace this with the actual path to your logo
|
||||
alt="Loading..."
|
||||
className="h-16 w-16 animate-bounce" // Add animation if desired
|
||||
/>
|
||||
<span className="ml-3 text-lg">Loading content...</span>
|
||||
</div>
|
||||
<img
|
||||
src="/logo.png" // Replace this with the actual path to your logo
|
||||
alt="Loading..."
|
||||
className="h-16 w-16 animate-bounce" // Add animation if desired
|
||||
/>
|
||||
<span className="ml-3 text-lg">Loading content...</span>
|
||||
</div>
|
||||
)
|
||||
|
||||
return (
|
||||
<html lang="en" className={isDarkMode ? "dark" : ""} suppressHydrationWarning>
|
||||
<head>
|
||||
<head>
|
||||
<script
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: `
|
||||
@ -63,21 +62,32 @@ export default function RootLayout({ children }: { children: React.ReactNode })
|
||||
}}
|
||||
/>
|
||||
<Script
|
||||
async
|
||||
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1843060382170565"
|
||||
async
|
||||
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1843060382170565"
|
||||
crossOrigin="anonymous"></Script>
|
||||
<Script
|
||||
src="https://www.googletagmanager.com/gtag/js?id=G-6SXB46RSDE"
|
||||
strategy="afterInteractive"
|
||||
src="https://www.googletagmanager.com/gtag/js?id=G-6SXB46RSDE"
|
||||
strategy="afterInteractive"
|
||||
/>
|
||||
<Script id="google-analytics" strategy="afterInteractive">
|
||||
{`
|
||||
{`
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'G-6SXB46RSDE');
|
||||
`}
|
||||
</Script>
|
||||
</Script>
|
||||
<Script
|
||||
strategy="afterInteractive"
|
||||
src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"
|
||||
onLoad={() => {
|
||||
window.googletag = window.googletag || { cmd: [] };
|
||||
window.googletag.cmd.push(() => {
|
||||
window.googletag.pubads().enableSingleRequest();
|
||||
window.googletag.enableServices();
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</head>
|
||||
<body className="bg-gray-100 dark:bg-gray-900 text-gray-900 dark:text-gray-100 min-h-screen">
|
||||
<KofiWidget />
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
import { formatDateToMonthDayYear } from "@/lib/utils";
|
||||
import { Chapter, Ad } from "@/lib/types";
|
||||
import { fetchReleases } from "@/lib/api";
|
||||
import Link from "next/link";
|
||||
import { Countdown } from "@/components/Countdown";
|
||||
|
||||
|
||||
@ -64,17 +63,17 @@ export default async function ReleasePage() {
|
||||
.sort(([titleA], [titleB]) => titleA.localeCompare(titleB))
|
||||
.map(([bookTitle, chapters]) => (
|
||||
<div key={bookTitle} className="mb-6">
|
||||
<Link href={`/books/${chapters[0].book?.documentId}`}
|
||||
<a href={`/books/${chapters[0].book?.documentId}`}
|
||||
className="text-lg font-semibold text-gray-700 dark:text-yellow-300 mb-4 hover:underline">
|
||||
{bookTitle}
|
||||
</Link>
|
||||
</a>
|
||||
<ul className="space-y-4">
|
||||
{chapters.map((chapter) => (
|
||||
<li
|
||||
key={chapter.id}
|
||||
className="p-4 bg-yellow-100 dark:bg-yellow-800 text-gray-800 dark:text-gray-100 rounded-lg shadow-sm border border-yellow-300 dark:border-yellow-700 transition-transform transform hover:scale-105"
|
||||
>
|
||||
<Link href={`books/${chapter.book?.documentId}/chapters/${chapter.documentId}`} className="block">
|
||||
<a href={`books/${chapter.book?.documentId}/chapters/${chapter.documentId}`} className="block">
|
||||
|
||||
<h4 className="text-md font-medium">
|
||||
Chapter {chapter.number}: {chapter.title}
|
||||
@ -85,7 +84,7 @@ export default async function ReleasePage() {
|
||||
new Date(chapter.release_datetime)
|
||||
)}
|
||||
</p>
|
||||
</Link>
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
@ -108,10 +107,10 @@ export default async function ReleasePage() {
|
||||
.sort(([titleA], [titleB]) => titleA.localeCompare(titleB))
|
||||
.map(([bookTitle, chapters]) => (
|
||||
<div key={bookTitle} className="mb-6">
|
||||
<Link href={`/books/${chapters[0].book?.documentId}`}
|
||||
<a href={`/books/${chapters[0].book?.documentId}`}
|
||||
className="text-lg font-semibold text-blue-700 dark:text-blue-300 mb-4 hover:underline">
|
||||
{bookTitle}
|
||||
</Link>
|
||||
</a>
|
||||
<ul className="space-y-4">
|
||||
{chapters.map((chapter) => (
|
||||
<li
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
"use client";
|
||||
import React, { useState } from "react";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { Ad } from "@/lib/types";
|
||||
export default function Navbar() {
|
||||
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
||||
@ -17,29 +16,29 @@ export default function Navbar() {
|
||||
alt="Logo"
|
||||
className="h-8 w-8"
|
||||
/>
|
||||
<Link href="/" className="text-2xl font-bold">
|
||||
<a href="https://nulltranslation.com" className="text-2xl font-bold">
|
||||
Null Translation Group
|
||||
</Link>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{/* Navigation Links */}
|
||||
|
||||
<nav className="hidden md:flex space-x-6">
|
||||
<Link href={"/announcements"} className="hover:text-gray-400">
|
||||
<a href={"/announcements"} className="hover:text-gray-400">
|
||||
Announcements
|
||||
</Link>
|
||||
<Link href="/" className="hover:text-gray-400">
|
||||
</a>
|
||||
<a href="https://nulltranslation.com" className="hover:text-gray-400">
|
||||
Books
|
||||
</Link>
|
||||
<Link href={"/releases"} className="hover:text-gray-400">
|
||||
</a>
|
||||
<a href={"/releases"} className="hover:text-gray-400">
|
||||
Releases
|
||||
</Link>
|
||||
<Link href={"/early"} className="hover:text-gray-400">
|
||||
</a>
|
||||
<a href={"/early"} className="hover:text-gray-400">
|
||||
Early Access
|
||||
</Link>
|
||||
<Link href={Ad.patreon} className="hover:text-yellow-400 text-yellow-200 font-semibold">
|
||||
</a>
|
||||
<a href={Ad.patreon} className="hover:text-yellow-400 text-yellow-200 font-semibold">
|
||||
Patreon
|
||||
</Link>
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
{/* Mobile Menu Button */}
|
||||
@ -67,18 +66,21 @@ export default function Navbar() {
|
||||
{/* Mobile Menu */}
|
||||
{isMenuOpen && (
|
||||
<div className="md:hidden bg-gray-700 px-6 pb-4">
|
||||
<Link href={"/announcements"} className="block py-2 hover:text-gray-400">
|
||||
<a href={"/announcements"} className="block py-2 hover:text-gray-400">
|
||||
Announcements
|
||||
</Link>
|
||||
<Link href={"/releases"} className="block py-2 hover:text-gray-400">
|
||||
</a>
|
||||
<a href={"/releases"} className="block py-2 hover:text-gray-400">
|
||||
Release
|
||||
</Link>
|
||||
<Link href="/" className="block py-2 hover:text-gray-400">
|
||||
</a>
|
||||
<a href="https://nulltranslation.com" className="block py-2 hover:text-gray-400">
|
||||
Book List
|
||||
</Link>
|
||||
<Link href={Ad.patreon} className="block py-2 hover:text-gray-400">
|
||||
</a>
|
||||
<a href={"/early"} className="hover:text-gray-400">
|
||||
Early Access
|
||||
</a>
|
||||
<a href={Ad.patreon} className="hover:text-yellow-400 text-yellow-200 font-semibold">
|
||||
Patreon
|
||||
</Link>
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
32
src/hooks/useRefreshAds.ts
Normal file
32
src/hooks/useRefreshAds.ts
Normal file
@ -0,0 +1,32 @@
|
||||
"use client"
|
||||
|
||||
import { useEffect } from 'react';
|
||||
import { useRouter } from 'next/router';
|
||||
|
||||
const useRefreshAds = () => {
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof window !== 'undefined') {
|
||||
console.log("Initializing Ad Refresh...");
|
||||
window.googletag = window.googletag || { cmd: [] };
|
||||
|
||||
router.events.on('routeChangeComplete', () => {
|
||||
console.log("Refreshing Ads...");
|
||||
window.googletag.cmd.push(() => {
|
||||
if (window.googletag?.pubads) {
|
||||
window.googletag.pubads().refresh();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
return () => {
|
||||
router.events.off('routeChangeComplete', () => {});
|
||||
};
|
||||
}
|
||||
}, [router]);
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
export default useRefreshAds;
|
||||
Loading…
Reference in New Issue
Block a user