aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/hooks
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/hooks')
-rw-r--r--frontend/src/hooks/UseConfirm.tsx61
-rw-r--r--frontend/src/hooks/UseMessage.tsx60
-rw-r--r--frontend/src/hooks/UseMessageLoad.tsx55
3 files changed, 97 insertions, 79 deletions
diff --git a/frontend/src/hooks/UseConfirm.tsx b/frontend/src/hooks/UseConfirm.tsx
index e86d70d..7b4bffa 100644
--- a/frontend/src/hooks/UseConfirm.tsx
+++ b/frontend/src/hooks/UseConfirm.tsx
@@ -2,39 +2,46 @@ import React, { useState } from 'react';
2import ConfirmDialog from '@components/ConfirmDialog'; 2import ConfirmDialog from '@components/ConfirmDialog';
3 3
4const useConfirm = () => { 4const useConfirm = () => {
5 const [isOpen, setIsOpen] = useState(false); 5 const [isOpen, setIsOpen] = useState(false);
6 const [title, setTitle] = useState<string>(""); 6 const [title, setTitle] = useState<string>('');
7 const [subtitle, setSubtitle] = useState<string>(""); 7 const [subtitle, setSubtitle] = useState<string>('');
8 const [resolvePromise, setResolvePromise] = useState<((value: boolean) => void) | null>(null); 8 const [resolvePromise, setResolvePromise] = useState<
9 ((value: boolean) => void) | null
10 >(null);
9 11
10 const confirm = ( titleN: string, subtitleN: string ) => { 12 const confirm = (titleN: string, subtitleN: string) => {
11 setIsOpen(true); 13 setIsOpen(true);
12 setTitle(titleN); 14 setTitle(titleN);
13 setSubtitle(subtitleN); 15 setSubtitle(subtitleN);
14 return new Promise<boolean>((resolve) => { 16 return new Promise<boolean>(resolve => {
15 setResolvePromise(() => resolve); 17 setResolvePromise(() => resolve);
16 }); 18 });
17 }; 19 };
18 20
19 const handleConfirm = () => { 21 const handleConfirm = () => {
20 setIsOpen(false); 22 setIsOpen(false);
21 if (resolvePromise) { 23 if (resolvePromise) {
22 resolvePromise(true); 24 resolvePromise(true);
23 }
24 } 25 }
26 };
25 27
26 const handleCancel = () => { 28 const handleCancel = () => {
27 setIsOpen(false); 29 setIsOpen(false);
28 if (resolvePromise) { 30 if (resolvePromise) {
29 resolvePromise(false); 31 resolvePromise(false);
30 }
31 } 32 }
33 };
32 34
33 const ConfirmDialogComponent = isOpen && ( 35 const ConfirmDialogComponent = isOpen && (
34 <ConfirmDialog title={title} subtitle={subtitle} onConfirm={handleConfirm} onCancel={handleCancel}></ConfirmDialog> 36 <ConfirmDialog
35 ); 37 title={title}
38 subtitle={subtitle}
39 onConfirm={handleConfirm}
40 onCancel={handleCancel}
41 ></ConfirmDialog>
42 );
36 43
37 return { confirm, ConfirmDialogComponent }; 44 return { confirm, ConfirmDialogComponent };
38} 45};
39 46
40export default useConfirm; 47export default useConfirm;
diff --git a/frontend/src/hooks/UseMessage.tsx b/frontend/src/hooks/UseMessage.tsx
index 97ec746..e0afa59 100644
--- a/frontend/src/hooks/UseMessage.tsx
+++ b/frontend/src/hooks/UseMessage.tsx
@@ -1,37 +1,43 @@
1import React, { useState } from 'react'; 1import React, { useState } from 'react';
2import MessageDialog from "@components/MessageDialog"; 2import MessageDialog from '@components/MessageDialog';
3 3
4const useMessage = () => { 4const useMessage = () => {
5 const [isOpen, setIsOpen] = useState(false); 5 const [isOpen, setIsOpen] = useState(false);
6 6
7 const [title, setTitle] = useState<string>(""); 7 const [title, setTitle] = useState<string>('');
8 const [subtitle, setSubtitle] = useState<string>(""); 8 const [subtitle, setSubtitle] = useState<string>('');
9 const [resolvePromise, setResolvePromise] = useState<(() => void) | null>(null); 9 const [resolvePromise, setResolvePromise] = useState<(() => void) | null>(
10 null
11 );
10 12
11 const message = (title: string, subtitle: string) => { 13 const message = (title: string, subtitle: string) => {
12 setIsOpen(true); 14 setIsOpen(true);
13 setTitle(title); 15 setTitle(title);
14 setSubtitle(subtitle); 16 setSubtitle(subtitle);
15 return new Promise((resolve) => { 17 return new Promise(resolve => {
16 setResolvePromise(() => resolve); 18 setResolvePromise(() => resolve);
17 }); 19 });
18 }; 20 };
19 21
20 const handleClose = () => { 22 const handleClose = () => {
21 setIsOpen(false); 23 setIsOpen(false);
22 if (resolvePromise) { 24 if (resolvePromise) {
23 resolvePromise(); 25 resolvePromise();
24 setResolvePromise(null); 26 setResolvePromise(null);
25 } 27 }
26 }; 28 };
27 29
28 const MessageDialogComponent = isOpen && ( 30 const MessageDialogComponent = isOpen && (
29 <div className="dialog-container"> 31 <div className="dialog-container">
30 <MessageDialog title={title} subtitle={subtitle} onClose={handleClose}></MessageDialog> 32 <MessageDialog
31 </div> 33 title={title}
32 ); 34 subtitle={subtitle}
35 onClose={handleClose}
36 ></MessageDialog>
37 </div>
38 );
33 39
34 return { message, MessageDialogComponent }; 40 return { message, MessageDialogComponent };
35} 41};
36 42
37export default useMessage; 43export default useMessage;
diff --git a/frontend/src/hooks/UseMessageLoad.tsx b/frontend/src/hooks/UseMessageLoad.tsx
index 228c2b4..ea0b5d8 100644
--- a/frontend/src/hooks/UseMessageLoad.tsx
+++ b/frontend/src/hooks/UseMessageLoad.tsx
@@ -1,35 +1,40 @@
1import React, { useState } from 'react'; 1import React, { useState } from 'react';
2import MessageDialogLoad from "@components/MessageDialogLoad"; 2import MessageDialogLoad from '@components/MessageDialogLoad';
3 3
4const useMessageLoad = () => { 4const useMessageLoad = () => {
5 const [isOpen, setIsOpen] = useState(false); 5 const [isOpen, setIsOpen] = useState(false);
6 6
7 const [title, setTitle] = useState<string>(""); 7 const [title, setTitle] = useState<string>('');
8 const [resolvePromise, setResolvePromise] = useState<(() => void) | null>(null); 8 const [resolvePromise, setResolvePromise] = useState<(() => void) | null>(
9 null
10 );
9 11
10 const messageLoad = (title: string) => { 12 const messageLoad = (title: string) => {
11 setIsOpen(true); 13 setIsOpen(true);
12 setTitle(title); 14 setTitle(title);
13 return new Promise((resolve) => { 15 return new Promise(resolve => {
14 setResolvePromise(() => resolve); 16 setResolvePromise(() => resolve);
15 }); 17 });
16 }; 18 };
17 19
18 const messageLoadClose = () => { 20 const messageLoadClose = () => {
19 setIsOpen(false); 21 setIsOpen(false);
20 if (resolvePromise) { 22 if (resolvePromise) {
21 resolvePromise(); 23 resolvePromise();
22 setResolvePromise(null); 24 setResolvePromise(null);
23 } 25 }
24 }; 26 };
25 27
26 const MessageDialogLoadComponent = isOpen && ( 28 const MessageDialogLoadComponent = isOpen && (
27 <div className="dialog-container"> 29 <div className="dialog-container">
28 <MessageDialogLoad title={title} onClose={messageLoadClose}></MessageDialogLoad> 30 <MessageDialogLoad
29 </div> 31 title={title}
30 ); 32 onClose={messageLoadClose}
33 ></MessageDialogLoad>
34 </div>
35 );
31 36
32 return { messageLoad, messageLoadClose, MessageDialogLoadComponent }; 37 return { messageLoad, messageLoadClose, MessageDialogLoadComponent };
33} 38};
34 39
35export default useMessageLoad; 40export default useMessageLoad;