chrone: sperate client and server to different repos.

src/containers/Drawers/AccountDrawer/AccountDrawerHeader.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { defaultTo } from 'lodash';
+
+import { FormattedMessage as T } from 'components';
+import { Icon, Money, DetailsMenu, DetailItem } from 'components';
+import { useAccountDrawerContext } from './AccountDrawerProvider';
+
+/**
+ *  Account drawer header.
+ */
+export default function AccountDrawerHeader() {
+  const { account } = useAccountDrawerContext();
+  return (
+    <div className={'account-drawer__content-header'}>
+      <DetailsMenu>
+        <DetailItem
+          name={'closing-balance'}
+          label={<T id={'closing_balance'} />}
+        >
+          <h3 class={'big-number'}>{account.formatted_amount}</h3>
+        </DetailItem>
+
+        <DetailItem name={'account-type'} label={<T id={'account_type'} />}>
+          {account.account_type_label}
+        </DetailItem>
+
+        <DetailItem name={'account-normal'} label={<T id={'account_normal'} />}>
+          {account.account_normal}
+          <Icon
+            iconSize={14}
+            icon={`arrow-${
+              account.account_normal === 'credit' ? 'down' : 'up'
+            }`}
+          />
+        </DetailItem>
+
+        <DetailItem name={'code'} label={<T id={'code'} />}>
+          {account.code}
+        </DetailItem>
+
+        <DetailItem name={'currency'} label={<T id={'currency'} />}>
+          {account.currency_code}
+        </DetailItem>
+      </DetailsMenu>
+
+      <DetailsMenu direction={'horizantal'}>
+        <DetailItem name={'description'} label={<T id={'description'} />}>
+          {defaultTo(account.description, '--')}
+        </DetailItem>
+      </DetailsMenu>
+    </div>
+  );
+}