diff --git a/frontend/src/components/SelectTag/index.jsx b/frontend/src/components/SelectTag/index.jsx
index d58b1d168..e983a18e8 100644
--- a/frontend/src/components/SelectTag/index.jsx
+++ b/frontend/src/components/SelectTag/index.jsx
@@ -1,6 +1,5 @@
 import { Select, Tag } from 'antd';
 import { generate as uniqueId } from 'shortid';
-import { tagColor } from '@/utils/statusTagColor';
 
 export default function SelectTag({ options, defaultValue }) {
   return (
@@ -11,19 +10,16 @@ export default function SelectTag({ options, defaultValue }) {
       }}
     >
       {options?.map((value) => {
-        const option = tagColor(value);
         if (option)
           return (
             <Select.Option key={`${uniqueId()}`} value={option.value}>
-              <Tag bordered={false} color={option.color}>
-                {translate(option.label)}
-              </Tag>
+              {translate(option.label)}
             </Select.Option>
           );
         else
           return (
             <Select.Option key={`${uniqueId()}`} value={value}>
-              <Tag bordered={false}>{value}</Tag>
+              {value}
             </Select.Option>
           );
       })}
diff --git a/frontend/src/modules/InvoiceModule/RecordPaymentModule/components/Payment.jsx b/frontend/src/modules/InvoiceModule/RecordPaymentModule/components/Payment.jsx
index 5fd187c8a..90ba819a5 100644
--- a/frontend/src/modules/InvoiceModule/RecordPaymentModule/components/Payment.jsx
+++ b/frontend/src/modules/InvoiceModule/RecordPaymentModule/components/Payment.jsx
@@ -10,7 +10,7 @@ import { useMoney } from '@/settings';
 
 import RecordPayment from './RecordPayment';
 import useLanguage from '@/locale/useLanguage';
-import { tagColor } from '@/utils/statusTagColor';
+
 import { useNavigate } from 'react-router-dom';
 
 export default function Payment({ config, currentItem }) {
@@ -57,11 +57,7 @@ export default function Payment({ config, currentItem }) {
               currentErp.year || ''
             }`}
             ghost={false}
-            tags={
-              <Tag color={tagColor(currentErp.paymentStatus)?.color}>
-                {currentErp.paymentStatus && translate(currentErp.paymentStatus)}
-              </Tag>
-            }
+            tags={<span>{currentErp.paymentStatus && translate(currentErp.paymentStatus)}</span>}
             // subTitle="This is cuurent erp page"
             extra={[
               <Button
@@ -102,9 +98,7 @@ export default function Payment({ config, currentItem }) {
             <Descriptions.Item label={translate('phone')}>{client.phone}</Descriptions.Item>
             <Divider dashed />
             <Descriptions.Item label={translate('payment status')}>
-              <Tag color={tagColor(currentErp.paymentStatus)?.color}>
-                {currentErp.paymentStatus && translate(currentErp.paymentStatus)}
-              </Tag>
+              <span>{currentErp.paymentStatus && translate(currentErp.paymentStatus)}</span>
             </Descriptions.Item>
             <Descriptions.Item label={translate('sub total')}>
               {money.moneyFormatter({
diff --git a/frontend/src/modules/PaymentModule/ReadPaymentModule/components/ReadItem.jsx b/frontend/src/modules/PaymentModule/ReadPaymentModule/components/ReadItem.jsx
index f35b838e9..0af86f18f 100644
--- a/frontend/src/modules/PaymentModule/ReadPaymentModule/components/ReadItem.jsx
+++ b/frontend/src/modules/PaymentModule/ReadPaymentModule/components/ReadItem.jsx
@@ -20,7 +20,7 @@ import { selectCurrentItem } from '@/redux/erp/selectors';
 
 import { DOWNLOAD_BASE_URL } from '@/config/serverApiConfig';
 import { useMoney } from '@/settings';
-import { tagColor } from '@/utils/statusTagColor';
+
 import useMail from '@/hooks/useMail';
 import { useNavigate } from 'react-router-dom';
 
@@ -78,9 +78,7 @@ export default function ReadItem({ config, selectedItem }) {
         }}
         title={`${ENTITY_NAME} # ${currentErp.number}/${currentErp.year || ''}`}
         ghost={false}
-        tags={
-          <Tag color={tagColor(currentErp.paymentStatus)?.color}>{currentErp.paymentStatus}</Tag>
-        }
+        tags={<span>{currentErp.paymentStatus}</span>}
         extra={[
           <Button
             key={`${uniqueId()}`}
diff --git a/frontend/src/modules/PaymentModule/UpdatePaymentModule/components/Payment.jsx b/frontend/src/modules/PaymentModule/UpdatePaymentModule/components/Payment.jsx
index 8e750ff54..c8f547d86 100644
--- a/frontend/src/modules/PaymentModule/UpdatePaymentModule/components/Payment.jsx
+++ b/frontend/src/modules/PaymentModule/UpdatePaymentModule/components/Payment.jsx
@@ -50,11 +50,7 @@ export default function Payment({ config, currentItem }) {
             onBack={() => navigate(`/${entity.toLowerCase()}`)}
             title={`Update  ${ENTITY_NAME} # ${currentErp.number}/${currentErp.year || ''}`}
             ghost={false}
-            tags={
-              <Tag color={tagColor(currentErp.paymentStatus)?.color}>
-                {currentErp.paymentStatus}
-              </Tag>
-            }
+            tags={<span>{currentErp.paymentStatus}</span>}
             // subTitle="This is cuurent erp page"
             extra={[
               <Button
@@ -95,9 +91,7 @@ export default function Payment({ config, currentItem }) {
             <Descriptions.Item label={translate('Phone')}>{client.phone}</Descriptions.Item>
             <Divider dashed />
             <Descriptions.Item label={translate('Payment Status')}>
-              <Tag color={tagColor(currentErp.paymentStatus)?.color}>
-                {currentErp.paymentStatus}
-              </Tag>
+              <span>{currentErp.paymentStatus}</span>
             </Descriptions.Item>
             <Descriptions.Item label={translate('SubTotal')}>
               {money.moneyFormatter({
diff --git a/frontend/src/request/errorHandler.js b/frontend/src/request/errorHandler.js
index 13b60057e..a580a0eca 100644
--- a/frontend/src/request/errorHandler.js
+++ b/frontend/src/request/errorHandler.js
@@ -53,7 +53,7 @@ const errorHandler = (error) => {
     const message = response.data && response.data.message;
 
     const errorText = message || codeMessage[response.status];
-    const { status } = response;
+    const { status, error } = response;
     notification.config({
       duration: 20,
       maxCount: 2,
@@ -62,7 +62,12 @@ const errorHandler = (error) => {
       message: `Request error ${status}`,
       description: errorText,
     });
-    return response.data;
+
+    if (response?.data?.error?.name === 'JsonWebTokenError') {
+      window.localStorage.removeItem('auth');
+      window.localStorage.removeItem('isLogout');
+      window.location.href = '/logout';
+    } else return response.data;
   } else {
     notification.config({
       duration: 15,