chrone: sperate client and server to different repos.

src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerHeader.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import { defaultTo } from 'lodash';
+import { DetailsMenu, DetailItem, FormattedMessage as T } from 'components';
+import { useManualJournalDrawerContext } from './ManualJournalDrawerProvider';
+
+/**
+ * Manual journal details header.
+ */
+export default function ManualJournalDrawerHeader() {
+  const {
+    manualJournal: {
+      formatted_amount,
+      journal_type,
+      journal_number,
+      reference,
+      currency_code,
+      description,
+    },
+  } = useManualJournalDrawerContext();
+
+  return (
+    <div className={'journal-drawer__content-header'}>
+      <DetailsMenu>
+        <DetailItem name={'total'} label={<T id={'total'} />}>
+          <h3 class="amount">{formatted_amount}</h3>
+        </DetailItem>
+
+        <DetailItem name={'journal-type'} label={<T id={'journal_type'} />}>
+          {journal_type}
+        </DetailItem>
+
+        <DetailItem name={'journal-number'} label={<T id={'journal_no'} />}>
+          {journal_number}
+        </DetailItem>
+
+        <DetailItem name={'reference-no'} label={<T id={'reference_no'} />}>
+          {defaultTo(reference, '-')}
+        </DetailItem>
+
+        <DetailItem name={'currency'} label={<T id={'currency'} />}>
+          {currency_code}
+        </DetailItem>
+      </DetailsMenu>
+
+      <div class="journal-drawer__content-description">
+        <b class="title">Description</b>: {defaultTo(description, '—')}
+      </div>
+    </div>
+  );
+}