- {o.user.name}
-
- {' '}
-
+
+ {o.user.name}
+
+
- You signed in as
- {' '}
- {user.name}
- {isUserIdVisible && ({user.id})}.
- {' '}
- Sign out?
-
- )
- }
+ {loggedIn && (
+
+ You signed in as{' '}
+
+ {user.name}
+
+ {isUserIdVisible && ({user.id})}.{' '}
+
+ Sign out?
+
+
+ )}
- {
- !loggedIn && (
-
- Sign in to comment using
- {' '}
- {
- providers.map((provider, i) => {
- const comma = i === 0 ? '' : (i === providers.length - 1 ? ' or ' : ', ');
+ {!loggedIn && (
+
+ )}
+ Sign in to comment using{' '}
+ {providers.map((provider, i) => {
+ const comma = i === 0 ? '' : i === providers.length - 1 ? ' or ' : ', ';
- return (
-
- {comma}
- props.onSignIn(provider)}
- >{PROVIDER_NAMES[provider]}
-
- );
- })
- }
- {'.'}
-
- )
- }
+ return (
+
+ {comma}
+ props.onSignIn(provider)}
+ >
+ {PROVIDER_NAMES[provider]}
+
+
+ );
+ })}
+ {'.'}
+
- {
- user.admin && (
- {isBlockedVisible ? 'Hide' : 'Show'} blocked
- )
- }
+ {user.admin && (
+
+ {isBlockedVisible ? 'Hide' : 'Show'} blocked
+
+ )}
{user.admin && ' • '}
- Sort by
- {' '}
+ Sort by{' '}
diff --git a/web/app/components/blocked-users/blocked-users.jsx b/web/app/components/blocked-users/blocked-users.jsx
index a2c78996..82a87606 100644
--- a/web/app/components/blocked-users/blocked-users.jsx
+++ b/web/app/components/blocked-users/blocked-users.jsx
@@ -1,3 +1,4 @@
+/** @jsx h */
import { h, Component } from 'preact';
import api from 'common/api';
@@ -36,49 +37,34 @@ export default class BlockedUsers extends Component {
return (
{' '}
+
);
}
return (
-
- {
- !users.length && (
-
);
}
diff --git a/web/app/components/comment/comment.jsx b/web/app/components/comment/comment.jsx
index 39d8ede2..cc48f897 100644
--- a/web/app/components/comment/comment.jsx
+++ b/web/app/components/comment/comment.jsx
@@ -1,3 +1,4 @@
+/** @jsx h */
import { h, Component } from 'preact';
import api from 'common/api';
@@ -47,10 +48,17 @@ export default class Comment extends Component {
}
updateState(props) {
- const { data, data: { user: { block, id: commentUserId }, pin }, mods: { guest } = {} } = props;
+ const {
+ data,
+ data: {
+ user: { block, id: commentUserId },
+ pin,
+ },
+ mods: { guest } = {},
+ } = props;
- const votes = data && data.votes || [];
- const score = data && data.score || 0;
+ const votes = (data && data.votes) || [];
+ const score = (data && data.score) || 0;
if (this.editTimerInterval) {
clearInterval(this.editTimerInterval);
@@ -156,7 +164,10 @@ export default class Comment extends Component {
}
onVerifyClick() {
- const { id, user: { id: userId } } = this.props.data;
+ const {
+ id,
+ user: { id: userId },
+ } = this.props.data;
if (confirm('Do you want to verify this user?')) {
this.setState({ isUserVerified: true });
@@ -168,7 +179,10 @@ export default class Comment extends Component {
}
onUnverifyClick() {
- const { id, user: { id: userId } } = this.props.data;
+ const {
+ id,
+ user: { id: userId },
+ } = this.props.data;
if (confirm('Do you want to unverify this user?')) {
this.setState({ isUserVerified: false });
@@ -180,7 +194,10 @@ export default class Comment extends Component {
}
onBlockClick() {
- const { id, user: { id: userId } } = this.props.data;
+ const {
+ id,
+ user: { id: userId },
+ } = this.props.data;
if (confirm('Do you want to block this user?')) {
this.setState({ userBlocked: true });
@@ -192,7 +209,10 @@ export default class Comment extends Component {
}
onUnblockClick() {
- const { id, user: { id: userId } } = this.props.data;
+ const {
+ id,
+ user: { id: userId },
+ } = this.props.data;
if (confirm('Do you want to unblock this user?')) {
this.setState({ userBlocked: false });
@@ -231,13 +251,11 @@ export default class Comment extends Component {
score: score + 1,
});
- this.votingPromise = this.votingPromise
- .then(() => {
- return api.putCommentVote({ id, url, value: 1 })
- .then(() => {
- api.getComment({ id }).then(comment => store.replaceComment(comment));
- });
+ this.votingPromise = this.votingPromise.then(() => {
+ return api.putCommentVote({ id, url, value: 1 }).then(() => {
+ api.getComment({ id }).then(comment => store.replaceComment(comment));
});
+ });
}
decreaseScore() {
@@ -252,13 +270,11 @@ export default class Comment extends Component {
score: score - 1,
});
- this.votingPromise = this.votingPromise
- .then(() => {
- return api.putCommentVote({ id, url, value: -1 })
- .then(() => {
- api.getComment({ id }).then(comment => store.replaceComment(comment));
- });
+ this.votingPromise = this.votingPromise.then(() => {
+ return api.putCommentVote({ id, url, value: -1 }).then(() => {
+ api.getComment({ id }).then(comment => store.replaceComment(comment));
});
+ });
}
onReply(...rest) {
@@ -278,7 +294,9 @@ export default class Comment extends Component {
}
scrollToParent(e) {
- const { data: { pid } } = this.props;
+ const {
+ data: { pid },
+ } = this.props;
e.preventDefault();
@@ -300,20 +318,23 @@ export default class Comment extends Component {
}
}
- render(props, {
- guest,
- userBlocked,
- pinned,
- score,
- scoreIncreased,
- scoreDecreased,
- deleted,
- isReplying,
- isEditing,
- isUserVerified,
- editTimeLeft,
- isUserInfoShown,
- }) {
+ render(
+ props,
+ {
+ guest,
+ userBlocked,
+ pinned,
+ score,
+ scoreIncreased,
+ scoreDecreased,
+ deleted,
+ isReplying,
+ isEditing,
+ isUserVerified,
+ editTimeLeft,
+ isUserInfoShown,
+ }
+ ) {
const { data, mods = {} } = props;
const isAdmin = !guest && store.get('user').admin;
const isGuest = guest || !Object.keys(store.get('user')).length;
@@ -323,33 +344,28 @@ export default class Comment extends Component {
const o = {
...data,
- text:
- data.text.length
- ? (mods.view === 'preview' ? getTextSnippet(data.text) : data.text)
- : (
- userBlocked
- ? 'This user was blocked'
- : (
- deleted
- ? 'This comment was deleted'
- : data.text
- )
- ),
+ text: data.text.length
+ ? mods.view === 'preview'
+ ? getTextSnippet(data.text)
+ : data.text
+ : userBlocked
+ ? 'This user was blocked'
+ : deleted
+ ? 'This comment was deleted'
+ : data.text,
time: formatTime(new Date(data.time)),
orig: isEditing
- ? (
- data.orig && data.orig
- .replace(/&[#A-Za-z0-9]+;/gi, entity => {
- const span = document.createElement('span');
- span.innerHTML = entity;
- return span.innerText;
- })
- )
+ ? data.orig &&
+ data.orig.replace(/&[#A-Za-z0-9]+;/gi, entity => {
+ const span = document.createElement('span');
+ span.innerHTML = entity;
+ return span.innerText;
+ })
: data.orig,
score: {
value: Math.abs(score),
- sign: score > 0 ? '+' : (score < 0 ? '−' : null),
- view: score > 0 ? 'positive' : (score < 0 ? 'negative' : null),
+ sign: score > 0 ? '+' : score < 0 ? '−' : null,
+ view: score > 0 ? 'positive' : score < 0 ? 'negative' : null,
},
user: {
...data.user,
@@ -374,66 +390,59 @@ export default class Comment extends Component {
There are no blocked users.
- ) - } + {!users.length &&There are no blocked users.
} - { - !!users.length && ( -List of blocked users:
- ) - } + {!!users.length &&List of blocked users:
} - { - !!users.length && ( --
- {
- users.map(user => {
- const isUserUnblocked = unblockedUsers.includes(user.id);
+ {!!users.length && (
+
- - {user.name} - {' '} - ({user.id}) - - { - isUserUnblocked && ( - this.block(user)}>block - ) - } - - { - !isUserUnblocked && ( - this.unblock(user)}>unblock - ) - } - - ); - }) - } -
- + {user.name}{' '} + ({user.id}) + {isUserUnblocked && ( + this.block(user)}> + block + + )} + {!isUserUnblocked && ( + this.unblock(user)}> + unblock + + )} + + ); + })} +
-
+ {users.map(user => {
+ const isUserUnblocked = unblockedUsers.includes(user.id);
- return (
-
- {
- mods.view !== 'user' && (
- 
- )
- }
+ {mods.view !== 'user' && (
+
+ )}
- {
- mods.view !== 'user' && (
- {o.user.name}
- )
- }
+ {mods.view !== 'user' && (
+
+ {o.user.name}
+
+ )}
- {
- isAdmin && mods.view !== 'user' && (
+ {isAdmin &&
+ mods.view !== 'user' && (
- )
- }
+ )}
- {
- !isAdmin && !!o.user.verified && mods.view !== 'user' && (
-
- )
- }
+ {!isAdmin &&
+ !!o.user.verified &&
+ mods.view !== 'user' && (
+
+ )}
- {o.time}
+
+ {o.time}
+
- {
- mods.level > 0 && mods.view !== 'user' && (
+ {mods.level > 0 &&
+ mods.view !== 'user' && (
- )
- }
+ )}
- {
- isAdmin && userBlocked && mods.view !== 'user' && (
- Blocked
- )
- }
+ {isAdmin && userBlocked && mods.view !== 'user' && Blocked}
- {
- isAdmin && !userBlocked && deleted && (
- Deleted
- )
- }
+ {isAdmin && !userBlocked && deleted && Deleted}
- {
- !mods.disabled && mods.view !== 'user' && (
+ {!mods.disabled &&
+ mods.view !== 'user' && (
{mods.collapsed ? '+' : '−'}
- )
- }
+ >
+ {mods.collapsed ? '+' : '−'}
+
+ )}
Vote up
-
-
- {o.score.sign}{o.score.value}
+ title={
+ isGuest
+ ? 'Only authorized users are allowed to vote'
+ : isCurrentUser
+ ? "You can't vote for your own comment"
+ : null
+ }
+ >
+ Vote up
+
+ {o.score.sign}
+ {o.score.value}
+
Vote down
+ title={
+ isGuest
+ ? 'Only authorized users are allowed to vote'
+ : isCurrentUser
+ ? "You can't vote for your own comment"
+ : null
+ }
+ >
+ Vote down
+
-
+
- {
- !deleted && !mods.disabled && !isGuest && mods.view !== 'user' && (
- {isReplying ? 'Cancel' : 'Reply'}
- )
- }
+ {!deleted &&
+ !mods.disabled &&
+ !isGuest &&
+ mods.view !== 'user' && (
+
+ {isReplying ? 'Cancel' : 'Reply'}
+
+ )}
- {
- !deleted && !mods.disabled && !!o.orig && isCurrentUser && (!!editTimeLeft || isEditing) && mods.view !== 'user' && (
+ {!deleted &&
+ !mods.disabled &&
+ !!o.orig &&
+ isCurrentUser &&
+ (!!editTimeLeft || isEditing) &&
+ mods.view !== 'user' && (
{isEditing ? 'Cancel' : 'Edit'}{editTimeLeft && ` (${editTimeLeft})`}
- )
- }
-
- {
- !deleted && isAdmin && (
-
- {
- !pinned && (
- Pin
- )
- }
-
- {
- pinned && (
- Unpin
- )
- }
-
- {
- userBlocked && (
- Unblock
- )
- }
-
- {
- !userBlocked && (
- Block
- )
- }
-
- {
- !deleted && (
- Delete
- )
- }
+ >
+ {isEditing ? 'Cancel' : 'Edit'}
+ {editTimeLeft && ` (${editTimeLeft})`}
- )
- }
+ )}
+
+ {!deleted &&
+ isAdmin && (
+
+ {!pinned && (
+
+ Pin
+
+ )}
+
+ {pinned && (
+
+ Unpin
+
+ )}
+
+ {userBlocked && (
+
+ Unblock
+
+ )}
+
+ {!userBlocked && (
+
+ Block
+
+ )}
+
+ {!deleted && (
+
+ Delete
+
+ )}
+
+ )}