feat( S&P ): add branch name to details.

src/containers/Drawers/ReceiptDetailDrawer/ReceiptDetailDrawerProvider.js

@@ -2,6 +2,8 @@ import React from 'react';
 import intl from 'react-intl-universal';
 import { DrawerHeaderContent, DrawerLoading } from 'components';
 import { useReceipt } from 'hooks/query';
+import { Features } from 'common';
+import { useFeatureCan } from 'hooks/state';
 
 // useTransactionsByReference
 const ReceiptDetailDrawerContext = React.createContext();
@@ -10,6 +12,9 @@ const ReceiptDetailDrawerContext = React.createContext();
  * Receipt detail provider.
  */
 function ReceiptDetailDrawerProvider({ receiptId, ...props }) {
+  // Features guard.
+  const { featureCan } = useFeatureCan();
+
   // Fetch sale receipt details.
   const { data: receipt, isFetching: isReceiptLoading } = useReceipt(
     receiptId,
@@ -31,6 +36,13 @@ function ReceiptDetailDrawerProvider({ receiptId, ...props }) {
         title={intl.get('receipt.drawer.title', {
           number: receipt.receipt_number,
         })}
+        subTitle={
+          featureCan(Features.Branches)
+            ? intl.get('receipt.drawer.subtitle', {
+                value: receipt.branch?.name,
+              })
+            : null
+        }
       />
       <ReceiptDetailDrawerContext.Provider value={provider} {...props} />
     </DrawerLoading>