From 4adff5ad5cefa004037416a1bba1ce8eabec50ed Mon Sep 17 00:00:00 2001
From: Alexander Belokon <ikatamarinaki@gmail.com>
Date: Tue, 2 Apr 2024 00:26:16 +0200
Subject: [PATCH] fix: stonks related issues found by qa

---
 .../stonks/ui/StonksGrid/StonksGridStyle.ts    |  5 +++++
 .../StonksOrderProgressSafe.tsx                |  5 ++---
 .../StonksOrderResolverForm.tsx                | 18 +++++++++++++++++-
 pages/stonks/orders/[orderAddress].tsx         |  2 +-
 4 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/modules/stonks/ui/StonksGrid/StonksGridStyle.ts b/modules/stonks/ui/StonksGrid/StonksGridStyle.ts
index 3c2e9c56..bd197cf5 100644
--- a/modules/stonks/ui/StonksGrid/StonksGridStyle.ts
+++ b/modules/stonks/ui/StonksGrid/StonksGridStyle.ts
@@ -1,3 +1,4 @@
+import { BREAKPOINT_MOBILE } from 'modules/globalStyles'
 import { Text } from 'modules/shared/ui/Common/Text'
 import styled from 'styled-components'
 
@@ -5,6 +6,10 @@ export const Grid = styled.div`
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   gap: 24px;
+
+  @media (max-width: ${BREAKPOINT_MOBILE}) {
+    grid-template-columns: 1fr;
+  }
 `
 
 export const Card = styled.div`
diff --git a/modules/stonks/ui/StonksOrderProgress/StonksOrderProgressSafe.tsx b/modules/stonks/ui/StonksOrderProgress/StonksOrderProgressSafe.tsx
index 63fd1b50..5f59f5bf 100644
--- a/modules/stonks/ui/StonksOrderProgress/StonksOrderProgressSafe.tsx
+++ b/modules/stonks/ui/StonksOrderProgress/StonksOrderProgressSafe.tsx
@@ -27,9 +27,8 @@ export function StonksOrderProgressSafe({ safeTxHash }: Props) {
       </MessageBox>
       <MessageBox>
         <Text size={14} weight={500}>
-          Once the transaction is signed and transaction has is obtained, you
-          can proceed with the order. Click the button below to open up the
-          order form.
+          Once the transaction has been signed and executed, return to the
+          Stonks page and enter the tx hash to continue order creation.
         </Text>
         <Button size="sm" onClick={() => router.push(stonks)}>
           Back to Stonks
diff --git a/modules/stonks/ui/StonksOrderResolverForm/StonksOrderResolverForm.tsx b/modules/stonks/ui/StonksOrderResolverForm/StonksOrderResolverForm.tsx
index 8b81c911..93842958 100644
--- a/modules/stonks/ui/StonksOrderResolverForm/StonksOrderResolverForm.tsx
+++ b/modules/stonks/ui/StonksOrderResolverForm/StonksOrderResolverForm.tsx
@@ -10,6 +10,7 @@ import { getOrderByPlaceTxReceipt } from 'modules/stonks/utils/getOrderByPlaceTx
 import { Fieldset } from './StonksOrderResolverFormStyle'
 import { Form } from 'modules/shared/ui/Controls/Form'
 import { InputControl } from 'modules/shared/ui/Controls/Input'
+import { validateAddress } from 'modules/motions/utils/validateAddress'
 
 type FormData = {
   txHashOrAddress: string
@@ -71,8 +72,23 @@ export function StonksOrderResolverForm() {
           fullwidth
           name="txHashOrAddress"
           placeholder="Order creation tx hash or order address"
+          rules={{
+            required: 'Field is required',
+            validate: value => {
+              const addressErr = validateAddress(value)
+              const isValidTxHash = /^0x[a-fA-F0-9]{64}$/.test(value)
+              if (addressErr && !isValidTxHash) {
+                return 'Invalid tx hash or address'
+              }
+            },
+          }}
         />
-        <Button fullwidth type="submit" loading={isSubmitting}>
+        <Button
+          fullwidth
+          type="submit"
+          loading={isSubmitting}
+          disabled={!formMethods.formState.isValid}
+        >
           Go to order
         </Button>
       </Fieldset>
diff --git a/pages/stonks/orders/[orderAddress].tsx b/pages/stonks/orders/[orderAddress].tsx
index ab1957da..6878d597 100644
--- a/pages/stonks/orders/[orderAddress].tsx
+++ b/pages/stonks/orders/[orderAddress].tsx
@@ -49,7 +49,7 @@ export default function StonksOrderDetailsPage() {
       <StonksOrderCard
         order={order}
         isDataValidating={isValidating}
-        onInvalidate={mutate}
+        onInvalidate={() => mutate(undefined, { revalidate: true })}
       />
     </ContentContainer>
   )