diff --git a/client/src/containers/Accounting/JournalsLanding/ManualJournalsDataTable.js b/client/src/containers/Accounting/JournalsLanding/ManualJournalsDataTable.js
index f40ff74d8..645e3fcce 100644
--- a/client/src/containers/Accounting/JournalsLanding/ManualJournalsDataTable.js
+++ b/client/src/containers/Accounting/JournalsLanding/ManualJournalsDataTable.js
@@ -67,10 +67,9 @@ function ManualJournalsDataTable({
   };
 
   // Handle view detail journal.
-  const handleViewDetailJournal = ({ id, journal_number }) => {
+  const handleViewDetailJournal = ({ id }) => {
     openDrawer('journal-drawer', {
       manualJournalId: id,
-      title: `Manual Journal ${journal_number}`,
     });
   };
 
diff --git a/client/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerProvider.js b/client/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerProvider.js
index 905b5c4d0..ebbf206cd 100644
--- a/client/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerProvider.js
+++ b/client/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerProvider.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { useJournal } from 'hooks/query';
-import { DashboardInsider } from 'components';
+import { DashboardInsider, DrawerHeaderContent } from 'components';
+
 const ManualJournalDrawerContext = React.createContext();
 
 /**
@@ -22,6 +23,10 @@ function ManualJournalDrawerProvider({ manualJournalId, ...props }) {
 
   return (
     <DashboardInsider loading={isJournalLoading}>
+      <DrawerHeaderContent
+        name={'journal-drawer'}
+        title={`Manual Journal ${manualJournal?.journal_number}`}
+      />
       <ManualJournalDrawerContext.Provider value={provider} {...props} />
     </DashboardInsider>
   );
diff --git a/client/src/containers/Drawers/ManualJournalDrawer/index.js b/client/src/containers/Drawers/ManualJournalDrawer/index.js
index 27397d9c9..817011f70 100644
--- a/client/src/containers/Drawers/ManualJournalDrawer/index.js
+++ b/client/src/containers/Drawers/ManualJournalDrawer/index.js
@@ -1,7 +1,6 @@
 import React, { lazy } from 'react';
 import { Drawer, DrawerSuspense } from 'components';
 import withDrawers from 'containers/Drawer/withDrawers';
-import withDrawerActions from 'containers/Drawer/withDrawerActions';
 
 import { compose } from 'utils';
 
@@ -17,16 +16,10 @@ function ManualJournalDrawer({
 
   //#withDrawer
   isOpen,
-  payload: { manualJournalId, title },
-
-  closeDrawer,
+  payload: { manualJournalId },
 }) {
-  // Handle close drawer.
-  const handleDrawerClose = () => {
-    closeDrawer(name);
-  };
   return (
-    <Drawer isOpen={isOpen} title={title} isClose={handleDrawerClose}>
+    <Drawer isOpen={isOpen} name={name}>
       <DrawerSuspense>
         <ManualJournalDrawerContent manualJournalId={manualJournalId} />
       </DrawerSuspense>
@@ -34,4 +27,4 @@ function ManualJournalDrawer({
   );
 }
 
-export default compose(withDrawers(), withDrawerActions)(ManualJournalDrawer);
+export default compose(withDrawers())(ManualJournalDrawer);