Browse Source

Fixing some technical debt. Fixes #524

main
Dessalines 3 years ago
parent
commit
56b4613ecf
  1. 6
      package.json
  2. 60
      src/components/community.tsx
  3. 44
      src/components/inbox.tsx
  4. 71
      src/components/main.tsx
  5. 76
      src/components/post.tsx
  6. 37
      src/components/search.tsx
  7. 48
      src/components/user.tsx
  8. 88
      src/utils.ts
  9. 16
      yarn.lock

6
package.json

@ -7,7 +7,7 @@
"main": "index.js",
"scripts": {
"build": "node fuse prod",
"lint": "eslint --report-unused-disable-directives --ext .js,.ts,.tsx src",
"lint": "tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx src",
"start": "node fuse dev"
},
"keywords": [],
@ -22,7 +22,7 @@
"bootswatch": "^4.3.1",
"classcat": "^1.1.3",
"dotenv": "^8.2.0",
"emoji-short-name": "^0.1.0",
"emoji-short-name": "^1.0.0",
"husky": "^4.2.1",
"i18next": "^19.0.3",
"inferno": "^7.0.1",
@ -35,7 +35,7 @@
"markdown-it-emoji": "^1.4.0",
"moment": "^2.24.0",
"prettier": "^1.18.2",
"reconnecting-websocket": "^4.3.0",
"reconnecting-websocket": "^4.4.0",
"rxjs": "^6.4.0",
"terser": "^4.6.3",
"toastify-js": "^1.6.2",

60
src/components/community.tsx

@ -37,6 +37,12 @@ import {
getPageFromProps,
getSortTypeFromProps,
getDataTypeFromProps,
editCommentRes,
saveCommentRes,
createCommentLikeRes,
createPostLikeFindRes,
editPostFindRes,
commentsToFlatNodes,
} from '../utils';
import { i18n } from '../i18next';
@ -174,13 +180,7 @@ export class Community extends Component<any, State> {
return this.state.dataType == DataType.Post ? (
<PostListings posts={this.state.posts} removeDuplicates />
) : (
this.state.comments.map(comment => (
<div class="row">
<div class="col-12">
<CommentNodes nodes={[{ comment: comment }]} noIndent />
</div>
</div>
))
<CommentNodes nodes={commentsToFlatNodes(this.state.comments)} noIndent />
);
}
@ -333,30 +333,15 @@ export class Community extends Component<any, State> {
this.setState(this.state);
} else if (res.op == UserOperation.EditPost) {
let data = res.data as PostResponse;
let found = this.state.posts.find(c => c.id == data.post.id);
if (found) {
found.url = data.post.url;
found.name = data.post.name;
found.nsfw = data.post.nsfw;
this.setState(this.state);
}
editPostFindRes(data, this.state.posts);
this.setState(this.state);
} else if (res.op == UserOperation.CreatePost) {
let data = res.data as PostResponse;
this.state.posts.unshift(data.post);
this.setState(this.state);
} else if (res.op == UserOperation.CreatePostLike) {
let data = res.data as PostResponse;
let found = this.state.posts.find(c => c.id == data.post.id);
if (found) {
found.score = data.post.score;
found.upvotes = data.post.upvotes;
found.downvotes = data.post.downvotes;
if (data.post.my_vote !== null) {
found.my_vote = data.post.my_vote;
found.upvoteLoading = false;
found.downvoteLoading = false;
}
}
createPostLikeFindRes(data, this.state.posts);
this.setState(this.state);
} else if (res.op == UserOperation.AddModToCommunity) {
let data = res.data as AddModToCommunityResponse;
@ -377,18 +362,8 @@ export class Community extends Component<any, State> {
this.setState(this.state);
} else if (res.op == UserOperation.EditComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
if (found) {
found.content = data.comment.content;
found.updated = data.comment.updated;
found.removed = data.comment.removed;
found.deleted = data.comment.deleted;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
found.score = data.comment.score;
this.setState(this.state);
}
editCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateComment) {
let data = res.data as CommentResponse;
@ -399,18 +374,11 @@ export class Community extends Component<any, State> {
}
} else if (res.op == UserOperation.SaveComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
found.saved = data.comment.saved;
saveCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
let data = res.data as CommentResponse;
let found: Comment = this.state.comments.find(
c => c.id === data.comment.id
);
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
createCommentLikeRes(data, this.state.comments);
this.setState(this.state);
}
}

44
src/components/inbox.tsx

@ -19,7 +19,16 @@ import {
PrivateMessageResponse,
} from '../interfaces';
import { WebSocketService, UserService } from '../services';
import { wsJsonToRes, fetchLimit, isCommentType, toast } from '../utils';
import {
wsJsonToRes,
fetchLimit,
isCommentType,
toast,
editCommentRes,
saveCommentRes,
createCommentLikeRes,
commentsToFlatNodes,
} from '../utils';
import { CommentNodes } from './comment-nodes';
import { PrivateMessage } from './private-message';
import { SortSelect } from './sort-select';
@ -197,9 +206,11 @@ export class Inbox extends Component<any, InboxState> {
replies() {
return (
<div>
{this.state.replies.map(reply => (
<CommentNodes nodes={[{ comment: reply }]} noIndent markable />
))}
<CommentNodes
nodes={commentsToFlatNodes(this.state.replies)}
noIndent
markable
/>
</div>
);
}
@ -362,15 +373,7 @@ export class Inbox extends Component<any, InboxState> {
this.setState(this.state);
} else if (res.op == UserOperation.EditComment) {
let data = res.data as CommentResponse;
let found = this.state.replies.find(c => c.id == data.comment.id);
found.content = data.comment.content;
found.updated = data.comment.updated;
found.removed = data.comment.removed;
found.deleted = data.comment.deleted;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
found.score = data.comment.score;
editCommentRes(data, this.state.replies);
// If youre in the unread view, just remove it from the list
if (this.state.unreadOrAll == UnreadOrAll.Unread && data.comment.read) {
@ -418,28 +421,17 @@ export class Inbox extends Component<any, InboxState> {
this.setState(this.state);
} else if (res.op == UserOperation.CreatePrivateMessage) {
let data = res.data as PrivateMessageResponse;
if (data.message.recipient_id == UserService.Instance.user.id) {
this.state.messages.unshift(data.message);
this.setState(this.state);
} else if (data.message.creator_id == UserService.Instance.user.id) {
toast(i18n.t('message_sent'));
}
this.setState(this.state);
} else if (res.op == UserOperation.SaveComment) {
let data = res.data as CommentResponse;
let found = this.state.replies.find(c => c.id == data.comment.id);
found.saved = data.comment.saved;
saveCommentRes(data, this.state.replies);
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
let data = res.data as CommentResponse;
let found: Comment = this.state.replies.find(
c => c.id === data.comment.id
);
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
createCommentLikeRes(data, this.state.replies);
this.setState(this.state);
}
}

71
src/components/main.tsx

@ -45,6 +45,12 @@ import {
getPageFromProps,
getSortTypeFromProps,
getDataTypeFromProps,
editCommentRes,
saveCommentRes,
createCommentLikeRes,
createPostLikeFindRes,
editPostFindRes,
commentsToFlatNodes,
} from '../utils';
import { i18n } from '../i18next';
import { T } from 'inferno-i18next';
@ -400,17 +406,11 @@ export class Main extends Component<any, MainState> {
return this.state.dataType == DataType.Post ? (
<PostListings posts={this.state.posts} showCommunity removeDuplicates />
) : (
this.state.comments.map(comment => (
<div class="row">
<div class="col-12">
<CommentNodes
nodes={[{ comment: comment }]}
noIndent
showCommunity
/>
</div>
</div>
))
<CommentNodes
nodes={commentsToFlatNodes(this.state.comments)}
noIndent
showCommunity
/>
);
}
@ -625,28 +625,12 @@ export class Main extends Component<any, MainState> {
this.setState(this.state);
} else if (res.op == UserOperation.EditPost) {
let data = res.data as PostResponse;
let found = this.state.posts.find(c => c.id == data.post.id);
if (found) {
found.url = data.post.url;
found.name = data.post.name;
found.nsfw = data.post.nsfw;
this.setState(this.state);
}
editPostFindRes(data, this.state.posts);
this.setState(this.state);
} else if (res.op == UserOperation.CreatePostLike) {
let data = res.data as PostResponse;
let found = this.state.posts.find(c => c.id == data.post.id);
if (found) {
found.score = data.post.score;
found.upvotes = data.post.upvotes;
found.downvotes = data.post.downvotes;
if (data.post.my_vote !== null) {
found.my_vote = data.post.my_vote;
found.upvoteLoading = false;
found.downvoteLoading = false;
}
this.setState(this.state);
}
createPostLikeFindRes(data, this.state.posts);
this.setState(this.state);
} else if (res.op == UserOperation.AddAdmin) {
let data = res.data as AddAdminResponse;
this.state.siteRes.admins = data.admins;
@ -676,18 +660,8 @@ export class Main extends Component<any, MainState> {
this.setState(this.state);
} else if (res.op == UserOperation.EditComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
if (found) {
found.content = data.comment.content;
found.updated = data.comment.updated;
found.removed = data.comment.removed;
found.deleted = data.comment.deleted;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
found.score = data.comment.score;
this.setState(this.state);
}
editCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateComment) {
let data = res.data as CommentResponse;
@ -709,18 +683,11 @@ export class Main extends Component<any, MainState> {
}
} else if (res.op == UserOperation.SaveComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
found.saved = data.comment.saved;
saveCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
let data = res.data as CommentResponse;
let found: Comment = this.state.comments.find(
c => c.id === data.comment.id
);
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
createCommentLikeRes(data, this.state.comments);
this.setState(this.state);
}
}

76
src/components/post.tsx

@ -29,7 +29,16 @@ import {
WebSocketJsonResponse,
} from '../interfaces';
import { WebSocketService, UserService } from '../services';
import { wsJsonToRes, hotRank, toast } from '../utils';
import {
wsJsonToRes,
hotRank,
toast,
editCommentRes,
saveCommentRes,
createCommentLikeRes,
createPostLikeRes,
commentsToFlatNodes,
} from '../utils';
import { PostListing } from './post-listing';
import { PostListings } from './post-listings';
import { Sidebar } from './sidebar';
@ -256,16 +265,14 @@ export class Post extends Component<any, PostState> {
<div class="d-none d-md-block new-comments mb-3 card border-secondary">
<div class="card-body small">
<h6>{i18n.t('recent_comments')}</h6>
{this.state.comments.map(comment => (
<CommentNodes
nodes={[{ comment: comment }]}
noIndent
locked={this.state.post.locked}
moderators={this.state.moderators}
admins={this.state.admins}
postCreatorId={this.state.post.creator_id}
/>
))}
<CommentNodes
nodes={commentsToFlatNodes(this.state.comments)}
noIndent
locked={this.state.post.locked}
moderators={this.state.moderators}
admins={this.state.admins}
postCreatorId={this.state.post.creator_id}
/>
</div>
</div>
);
@ -408,53 +415,19 @@ export class Post extends Component<any, PostState> {
}
} else if (res.op == UserOperation.EditComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
if (found) {
found.content = data.comment.content;
found.updated = data.comment.updated;
found.removed = data.comment.removed;
found.deleted = data.comment.deleted;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
found.score = data.comment.score;
found.read = data.comment.read;
this.setState(this.state);
}
editCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.SaveComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
if (found) {
found.saved = data.comment.saved;
this.setState(this.state);
}
saveCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
let data = res.data as CommentResponse;
let found: Comment = this.state.comments.find(
c => c.id === data.comment.id
);
if (found) {
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) {
found.my_vote = data.comment.my_vote;
found.upvoteLoading = false;
found.downvoteLoading = false;
}
}
createCommentLikeRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreatePostLike) {
let data = res.data as PostResponse;
this.state.post.score = data.post.score;
this.state.post.upvotes = data.post.upvotes;
this.state.post.downvotes = data.post.downvotes;
if (data.post.my_vote !== null) {
this.state.post.my_vote = data.post.my_vote;
this.state.post.upvoteLoading = false;
this.state.post.downvoteLoading = false;
}
createPostLikeRes(data, this.state.post);
this.setState(this.state);
} else if (res.op == UserOperation.EditPost) {
let data = res.data as PostResponse;
@ -510,7 +483,6 @@ export class Post extends Component<any, PostState> {
this.setState(this.state);
} else if (res.op == UserOperation.TransferSite) {
let data = res.data as GetSiteResponse;
this.state.admins = data.admins;
this.setState(this.state);
} else if (res.op == UserOperation.TransferCommunity) {

37
src/components/search.tsx

@ -25,6 +25,9 @@ import {
pictshareAvatarThumbnail,
showAvatars,
toast,
createCommentLikeRes,
createPostLikeFindRes,
commentsToFlatNodes,
} from '../utils';
import { PostListing } from './post-listing';
import { SortSelect } from './sort-select';
@ -294,15 +297,11 @@ export class Search extends Component<any, SearchState> {
comments() {
return (
<>
{this.state.searchResponse.comments.map(comment => (
<div class="row">
<div class="col-12">
<CommentNodes nodes={[{ comment: comment }]} locked noIndent />
</div>
</div>
))}
</>
<CommentNodes
nodes={commentsToFlatNodes(this.state.searchResponse.comments)}
locked
noIndent
/>
);
}
@ -474,27 +473,11 @@ export class Search extends Component<any, SearchState> {
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
let data = res.data as CommentResponse;
let found: Comment = this.state.searchResponse.comments.find(
c => c.id === data.comment.id
);
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) {
found.my_vote = data.comment.my_vote;
found.upvoteLoading = false;
found.downvoteLoading = false;
}
createCommentLikeRes(data, this.state.searchResponse.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreatePostLike) {
let data = res.data as PostResponse;
let found = this.state.searchResponse.posts.find(
c => c.id == data.post.id
);
found.my_vote = data.post.my_vote;
found.score = data.post.score;
found.upvotes = data.post.upvotes;
found.downvotes = data.post.downvotes;
createPostLikeFindRes(data, this.state.searchResponse.posts);
this.setState(this.state);
}
}

48
src/components/user.tsx

@ -32,6 +32,11 @@ import {
languages,
showAvatars,
toast,
editCommentRes,
saveCommentRes,
createCommentLikeRes,
createPostLikeFindRes,
commentsToFlatNodes,
} from '../utils';
import { PostListing } from './post-listing';
import { SortSelect } from './sort-select';
@ -316,13 +321,11 @@ export class User extends Component<any, UserState> {
comments() {
return (
<div>
{this.state.comments.map(comment => (
<CommentNodes
nodes={[{ comment: comment }]}
admins={this.state.admins}
noIndent
/>
))}
<CommentNodes
nodes={commentsToFlatNodes(this.state.comments)}
admins={this.state.admins}
noIndent
/>
</div>
);
}
@ -1032,18 +1035,8 @@ export class User extends Component<any, UserState> {
this.setState(this.state);
} else if (res.op == UserOperation.EditComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
if (found) {
found.content = data.comment.content;
found.updated = data.comment.updated;
found.removed = data.comment.removed;
found.deleted = data.comment.deleted;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
found.score = data.comment.score;
this.setState(this.state);
}
editCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateComment) {
let data = res.data as CommentResponse;
if (
@ -1054,26 +1047,15 @@ export class User extends Component<any, UserState> {
}
} else if (res.op == UserOperation.SaveComment) {
let data = res.data as CommentResponse;
let found = this.state.comments.find(c => c.id == data.comment.id);
found.saved = data.comment.saved;
saveCommentRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
let data = res.data as CommentResponse;
let found: Comment = this.state.comments.find(
c => c.id === data.comment.id
);
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) found.my_vote = data.comment.my_vote;
createCommentLikeRes(data, this.state.comments);
this.setState(this.state);
} else if (res.op == UserOperation.CreatePostLike) {
let data = res.data as PostResponse;
let found = this.state.posts.find(c => c.id == data.post.id);
found.my_vote = data.post.my_vote;
found.score = data.post.score;
found.upvotes = data.post.upvotes;
found.downvotes = data.post.downvotes;
createPostLikeFindRes(data, this.state.posts);
this.setState(this.state);
} else if (res.op == UserOperation.BanUser) {
let data = res.data as BanUserResponse;

88
src/utils.ts

@ -15,6 +15,8 @@ import 'moment/locale/pt-br';
import {
UserOperation,
Comment,
CommentNode,
Post,
PrivateMessage,
User,
SortType,
@ -25,6 +27,8 @@ import {
WebSocketJsonResponse,
SearchForm,
SearchResponse,
CommentResponse,
PostResponse,
} from './interfaces';
import { UserService, WebSocketService } from './services';
@ -551,3 +555,87 @@ export function getSortTypeFromProps(props: any): SortType {
export function getPageFromProps(props: any): number {
return props.match.params.page ? Number(props.match.params.page) : 1;
}
export function editCommentRes(
data: CommentResponse,
comments: Array<Comment>
) {
let found = comments.find(c => c.id == data.comment.id);
if (found) {
found.content = data.comment.content;
found.updated = data.comment.updated;
found.removed = data.comment.removed;
found.deleted = data.comment.deleted;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
found.score = data.comment.score;
}
}
export function saveCommentRes(
data: CommentResponse,
comments: Array<Comment>
) {
let found = comments.find(c => c.id == data.comment.id);
if (found) {
found.saved = data.comment.saved;
}
}
export function createCommentLikeRes(
data: CommentResponse,
comments: Array<Comment>
) {
let found: Comment = comments.find(c => c.id === data.comment.id);
if (found) {
found.score = data.comment.score;
found.upvotes = data.comment.upvotes;
found.downvotes = data.comment.downvotes;
if (data.comment.my_vote !== null) {
found.my_vote = data.comment.my_vote;
found.upvoteLoading = false;
found.downvoteLoading = false;
}
}
}
export function createPostLikeFindRes(data: PostResponse, posts: Array<Post>) {
let found = posts.find(c => c.id == data.post.id);
if (found) {
createPostLikeRes(data, found);
}
}
export function createPostLikeRes(data: PostResponse, post: Post) {
post.score = data.post.score;
post.upvotes = data.post.upvotes;
post.downvotes = data.post.downvotes;
if (data.post.my_vote !== null) {
post.my_vote = data.post.my_vote;
post.upvoteLoading = false;
post.downvoteLoading = false;
}
}
export function editPostFindRes(data: PostResponse, posts: Array<Post>) {
let found = posts.find(c => c.id == data.post.id);
if (found) {
editPostRes(data, found);
}
}
export function editPostRes(data: PostResponse, post: Post) {
post.url = data.post.url;
post.name = data.post.name;
post.nsfw = data.post.nsfw;
}
export function commentsToFlatNodes(
comments: Array<Comment>
): Array<CommentNode> {
let nodes: Array<CommentNode> = [];
for (let comment of comments) {
nodes.push({ comment: comment });
}
return nodes;
}

16
yarn.lock

@ -1079,10 +1079,10 @@ [email protected]^8.0.0:
resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-8.0.0.tgz#e818fd69ce5ccfcb404594f842963bf53164cc37"
integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==
[email protected]^0.1.0:
version "0.1.4"
resolved "https://registry.yarnpkg.com/emoji-short-name/-/emoji-short-name-0.1.4.tgz#125a452adc22a399b089f802f9d8d46ecb6e5b08"
integrity sha512-VTjEKkhN1UARtHLqlK70N5K3SwxuZAkmdm5sXvSjkV677kr0jt/O7mvB5eQqM+3rKCa+w3Qb5G7wwU/fezonKQ==
[email protected]^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/emoji-short-name/-/emoji-short-name-1.0.0.tgz#82e6f543b6c68984d69bdc80eac735104fdd4af8"
integrity sha512-+tiniHvgRR7XMI1jAaGveumWg5LALE/nWkFD6CcOn6M5IDM9w4PkMs8UwzLTMoZtDLdTdQmzxGvLOxHVIjPzjg==
[email protected]~1.0.2:
version "1.0.2"
@ -3731,10 +3731,10 @@ [email protected]^1.0.9:
app-root-path "^1.3.0"
mkdirp "^0.5.1"
[email protected]^4.3.0:
version "4.3.0"
resolved "https://registry.yarnpkg.com/reconnecting-websocket/-/reconnecting-websocket-4.3.0.tgz#aaefbc7629a89450aa45324b89aec2276e728cc5"
integrity sha512-3eaHIEVYB9Zb0GfYy1xdEHKJLA2JaawAegByZ1AZ8Npb3AiRgUN5l89cvE2H+pHTsFcoC88t32ky9qET6DJ75Q==
[email protected]^4.4.0:
version "4.4.0"
resolved "https://registry.yarnpkg.com/reconnecting-websocket/-/reconnecting-websocket-4.4.0.tgz#3b0e5b96ef119e78a03135865b8bb0af1b948783"
integrity sha512-D2E33ceRPga0NvTDhJmphEgJ7FUYF0v4lr1ki0csq06OdlxKfugGzN0dSkxM/NfqCxYELK4KcaTOUOjTV6Dcng==
[email protected]^8.1.0:
version "8.1.0"

Loading…
Cancel
Save