From f60a1b74862593ded54742d7b12e1a479889e28e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= <agustin.longoni@altoros.com>
Date: Tue, 23 Nov 2021 15:42:16 -0300
Subject: [PATCH 1/3] remove inline-block

---
 src/components/orders/StatusLabel/index.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/orders/StatusLabel/index.tsx b/src/components/orders/StatusLabel/index.tsx
index d619a3fd5..7cf091cca 100644
--- a/src/components/orders/StatusLabel/index.tsx
+++ b/src/components/orders/StatusLabel/index.tsx
@@ -66,7 +66,6 @@ const Label = styled.div<DisplayProps & ShimmingProps>`
   ${({ shimming }): FlattenSimpleInterpolation | null =>
     shimming
       ? css`
-          display: inline-block;
           -webkit-mask: linear-gradient(-60deg, #000 30%, #0005, #000 70%) right/300% 100%;
           mask: linear-gradient(-60deg, #000 30%, #0005, #000 70%) right/300% 100%;
           background-repeat: no-repeat;

From 0c2920ba28becc55d6a5f5f9db22a9f40381615a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= <agustin.longoni@altoros.com>
Date: Wed, 24 Nov 2021 11:06:37 -0300
Subject: [PATCH 2/3] add Cancelling status to the stories

---
 src/api/operator/types.ts                              | 10 ++++++++--
 .../orders/StatusLabel/StatusLabel.stories.tsx         |  5 +++++
 src/components/orders/StatusLabel/index.tsx            |  5 ++++-
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/api/operator/types.ts b/src/api/operator/types.ts
index 1c1e50056..1c4bd5b34 100644
--- a/src/api/operator/types.ts
+++ b/src/api/operator/types.ts
@@ -19,8 +19,14 @@ export interface FeeInformation {
 
 export type OrderKind = 'sell' | 'buy'
 
-export type OrderStatus = 'open' | 'filled' | 'cancelled' | 'expired' | 'signing'
-export type RawOrderStatusFromAPI = 'presignaturePending' | 'open' | 'fullfilled' | 'cancelled' | 'expired'
+export type OrderStatus = 'open' | 'filled' | 'cancelled' | 'cancelling' | 'expired' | 'signing'
+export type RawOrderStatusFromAPI =
+  | 'presignaturePending'
+  | 'open'
+  | 'fullfilled'
+  | 'cancelled'
+  | 'cancelling'
+  | 'expired'
 
 // Raw API response
 export type RawOrder = {
diff --git a/src/components/orders/StatusLabel/StatusLabel.stories.tsx b/src/components/orders/StatusLabel/StatusLabel.stories.tsx
index e6d972080..3139edae1 100644
--- a/src/components/orders/StatusLabel/StatusLabel.stories.tsx
+++ b/src/components/orders/StatusLabel/StatusLabel.stories.tsx
@@ -23,6 +23,9 @@ Expired.args = { status: 'expired' }
 export const Cancelled = Template.bind({})
 Cancelled.args = { status: 'cancelled' }
 
+export const Cancelling = Template.bind({})
+Cancelling.args = { status: 'cancelling' }
+
 export const Open = Template.bind({})
 Open.args = { status: 'open' }
 
@@ -35,3 +38,5 @@ export const ExpiredPartiallyFilled = Template.bind({})
 ExpiredPartiallyFilled.args = { status: 'expired', partiallyFilled: true }
 export const CancelledPartiallyFilled = Template.bind({})
 CancelledPartiallyFilled.args = { status: 'cancelled', partiallyFilled: true }
+export const CancellingPartiallyFilled = Template.bind({})
+CancellingPartiallyFilled.args = { status: 'cancelling', partiallyFilled: true }
diff --git a/src/components/orders/StatusLabel/index.tsx b/src/components/orders/StatusLabel/index.tsx
index 7cf091cca..90174f783 100644
--- a/src/components/orders/StatusLabel/index.tsx
+++ b/src/components/orders/StatusLabel/index.tsx
@@ -20,6 +20,7 @@ function setStatusColors({ theme, status }: { theme: DefaultTheme; status: Order
   switch (status) {
     case 'expired':
     case 'cancelled':
+    case 'cancelling':
       text = theme.orange
       background = theme.orangeOpacity
       break
@@ -93,6 +94,8 @@ function getStatusIcon(status: OrderStatus): IconDefinition {
       return faCheckCircle
     case 'cancelled':
       return faTimesCircle
+    case 'cancelling':
+      return faTimesCircle
     case 'signing':
       return faKey
     case 'open':
@@ -111,7 +114,7 @@ export type Props = DisplayProps & { partiallyFilled: boolean }
 
 export function StatusLabel(props: Props): JSX.Element {
   const { status, partiallyFilled } = props
-  const shimming = status === 'signing'
+  const shimming = status === 'signing' || status === 'cancelling'
 
   return (
     <Wrapper>

From b6b6200d4221109f0e4c572245c2f9ba62d778dd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Agust=C3=ADn=20Longoni?= <agustin.longoni@altoros.com>
Date: Wed, 24 Nov 2021 15:34:51 -0300
Subject: [PATCH 3/3] remove cancelling order status from api

---
 src/api/operator/types.ts | 8 +-------
 1 file changed, 1 insertion(+), 7 deletions(-)

diff --git a/src/api/operator/types.ts b/src/api/operator/types.ts
index 1c4bd5b34..6a1d8b049 100644
--- a/src/api/operator/types.ts
+++ b/src/api/operator/types.ts
@@ -20,13 +20,7 @@ export interface FeeInformation {
 export type OrderKind = 'sell' | 'buy'
 
 export type OrderStatus = 'open' | 'filled' | 'cancelled' | 'cancelling' | 'expired' | 'signing'
-export type RawOrderStatusFromAPI =
-  | 'presignaturePending'
-  | 'open'
-  | 'fullfilled'
-  | 'cancelled'
-  | 'cancelling'
-  | 'expired'
+export type RawOrderStatusFromAPI = 'presignaturePending' | 'open' | 'fullfilled' | 'cancelled' | 'expired'
 
 // Raw API response
 export type RawOrder = {