Finish support for creating databases in the UI
This commit is contained in:
parent
61dc86421d
commit
1f763dc155
7 changed files with 136 additions and 12 deletions
|
@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
|
|||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import { faTimes } from '@fortawesome/free-solid-svg-icons/faTimes';
|
||||
import { CSSTransition } from 'react-transition-group';
|
||||
import Spinner from '@/components/elements/Spinner';
|
||||
|
||||
interface Props {
|
||||
visible: boolean;
|
||||
|
@ -9,7 +10,8 @@ interface Props {
|
|||
dismissable?: boolean;
|
||||
closeOnEscape?: boolean;
|
||||
closeOnBackground?: boolean;
|
||||
children: React.ReactChild;
|
||||
showSpinnerOverlay?: boolean;
|
||||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
export default (props: Props) => {
|
||||
|
@ -51,6 +53,14 @@ export default (props: Props) => {
|
|||
<FontAwesomeIcon icon={faTimes}/>
|
||||
</div>
|
||||
}
|
||||
{props.showSpinnerOverlay &&
|
||||
<div
|
||||
className={'absolute w-full h-full rounded flex items-center justify-center'}
|
||||
style={{ background: 'hsla(211, 10%, 53%, 0.25)' }}
|
||||
>
|
||||
<Spinner large={false}/>
|
||||
</div>
|
||||
}
|
||||
<div className={'modal-content p-6'}>
|
||||
{props.children}
|
||||
</div>
|
||||
|
|
Reference in a new issue