1 files changed, 26 insertions, 31 deletions
diff --git a/packages/demobank-ui/src/components/Cashouts/views.tsx b/packages/demobank-ui/src/components/Cashouts/views.tsx
index 651a7a034..59bb4a16b 100644
--- a/packages/demobank-ui/src/components/Cashouts/views.tsx
+++ b/packages/demobank-ui/src/components/Cashouts/views.tsx
@@ -93,7 +93,7 @@ export function ReadyView({ cashouts, onSelected }: State.Ready): VNode {
             {Object.entries(txByDate).map(([date, txs], idx) => {
               return <Fragment key={idx}>
                 <tr class="border-t border-gray-200">
-                  <th colSpan={4} scope="colgroup" class="bg-gray-50 py-2 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-3">
+                  <th colSpan={6} scope="colgroup" class="bg-gray-50 py-2 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-3">
                     {date}
                   </th>
                 </tr>
@@ -102,9 +102,12 @@ export function ReadyView({ cashouts, onSelected }: State.Ready): VNode {
                   const confirmationTime = item.confirmation_time
                     ? item.confirmation_time.t_s === "never" ? i18n.str`never` : format(item.confirmation_time.t_s, "dd/MM/yyyy HH:mm:ss")
                     : "-"
-                  return (<tr key={idx} class="border-b border-gray-200 last:border-none">
+                  return (<tr key={idx} class="border-b border-gray-200 hover:bg-gray-200 last:border-none">
 
-                    <td class="relative py-2 pl-2 pr-2 text-sm ">
+                    <td onClick={(e) => {
+                        e.preventDefault();
+                        onSelected(item.id);
+                      }} class="relative py-2 pl-2 pr-2 text-sm ">
                       <div class="font-medium text-gray-900">{creationTime}</div>
                       {/* <dl class="font-normal sm:hidden">
                         <dt class="sr-only sm:hidden"><i18n.Translate>Amount</i18n.Translate></dt>
@@ -128,18 +131,28 @@ export function ReadyView({ cashouts, onSelected }: State.Ready): VNode {
                         </dd>
                       </dl> */}
                     </td>
-                    <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500">{confirmationTime}</td>
-                    <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-red-600"><RenderAmount value={Amounts.parseOrThrow(item.amount_debit)}  spec={resp.body.regional_currency_specification} /></td>
-                    <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-green-600"><RenderAmount value={Amounts.parseOrThrow(item.amount_credit)} spec={resp.body.fiat_currency_specification} /></td>
+                    <td onClick={(e) => {
+                        e.preventDefault();
+                        onSelected(item.id);
+                      }}class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500 cursor-pointer">{confirmationTime}</td>
+                    <td onClick={(e) => {
+                        e.preventDefault();
+                        onSelected(item.id);
+                      }}class="hidden sm:table-cell px-3 py-3.5 text-sm text-red-600 cursor-pointer"><RenderAmount value={Amounts.parseOrThrow(item.amount_debit)} spec={resp.body.regional_currency_specification} /></td>
+                    <td onClick={(e) => {
+                        e.preventDefault();
+                        onSelected(item.id);
+                      }}class="hidden sm:table-cell px-3 py-3.5 text-sm text-green-600 cursor-pointer"><RenderAmount value={Amounts.parseOrThrow(item.amount_credit)} spec={resp.body.fiat_currency_specification} /></td>
 
-                    <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500">{item.status}</td>
-                    <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500 break-all min-w-md">
-                      <a href="#" onClick={(e) => {
+                    <td  onClick={(e) => {
                         e.preventDefault();
                         onSelected(item.id);
-                      }}>
-                        {item.subject}
-                      </a>
+                      }}class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500 cursor-pointer">{item.status}</td>
+                    <td onClick={(e) => {
+                        e.preventDefault();
+                        onSelected(item.id);
+                      }} class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500 break-all min-w-md">
+                      {item.subject}
                     </td>
                   </tr>)
                 })}
@@ -150,27 +163,9 @@ export function ReadyView({ cashouts, onSelected }: State.Ready): VNode {
 
         </table>
 
-        {/* <nav class="flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6 rounded-lg" aria-label="Pagination">
-          <div class="flex flex-1 justify-between sm:justify-end">
-            <button
-              class="relative disabled:bg-gray-100 disabled:text-gray-500 inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus-visible:outline-offset-0"
-              disabled={!onPrev}
-              onClick={onPrev}
-            >
-              <i18n.Translate>First page</i18n.Translate>
-            </button>
-            <button
-              class="relative disabled:bg-gray-100 disabled:text-gray-500 ml-3 inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus-visible:outline-offset-0"
-              disabled={!onNext}
-              onClick={onNext}
-            >
-              <i18n.Translate>Next</i18n.Translate>
-            </button>
-          </div>
-        </nav> */}
+
       </div>
     </div>
   );
-  // }
 
 }