feat: swap Google Fonts for local fonts + fix Suspense boundary
- Replace next/font/google with next/font/local for Inter and Merriweather - Add self-hosted font files to public/fonts/ - Wrap useSearchParams in Suspense boundary for /chat page - Eliminates Turbopack TLS font loading issues during build
This commit is contained in:
BIN
public/fonts/Inter-VariableFont.woff2
Normal file
BIN
public/fonts/Inter-VariableFont.woff2
Normal file
Binary file not shown.
11
public/fonts/Merriweather-Black.woff2
Normal file
11
public/fonts/Merriweather-Black.woff2
Normal file
@@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
|
||||
<title>Error 404 (Not Found)!!1</title>
|
||||
<style>
|
||||
*{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
|
||||
</style>
|
||||
<a href=//www.google.com/><span id=logo aria-label=Google></span></a>
|
||||
<p><b>404.</b> <ins>That’s an error.</ins>
|
||||
<p>The requested URL <code>/s/merriweather/v30/u-4n0qyriQwlOrhSvowK_l52uwpZWMf6.woff2</code> was not found on this server. <ins>That’s all we know.</ins>
|
||||
11
public/fonts/Merriweather-Bold.woff2
Normal file
11
public/fonts/Merriweather-Bold.woff2
Normal file
@@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
|
||||
<title>Error 404 (Not Found)!!1</title>
|
||||
<style>
|
||||
*{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
|
||||
</style>
|
||||
<a href=//www.google.com/><span id=logo aria-label=Google></span></a>
|
||||
<p><b>404.</b> <ins>That’s an error.</ins>
|
||||
<p>The requested URL <code>/s/merriweather/v30/u-4n0qyriQwlOrhSvowK_l52_wtZWMf6.woff2</code> was not found on this server. <ins>That’s all we know.</ins>
|
||||
BIN
public/fonts/Merriweather-Light.woff2
Normal file
BIN
public/fonts/Merriweather-Light.woff2
Normal file
Binary file not shown.
BIN
public/fonts/Merriweather-Regular.woff2
Normal file
BIN
public/fonts/Merriweather-Regular.woff2
Normal file
Binary file not shown.
@@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useEffect, useState, Suspense } from 'react';
|
||||
import { useSearchParams, useRouter } from 'next/navigation';
|
||||
import { ChatWindow } from '@/components/features/chat/chat-window';
|
||||
import { ChatInput } from '@/components/features/chat/chat-input';
|
||||
@@ -11,7 +11,7 @@ import Link from "next/link";
|
||||
import { LLMService } from '@/services/llm-service';
|
||||
import { ProviderManagementService } from '@/services/provider-management-service';
|
||||
|
||||
export default function ChatPage() {
|
||||
function ChatPageContent() {
|
||||
const { resetSession, phase } = useChatStore();
|
||||
const searchParams = useSearchParams();
|
||||
const router = useRouter();
|
||||
@@ -90,3 +90,16 @@ export default function ChatPage() {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ChatPage() {
|
||||
return (
|
||||
<Suspense fallback={
|
||||
<div className="flex flex-col h-dvh bg-background items-center justify-center">
|
||||
<Loader2 className="w-8 h-8 animate-spin text-indigo-500" />
|
||||
</div>
|
||||
}>
|
||||
<ChatPageContent />
|
||||
</Suspense>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,19 +1,24 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Inter, Merriweather } from "next/font/google";
|
||||
import localFont from "next/font/local";
|
||||
import "./globals.css";
|
||||
import { OfflineIndicator } from "../components/features/common";
|
||||
import { InstallPrompt } from "../components/features/pwa/install-prompt";
|
||||
import { ThemeProvider } from "@/components/theme-provider";
|
||||
|
||||
const inter = Inter({
|
||||
const inter = localFont({
|
||||
src: "../../public/fonts/Inter-VariableFont.woff2",
|
||||
variable: "--font-inter",
|
||||
subsets: ["latin"],
|
||||
display: "swap",
|
||||
});
|
||||
|
||||
const merriweather = Merriweather({
|
||||
const merriweather = localFont({
|
||||
src: [
|
||||
{ path: "../../public/fonts/Merriweather-Light.woff2", weight: "300", style: "normal" },
|
||||
{ path: "../../public/fonts/Merriweather-Regular.woff2", weight: "400", style: "normal" },
|
||||
{ path: "../../public/fonts/Merriweather-Bold.woff2", weight: "700", style: "normal" },
|
||||
{ path: "../../public/fonts/Merriweather-Black.woff2", weight: "900", style: "normal" },
|
||||
],
|
||||
variable: "--font-merriweather",
|
||||
subsets: ["latin"],
|
||||
weight: ["300", "400", "700", "900"],
|
||||
display: "swap",
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user