From e013553ec18e0ea084528444b54edb149a85a6fd Mon Sep 17 00:00:00 2001 From: Dessalines Date: Wed, 4 Mar 2020 22:35:55 -0500 Subject: [PATCH] Better tippy loading. Fixes #577 --- ui/src/components/comment-node.tsx | 12 ------------ ui/src/components/community.tsx | 2 ++ ui/src/components/main.tsx | 2 ++ ui/src/components/moment-time.tsx | 6 +----- ui/src/components/navbar.tsx | 7 +------ ui/src/components/post-listing.tsx | 13 ------------- ui/src/components/post.tsx | 5 +++++ ui/src/components/sidebar.tsx | 5 ----- ui/src/services/WebSocketService.ts | 15 +++++++++++---- 9 files changed, 22 insertions(+), 45 deletions(-) diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx index 47930377c..a02a3cf85 100644 --- a/ui/src/components/comment-node.tsx +++ b/ui/src/components/comment-node.tsx @@ -103,18 +103,6 @@ export class CommentNode extends Component { this.handleCommentDownvote = this.handleCommentDownvote.bind(this); } - componentDidUpdate(prevProps: CommentNodeProps) { - let prevComment = prevProps.node.comment; - let comment = this.props.node.comment; - if ( - prevComment.saved !== comment.saved || - prevComment.deleted !== comment.deleted || - prevComment.read !== comment.read - ) { - setupTippy(); - } - } - componentWillReceiveProps(nextProps: CommentNodeProps) { this.state.my_vote = nextProps.node.comment.my_vote; this.state.upvotes = nextProps.node.comment.upvotes; diff --git a/ui/src/components/community.tsx b/ui/src/components/community.tsx index 0be549a5a..4e8e9d1b6 100644 --- a/ui/src/components/community.tsx +++ b/ui/src/components/community.tsx @@ -43,6 +43,7 @@ import { createPostLikeFindRes, editPostFindRes, commentsToFlatNodes, + setupTippy, } from '../utils'; import { i18n } from '../i18next'; @@ -341,6 +342,7 @@ export class Community extends Component { this.state.posts = data.posts; this.state.loading = false; this.setState(this.state); + setupTippy(); } else if (res.op == UserOperation.EditPost) { let data = res.data as PostResponse; editPostFindRes(data, this.state.posts); diff --git a/ui/src/components/main.tsx b/ui/src/components/main.tsx index 85fa5d339..ee028151f 100644 --- a/ui/src/components/main.tsx +++ b/ui/src/components/main.tsx @@ -52,6 +52,7 @@ import { editPostFindRes, commentsToFlatNodes, commentSortSortType, + setupTippy, } from '../utils'; import { i18n } from '../i18next'; import { T } from 'inferno-i18next'; @@ -620,6 +621,7 @@ export class Main extends Component { this.state.posts = data.posts; this.state.loading = false; this.setState(this.state); + setupTippy(); } else if (res.op == UserOperation.CreatePost) { let data = res.data as PostResponse; diff --git a/ui/src/components/moment-time.tsx b/ui/src/components/moment-time.tsx index 4aba68d2b..24ab2d897 100644 --- a/ui/src/components/moment-time.tsx +++ b/ui/src/components/moment-time.tsx @@ -1,6 +1,6 @@ import { Component } from 'inferno'; import moment from 'moment'; -import { getMomentLanguage, setupTippy, capitalizeFirstLetter } from '../utils'; +import { getMomentLanguage, capitalizeFirstLetter } from '../utils'; import { i18n } from '../i18next'; interface MomentTimeProps { @@ -20,10 +20,6 @@ export class MomentTime extends Component { moment.locale(lang); } - componentDidMount() { - setupTippy(); - } - render() { if (this.props.data.updated) { return ( diff --git a/ui/src/components/navbar.tsx b/ui/src/components/navbar.tsx index 031c2ecbf..ef3f84309 100644 --- a/ui/src/components/navbar.tsx +++ b/ui/src/components/navbar.tsx @@ -26,7 +26,6 @@ import { fetchLimit, isCommentType, toast, - setupTippy, } from '../utils'; import { version } from '../version'; import { i18n } from '../i18next'; @@ -85,10 +84,6 @@ export class Navbar extends Component { WebSocketService.Instance.getSite(); } - componentDidMount() { - setupTippy(); - } - render() { return this.navbar(); } @@ -283,7 +278,7 @@ export class Navbar extends Component { } else if (res.op == UserOperation.GetSite) { let data = res.data as GetSiteResponse; - if (data.site) { + if (data.site && !this.state.siteName) { this.state.siteName = data.site.name; WebSocketService.Instance.site = data.site; this.setState(this.state); diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx index e170c711a..f8f194486 100644 --- a/ui/src/components/post-listing.tsx +++ b/ui/src/components/post-listing.tsx @@ -102,19 +102,6 @@ export class PostListing extends Component { } } - componentDidUpdate(prevProps: PostListingProps) { - let prevPost = prevProps.post; - let post = this.props.post; - if ( - prevPost.saved !== post.saved || - prevPost.deleted !== post.deleted || - prevPost.locked !== post.locked || - prevPost.stickied !== post.stickied - ) { - setupTippy(); - } - } - componentWillReceiveProps(nextProps: PostListingProps) { this.state.my_vote = nextProps.post.my_vote; this.state.upvotes = nextProps.post.upvotes; diff --git a/ui/src/components/post.tsx b/ui/src/components/post.tsx index d8f662cf7..faee23ed0 100644 --- a/ui/src/components/post.tsx +++ b/ui/src/components/post.tsx @@ -37,6 +37,7 @@ import { createCommentLikeRes, createPostLikeRes, commentsToFlatNodes, + setupTippy, } from '../utils'; import { PostListing } from './post-listing'; import { PostListings } from './post-listings'; @@ -370,6 +371,7 @@ export class Post extends Component { } this.setState(this.state); + setupTippy(); } else if (res.op == UserOperation.CreateComment) { let data = res.data as CommentResponse; @@ -386,6 +388,7 @@ export class Post extends Component { let data = res.data as CommentResponse; saveCommentRes(data, this.state.comments); this.setState(this.state); + setupTippy(); } else if (res.op == UserOperation.CreateCommentLike) { let data = res.data as CommentResponse; createCommentLikeRes(data, this.state.comments); @@ -398,10 +401,12 @@ export class Post extends Component { let data = res.data as PostResponse; this.state.post = data.post; this.setState(this.state); + setupTippy(); } else if (res.op == UserOperation.SavePost) { let data = res.data as PostResponse; this.state.post = data.post; this.setState(this.state); + setupTippy(); } else if (res.op == UserOperation.EditCommunity) { let data = res.data as CommunityResponse; this.state.community = data.community; diff --git a/ui/src/components/sidebar.tsx b/ui/src/components/sidebar.tsx index a78589d55..042b67dbb 100644 --- a/ui/src/components/sidebar.tsx +++ b/ui/src/components/sidebar.tsx @@ -13,7 +13,6 @@ import { getUnixTime, pictshareAvatarThumbnail, showAvatars, - setupTippy, } from '../utils'; import { CommunityForm } from './community-form'; import { i18n } from '../i18next'; @@ -47,10 +46,6 @@ export class Sidebar extends Component { this.handleEditCancel = this.handleEditCancel.bind(this); } - componentDidUpdate() { - setupTippy(); - } - render() { return (
diff --git a/ui/src/services/WebSocketService.ts b/ui/src/services/WebSocketService.ts index 3df69457a..02c97cc94 100644 --- a/ui/src/services/WebSocketService.ts +++ b/ui/src/services/WebSocketService.ts @@ -61,6 +61,7 @@ export class WebSocketService { private constructor() { this.ws = new ReconnectingWebSocket(wsUri); + let firstConnect = true; this.subject = Observable.create((obs: any) => { this.ws.onmessage = e => { @@ -68,13 +69,19 @@ export class WebSocketService { }; this.ws.onopen = () => { console.log(`Connected to ${wsUri}`); + if (UserService.Instance.user) { this.userJoin(); } - let res: WebSocketJsonResponse = { - reconnect: true, - }; - obs.next(res); + + if (!firstConnect) { + let res: WebSocketJsonResponse = { + reconnect: true, + }; + obs.next(res); + } + + firstConnect = false; }; }).pipe(share()); }