From 35e7469a13ca10a8bc570b9b0f0d16e4dc584e5f Mon Sep 17 00:00:00 2001
From: Albert Folch <albertfolch@redeemeum.com>
Date: Fri, 13 Oct 2023 10:49:27 +0200
Subject: [PATCH 1/4] wip

---
 .../EscalateModal/steps/EscalateStepTwo.tsx   |  6 +-
 src/lib/utils/dispute.ts                      | 18 ++++++
 src/lib/utils/exchange.ts                     |  8 +--
 src/lib/utils/getDateTimestamp.ts             |  2 +-
 .../chat/components/ExchangeSidePreview.tsx   | 55 +++++++++++--------
 5 files changed, 59 insertions(+), 30 deletions(-)
 create mode 100644 src/lib/utils/dispute.ts

diff --git a/src/components/modal/components/Chat/components/EscalateModal/steps/EscalateStepTwo.tsx b/src/components/modal/components/Chat/components/EscalateModal/steps/EscalateStepTwo.tsx
index 8359162ef..8fa1b2815 100644
--- a/src/components/modal/components/Chat/components/EscalateModal/steps/EscalateStepTwo.tsx
+++ b/src/components/modal/components/Chat/components/EscalateModal/steps/EscalateStepTwo.tsx
@@ -511,9 +511,9 @@ function EscalateStepTwo({
                         values?.disputeId || "",
                       [FormModel.formFields.buyerAddress.name]:
                         values?.buyerAddress ? values?.buyerAddress : "",
-                      [`Unsigned message: ${FormModel.formFields.message.name}`]:
+                      [`Signed message: ${FormModel.formFields.message.name}`]:
                         values?.message
-                          ? `Unsigned message: ${values?.message}`
+                          ? `Signed message: ${values?.message}`
                           : "",
                       [FormModel.formFields.signature.name]:
                         values?.signature || ""
@@ -524,7 +524,7 @@ function EscalateStepTwo({
                     <Input {...FormModel.formFields.buyerAddress} disabled />
                     <UnsignedMessageWrapper>
                       <FieldInput
-                        value="Unsigned message:"
+                        value="Signed message:"
                         disabled
                         id="unsigned_prefix"
                       />
diff --git a/src/lib/utils/dispute.ts b/src/lib/utils/dispute.ts
new file mode 100644
index 000000000..30647e214
--- /dev/null
+++ b/src/lib/utils/dispute.ts
@@ -0,0 +1,18 @@
+import { subgraph } from "@bosonprotocol/react-kit";
+
+import { getDateTimestamp } from "./getDateTimestamp";
+
+export const getDisputeDates = (
+  dispute: subgraph.DisputeFieldsFragment | undefined
+) => {
+  const endOfResolutionPeriod = dispute?.timeout
+    ? getDateTimestamp(dispute?.timeout)
+    : undefined;
+  const finishedResolutionPeriod = endOfResolutionPeriod
+    ? Date.now() > endOfResolutionPeriod
+    : false;
+  return {
+    endOfResolutionPeriod,
+    finishedResolutionPeriod
+  };
+};
diff --git a/src/lib/utils/exchange.ts b/src/lib/utils/exchange.ts
index 521d9c826..e33019b86 100644
--- a/src/lib/utils/exchange.ts
+++ b/src/lib/utils/exchange.ts
@@ -39,8 +39,8 @@ export const getHasExchangeDisputeResolutionElapsed = (
     return false;
   }
   return (
-    Number(exchange.redeemedDate) * 1000 +
-      Number(offer.disputePeriodDuration) * 1000 <
+    getDateTimestamp(exchange.redeemedDate) +
+      getDateTimestamp(offer.disputePeriodDuration) <
     Date.now()
   );
 };
@@ -69,10 +69,10 @@ export const getExchangeTokenId = (
 };
 
 export const getExchangeDisputeDates = (exchange: Exchange) => {
-  const raisedDisputeAt = new Date(Number(exchange.disputedDate) * 1000);
+  const raisedDisputeAt = new Date(getDateTimestamp(exchange.disputedDate));
   const lastDayToResolveDispute = new Date(
     raisedDisputeAt.getTime() +
-      Number(exchange.offer.resolutionPeriodDuration) * 1000
+      getDateTimestamp(exchange.offer.resolutionPeriodDuration)
   );
   const totalDaysToResolveDispute = dayjs(lastDayToResolveDispute).diff(
     raisedDisputeAt,
diff --git a/src/lib/utils/getDateTimestamp.ts b/src/lib/utils/getDateTimestamp.ts
index 3f2c2db65..4b934f4e2 100644
--- a/src/lib/utils/getDateTimestamp.ts
+++ b/src/lib/utils/getDateTimestamp.ts
@@ -1,4 +1,4 @@
-export const getDateTimestamp = (date: string) => {
+export const getDateTimestamp = (date: string | undefined | null) => {
   const number = Number(date);
 
   return !isNaN(number) ? number * 1000 : 0;
diff --git a/src/pages/chat/components/ExchangeSidePreview.tsx b/src/pages/chat/components/ExchangeSidePreview.tsx
index 58178aa72..58a4ce437 100644
--- a/src/pages/chat/components/ExchangeSidePreview.tsx
+++ b/src/pages/chat/components/ExchangeSidePreview.tsx
@@ -7,6 +7,7 @@ import {
   buyerAndSellerAgreementIncluding,
   customisedExchangePolicy
 } from "lib/constants/policies";
+import { getDisputeDates } from "lib/utils/dispute";
 import { getExchangePolicyName } from "lib/utils/policy/getExchangePolicyName";
 import { ArrowSquareOut } from "phosphor-react";
 import {
@@ -437,7 +438,15 @@ export default function ExchangeSidePreview({
   const isEscalated = !!dispute?.escalatedDate;
   const isRetracted = !!dispute?.retractedDate;
   const isFinalized = !!dispute?.finalizedDate;
-
+  const { finishedResolutionPeriod } = getDisputeDates(dispute);
+  console.log({
+    exchange,
+    dispute,
+    finishedResolutionPeriod,
+    isInDispute,
+    iAmTheBuyer,
+    isEscalated
+  });
   const { totalDaysToResolveDispute, daysLeftToResolveDispute } =
     getExchangeDisputeDates(exchange);
 
@@ -520,7 +529,7 @@ export default function ExchangeSidePreview({
       <Section>
         <DetailTable align noBorder data={OFFER_DETAIL_DATA ?? ({} as never)} />
       </Section>
-      {isInDispute && iAmTheBuyer && !isEscalated && !isRetracted ? (
+      {isInDispute && iAmTheBuyer && !isRetracted ? (
         <CTASection>
           <Button
             theme="secondary"
@@ -548,26 +557,28 @@ export default function ExchangeSidePreview({
           >
             Retract
           </Button>
-          <Button
-            theme="secondary"
-            onClick={() =>
-              showModal(
-                "ESCALATE_MODAL",
-                {
-                  title: "Escalate",
-                  exchange: exchange,
-                  refetch: refetchItAll,
-                  addMessage,
-                  setHasError,
-                  onSentMessage,
-                  destinationAddress
-                },
-                "l"
-              )
-            }
-          >
-            Escalate
-          </Button>
+          {!finishedResolutionPeriod && !isEscalated && (
+            <Button
+              theme="secondary"
+              onClick={() =>
+                showModal(
+                  "ESCALATE_MODAL",
+                  {
+                    title: "Escalate",
+                    exchange: exchange,
+                    refetch: refetchItAll,
+                    addMessage,
+                    setHasError,
+                    onSentMessage,
+                    destinationAddress
+                  },
+                  "l"
+                )
+              }
+            >
+              Escalate
+            </Button>
+          )}
           <CompleteExchangeButton />
         </CTASection>
       ) : isInRedeemed && iAmTheBuyer ? (

From 5b07eed0136c706d3d1de7060b3bfbf865f4732e Mon Sep 17 00:00:00 2001
From: Albert Folch <albertfolch@redeemeum.com>
Date: Fri, 13 Oct 2023 13:16:32 +0200
Subject: [PATCH 2/4] refactor: remove logs

---
 src/pages/chat/components/ExchangeSidePreview.tsx | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

diff --git a/src/pages/chat/components/ExchangeSidePreview.tsx b/src/pages/chat/components/ExchangeSidePreview.tsx
index 58a4ce437..4e2a296b6 100644
--- a/src/pages/chat/components/ExchangeSidePreview.tsx
+++ b/src/pages/chat/components/ExchangeSidePreview.tsx
@@ -439,14 +439,7 @@ export default function ExchangeSidePreview({
   const isRetracted = !!dispute?.retractedDate;
   const isFinalized = !!dispute?.finalizedDate;
   const { finishedResolutionPeriod } = getDisputeDates(dispute);
-  console.log({
-    exchange,
-    dispute,
-    finishedResolutionPeriod,
-    isInDispute,
-    iAmTheBuyer,
-    isEscalated
-  });
+
   const { totalDaysToResolveDispute, daysLeftToResolveDispute } =
     getExchangeDisputeDates(exchange);
 

From 9f041ddf01a0ff26ec26990196ab75e6a12e227c Mon Sep 17 00:00:00 2001
From: Albert Folch <albertfolch@redeemeum.com>
Date: Fri, 13 Oct 2023 16:15:52 +0200
Subject: [PATCH 3/4] rollback condition

---
 src/pages/chat/components/ExchangeSidePreview.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/chat/components/ExchangeSidePreview.tsx b/src/pages/chat/components/ExchangeSidePreview.tsx
index 4e2a296b6..0eeca3f38 100644
--- a/src/pages/chat/components/ExchangeSidePreview.tsx
+++ b/src/pages/chat/components/ExchangeSidePreview.tsx
@@ -522,7 +522,7 @@ export default function ExchangeSidePreview({
       <Section>
         <DetailTable align noBorder data={OFFER_DETAIL_DATA ?? ({} as never)} />
       </Section>
-      {isInDispute && iAmTheBuyer && !isRetracted ? (
+      {isInDispute && iAmTheBuyer && !isEscalated && !isRetracted ? (
         <CTASection>
           <Button
             theme="secondary"

From 4cb7d0ea2fd6f49af199fe8290837c5348a762a1 Mon Sep 17 00:00:00 2001
From: Albert Folch <albertfolch@redeemeum.com>
Date: Fri, 13 Oct 2023 17:24:30 +0200
Subject: [PATCH 4/4] fix: retract

---
 src/lib/utils/exchange.ts                        | 16 ++++++++++++++++
 src/lib/utils/getDateTimestamp.ts                |  2 +-
 src/lib/utils/hooks/useDisputeResolver.ts        |  5 ++++-
 .../chat/components/ExchangeSidePreview.tsx      | 12 +++++++++++-
 4 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/src/lib/utils/exchange.ts b/src/lib/utils/exchange.ts
index e33019b86..89b3c7d51 100644
--- a/src/lib/utils/exchange.ts
+++ b/src/lib/utils/exchange.ts
@@ -45,6 +45,22 @@ export const getHasExchangeDisputeResolutionElapsed = (
   );
 };
 
+export const getHasExchangeEscalationPeriodElapsed = (
+  escalationResponsePeriod: string | undefined | null,
+  escalatedDate: string | undefined | null
+): boolean => {
+  if (!escalationResponsePeriod || !escalatedDate) {
+    return false;
+  }
+  const fixedEscalatedDate = getDateTimestamp(escalatedDate);
+  const escalationPeriodSecondsNumber = Number(escalationResponsePeriod);
+  if (!fixedEscalatedDate || isNaN(escalationPeriodSecondsNumber)) {
+    return false;
+  }
+  const escalationPeriodInMs = escalationPeriodSecondsNumber * 1000;
+  return fixedEscalatedDate + escalationPeriodInMs < Date.now();
+};
+
 const PROTOCOL_DEPLOYMENT_TIMES = {
   v221: {
     local: 0,
diff --git a/src/lib/utils/getDateTimestamp.ts b/src/lib/utils/getDateTimestamp.ts
index 4b934f4e2..f64587144 100644
--- a/src/lib/utils/getDateTimestamp.ts
+++ b/src/lib/utils/getDateTimestamp.ts
@@ -1,4 +1,4 @@
-export const getDateTimestamp = (date: string | undefined | null) => {
+export const getDateTimestamp = (date: string | undefined | null): number => {
   const number = Number(date);
 
   return !isNaN(number) ? number * 1000 : 0;
diff --git a/src/lib/utils/hooks/useDisputeResolver.ts b/src/lib/utils/hooks/useDisputeResolver.ts
index 083190a56..0931c5e63 100644
--- a/src/lib/utils/hooks/useDisputeResolver.ts
+++ b/src/lib/utils/hooks/useDisputeResolver.ts
@@ -28,12 +28,15 @@ interface Props {
   };
 }
 
-export function useDisputeResolver(id: string) {
+export function useDisputeResolver(id: string | undefined | null) {
   const { config } = useConfigContext();
   const { subgraphUrl } = config.envConfig;
   const props = { id };
 
   const result = useQuery(["disputeResolver", props, subgraphUrl], async () => {
+    if (!id) {
+      return;
+    }
     const result = await fetchSubgraph<Props>(
       subgraphUrl,
       gql`
diff --git a/src/pages/chat/components/ExchangeSidePreview.tsx b/src/pages/chat/components/ExchangeSidePreview.tsx
index 0eeca3f38..12dcb31e9 100644
--- a/src/pages/chat/components/ExchangeSidePreview.tsx
+++ b/src/pages/chat/components/ExchangeSidePreview.tsx
@@ -8,6 +8,7 @@ import {
   customisedExchangePolicy
 } from "lib/constants/policies";
 import { getDisputeDates } from "lib/utils/dispute";
+import { useDisputeResolver } from "lib/utils/hooks/useDisputeResolver";
 import { getExchangePolicyName } from "lib/utils/policy/getExchangePolicyName";
 import { ArrowSquareOut } from "phosphor-react";
 import {
@@ -44,6 +45,7 @@ import { calcPercentage } from "../../../lib/utils/calcPrice";
 import {
   getExchangeDisputeDates,
   getHasExchangeDisputeResolutionElapsed,
+  getHasExchangeEscalationPeriodElapsed,
   isExchangeCompletableByBuyer,
   isExchangeCompletableBySeller
 } from "../../../lib/utils/exchange";
@@ -377,7 +379,15 @@ export default function ExchangeSidePreview({
     },
     { enabled: !!exchange }
   );
+  const { disputeResolver } = useDisputeResolver(
+    exchange?.offer.disputeResolverId
+  );
+
   const dispute = disputes?.[0];
+  const isElapsedEscalation = getHasExchangeEscalationPeriodElapsed(
+    disputeResolver?.escalationResponsePeriod,
+    dispute?.escalatedDate
+  );
   const offer = exchange?.offer;
   const { showModal, modalTypes } = useModal();
   const OFFER_DETAIL_DATA = useMemo(
@@ -522,7 +532,7 @@ export default function ExchangeSidePreview({
       <Section>
         <DetailTable align noBorder data={OFFER_DETAIL_DATA ?? ({} as never)} />
       </Section>
-      {isInDispute && iAmTheBuyer && !isEscalated && !isRetracted ? (
+      {isInDispute && iAmTheBuyer && !isRetracted && !isElapsedEscalation ? (
         <CTASection>
           <Button
             theme="secondary"