chore: organize code structure

app/chat/@sidebar/main.tsx

@@ -1,13 +1,13 @@
 'use client'
 import { FC } from 'react'
-import { LocaleProps } from '@/interface'
+import { LocaleProps, ConversationsProps } from '@/interface'
 import Button from '@/components/button'
 import PencilSquare from '@heroicons/react/24/solid/PencilSquareIcon'
 import MenuItem from '@/components/menu-item'
 
 import { t } from '@/i18n'
 
-const Main: FC<LocaleProps> = ({ locale }) => {
+const Main: FC<ConversationsProps & LocaleProps> = ({ locale }) => {
   return (
     <div className='flex flex-col shrink-0 w-60 h-screen bg-white'>
       <div className='flex items-center w-full h-16 p-4'>

app/chat/@sidebar/page.tsx

@@ -1,11 +1,18 @@
 import Main from './main'
 import { getLocale, client } from '@/service'
+import { ConversationsProps } from '@/interface'
 
-async function getData() {}
+async function getData() {
+  const { status, data } = await client.getConversations()
+  if (status !== 200) {
+    throw new Error('Failed to fetch data')
+  }
+  return data as ConversationsProps
+}
 
 const Sidebar = async () => {
   const conversations = await getData()
-  return <Main locale={getLocale()} />
+  return <Main locale={getLocale()} {...conversations} />
 }
 
 export default Sidebar

app/chat/page.tsx

@@ -3,9 +3,6 @@ import Main from './main'
 
 async function getData() {
   const { status, data: appInfo } = await client.getApplicationParameters()
-  // The return value is *not* serialized
-  // You can return Date, Map, Set, etc.
-  // Recommendation: handle errors
   if (status !== 200) {
     // This will activate the closest `error.js` Error Boundary
     throw new Error('Failed to fetch data')

interface/index.ts

@@ -23,5 +23,7 @@ export interface ConversationProps {
 }
 
 export interface ConversationsProps {
-  conversations: ConversationProps[]
+  data: ConversationProps[]
+  has_more: boolean
+  limit: number
 }