diff options
| author | crupest <crupest@outlook.com> | 2021-03-19 09:10:37 +0800 |
|---|---|---|
| committer | crupest <crupest@outlook.com> | 2021-03-19 09:10:37 +0800 |
| commit | be918c34d09264fbe3b80506c8204d8af034a17e (patch) | |
| tree | e697d9b92635a09af60fcf24b79e71401e8c8cfa | |
| parent | 20c3aff106089ad9dfe83b01f7447b676aa43021 (diff) | |
| download | timeline-be918c34d09264fbe3b80506c8204d8af034a17e.tar.gz timeline-be918c34d09264fbe3b80506c8204d8af034a17e.tar.bz2 timeline-be918c34d09264fbe3b80506c8204d8af034a17e.zip | |
feat: Add markdown posting indicator.
| -rw-r--r-- | FrontEnd/src/app/views/timeline-common/MarkdownPostEdit.tsx | 48 |
1 files changed, 28 insertions, 20 deletions
diff --git a/FrontEnd/src/app/views/timeline-common/MarkdownPostEdit.tsx b/FrontEnd/src/app/views/timeline-common/MarkdownPostEdit.tsx index fb38d2f7..f30e960b 100644 --- a/FrontEnd/src/app/views/timeline-common/MarkdownPostEdit.tsx +++ b/FrontEnd/src/app/views/timeline-common/MarkdownPostEdit.tsx @@ -1,5 +1,6 @@ import React from "react"; -import { Form } from "react-bootstrap"; +import clsx from "clsx"; +import { Form, Spinner } from "react-bootstrap"; import { useTranslation } from "react-i18next"; import { Prompt } from "react-router"; @@ -100,24 +101,28 @@ const MarkdownPostEdit: React.FC<MarkdownPostEditProps> = ({ style={style} pageContainerClassName="py-2" actions={ - <> - <FlatButton - className="mr-2" - variant="danger" - onClick={() => { - if (canLeave) { - onClose(); - } else { - setShowLeaveConfirmDialog(true); - } - }} - > - {t("operationDialog.cancel")} - </FlatButton> - <FlatButton onClick={send} disabled={canLeave}> - {t("timeline.send")} - </FlatButton> - </> + process ? ( + <Spinner variant="primary" animation="border" size="sm" /> + ) : ( + <> + <FlatButton + className="mr-2" + variant="danger" + onClick={() => { + if (canLeave) { + onClose(); + } else { + setShowLeaveConfirmDialog(true); + } + }} + > + {t("operationDialog.cancel")} + </FlatButton> + <FlatButton onClick={send} disabled={canLeave}> + {t("timeline.send")} + </FlatButton> + </> + ) } pages={[ { @@ -149,7 +154,10 @@ const MarkdownPostEdit: React.FC<MarkdownPostEditProps> = ({ className="timeline-markdown-post-edit-image" /> <i - className="bi-trash text-danger icon-button timeline-markdown-post-edit-image-delete-button" + className={clsx( + "bi-trash text-danger icon-button timeline-markdown-post-edit-image-delete-button", + process && "d-none" + )} onClick={() => { getBuilder().deleteImage(index); }} |