feat: add interfaces

app/chat/@sidebar/main.tsx

@@ -1,15 +1,13 @@
 'use client'
 import { FC } from 'react'
+import { LocaleProps } 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'
-interface ExtraProps {
-  locale: string
-}
 
-const Main: FC<ExtraProps> = ({ locale }) => {
+const Main: FC<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'>
@@ -32,14 +30,15 @@ const Main: FC<ExtraProps> = ({ locale }) => {
         </Button>
       </div>
       <div className='mt-6 mx-4'>
-        <div className='ml-4 text-gray-500 text-xs'>
+        <div className='ml-4 text-gray-500 text-xs mb-1'>
           {t('app.chats', locale)}
         </div>
-
-        <MenuItem text='Menu Item' onClick={() => {}} />
-        <MenuItem text='Menu Item' onClick={() => {}} />
-        <MenuItem text='Menu Item' onClick={() => {}} />
-        <MenuItem text='Menu Item' onClick={() => {}} />
+        <div className='flex flex-col'>
+          <MenuItem text='Menu Item' onClick={() => {}} />
+          <MenuItem text='Menu Item' onClick={() => {}} />
+          <MenuItem text='Menu Item' onClick={() => {}} />
+          <MenuItem text='Menu Item' onClick={() => {}} />
+        </div>
       </div>
     </div>
   )

app/chat/@sidebar/page.tsx

@@ -1,7 +1,11 @@
 import Main from './main'
+import { getLocale, client } from '@/service'
+
+async function getData() {}
 
 const Sidebar = async () => {
-  return <Main />
+  const conversations = await getData()
+  return <Main locale={getLocale()} />
 }
 
 export default Sidebar

app/chat/main.tsx

@@ -1,23 +1,9 @@
 'use client'
 import { FC } from 'react'
+import { AppProps, LocaleProps } from '@/interface'
 
-export interface AppProps {
-  opening_statement: string
-  suggested_questions: any[]
-  suggested_questions_after_answer: {
-    enabled: boolean
-  }
-  more_like_this: {
-    enabled: boolean
-  }
-  user_input_form: any[]
-}
-interface ExtraProps {
-  locale: string
-}
-
-const Main: FC<AppProps & ExtraProps> = ({ locale }) => {
-  return <div className='flex'>{locale}</div>
+const Main: FC<AppProps & LocaleProps> = ({}) => {
+  return <div className='flex'></div>
 }
 
 export default Main

interface/index.ts

@@ -0,0 +1,27 @@
+export interface LocaleProps {
+  locale: string
+}
+
+export interface AppProps {
+  opening_statement: string
+  suggested_questions: any[]
+  suggested_questions_after_answer: {
+    enabled: boolean
+  }
+  more_like_this: {
+    enabled: boolean
+  }
+  user_input_form: any[]
+}
+
+export interface ConversationProps {
+  id: string
+  inputs: any
+  introduction: string
+  name: string
+  status: string
+}
+
+export interface ConversationsProps {
+  conversations: ConversationProps[]
+}

service/index.ts

@@ -5,6 +5,6 @@ dotenv.config()
 
 export const getLocale = () => {
   const cookieStore = cookies()
-  return cookieStore.get('locale')?.value
+  return cookieStore.get('locale')?.value || 'en' // default to english
 }
 export const client = new ChatClient(process.env.API_SECRET)