chore: use monorepo organization

packages/admin-ui/src/pages/Customers/CustomersList.jsx

@@ -0,0 +1,87 @@
+import { format } from 'date-fns/fp'
+import * as R from 'ramda'
+import React from 'react'
+import { MainStatus } from 'src/components/Status'
+import DataTable from 'src/components/tables/DataTable'
+import TxInIcon from 'src/styling/icons/direction/cash-in.svg?react'
+import TxOutIcon from 'src/styling/icons/direction/cash-out.svg?react'
+
+import { getFormattedPhone, getName } from './helper'
+
+const CustomersList = ({
+  data,
+  locale,
+  onClick,
+  loading,
+  triggers,
+  customRequests
+}) => {
+  const elements = [
+    {
+      header: 'Phone/email',
+      width: 199,
+      view: it => `${getFormattedPhone(it.phone, locale.country) || ''} 
+      ${it.email || ''}`
+    },
+    {
+      header: 'Name',
+      width: 241,
+      view: getName
+    },
+    {
+      header: 'Total Txs',
+      width: 126,
+      textAlign: 'right',
+      view: it => `${Number.parseInt(it.totalTxs)}`
+    },
+    {
+      header: 'Total spent',
+      width: 152,
+      textAlign: 'right',
+      view: it =>
+        `${Number.parseFloat(it.totalSpent)} ${it.lastTxFiatCode ?? ''}`
+    },
+    {
+      header: 'Last active',
+      width: 133,
+      view: it =>
+        (it.lastActive && format('yyyy-MM-dd', new Date(it.lastActive))) ?? ''
+    },
+    {
+      header: 'Last transaction',
+      width: 161,
+      textAlign: 'right',
+      view: it => {
+        const hasLastTx = !R.isNil(it.lastTxFiatCode)
+        const LastTxIcon = it.lastTxClass === 'cashOut' ? TxOutIcon : TxInIcon
+        const lastIcon = <LastTxIcon className="ml-3" />
+        return (
+          <>
+            {hasLastTx &&
+              `${parseFloat(it.lastTxFiat)} ${it.lastTxFiatCode ?? ''}`}
+            {hasLastTx && lastIcon}
+          </>
+        )
+      }
+    },
+    {
+      header: 'Status',
+      width: 191,
+      view: it => <MainStatus statuses={[it.authorizedStatus]} />
+    }
+  ]
+
+  return (
+    <>
+      <DataTable
+        loading={loading}
+        emptyText="No customers so far"
+        elements={elements}
+        data={data}
+        onClick={onClick}
+      />
+    </>
+  )
+}
+
+export default CustomersList