diff --git a/.env b/.env
index ae06a45..b5e315f 100644
--- a/.env
+++ b/.env
@@ -1,9 +1,9 @@
 VITE_TOKEN_NAME = 'dsc_token'
 VITE_REFRESH_TOKEN_NAME = 'dsc_refresh_token'
-VITE_BASE_URL = 'http://192.168.1.113:4001'
-# VITE_BASE_URL = 'https://danak-zone-api.dev.danakcorp.com'
-VITE_DANAK_BASE_URL ='http://192.168.1.113:4000'
+# VITE_BASE_URL = 'http://192.168.1.113:4001'
+VITE_BASE_URL = 'https://api-dzone.danakcorp.com'
+# VITE_DANAK_BASE_URL ='http://192.168.1.113:4000'
 VITE_SERVICE_ID = '7e3c2f08-b7e7-4402-ae5f-fea99cff56bd'
 VITE_WORKSPACE_ID = 'workspace_id'
-# VITE_LOGIN_URL = 'https://console.danakcorp.com/auth/login'
-VITE_LOGIN_URL = 'http://localhost:5174/auth/login'
\ No newline at end of file
+VITE_LOGIN_URL = 'https://console.danakcorp.com/auth/login'
+# VITE_LOGIN_URL = 'http://localhost:5174/auth/login'
\ No newline at end of file
diff --git a/src/langs/fa.json b/src/langs/fa.json
index 68eaf02..6d36db3 100644
--- a/src/langs/fa.json
+++ b/src/langs/fa.json
@@ -467,7 +467,7 @@
     "error_empty": "همه فیلد ها را پر کنید",
     "date_receipt": "تاریخ صورتحساب",
     "last_date_receipt": "آخرین مهلت پرداخت",
-    "service": "سرویس",
+    "service": "خدمت",
     "status": "وضعیت تایید",
     "status_paid": "وضعیت پرداخت",
     "PENDING": "در انتظار",
@@ -487,7 +487,10 @@
     "4": "چهارماهه",
     "5": "سالانه",
     "maxRecurringCycles": "حداکثر تعداد تکرار دوره",
-    "WAIT_PAYMENT": "در انتظار پرداخت"
+    "WAIT_PAYMENT": "در انتظار پرداخت",
+    "overdue": "سررسید شده",
+    "recurringPeriod": "دوره ای",
+    "lateFee": "جریمه"
   },
   "edit": "ویرایش",
   "transaction": {
diff --git a/src/pages/receipts/List.tsx b/src/pages/receipts/List.tsx
index d266ff7..78f50c6 100644
--- a/src/pages/receipts/List.tsx
+++ b/src/pages/receipts/List.tsx
@@ -1,11 +1,11 @@
 import { FC, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import Tabs from '../../components/Tabs'
-import { CloseCircle, FolderOpen, WalletCheck, WalletRemove, WalletSearch } from 'iconsax-react'
+import { FolderOpen, WalletCheck, WalletRemove, WalletSearch, WalletMinus } from 'iconsax-react'
 import Td from '../../components/Td'
 import { useGetInvoices } from './hooks/useReceiptData'
 import PageLoading from '../../components/PageLoading'
-import { ReceiptItemType } from './types/ReceiptTypes'
+import { InvoiceStatus, ReceiptItemType } from './types/ReceiptTypes'
 import { NumberFormat } from '../../config/func'
 import Select from '../../components/Select'
 import Input from '../../components/Input'
@@ -13,14 +13,15 @@ import DatePickerComponent from '../../components/DatePicker'
 import { useSearchParams } from 'react-router-dom'
 import moment from 'moment-jalaali'
 import { CompanyItemType } from '../company/types/CompanyTypes'
+import Pagination from '../../components/Pagination'
 
-type ActiveTabType = "PENDING" | "WAIT_PAYMENT" | "PAID" | "CANCELLED" | "EXPIRED" | ""
 
 const ReceiptsList: FC = () => {
 
     const { t } = useTranslation('global')
+    const [page, setPage] = useState<number>(1)
     const [searchParams] = useSearchParams()
-    const [activeTab, setActiveTab] = useState<ActiveTabType>('PENDING')
+    const [activeTab, setActiveTab] = useState<InvoiceStatus>('PENDING')
     const [customerId, setCustomerId] = useState<string>('')
     const [search, setSearch] = useState<string>('')
     const [date, setDate] = useState<string>('')
@@ -31,7 +32,7 @@ const ReceiptsList: FC = () => {
         const urlCustomerId = searchParams.get('user')
         if (urlCustomerId) {
             setCustomerId(urlCustomerId)
-            setActiveTab('')
+            setActiveTab('PENDING')
         }
     }, [searchParams])
 
@@ -102,17 +103,17 @@ const ReceiptsList: FC = () => {
                             value: 'PAID'
                         },
                         {
-                            icon: <CloseCircle color={activeTab === 'CANCELLED' ? 'black' : '#8C90A3'} size={22} />,
-                            label: t('receip.canceled'),
-                            value: 'CANCELLED'
+                            icon: <FolderOpen color={activeTab === 'ARCHIVED' ? 'black' : '#8C90A3'} size={22} />,
+                            label: t('receip.archive'),
+                            value: 'ARCHIVED'
                         },
                         {
-                            icon: <FolderOpen color={activeTab === 'EXPIRED' ? 'black' : '#8C90A3'} size={22} />,
-                            label: t('receip.archive'),
-                            value: 'EXPIRED'
+                            icon: <WalletMinus color={activeTab === 'OVERDUE' ? 'black' : '#8C90A3'} size={22} />,
+                            label: t('receip.overdue'),
+                            value: 'OVERDUE'
                         },
                     ]}
-                    onChange={(value) => setActiveTab(value as ActiveTabType)}
+                    onChange={(value) => setActiveTab(value as InvoiceStatus)}
                 />
             </div>
 
@@ -131,6 +132,7 @@ const ReceiptsList: FC = () => {
                                     <Td text={t('receip.date_receipt')} />
                                     <Td text={t('receip.last_date_receipt')} />
                                     <Td text={t('receip.total')} />
+                                    <Td text={t('receip.lateFee')} />
                                     <Td text={t('receip.service')} />
                                     <Td text={t('receip.status')} />
                                     <Td text={t('receip.status_paid')} />
@@ -149,7 +151,8 @@ const ReceiptsList: FC = () => {
                                                 <Td text={moment(item.createdAt).format('jYYYY/jMM/jDD')} />
                                                 <Td text={moment(item.dueDate).format('jYYYY/jMM/jDD')} />
                                                 <Td text={NumberFormat(item.totalPrice)} />
-                                                <Td text={t('receip.service')} />
+                                                <Td text={NumberFormat(item.lateFee)} />
+                                                <Td text={item.items[0]?.name} />
                                                 <Td text={item.status === 'APPROVED' || item.status === 'PAID' ? t('receip.approved') : t('receip.pending')} />
                                                 <Td text={t(`receip.${item.status}`)} />
                                                 <Td text=''>
@@ -166,6 +169,12 @@ const ReceiptsList: FC = () => {
 
                             </tbody>
                         </table>
+
+                        <Pagination
+                            totalPages={getInvoices.data?.data?.pager?.totalPages}
+                            currentPage={page}
+                            onPageChange={setPage}
+                        />
                     </div>
             }
         </div>
diff --git a/src/pages/receipts/types/ReceiptTypes.ts b/src/pages/receipts/types/ReceiptTypes.ts
index 4cb08a5..16acacf 100644
--- a/src/pages/receipts/types/ReceiptTypes.ts
+++ b/src/pages/receipts/types/ReceiptTypes.ts
@@ -24,6 +24,7 @@ export type ReceiptItemType = {
   totalPrice: number;
   subscriptionPlan?: string | null;
   items: ReceiptItemType[];
+  lateFee: number;
   company: {
     name: string;
   };
@@ -42,3 +43,10 @@ export type InvoiceUserItemType = {
   email: string;
   phone: string;
 };
+
+export type InvoiceStatus =
+  | "PENDING"
+  | "WAIT_PAYMENT"
+  | "PAID"
+  | "ARCHIVED"
+  | "OVERDUE";