Updated next and Added Missing Suspense boundary with useSearchParams

This commit is contained in:
zaidmukaddam 2024-09-18 11:20:15 +05:30
parent 18608a1a36
commit 6ec4100e50
4 changed files with 70 additions and 47 deletions

View File

@ -9,7 +9,8 @@ React,
useState,
useEffect,
useMemo,
memo
memo,
Suspense
} from 'react';
import ReactMarkdown, { Components } from 'react-markdown';
import Marked, { ReactRenderer } from 'marked-react';
@ -69,7 +70,8 @@ import {
Clock,
Cpu,
Network,
ExternalLink} from 'lucide-react';
ExternalLink
} from 'lucide-react';
import {
HoverCard,
HoverCardContent,
@ -144,7 +146,7 @@ interface Attachment {
size: number;
}
export default function Home() {
const HomeContent = () => {
const searchParams = useSearchParams();
const initialQuery = searchParams.get('query') || '';
const initialModel = searchParams.get('model') || 'azure:gpt4o-mini';
@ -325,8 +327,8 @@ export default function Home() {
"https://metwm7frkvew6tn1.public.blob.vercel-storage.com/mplx-changelogs/default-search-engine-mplx.png",
"https://metwm7frkvew6tn1.public.blob.vercel-storage.com/mplx-changelogs/o1-mini-mplx.png"
],
content:
`## **Results Overview**
content:
`## **Results Overview**
The new Results Overview tool provides a summary of the search results, including images, descriptions, and other relevant information. It also includes a table with additional details.
@ -2724,4 +2726,28 @@ The o1-mini is a new OpenAI model that is optimized for reasoning tasks. Current
<ChangeLogs open={openChangelog} setOpen={setOpenChangelog} />
</div>
);
}
}
const LoadingFallback = () => (
<div className="flex flex-col items-center justify-center min-h-screen bg-background text-foreground">
<div className="text-center space-y-4">
<h1 className="text-4xl sm:text-6xl mb-1 text-gray-800 font-serif animate-pulse">
MiniPerplx
</h1>
<p className="text-xl sm:text-2xl font-serif text-gray-600 animate-pulse">
Loading your minimalist AI experience...
</p>
<Loader2 className="w-10 h-10 text-primary mx-auto animate-spin" />
</div>
</div>
);
const Home = () => {
return (
<Suspense fallback={<LoadingFallback />}>
<HomeContent />
</Suspense>
);
};
export default Home;

View File

@ -51,9 +51,6 @@ const nextConfig = {
},
]
},
experimental: {
missingSuspenseWithCSRBailout: false,
},
};
export default nextConfig;

View File

@ -49,7 +49,7 @@
"katex": "^0.16.11",
"lucide-react": "^0.424.0",
"marked-react": "^2.0.0",
"next": "^14.2.5",
"next": "^14.2.10",
"openai": "^4.56.0",
"react": "^18",
"react-dom": "^18",

View File

@ -76,7 +76,7 @@ dependencies:
version: 1.34.0
'@vercel/analytics':
specifier: ^1.3.1
version: 1.3.1(next@14.2.5)(react@18.3.1)
version: 1.3.1(next@14.2.10)(react@18.3.1)
'@vercel/blob':
specifier: ^0.23.4
version: 0.23.4
@ -126,8 +126,8 @@ dependencies:
specifier: ^2.0.0
version: 2.0.0(react@18.3.1)
next:
specifier: ^14.2.5
version: 14.2.5(react-dom@18.3.1)(react@18.3.1)
specifier: ^14.2.10
version: 14.2.10(react-dom@18.3.1)(react@18.3.1)
openai:
specifier: ^4.56.0
version: 4.56.0(zod@3.23.8)
@ -644,8 +644,8 @@ packages:
- ws
dev: false
/@next/env@14.2.5:
resolution: {integrity: sha512-/zZGkrTOsraVfYjGP8uM0p6r0BDT6xWpkjdVbcz66PJVSpwXX3yNiRycxAuDfBKGWBrZBXRuK/YVlkNgxHGwmA==}
/@next/env@14.2.10:
resolution: {integrity: sha512-dZIu93Bf5LUtluBXIv4woQw2cZVZ2DJTjax5/5DOs3lzEOeKLy7GxRSr4caK9/SCPdaW6bCgpye6+n4Dh9oJPw==}
dev: false
/@next/eslint-plugin-next@14.2.5:
@ -654,8 +654,8 @@ packages:
glob: 10.3.10
dev: true
/@next/swc-darwin-arm64@14.2.5:
resolution: {integrity: sha512-/9zVxJ+K9lrzSGli1///ujyRfon/ZneeZ+v4ptpiPoOU+GKZnm8Wj8ELWU1Pm7GHltYRBklmXMTUqM/DqQ99FQ==}
/@next/swc-darwin-arm64@14.2.10:
resolution: {integrity: sha512-V3z10NV+cvMAfxQUMhKgfQnPbjw+Ew3cnr64b0lr8MDiBJs3eLnM6RpGC46nhfMZsiXgQngCJKWGTC/yDcgrDQ==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [darwin]
@ -663,8 +663,8 @@ packages:
dev: false
optional: true
/@next/swc-darwin-x64@14.2.5:
resolution: {integrity: sha512-vXHOPCwfDe9qLDuq7U1OYM2wUY+KQ4Ex6ozwsKxp26BlJ6XXbHleOUldenM67JRyBfVjv371oneEvYd3H2gNSA==}
/@next/swc-darwin-x64@14.2.10:
resolution: {integrity: sha512-Y0TC+FXbFUQ2MQgimJ/7Ina2mXIKhE7F+GUe1SgnzRmwFY3hX2z8nyVCxE82I2RicspdkZnSWMn4oTjIKz4uzA==}
engines: {node: '>= 10'}
cpu: [x64]
os: [darwin]
@ -672,8 +672,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-arm64-gnu@14.2.5:
resolution: {integrity: sha512-vlhB8wI+lj8q1ExFW8lbWutA4M2ZazQNvMWuEDqZcuJJc78iUnLdPPunBPX8rC4IgT6lIx/adB+Cwrl99MzNaA==}
/@next/swc-linux-arm64-gnu@14.2.10:
resolution: {integrity: sha512-ZfQ7yOy5zyskSj9rFpa0Yd7gkrBnJTkYVSya95hX3zeBG9E55Z6OTNPn1j2BTFWvOVVj65C3T+qsjOyVI9DQpA==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
@ -681,8 +681,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-arm64-musl@14.2.5:
resolution: {integrity: sha512-NpDB9NUR2t0hXzJJwQSGu1IAOYybsfeB+LxpGsXrRIb7QOrYmidJz3shzY8cM6+rO4Aojuef0N/PEaX18pi9OA==}
/@next/swc-linux-arm64-musl@14.2.10:
resolution: {integrity: sha512-n2i5o3y2jpBfXFRxDREr342BGIQCJbdAUi/K4q6Env3aSx8erM9VuKXHw5KNROK9ejFSPf0LhoSkU/ZiNdacpQ==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
@ -690,8 +690,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-x64-gnu@14.2.5:
resolution: {integrity: sha512-8XFikMSxWleYNryWIjiCX+gU201YS+erTUidKdyOVYi5qUQo/gRxv/3N1oZFCgqpesN6FPeqGM72Zve+nReVXQ==}
/@next/swc-linux-x64-gnu@14.2.10:
resolution: {integrity: sha512-GXvajAWh2woTT0GKEDlkVhFNxhJS/XdDmrVHrPOA83pLzlGPQnixqxD8u3bBB9oATBKB//5e4vpACnx5Vaxdqg==}
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
@ -699,8 +699,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-x64-musl@14.2.5:
resolution: {integrity: sha512-6QLwi7RaYiQDcRDSU/os40r5o06b5ue7Jsk5JgdRBGGp8l37RZEh9JsLSM8QF0YDsgcosSeHjglgqi25+m04IQ==}
/@next/swc-linux-x64-musl@14.2.10:
resolution: {integrity: sha512-opFFN5B0SnO+HTz4Wq4HaylXGFV+iHrVxd3YvREUX9K+xfc4ePbRrxqOuPOFjtSuiVouwe6uLeDtabjEIbkmDA==}
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
@ -708,8 +708,8 @@ packages:
dev: false
optional: true
/@next/swc-win32-arm64-msvc@14.2.5:
resolution: {integrity: sha512-1GpG2VhbspO+aYoMOQPQiqc/tG3LzmsdBH0LhnDS3JrtDx2QmzXe0B6mSZZiN3Bq7IOMXxv1nlsjzoS1+9mzZw==}
/@next/swc-win32-arm64-msvc@14.2.10:
resolution: {integrity: sha512-9NUzZuR8WiXTvv+EiU/MXdcQ1XUvFixbLIMNQiVHuzs7ZIFrJDLJDaOF1KaqttoTujpcxljM/RNAOmw1GhPPQQ==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [win32]
@ -717,8 +717,8 @@ packages:
dev: false
optional: true
/@next/swc-win32-ia32-msvc@14.2.5:
resolution: {integrity: sha512-Igh9ZlxwvCDsu6438FXlQTHlRno4gFpJzqPjSIBZooD22tKeI4fE/YMRoHVJHmrQ2P5YL1DoZ0qaOKkbeFWeMg==}
/@next/swc-win32-ia32-msvc@14.2.10:
resolution: {integrity: sha512-fr3aEbSd1GeW3YUMBkWAu4hcdjZ6g4NBl1uku4gAn661tcxd1bHs1THWYzdsbTRLcCKLjrDZlNp6j2HTfrw+Bg==}
engines: {node: '>= 10'}
cpu: [ia32]
os: [win32]
@ -726,8 +726,8 @@ packages:
dev: false
optional: true
/@next/swc-win32-x64-msvc@14.2.5:
resolution: {integrity: sha512-tEQ7oinq1/CjSG9uSTerca3v4AZ+dFa+4Yu6ihaG8Ud8ddqLQgFGcnwYls13H5X5CPDPZJdYxyeMui6muOLd4g==}
/@next/swc-win32-x64-msvc@14.2.10:
resolution: {integrity: sha512-UjeVoRGKNL2zfbcQ6fscmgjBAS/inHBh63mjIlfPg/NG8Yn2ztqylXt5qilYb6hoHIwaU2ogHknHWWmahJjgZQ==}
engines: {node: '>= 10'}
cpu: [x64]
os: [win32]
@ -1774,7 +1774,7 @@ packages:
crypto-js: 4.2.0
dev: false
/@vercel/analytics@1.3.1(next@14.2.5)(react@18.3.1):
/@vercel/analytics@1.3.1(next@14.2.10)(react@18.3.1):
resolution: {integrity: sha512-xhSlYgAuJ6Q4WQGkzYTLmXwhYl39sWjoMA3nHxfkvG+WdBT25c563a7QhwwKivEOZtPJXifYHR1m2ihoisbWyA==}
peerDependencies:
next: '>= 13'
@ -1785,7 +1785,7 @@ packages:
react:
optional: true
dependencies:
next: 14.2.5(react-dom@18.3.1)(react@18.3.1)
next: 14.2.10(react-dom@18.3.1)(react@18.3.1)
react: 18.3.1
server-only: 0.0.1
dev: false
@ -4887,8 +4887,8 @@ packages:
resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
dev: true
/next@14.2.5(react-dom@18.3.1)(react@18.3.1):
resolution: {integrity: sha512-0f8aRfBVL+mpzfBjYfQuLWh2WyAwtJXCRfkPF4UJ5qd2YwrHczsrSzXU4tRMV0OAxR8ZJZWPFn6uhSC56UTsLA==}
/next@14.2.10(react-dom@18.3.1)(react@18.3.1):
resolution: {integrity: sha512-sDDExXnh33cY3RkS9JuFEKaS4HmlWmDKP1VJioucCG6z5KuA008DPsDZOzi8UfqEk3Ii+2NCQSJrfbEWtZZfww==}
engines: {node: '>=18.17.0'}
hasBin: true
peerDependencies:
@ -4905,7 +4905,7 @@ packages:
sass:
optional: true
dependencies:
'@next/env': 14.2.5
'@next/env': 14.2.10
'@swc/helpers': 0.5.5
busboy: 1.6.0
caniuse-lite: 1.0.30001646
@ -4915,15 +4915,15 @@ packages:
react-dom: 18.3.1(react@18.3.1)
styled-jsx: 5.1.1(react@18.3.1)
optionalDependencies:
'@next/swc-darwin-arm64': 14.2.5
'@next/swc-darwin-x64': 14.2.5
'@next/swc-linux-arm64-gnu': 14.2.5
'@next/swc-linux-arm64-musl': 14.2.5
'@next/swc-linux-x64-gnu': 14.2.5
'@next/swc-linux-x64-musl': 14.2.5
'@next/swc-win32-arm64-msvc': 14.2.5
'@next/swc-win32-ia32-msvc': 14.2.5
'@next/swc-win32-x64-msvc': 14.2.5
'@next/swc-darwin-arm64': 14.2.10
'@next/swc-darwin-x64': 14.2.10
'@next/swc-linux-arm64-gnu': 14.2.10
'@next/swc-linux-arm64-musl': 14.2.10
'@next/swc-linux-x64-gnu': 14.2.10
'@next/swc-linux-x64-musl': 14.2.10
'@next/swc-win32-arm64-msvc': 14.2.10
'@next/swc-win32-ia32-msvc': 14.2.10
'@next/swc-win32-x64-msvc': 14.2.10
transitivePeerDependencies:
- '@babel/core'
- babel-plugin-macros