mirror of
https://github.com/apache/superset.git
synced 2024-09-12 00:29:39 -04:00
refactor(annotation): improve annotation modal (#15359)
This commit is contained in:
parent
1d572ca92b
commit
7e9674a8fa
@ -279,6 +279,7 @@ function AnnotationList({
|
|||||||
/>
|
/>
|
||||||
<AnnotationModal
|
<AnnotationModal
|
||||||
addDangerToast={addDangerToast}
|
addDangerToast={addDangerToast}
|
||||||
|
addSuccessToast={addSuccessToast}
|
||||||
annotation={currentAnnotation}
|
annotation={currentAnnotation}
|
||||||
show={annotationModalOpen}
|
show={annotationModalOpen}
|
||||||
onAnnotationAdd={() => refreshData()}
|
onAnnotationAdd={() => refreshData()}
|
||||||
|
@ -45,6 +45,7 @@ const store = mockStore({});
|
|||||||
|
|
||||||
const mockedProps = {
|
const mockedProps = {
|
||||||
addDangerToast: () => {},
|
addDangerToast: () => {},
|
||||||
|
addSuccessToast: () => {},
|
||||||
annotation: mockData,
|
annotation: mockData,
|
||||||
onAnnotationAdd: jest.fn(() => []),
|
onAnnotationAdd: jest.fn(() => []),
|
||||||
onHide: () => {},
|
onHide: () => {},
|
||||||
|
@ -30,6 +30,7 @@ import { AnnotationObject } from './types';
|
|||||||
|
|
||||||
interface AnnotationModalProps {
|
interface AnnotationModalProps {
|
||||||
addDangerToast: (msg: string) => void;
|
addDangerToast: (msg: string) => void;
|
||||||
|
addSuccessToast: (msg: string) => void;
|
||||||
annnotationLayerId: number;
|
annnotationLayerId: number;
|
||||||
annotation?: AnnotationObject | null;
|
annotation?: AnnotationObject | null;
|
||||||
onAnnotationAdd?: (annotation?: AnnotationObject) => void;
|
onAnnotationAdd?: (annotation?: AnnotationObject) => void;
|
||||||
@ -85,6 +86,7 @@ const AnnotationContainer = styled.div`
|
|||||||
|
|
||||||
const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
||||||
addDangerToast,
|
addDangerToast,
|
||||||
|
addSuccessToast,
|
||||||
annnotationLayerId,
|
annnotationLayerId,
|
||||||
annotation = null,
|
annotation = null,
|
||||||
onAnnotationAdd,
|
onAnnotationAdd,
|
||||||
@ -96,7 +98,6 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
currentAnnotation,
|
currentAnnotation,
|
||||||
setCurrentAnnotation,
|
setCurrentAnnotation,
|
||||||
] = useState<AnnotationObject | null>(null);
|
] = useState<AnnotationObject | null>(null);
|
||||||
const [isHidden, setIsHidden] = useState<boolean>(true);
|
|
||||||
const isEditMode = annotation !== null;
|
const isEditMode = annotation !== null;
|
||||||
|
|
||||||
// annotation fetch logic
|
// annotation fetch logic
|
||||||
@ -122,13 +123,12 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
// Functions
|
|
||||||
const hide = () => {
|
const hide = () => {
|
||||||
setIsHidden(true);
|
if (isEditMode) {
|
||||||
|
setCurrentAnnotation(resource);
|
||||||
// Reset annotation
|
} else {
|
||||||
resetAnnotation();
|
resetAnnotation();
|
||||||
|
}
|
||||||
onHide();
|
onHide();
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -153,6 +153,8 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
hide();
|
hide();
|
||||||
|
|
||||||
|
addSuccessToast(t('The annotation has been updated'));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
} else if (currentAnnotation) {
|
} else if (currentAnnotation) {
|
||||||
@ -167,6 +169,8 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
hide();
|
hide();
|
||||||
|
|
||||||
|
addSuccessToast(t('The annotation has been saved'));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -236,7 +240,7 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
(!currentAnnotation ||
|
(!currentAnnotation ||
|
||||||
!currentAnnotation.id ||
|
!currentAnnotation.id ||
|
||||||
(annotation && annotation.id !== currentAnnotation.id) ||
|
(annotation && annotation.id !== currentAnnotation.id) ||
|
||||||
(isHidden && show))
|
show)
|
||||||
) {
|
) {
|
||||||
if (annotation && annotation.id !== null && !loading) {
|
if (annotation && annotation.id !== null && !loading) {
|
||||||
const id = annotation.id || 0;
|
const id = annotation.id || 0;
|
||||||
@ -245,7 +249,7 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
}
|
}
|
||||||
} else if (
|
} else if (
|
||||||
!isEditMode &&
|
!isEditMode &&
|
||||||
(!currentAnnotation || currentAnnotation.id || (isHidden && show))
|
(!currentAnnotation || currentAnnotation.id || show)
|
||||||
) {
|
) {
|
||||||
resetAnnotation();
|
resetAnnotation();
|
||||||
}
|
}
|
||||||
@ -266,11 +270,6 @@ const AnnotationModal: FunctionComponent<AnnotationModalProps> = ({
|
|||||||
currentAnnotation ? currentAnnotation.end_dttm : '',
|
currentAnnotation ? currentAnnotation.end_dttm : '',
|
||||||
]);
|
]);
|
||||||
|
|
||||||
// Show/hide
|
|
||||||
if (isHidden && show) {
|
|
||||||
setIsHidden(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Modal
|
<Modal
|
||||||
disablePrimaryButton={disableSave}
|
disablePrimaryButton={disableSave}
|
||||||
|
Loading…
Reference in New Issue
Block a user