Doing comment-node, comment-form and private-message.
This commit is contained in:
parent
ccda4d8453
commit
6124133e85
3 changed files with 37 additions and 42 deletions
9
ui/src/components/comment-form.tsx
vendored
9
ui/src/components/comment-form.tsx
vendored
|
@ -15,7 +15,6 @@ import { WebSocketService, UserService } from '../services';
|
||||||
import autosize from 'autosize';
|
import autosize from 'autosize';
|
||||||
import Tribute from 'tributejs/src/Tribute.js';
|
import Tribute from 'tributejs/src/Tribute.js';
|
||||||
import { i18n } from '../i18next';
|
import { i18n } from '../i18next';
|
||||||
import { T } from 'inferno-i18next';
|
|
||||||
|
|
||||||
interface CommentFormProps {
|
interface CommentFormProps {
|
||||||
postId?: number;
|
postId?: number;
|
||||||
|
@ -127,7 +126,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
|
||||||
.previewMode && 'active'}`}
|
.previewMode && 'active'}`}
|
||||||
onClick={linkEvent(this, this.handlePreviewToggle)}
|
onClick={linkEvent(this, this.handlePreviewToggle)}
|
||||||
>
|
>
|
||||||
<T i18nKey="preview">#</T>
|
{i18n.t('preview')}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
{this.props.node && (
|
{this.props.node && (
|
||||||
|
@ -136,7 +135,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
|
||||||
class="btn btn-sm btn-secondary mr-2"
|
class="btn btn-sm btn-secondary mr-2"
|
||||||
onClick={linkEvent(this, this.handleReplyCancel)}
|
onClick={linkEvent(this, this.handleReplyCancel)}
|
||||||
>
|
>
|
||||||
<T i18nKey="cancel">#</T>
|
{i18n.t('cancel')}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
<a
|
<a
|
||||||
|
@ -144,14 +143,14 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
|
||||||
target="_blank"
|
target="_blank"
|
||||||
class="d-inline-block float-right text-muted small font-weight-bold"
|
class="d-inline-block float-right text-muted small font-weight-bold"
|
||||||
>
|
>
|
||||||
<T i18nKey="formatting_help">#</T>
|
{i18n.t('formatting_help')}
|
||||||
</a>
|
</a>
|
||||||
<form class="d-inline-block mr-2 float-right text-muted small font-weight-bold">
|
<form class="d-inline-block mr-2 float-right text-muted small font-weight-bold">
|
||||||
<label
|
<label
|
||||||
htmlFor={`file-upload-${this.id}`}
|
htmlFor={`file-upload-${this.id}`}
|
||||||
className={`${UserService.Instance.user && 'pointer'}`}
|
className={`${UserService.Instance.user && 'pointer'}`}
|
||||||
>
|
>
|
||||||
<T i18nKey="upload_image">#</T>
|
{i18n.t('upload_image')}
|
||||||
</label>
|
</label>
|
||||||
<input
|
<input
|
||||||
id={`file-upload-${this.id}`}
|
id={`file-upload-${this.id}`}
|
||||||
|
|
63
ui/src/components/comment-node.tsx
vendored
63
ui/src/components/comment-node.tsx
vendored
|
@ -30,7 +30,6 @@ import { MomentTime } from './moment-time';
|
||||||
import { CommentForm } from './comment-form';
|
import { CommentForm } from './comment-form';
|
||||||
import { CommentNodes } from './comment-nodes';
|
import { CommentNodes } from './comment-nodes';
|
||||||
import { i18n } from '../i18next';
|
import { i18n } from '../i18next';
|
||||||
import { T } from 'inferno-i18next';
|
|
||||||
|
|
||||||
interface CommentNodeState {
|
interface CommentNodeState {
|
||||||
showReply: boolean;
|
showReply: boolean;
|
||||||
|
@ -180,22 +179,22 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
</li>
|
</li>
|
||||||
{this.isMod && (
|
{this.isMod && (
|
||||||
<li className="list-inline-item badge badge-light">
|
<li className="list-inline-item badge badge-light">
|
||||||
<T i18nKey="mod">#</T>
|
{i18n.t('mod')}
|
||||||
</li>
|
</li>
|
||||||
)}
|
)}
|
||||||
{this.isAdmin && (
|
{this.isAdmin && (
|
||||||
<li className="list-inline-item badge badge-light">
|
<li className="list-inline-item badge badge-light">
|
||||||
<T i18nKey="admin">#</T>
|
{i18n.t('admin')}
|
||||||
</li>
|
</li>
|
||||||
)}
|
)}
|
||||||
{this.isPostCreator && (
|
{this.isPostCreator && (
|
||||||
<li className="list-inline-item badge badge-light">
|
<li className="list-inline-item badge badge-light">
|
||||||
<T i18nKey="creator">#</T>
|
{i18n.t('creator')}
|
||||||
</li>
|
</li>
|
||||||
)}
|
)}
|
||||||
{(node.comment.banned_from_community || node.comment.banned) && (
|
{(node.comment.banned_from_community || node.comment.banned) && (
|
||||||
<li className="list-inline-item badge badge-danger">
|
<li className="list-inline-item badge badge-danger">
|
||||||
<T i18nKey="banned">#</T>
|
{i18n.t('banned')}
|
||||||
</li>
|
</li>
|
||||||
)}
|
)}
|
||||||
<li className="list-inline-item">
|
<li className="list-inline-item">
|
||||||
|
@ -258,7 +257,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
class="pointer"
|
class="pointer"
|
||||||
onClick={linkEvent(this, this.handleReplyClick)}
|
onClick={linkEvent(this, this.handleReplyClick)}
|
||||||
>
|
>
|
||||||
<T i18nKey="reply">#</T>
|
{i18n.t('reply')}
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
<li className="list-inline-item mr-2">
|
<li className="list-inline-item mr-2">
|
||||||
|
@ -276,7 +275,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
class="pointer"
|
class="pointer"
|
||||||
onClick={linkEvent(this, this.handleEditClick)}
|
onClick={linkEvent(this, this.handleEditClick)}
|
||||||
>
|
>
|
||||||
<T i18nKey="edit">#</T>
|
{i18n.t('edit')}
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
<li className="list-inline-item">
|
<li className="list-inline-item">
|
||||||
|
@ -307,7 +306,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
className="pointer"
|
className="pointer"
|
||||||
onClick={linkEvent(this, this.handleViewSource)}
|
onClick={linkEvent(this, this.handleViewSource)}
|
||||||
>
|
>
|
||||||
<T i18nKey="view_source">#</T>
|
{i18n.t('view_source')}
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
<li className="list-inline-item">
|
<li className="list-inline-item">
|
||||||
|
@ -315,7 +314,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
className="text-muted"
|
className="text-muted"
|
||||||
to={`/post/${node.comment.post_id}/comment/${node.comment.id}`}
|
to={`/post/${node.comment.post_id}/comment/${node.comment.id}`}
|
||||||
>
|
>
|
||||||
<T i18nKey="link">#</T>
|
{i18n.t('link')}
|
||||||
</Link>
|
</Link>
|
||||||
</li>
|
</li>
|
||||||
{/* Admins and mods can remove comments */}
|
{/* Admins and mods can remove comments */}
|
||||||
|
@ -331,7 +330,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleModRemoveShow
|
this.handleModRemoveShow
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="remove">#</T>
|
{i18n.t('remove')}
|
||||||
</span>
|
</span>
|
||||||
) : (
|
) : (
|
||||||
<span
|
<span
|
||||||
|
@ -341,7 +340,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleModRemoveSubmit
|
this.handleModRemoveSubmit
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="restore">#</T>
|
{i18n.t('restore')}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</li>
|
</li>
|
||||||
|
@ -360,7 +359,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleModBanFromCommunityShow
|
this.handleModBanFromCommunityShow
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="ban">#</T>
|
{i18n.t('ban')}
|
||||||
</span>
|
</span>
|
||||||
) : (
|
) : (
|
||||||
<span
|
<span
|
||||||
|
@ -370,7 +369,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleModBanFromCommunitySubmit
|
this.handleModBanFromCommunitySubmit
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="unban">#</T>
|
{i18n.t('unban')}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</li>
|
</li>
|
||||||
|
@ -392,7 +391,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<span class="d-inline-block mr-1">
|
<span class="d-inline-block mr-1">
|
||||||
<T i18nKey="are_you_sure">#</T>
|
{i18n.t('are_you_sure')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block mr-1"
|
class="pointer d-inline-block mr-1"
|
||||||
|
@ -401,7 +400,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleAddModToCommunity
|
this.handleAddModToCommunity
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="yes">#</T>
|
{i18n.t('yes')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block"
|
class="pointer d-inline-block"
|
||||||
|
@ -410,7 +409,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleCancelConfirmAppointAsMod
|
this.handleCancelConfirmAppointAsMod
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="no">#</T>
|
{i18n.t('no')}
|
||||||
</span>
|
</span>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
@ -429,12 +428,12 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleShowConfirmTransferCommunity
|
this.handleShowConfirmTransferCommunity
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="transfer_community">#</T>
|
{i18n.t('transfer_community')}
|
||||||
</span>
|
</span>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<span class="d-inline-block mr-1">
|
<span class="d-inline-block mr-1">
|
||||||
<T i18nKey="are_you_sure">#</T>
|
{i18n.t('are_you_sure')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block mr-1"
|
class="pointer d-inline-block mr-1"
|
||||||
|
@ -443,7 +442,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleTransferCommunity
|
this.handleTransferCommunity
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="yes">#</T>
|
{i18n.t('yes')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block"
|
class="pointer d-inline-block"
|
||||||
|
@ -452,7 +451,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleCancelShowConfirmTransferCommunity
|
this.handleCancelShowConfirmTransferCommunity
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="no">#</T>
|
{i18n.t('no')}
|
||||||
</span>
|
</span>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
@ -468,7 +467,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
class="pointer"
|
class="pointer"
|
||||||
onClick={linkEvent(this, this.handleModBanShow)}
|
onClick={linkEvent(this, this.handleModBanShow)}
|
||||||
>
|
>
|
||||||
<T i18nKey="ban_from_site">#</T>
|
{i18n.t('ban_from_site')}
|
||||||
</span>
|
</span>
|
||||||
) : (
|
) : (
|
||||||
<span
|
<span
|
||||||
|
@ -478,7 +477,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleModBanSubmit
|
this.handleModBanSubmit
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="unban_from_site">#</T>
|
{i18n.t('unban_from_site')}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</li>
|
</li>
|
||||||
|
@ -500,13 +499,13 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<span class="d-inline-block mr-1">
|
<span class="d-inline-block mr-1">
|
||||||
<T i18nKey="are_you_sure">#</T>
|
{i18n.t('are_you_sure')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block mr-1"
|
class="pointer d-inline-block mr-1"
|
||||||
onClick={linkEvent(this, this.handleAddAdmin)}
|
onClick={linkEvent(this, this.handleAddAdmin)}
|
||||||
>
|
>
|
||||||
<T i18nKey="yes">#</T>
|
{i18n.t('yes')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block"
|
class="pointer d-inline-block"
|
||||||
|
@ -515,7 +514,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleCancelConfirmAppointAsAdmin
|
this.handleCancelConfirmAppointAsAdmin
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="no">#</T>
|
{i18n.t('no')}
|
||||||
</span>
|
</span>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
@ -534,18 +533,18 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleShowConfirmTransferSite
|
this.handleShowConfirmTransferSite
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="transfer_site">#</T>
|
{i18n.t('transfer_site')}
|
||||||
</span>
|
</span>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<span class="d-inline-block mr-1">
|
<span class="d-inline-block mr-1">
|
||||||
<T i18nKey="are_you_sure">#</T>
|
{i18n.t('are_you_sure')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block mr-1"
|
class="pointer d-inline-block mr-1"
|
||||||
onClick={linkEvent(this, this.handleTransferSite)}
|
onClick={linkEvent(this, this.handleTransferSite)}
|
||||||
>
|
>
|
||||||
<T i18nKey="yes">#</T>
|
{i18n.t('yes')}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="pointer d-inline-block"
|
class="pointer d-inline-block"
|
||||||
|
@ -554,7 +553,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
this.handleCancelShowConfirmTransferSite
|
this.handleCancelShowConfirmTransferSite
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<T i18nKey="no">#</T>
|
{i18n.t('no')}
|
||||||
</span>
|
</span>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
@ -579,16 +578,14 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
||||||
onInput={linkEvent(this, this.handleModRemoveReasonChange)}
|
onInput={linkEvent(this, this.handleModRemoveReasonChange)}
|
||||||
/>
|
/>
|
||||||
<button type="submit" class="btn btn-secondary">
|
<button type="submit" class="btn btn-secondary">
|
||||||
<T i18nKey="remove_comment">#</T>
|
{i18n.t('remove_comment')}
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
)}
|
)}
|
||||||
{this.state.showBanDialog && (
|
{this.state.showBanDialog && (
|
||||||
<form onSubmit={linkEvent(this, this.handleModBanBothSubmit)}>
|
<form onSubmit={linkEvent(this, this.handleModBanBothSubmit)}>
|
||||||
<div class="form-group row">
|
<div class="form-group row">
|
||||||
<label class="col-form-label">
|
<label class="col-form-label">{i18n.t('reason')}</label>
|
||||||
<T i18nKey="reason">#</T>
|
|
||||||
</label>
|
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
class="form-control mr-2"
|
class="form-control mr-2"
|
||||||
|
|
7
ui/src/components/private-message.tsx
vendored
7
ui/src/components/private-message.tsx
vendored
|
@ -14,7 +14,6 @@ import {
|
||||||
import { MomentTime } from './moment-time';
|
import { MomentTime } from './moment-time';
|
||||||
import { PrivateMessageForm } from './private-message-form';
|
import { PrivateMessageForm } from './private-message-form';
|
||||||
import { i18n } from '../i18next';
|
import { i18n } from '../i18next';
|
||||||
import { T } from 'inferno-i18next';
|
|
||||||
|
|
||||||
interface PrivateMessageState {
|
interface PrivateMessageState {
|
||||||
showReply: boolean;
|
showReply: boolean;
|
||||||
|
@ -140,7 +139,7 @@ export class PrivateMessage extends Component<
|
||||||
class="pointer"
|
class="pointer"
|
||||||
onClick={linkEvent(this, this.handleReplyClick)}
|
onClick={linkEvent(this, this.handleReplyClick)}
|
||||||
>
|
>
|
||||||
<T i18nKey="reply">#</T>
|
{i18n.t('reply')}
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
</>
|
</>
|
||||||
|
@ -152,7 +151,7 @@ export class PrivateMessage extends Component<
|
||||||
class="pointer"
|
class="pointer"
|
||||||
onClick={linkEvent(this, this.handleEditClick)}
|
onClick={linkEvent(this, this.handleEditClick)}
|
||||||
>
|
>
|
||||||
<T i18nKey="edit">#</T>
|
{i18n.t('edit')}
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
<li className="list-inline-item">
|
<li className="list-inline-item">
|
||||||
|
@ -173,7 +172,7 @@ export class PrivateMessage extends Component<
|
||||||
className="pointer"
|
className="pointer"
|
||||||
onClick={linkEvent(this, this.handleViewSource)}
|
onClick={linkEvent(this, this.handleViewSource)}
|
||||||
>
|
>
|
||||||
<T i18nKey="view_source">#</T>
|
{i18n.t('view_source')}
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
Loading…
Reference in a new issue