Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 13, 2024. It is now read-only.

Commit e75ef45

Browse files
Hubert KosterHubert Koster
Hubert Koster
authored and
Hubert Koster
committed
chore: fixing modals
1 parent 7e7bed8 commit e75ef45

File tree

9 files changed

+98
-65
lines changed

9 files changed

+98
-65
lines changed

src/features/Apiexplorer/RequestResponseRenderer/index.tsx

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,16 @@ export const LoginModal = (visible) => {
2525
return (
2626
<Modal defaultOpen>
2727
<Modal.Portal>
28-
<Modal.Overlay />
29-
<Modal.PageContent title={'Authorization Required'} has_close_button has_title_separator>
30-
<div className={style.modal}>Please Login to fetch Response</div>
31-
</Modal.PageContent>
28+
<div className='modal-overlay'>
29+
<Modal.Overlay />
30+
<Modal.PageContent
31+
title={'Authorization Required'}
32+
has_close_button
33+
has_title_separator
34+
>
35+
<div className={style.modal}>Please Login to fetch Response</div>
36+
</Modal.PageContent>
37+
</div>
3238
</Modal.Portal>
3339
</Modal>
3440
);

src/features/Apiexplorer/SubscribeRenderer/index.tsx

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,10 +29,16 @@ export const LoginModal = (visible) => {
2929
return (
3030
<Modal defaultOpen>
3131
<Modal.Portal>
32-
<Modal.Overlay />
33-
<Modal.PageContent title={'Authorization Required'} has_close_button has_title_separator>
34-
<div className={style.modal}>Please Login to fetch Response</div>
35-
</Modal.PageContent>
32+
<div className='modal-overlay'>
33+
<Modal.Overlay />
34+
<Modal.PageContent
35+
title={'Authorization Required'}
36+
has_close_button
37+
has_title_separator
38+
>
39+
<div className={style.modal}>Please Login to fetch Response</div>
40+
</Modal.PageContent>
41+
</div>
3642
</Modal.Portal>
3743
</Modal>
3844
);

src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/index.tsx

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -43,14 +43,16 @@ const CopyTokenDialog = ({ setToggleModal, copyToken }: TCopyTokenDialog) => {
4343
return (
4444
<Modal defaultOpen onOpenChange={onOpenChange}>
4545
<Modal.Portal>
46-
<Modal.Overlay />
47-
<Modal.DialogContent
48-
has_close_button
49-
content={
50-
'Be careful who you share this token with. Anyone with this token can perform the following actions on your account: Add accounts, Create or delete API tokens for trading and withdrawals, Modify account settings.'
51-
}
52-
action_buttons={actionButtons}
53-
/>
46+
<div className='modal-overlay'>
47+
<Modal.Overlay />
48+
<Modal.DialogContent
49+
has_close_button
50+
content={
51+
'Be careful who you share this token with. Anyone with this token can perform the following actions on your account: Add accounts, Create or delete API tokens for trading and withdrawals, Modify account settings.'
52+
}
53+
action_buttons={actionButtons}
54+
/>
55+
</div>
5456
</Modal.Portal>
5557
</Modal>
5658
);

src/features/dashboard/components/ApiTokenTable/DeleteTokenDialog/index.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -43,13 +43,15 @@ const DeleteTokenDialog = ({ onDelete, setToggleModal }: TDeleteTokendialog) =>
4343
return (
4444
<Modal defaultOpen onOpenChange={onOpenChange}>
4545
<Modal.Portal>
46-
<Modal.Overlay />
47-
<Modal.DialogContent
48-
title='Deleting token'
49-
content='Are you sure you want to delete this token?'
50-
action_buttons={actionButtons}
51-
has_close_button
52-
/>
46+
<div className='modal-overlay'>
47+
<Modal.Overlay />
48+
<Modal.DialogContent
49+
title='Deleting token'
50+
content='Are you sure you want to delete this token?'
51+
action_buttons={actionButtons}
52+
has_close_button
53+
/>
54+
</div>
5355
</Modal.Portal>
5456
</Modal>
5557
);

src/features/dashboard/components/Dialogs/DeleteAppDialog/index.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -46,13 +46,15 @@ const DeleteAppDialog = ({ appId, onClose }: TDeleteAppDialogProps) => {
4646
return (
4747
<Modal defaultOpen onOpenChange={onOpenChange}>
4848
<Modal.Portal>
49-
<Modal.Overlay />
50-
<Modal.DialogContent
51-
title='Delete app'
52-
content='Are you sure you want to delete this app?'
53-
action_buttons={actionButtons}
54-
has_close_button
55-
/>
49+
<div className='modal-overlay'>
50+
<Modal.Overlay />
51+
<Modal.DialogContent
52+
title='Delete app'
53+
content='Are you sure you want to delete this app?'
54+
action_buttons={actionButtons}
55+
has_close_button
56+
/>
57+
</div>
5658
</Modal.Portal>
5759
</Modal>
5860
);

src/features/dashboard/components/Dialogs/RegisterAppDialogError/index.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -37,13 +37,15 @@ export const RegisterAppDialogError = ({ error, onClose }: TRegisterAppDialogErr
3737
return (
3838
<Modal defaultOpen>
3939
<Modal.Portal>
40-
<Modal.Overlay />
41-
<Modal.DialogContent
42-
title='Error!'
43-
content={catchError()}
44-
action_buttons={actionButtons}
45-
has_close_button
46-
/>
40+
<div className='modal-overlay'>
41+
<Modal.Overlay />
42+
<Modal.DialogContent
43+
title='Error!'
44+
content={catchError()}
45+
action_buttons={actionButtons}
46+
has_close_button
47+
/>
48+
</div>
4749
</Modal.Portal>
4850
</Modal>
4951
);

src/features/dashboard/components/Dialogs/RegisterAppDialogSuccess/index.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -36,16 +36,18 @@ export const RegisterAppDialogSuccess = ({ onClose }: IRegisterAppDialogSuccessP
3636
return (
3737
<Modal defaultOpen>
3838
<Modal.Portal>
39-
<Modal.Overlay />
40-
<Modal.DialogContent
41-
title='Success!'
42-
content={
43-
'You have successfully registered your application. You can now start using Deriv API.'
44-
}
45-
action_buttons={actionButtons}
46-
has_close_button
47-
should_prevent_close_on_click_outside
48-
/>
39+
<div className='modal-overlay'>
40+
<Modal.Overlay />
41+
<Modal.DialogContent
42+
title='Success!'
43+
content={
44+
'You have successfully registered your application. You can now start using Deriv API.'
45+
}
46+
action_buttons={actionButtons}
47+
has_close_button
48+
should_prevent_close_on_click_outside
49+
/>
50+
</div>
4951
</Modal.Portal>
5052
</Modal>
5153
);

src/features/dashboard/components/Dialogs/UpdateAppDialog/index.tsx

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -80,24 +80,26 @@ const UpdateAppDialog = ({ app, onClose }: IUpdateAppDialog) => {
8080
return (
8181
<Modal defaultOpen onOpenChange={onOpenChange}>
8282
<Modal.Portal>
83-
<Modal.Overlay />
84-
<Modal.PageContent
85-
title={'Update App'}
86-
has_close_button
87-
has_title_separator
88-
className={styles.update_dialog}
89-
>
90-
<div className={styles.update_app_content}>
91-
<AppForm
92-
is_update_mode
93-
renderButtons={renderButtons}
94-
submit={onSubmit}
95-
initialValues={initialValues}
96-
isUpdating
97-
/>
98-
</div>
99-
{error && <RegisterAppDialogError error={error} onClose={clear} />}
100-
</Modal.PageContent>
83+
<div className='modal-overlay'>
84+
<Modal.Overlay />
85+
<Modal.PageContent
86+
title={'Update App'}
87+
has_close_button
88+
has_title_separator
89+
className={styles.update_dialog}
90+
>
91+
<div className={styles.update_app_content}>
92+
<AppForm
93+
is_update_mode
94+
renderButtons={renderButtons}
95+
submit={onSubmit}
96+
initialValues={initialValues}
97+
isUpdating
98+
/>
99+
</div>
100+
{error && <RegisterAppDialogError error={error} onClose={clear} />}
101+
</Modal.PageContent>
102+
</div>
101103
</Modal.Portal>
102104
</Modal>
103105
);

src/styles/index.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,15 @@ div[class*='sidebarViewport'] {
147147
}
148148
}
149149

150+
.modal-overlay {
151+
> div {
152+
z-index: 1000;
153+
}
154+
div[role="dialog"] {
155+
z-index: 1001;
156+
}
157+
}
158+
150159
.loading {
151160
position: absolute;
152161
width: 100%;

0 commit comments

Comments
 (0)