feat: show a message when all orders are being shown

cowprotocol · Dec 18, 2024 · f35937e · f35937e
1 parent 3c1bb00
commit f35937e
Showing 1 changed file with 22 additions and 17 deletions.
diff --git a/apps/explorer/src/components/orders/OrdersUserDetailsTable/index.tsx b/apps/explorer/src/components/orders/OrdersUserDetailsTable/index.tsx
@@ -262,23 +262,28 @@ const OrdersUserDetailsTable: React.FC<Props> = (props) => {
             <FilterRow>
               <td colSpan={8}>
                 <div>
-                  {hiddenOrdersCount > 0 && (
-                    <HiddenOrdersLegend>
-                      <p>
-                        Showing {orders.length - hiddenOrdersCount} out of {orders.length} orders for the current page.
-                      </p>
-                      <p>
-                        {hiddenOrdersCount} orders are hidden, you can make them visible using the filters below
-                        {tableState.hasNextPage ? (
-                          <span>
-                            , or go to&nbsp;<a onClick={handleNextPage}>next page</a>&nbsp;for more orders.
-                          </span>
-                        ) : (
-                          '.'
-                        )}
-                      </p>
-                    </HiddenOrdersLegend>
-                  )}
+                  <HiddenOrdersLegend>
+                    {hiddenOrdersCount > 0 ? (
+                      <>
+                        <p>
+                          Showing {orders.length - hiddenOrdersCount} out of {orders.length} orders for the current
+                          page.
+                        </p>
+                        <p>
+                          {hiddenOrdersCount} orders are hidden, you can make them visible using the filters below
+                          {tableState.hasNextPage ? (
+                            <span>
+                              , or go to&nbsp;<a onClick={handleNextPage}>next page</a>&nbsp;for more orders.
+                            </span>
+                          ) : (
+                            '.'
+                          )}
+                        </p>
+                      </>
+                    ) : (
+                      <p>Showing all {orders.length} orders for the current page.</p>
+                    )}
+                  </HiddenOrdersLegend>
                   <Filters>
                     {canceledAndExpiredCount > 0 && (
                       <ToggleFilter