From 3e7e73ddd6b261bb0bf5dd9856012cfded8bd672 Mon Sep 17 00:00:00 2001 From: sabaimran Date: Thu, 11 Jul 2024 23:06:27 +0530 Subject: [PATCH] Switch from using dynamic routes to static routes and extracting slug from URL manually. See https://github.com/vercel/next.js/discussions/64660 for limitations with static export / dynamic routes --- .../app/share/chat/{[slug] => }/layout.tsx | 2 +- .../web/app/share/chat/{[slug] => }/page.tsx | 43 ++++++++++++------- .../chat/{[slug] => }/sharedChat.module.css | 0 3 files changed, 28 insertions(+), 17 deletions(-) rename src/interface/web/app/share/chat/{[slug] => }/layout.tsx (97%) rename src/interface/web/app/share/chat/{[slug] => }/page.tsx (93%) rename src/interface/web/app/share/chat/{[slug] => }/sharedChat.module.css (100%) diff --git a/src/interface/web/app/share/chat/[slug]/layout.tsx b/src/interface/web/app/share/chat/layout.tsx similarity index 97% rename from src/interface/web/app/share/chat/[slug]/layout.tsx rename to src/interface/web/app/share/chat/layout.tsx index d0f63ce1..efd3c5f6 100644 --- a/src/interface/web/app/share/chat/[slug]/layout.tsx +++ b/src/interface/web/app/share/chat/layout.tsx @@ -1,6 +1,6 @@ import type { Metadata } from "next"; import { Noto_Sans } from "next/font/google"; -import "../../../globals.css"; +import "../../globals.css"; const inter = Noto_Sans({ subsets: ["latin"] }); diff --git a/src/interface/web/app/share/chat/[slug]/page.tsx b/src/interface/web/app/share/chat/page.tsx similarity index 93% rename from src/interface/web/app/share/chat/[slug]/page.tsx rename to src/interface/web/app/share/chat/page.tsx index d16b4478..e9653dd0 100644 --- a/src/interface/web/app/share/chat/[slug]/page.tsx +++ b/src/interface/web/app/share/chat/page.tsx @@ -3,14 +3,14 @@ import styles from './sharedChat.module.css'; import React, { Suspense, useEffect, useRef, useState } from 'react'; -import SidePanel from '../../../components/sidePanel/chatHistorySidePanel'; -import ChatHistory from '../../../components/chatHistory/chatHistory'; -import NavMenu from '../../../components/navMenu/navMenu'; -import Loading from '../../../components/loading/loading'; +import SidePanel from '../../components/sidePanel/chatHistorySidePanel'; +import ChatHistory from '../../components/chatHistory/chatHistory'; +import NavMenu from '../../components/navMenu/navMenu'; +import Loading from '../../components/loading/loading'; import 'katex/dist/katex.min.css'; -import { welcomeConsole } from '../../../common/utils'; +import { welcomeConsole } from '../../common/utils'; import { useAuthenticatedData } from '@/app/common/auth'; import ChatInputArea, { ChatOptions } from '@/app/components/chatInputArea/chatInputArea'; @@ -35,14 +35,6 @@ function ChatBodyData(props: ChatBodyDataProps) { const [message, setMessage] = useState(''); const [processingMessage, setProcessingMessage] = useState(false); - if (!props.publicConversationSlug && !props.conversationId) { - return ( -
- Whoops, nothing to see here! -
- ); - } - useEffect(() => { if (message) { setProcessingMessage(true); @@ -62,6 +54,14 @@ function ChatBodyData(props: ChatBodyDataProps) { } }, [props.streamedMessages]); + if (!props.publicConversationSlug && !props.conversationId) { + return ( +
+ Whoops, nothing to see here! +
+ ); + } + return ( <>
@@ -86,7 +86,7 @@ function ChatBodyData(props: ChatBodyDataProps) { ); } -export default function SharedChat({ params }: { params: { slug: string } }) { +export default function SharedChat() { const [chatOptionsData, setChatOptionsData] = useState(null); const [isLoading, setLoading] = useState(true); const [title, setTitle] = useState('Khoj AI - Chat'); @@ -97,6 +97,7 @@ export default function SharedChat({ params }: { params: { slug: string } }) { const [processQuerySignal, setProcessQuerySignal] = useState(false); const [uploadedFiles, setUploadedFiles] = useState([]); const [isMobileWidth, setIsMobileWidth] = useState(false); + const [paramSlug, setParamSlug] = useState(undefined); const authenticatedData = useAuthenticatedData(); @@ -190,11 +191,13 @@ export default function SharedChat({ params }: { params: { slug: string } }) { setIsMobileWidth(window.innerWidth < 786); }); + setParamSlug(window.location.pathname.split('/').pop() || ''); + }, []); useEffect(() => { if (queryToProcess && !conversationId) { - fetch(`/api/chat/share/fork?public_conversation_slug=${params.slug}`, { + fetch(`/api/chat/share/fork?public_conversation_slug=${paramSlug}`, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -278,6 +281,14 @@ export default function SharedChat({ params }: { params: { slug: string } }) { return ; } + if (!paramSlug) { + return ( +
+ Whoops, nothing to see here! +
+ ); + } + return (
@@ -300,7 +311,7 @@ export default function SharedChat({ params }: { params: { slug: string } }) { streamedMessages={messages} setQueryToProcess={setQueryToProcess} isLoggedIn={authenticatedData !== null} - publicConversationSlug={params.slug} + publicConversationSlug={paramSlug} chatOptionsData={chatOptionsData} setTitle={setTitle} setUploadedFiles={setUploadedFiles} diff --git a/src/interface/web/app/share/chat/[slug]/sharedChat.module.css b/src/interface/web/app/share/chat/sharedChat.module.css similarity index 100% rename from src/interface/web/app/share/chat/[slug]/sharedChat.module.css rename to src/interface/web/app/share/chat/sharedChat.module.css