feat: thread dialog ui

apps/masterbots.ai/app/(browse)/[category]/[threadId]/page.tsx

@@ -1,19 +1,22 @@
-import { getThread } from '@/services/hasura'
-import { BrowseThread } from '@/components/browse/browse-thread'
+import { getMessagePairs, getThread } from '@/services/hasura'
+
 import type { ChatPageProps } from '@/app/c/[chatbot]/[threadId]/page'
-import Shortlink from '@/components/browse/shortlink-button'
+import Shortlink from '@/components/routes/browse/shortlink-button'
+import { ThreadAccordion } from '@/components/shared/thread-accordion'
 
 export default async function ThreadLandingPage({ params }: ChatPageProps) {
   const thread = await getThread({
     threadId: params.threadId
   })
-  return (
-    <>
-      <div>
-        <Shortlink />
-      </div>
+  const initialMessagePairs = await getMessagePairs(thread.threadId)
 
-      <BrowseThread thread={thread} />
-    </>
+  return (
+    <div className="container">
+      <Shortlink />
+      <ThreadAccordion
+        thread={thread}
+        initialMessagePairs={initialMessagePairs}
+      />
+    </div>
   )
 }

apps/masterbots.ai/app/(browse)/[category]/page.tsx

@@ -1,6 +1,6 @@
-import BrowseList from '@/components/shared/thread-dialog/thread-list'
-import { BrowseCategoryTabs } from '@/components/browse/browse-category-tabs'
-import { BrowseSearchInput } from '@/components/browse/browse-search-input'
+import BrowseList from '@/components/shared/thread-list'
+import { BrowseCategoryTabs } from '@/components/routes/browse/browse-category-tabs'
+import { BrowseSearchInput } from '@/components/routes/browse/browse-search-input'
 import { getBrowseThreads, getCategories } from '@/services/hasura'
 
 export const revalidate = 3600 // revalidate the data at most every hour

apps/masterbots.ai/app/(browse)/page.tsx

@@ -1,6 +1,6 @@
-import BrowseList from '@/components/shared/thread-dialog/thread-list'
-import { BrowseCategoryTabs } from '@/components/browse/browse-category-tabs'
-import { BrowseSearchInput } from '@/components/browse/browse-search-input'
+import BrowseList from '@/components/shared/thread-list'
+import { BrowseCategoryTabs } from '@/components/routes/browse/browse-category-tabs'
+import { BrowseSearchInput } from '@/components/routes/browse/browse-search-input'
 import { getBrowseThreads, getCategories } from '@/services/hasura'
 
 export const revalidate = 3600 // revalidate the data at most every hour

apps/masterbots.ai/app/b/[id]/page.tsx

@@ -1,6 +1,6 @@
 import { getChatbot, getBrowseThreads } from '@/services/hasura'
 import { botNames } from '@/lib/bots-names'
-import BotDetails from '@/components/b/bot-details'
+import BotDetails from '@/components/routes/b/bot-details'
 
 const PAGE_SIZE = 50
 

apps/masterbots.ai/app/c/[chatbot]/[threadId]/page.tsx

@@ -2,7 +2,7 @@ import { redirect } from 'next/navigation'
 import type { Message } from 'ai/react'
 import { isTokenExpired } from '@repo/mb-lib'
 import { cookies } from 'next/headers'
-import { Chat } from '@/components/c/chat'
+import { Chat } from '@/components/routes/c/chat'
 import { getThread } from '@/services/hasura'
 import { getUserProfile } from '@/services/supabase'
 

apps/masterbots.ai/app/c/[chatbot]/page.tsx

@@ -3,8 +3,8 @@ import { isTokenExpired } from '@repo/mb-lib'
 import { nanoid } from 'nanoid'
 import { cookies } from 'next/headers'
 import { redirect } from 'next/navigation'
-import { ChatChatbot } from '@/components/c/chat-chatbot'
-import ThreadPanel from '@/components/c/thread-panel'
+import { ChatChatbot } from '@/components/routes/c/chat-chatbot'
+import ThreadPanel from '@/components/routes/c/thread-panel'
 import { botNames } from '@/lib/bots-names'
 import { getChatbot, getThreads } from '@/services/hasura'
 import { getUserProfile } from '@/services/supabase'

apps/masterbots.ai/app/c/layout.tsx

@@ -1,5 +1,5 @@
-import { ChatLayoutSection } from '@/components/c/chat-layout-section'
-import { ResponsiveSidebar } from '@/components/c/sidebar/sidebar-responsive'
+import { ChatLayoutSection } from '@/components/routes/c/chat-layout-section'
+import { ResponsiveSidebar } from '@/components/routes/c/sidebar/sidebar-responsive'
 import FooterCT from '@/components/layout/footer-ct'
 
 interface ChatLayoutProps {

apps/masterbots.ai/app/c/page.tsx

@@ -1,8 +1,8 @@
 import { isTokenExpired } from '@repo/mb-lib'
 import { redirect } from 'next/navigation'
 import { cookies } from 'next/headers'
-import ChatThreadListPanel from '@/components/c/chat-thread-list-panel'
-import ThreadPanel from '@/components/c/thread-panel'
+import ChatThreadListPanel from '@/components/routes/c/chat-thread-list-panel'
+import ThreadPanel from '@/components/routes/c/thread-panel'
 import { getThreads } from '@/services/hasura'
 import { getUserProfile } from '@/services/supabase'
 

apps/masterbots.ai/app/globals.css

@@ -100,32 +100,21 @@
 }
 
 .scrollbar {
-	overflow: auto;
+  overflow: auto;
 }
 
 .scrollbar::-webkit-scrollbar {
-  width: 4px;
-  height: 4px;
+  width: 1px;
+  height: 1px;
 }
 .scrollbar::-webkit-scrollbar-track,
 .scrollbar::-webkit-scrollbar-corner {
-  background: var(--scrollbar-track) !important;
+  background: var(--scrollbar-track);
 }
 .scrollbar::-webkit-scrollbar-thumb {
   background: var(--scrollbar-thumb);
   border-radius: 2px;
 }
-/* .scrollbar::-webkit-scrollbar-thumb:hover {
-  background: var(--scrollbar-thumb-hover);
-} */
-
-@media screen and (min-width: 1024px) {
-  .scrollbar::-webkit-scrollbar {
-    width: 8px;
-    height: 8px;
-  }
-}
-
 
 .scrollbar.small-thumb::-webkit-scrollbar-thumb {
   border-left: 300px solid #f9f9fa;
@@ -151,3 +140,7 @@
   overflow: visible;
   text-overflow: clip;
 }
+
+.hide-buttons > button {
+  display: none;
+}

apps/masterbots.ai/app/p/page.tsx

@@ -1,5 +1,5 @@
 import { Suspense } from 'react'
-import { WorkEarlyAccessForm } from '@/components/p/early-access-from'
+import { WorkEarlyAccessForm } from '@/components/routes/p/early-access-from'
 
 export default function WorkPage() {
   return (

apps/masterbots.ai/app/u/[slug]/page.tsx

@@ -1,5 +1,5 @@
 import { getBrowseThreads, getUserInfoFromBrowse } from '@/services/hasura'
-import BrowseUserDetails from '@/components/browse/browse-user-details'
+import BrowseUserDetails from '@/components/routes/browse/browse-user-details'
 
 const PAGE_SIZE = 50
 

apps/masterbots.ai/components/layout/header.tsx

@@ -4,9 +4,9 @@ import { isTokenExpired } from '@repo/mb-lib'
 import { cookies } from 'next/headers'
 import { Button } from '@/components/ui/button'
 import { IconSeparator } from '@/components/ui/icons'
-import { UserMenu } from '@/components/user-menu'
+import { UserMenu } from '@/components/layout/user-menu'
 import { getUserProfile } from '@/services/supabase'
-import { SidebarToggle } from '../c/sidebar/sidebar-toggle'
+import { SidebarToggle } from '../routes/c/sidebar/sidebar-toggle'
 
 // https://nextjs.org/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating
 

apps/masterbots.ai/components/layout/providers.tsx

@@ -6,15 +6,20 @@ import type { ThemeProviderProps } from 'next-themes/dist/types'
 import { SidebarProvider } from '@/hooks/use-sidebar'
 import { TooltipProvider } from '@/components/ui/tooltip'
 import { ThreadProvider } from '@/hooks/use-thread'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+
+const queryClient = new QueryClient()
 
 export function Providers({ children, ...props }: ThemeProviderProps) {
   return (
     <NextThemesProvider {...props}>
-      <SidebarProvider>
-        <TooltipProvider>
-          <ThreadProvider>{children}</ThreadProvider>
-        </TooltipProvider>
-      </SidebarProvider>
+      <QueryClientProvider client={queryClient}>
+        <SidebarProvider>
+          <TooltipProvider>
+            <ThreadProvider>{children}</ThreadProvider>
+          </TooltipProvider>
+        </SidebarProvider>
+      </QueryClientProvider>
     </NextThemesProvider>
   )
 }