From 78de9ce2bddb6270f431e362296315cd686862c0 Mon Sep 17 00:00:00 2001
From: Impeqq <sokovnin.m@list.ru>
Date: Mon, 1 Nov 2021 00:00:00 +0300
Subject: [PATCH] added disabling for action buttons

---
 frontend/src/components/chat/typing/typing.tsx             | 7 +++++--
 frontend/src/pages/Auth/register-block/register-block.tsx  | 7 ++++++-
 .../Profile/change-information/change-information.tsx      | 7 ++++++-
 .../src/pages/Profile/change-password/change-password.tsx  | 1 +
 frontend/src/ui/atoms/button/styles.scss                   | 1 +
 5 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/chat/typing/typing.tsx b/frontend/src/components/chat/typing/typing.tsx
index 6eb8510..732dc96 100644
--- a/frontend/src/components/chat/typing/typing.tsx
+++ b/frontend/src/components/chat/typing/typing.tsx
@@ -10,10 +10,10 @@ import { RouteParams } from "@features/types";
 import { useParams } from "react-router-dom";
 import { BaseForm } from "@components";
 import { useForm } from "react-hook-form";
-import { Button, Input } from "@ui";
+import { Button, ButtonType, Input } from "@ui";
 
 export const Typing = () => {
-  const [sendMessage] = useMutation(SEND_MESSAGE);
+  const [sendMessage, { loading }] = useMutation(SEND_MESSAGE);
 
   const { id } = useParams<RouteParams>();
 
@@ -55,8 +55,11 @@ export const Typing = () => {
       <div>
         <MicIcon />
         <Button
+          type={ButtonType.SUBMIT}
           className={styles.button}
           text={""}
+          withDisable={true}
+          loading={loading}
           icon={<SendIcon fill="#ffffff" />}
         />
       </div>
diff --git a/frontend/src/pages/Auth/register-block/register-block.tsx b/frontend/src/pages/Auth/register-block/register-block.tsx
index bb07249..c7513ee 100644
--- a/frontend/src/pages/Auth/register-block/register-block.tsx
+++ b/frontend/src/pages/Auth/register-block/register-block.tsx
@@ -76,7 +76,12 @@ export const RegisterBlock = () => {
         message={error?.message}
       />
       <InputGroup>
-        <Button text={"Sign Up"} type={ButtonType.SUBMIT} loading={loading} />
+        <Button
+          text={"Sign Up"}
+          type={ButtonType.SUBMIT}
+          loading={loading}
+          withDisable={true}
+        />
         <Button
           text={"Sign Up"}
           iconDirection={IconDirection.RIGHT}
diff --git a/frontend/src/pages/Profile/change-information/change-information.tsx b/frontend/src/pages/Profile/change-information/change-information.tsx
index f004ca6..36b2837 100644
--- a/frontend/src/pages/Profile/change-information/change-information.tsx
+++ b/frontend/src/pages/Profile/change-information/change-information.tsx
@@ -117,7 +117,12 @@ export const ChangeInformation = () => {
           style={ButtonStyle.OUTLINE}
           onClick={handleReset}
         />
-        <Button text={"Update"} type={ButtonType.SUBMIT} loading={loading} />
+        <Button
+          text={"Update"}
+          type={ButtonType.SUBMIT}
+          withDisable={true}
+          loading={loading}
+        />
       </InputGroup>
     </BaseForm>
   );
diff --git a/frontend/src/pages/Profile/change-password/change-password.tsx b/frontend/src/pages/Profile/change-password/change-password.tsx
index a6d2ea5..710ec81 100644
--- a/frontend/src/pages/Profile/change-password/change-password.tsx
+++ b/frontend/src/pages/Profile/change-password/change-password.tsx
@@ -61,6 +61,7 @@ export const ChangePassword = () => {
         <Button
           text={"Change password"}
           type={ButtonType.SUBMIT}
+          withDisable={true}
           loading={loading}
         />
         <Input
diff --git a/frontend/src/ui/atoms/button/styles.scss b/frontend/src/ui/atoms/button/styles.scss
index 028a38f..9816708 100644
--- a/frontend/src/ui/atoms/button/styles.scss
+++ b/frontend/src/ui/atoms/button/styles.scss
@@ -72,6 +72,7 @@
   &.disabled {
     background: $c_button_disabled;
     color: $c_white;
+    cursor: unset;
     &:hover {
       background: $c_button_disabled_hover;
     }