diff options
Diffstat (limited to 'FrontEnd/src/views/timeline-common')
6 files changed, 19 insertions, 58 deletions
diff --git a/FrontEnd/src/views/timeline-common/MarkdownPostEdit.tsx b/FrontEnd/src/views/timeline-common/MarkdownPostEdit.tsx index 6cb64dd3..9f0753b9 100644 --- a/FrontEnd/src/views/timeline-common/MarkdownPostEdit.tsx +++ b/FrontEnd/src/views/timeline-common/MarkdownPostEdit.tsx @@ -1,15 +1,17 @@ +/* eslint-disable react/jsx-no-undef */ import React from "react"; import classnames from "classnames"; -import { Form, Spinner } from "react-bootstrap"; import { useTranslation } from "react-i18next"; import { Prompt } from "react-router"; import { getHttpTimelineClient, HttpTimelinePostInfo } from "@/http/timeline"; +import TimelinePostBuilder from "@/services/TimelinePostBuilder"; + import FlatButton from "../common/button/FlatButton"; import TabPages from "../common/TabPages"; -import TimelinePostBuilder from "@/services/TimelinePostBuilder"; import ConfirmDialog from "../common/dailog/ConfirmDialog"; +import Spinner from "../common/Spinner"; export interface MarkdownPostEditProps { timeline: string; @@ -102,7 +104,7 @@ const MarkdownPostEdit: React.FC<MarkdownPostEditProps> = ({ pageContainerClassName="py-2" actions={ process ? ( - <Spinner variant="primary" animation="border" size="sm" /> + <Spinner /> ) : ( <> <FlatButton diff --git a/FrontEnd/src/views/timeline-common/TimelineMember.tsx b/FrontEnd/src/views/timeline-common/TimelineMember.tsx index 830ecd45..c8f26da7 100644 --- a/FrontEnd/src/views/timeline-common/TimelineMember.tsx +++ b/FrontEnd/src/views/timeline-common/TimelineMember.tsx @@ -5,21 +5,20 @@ import { convertI18nText, I18nText } from "@/common"; import { HttpUser } from "@/http/user"; import { getHttpSearchClient } from "@/http/search"; +import { getHttpTimelineClient, HttpTimelineInfo } from "@/http/timeline"; import SearchInput from "../common/SearchInput"; import UserAvatar from "../common/user/UserAvatar"; -import { getHttpTimelineClient, HttpTimelineInfo } from "@/http/timeline"; import Button from "../common/button/Button"; +import Dialog from "../common/dailog/Dialog"; const TimelineMemberItem: React.FC<{ user: HttpUser; add?: boolean; onAction?: (username: string) => void; }> = ({ user, add, onAction }) => { - const { t } = useTranslation(); - return ( - <ListGroup.Item className="container"> + <div className="container"> <div className="row"> <div className="col col-auto"> <UserAvatar username={user.username} className="avatar small" /> @@ -42,7 +41,7 @@ const TimelineMemberItem: React.FC<{ </div> ) : null} </div> - </ListGroup.Item> + </div> ); }; @@ -109,7 +108,7 @@ const TimelineMemberUserSearch: React.FC<{ return <div>{t("timeline.member.noUserAvailableToAdd")}</div>; } else { return ( - <ListGroup className="mt-2"> + <div className="mt-2"> {users.map((user) => ( <TimelineMemberItem key={user.username} @@ -126,7 +125,7 @@ const TimelineMemberUserSearch: React.FC<{ }} /> ))} - </ListGroup> + </div> ); } } else if (userSearchState.type === "error") { @@ -152,7 +151,7 @@ const TimelineMember: React.FC<TimelineMemberProps> = (props) => { return ( <div className="container px-4 py-3"> - <ListGroup> + <div> {members.map((member, index) => ( <TimelineMemberItem key={member.username} @@ -168,7 +167,7 @@ const TimelineMember: React.FC<TimelineMemberProps> = (props) => { } /> ))} - </ListGroup> + </div> {timeline.manageable ? ( <TimelineMemberUserSearch timeline={timeline} onChange={onChange} /> ) : null} @@ -187,8 +186,8 @@ export const TimelineMemberDialog: React.FC<TimelineMemberDialogProps> = ( props ) => { return ( - <Modal show centered onHide={props.onClose}> + <Dialog open onClose={props.onClose}> <TimelineMember {...props} /> - </Modal> + </Dialog> ); }; diff --git a/FrontEnd/src/views/timeline-common/TimelinePageTemplate.tsx b/FrontEnd/src/views/timeline-common/TimelinePageTemplate.tsx index d05f18d4..ea6e8d40 100644 --- a/FrontEnd/src/views/timeline-common/TimelinePageTemplate.tsx +++ b/FrontEnd/src/views/timeline-common/TimelinePageTemplate.tsx @@ -1,5 +1,4 @@ import React from "react"; -import { Container } from "react-bootstrap"; import { HubConnectionState } from "@microsoft/signalr"; import { HttpTimelineInfo } from "@/http/timeline"; diff --git a/FrontEnd/src/views/timeline-common/TimelinePostDeleteConfirmDialog.tsx b/FrontEnd/src/views/timeline-common/TimelinePostDeleteConfirmDialog.tsx deleted file mode 100644 index e04bb7e1..00000000 --- a/FrontEnd/src/views/timeline-common/TimelinePostDeleteConfirmDialog.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import React from "react"; -import { useTranslation } from "react-i18next"; - -import Button from "../common/button/Button"; - -const TimelinePostDeleteConfirmDialog: React.FC<{ - onClose: () => void; - onConfirm: () => void; -}> = ({ onClose, onConfirm }) => { - const { t } = useTranslation(); - - return ( - <Modal onHide={onClose} show centered> - <Modal.Header> - <Modal.Title className="text-danger"> - {t("timeline.post.deleteDialog.title")} - </Modal.Title> - </Modal.Header> - <Modal.Body>{t("timeline.post.deleteDialog.prompt")}</Modal.Body> - <Modal.Footer> - <Button - text="operationDialog.cancel" - color="secondary" - onClick={onClose} - /> - <Button - variant="danger" - onClick={() => { - onConfirm(); - onClose(); - }} - > - {t("operationDialog.confirm")} - </Button> - </Modal.Footer> - </Modal> - ); -}; - -export default TimelinePostDeleteConfirmDialog; diff --git a/FrontEnd/src/views/timeline-common/TimelinePostEdit.tsx b/FrontEnd/src/views/timeline-common/TimelinePostEdit.tsx index 5e59bee4..13aacb54 100644 --- a/FrontEnd/src/views/timeline-common/TimelinePostEdit.tsx +++ b/FrontEnd/src/views/timeline-common/TimelinePostEdit.tsx @@ -265,7 +265,6 @@ const TimelinePostEdit: React.FC<TimelinePostEditProps> = (props) => { </PopupMenu> </div> <LoadingButton - variant="primary" onClick={onSend} disabled={!canSend} loading={process} diff --git a/FrontEnd/src/views/timeline-common/TimelinePostView.tsx b/FrontEnd/src/views/timeline-common/TimelinePostView.tsx index 7b16e898..995c43df 100644 --- a/FrontEnd/src/views/timeline-common/TimelinePostView.tsx +++ b/FrontEnd/src/views/timeline-common/TimelinePostView.tsx @@ -9,9 +9,9 @@ import { pushAlert } from "@/services/alert"; import UserAvatar from "../common/user/UserAvatar"; import Card from "../common/Card"; import FlatButton from "../common/button/FlatButton"; +import ConfirmDialog from "../common/dailog/ConfirmDialog"; import TimelineLine from "./TimelineLine"; import TimelinePostContentView from "./TimelinePostContentView"; -import TimelinePostDeleteConfirmDialog from "./TimelinePostDeleteConfirmDialog"; import PostPropertyChangeDialog from "./PostPropertyChangeDialog"; export interface TimelinePostViewProps { @@ -116,7 +116,9 @@ const TimelinePostView: React.FC<TimelinePostViewProps> = (props) => { ) : null} </Card> {dialog === "delete" ? ( - <TimelinePostDeleteConfirmDialog + <ConfirmDialog + title="timeline.post.deleteDialog.title" + body="timeline.post.deleteDialog.prompt" onClose={() => { setDialog(null); setOperationMaskVisible(false); |