chore: Refactoring all import directories to alias and all .js|.jsx renamed to be .ts|.tsx

src/containers/Drawers/BillDrawer/BillDetailFooter.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import {
+  CommercialDocFooter,
+  T,
+  If,
+  DetailsMenu,
+  DetailItem,
+} from '@/components';
+
+import { useBillDrawerContext } from './BillDrawerProvider';
+
+/**
+ * Bill detail footer.
+ * @returns {React.JSX}
+ */
+export default function BillDetailFooter() {
+  const { bill } = useBillDrawerContext();
+  return (
+    <CommercialDocFooter>
+      <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
+        <If condition={bill.note}>
+          <DetailItem label={<T id={'note'} />}>{bill.note}</DetailItem>
+        </If>
+      </DetailsMenu>
+    </CommercialDocFooter>
+  );
+}