Merge branch 'master' into remove_twemoji

diff --cc ui/src/components/comment-form.tsx
index 22f871d22385dfd0bd3929593e69f35d2ce18efa,a433dbd4268d9bd99720e13b8846777193ecead4..04720cbb0a2164fc78339aa36cab9da5ccef70df
--- 1/ui/src/components/comment-form.tsx
--- 2/ui/src/components/comment-form.tsx
+++ b/ui/src/components/comment-form.tsx
@@@ -142,106 -148,128 +146,119 @@@ export class CommentForm extends Compon
            when={this.state.commentForm.content}
            message={i18n.t('block_leaving')}
          />
-         <form
-           id={this.formId}
-           onSubmit={linkEvent(this, this.handleCommentSubmit)}
-         >
-           <div class="form-group row">
-             <div className={`col-sm-12`}>
-               <textarea
-                 id={this.id}
-                 className={`form-control ${this.state.previewMode && 'd-none'}`}
-                 value={this.state.commentForm.content}
-                 onInput={linkEvent(this, this.handleCommentContentChange)}
-                 onPaste={linkEvent(this, this.handleImageUploadPaste)}
-                 required
-                 disabled={this.props.disabled}
-                 rows={2}
-                 maxLength={10000}
-               />
-               {this.state.previewMode && (
-                 <div
-                   className="card card-body md-div"
-                   dangerouslySetInnerHTML={mdToHtml(
-                     this.state.commentForm.content
-                   )}
+         {UserService.Instance.user ? (
+           <form
+             id={this.formId}
+             onSubmit={linkEvent(this, this.handleCommentSubmit)}
+           >
+             <div class="form-group row">
+               <div className={`col-sm-12`}>
+                 <textarea
+                   id={this.id}
+                   className={`form-control ${
+                     this.state.previewMode && 'd-none'
+                   }`}
+                   value={this.state.commentForm.content}
+                   onInput={linkEvent(this, this.handleCommentContentChange)}
+                   onPaste={linkEvent(this, this.handleImageUploadPaste)}
+                   required
+                   disabled={this.props.disabled}
+                   rows={2}
+                   maxLength={10000}
                  />
-               )}
-             </div>
-           </div>
-           <div class="row">
-             <div class="col-sm-12">
-               <button
-                 type="submit"
-                 class="btn btn-sm btn-secondary mr-2"
-                 disabled={this.props.disabled || this.state.loading}
-               >
-                 {this.state.loading ? (
-                   <svg class="icon icon-spinner spin">
-                     <use xlinkHref="#icon-spinner"></use>
-                   </svg>
-                 ) : (
-                   <span>{this.state.buttonTitle}</span>
+                 {this.state.previewMode && (
+                   <div
+                     className="card card-body md-div"
+                     dangerouslySetInnerHTML={mdToHtml(
+                       this.state.commentForm.content
+                     )}
+                   />
                  )}
-               </button>
-               {this.state.commentForm.content && (
-                 <button
-                   className={`btn btn-sm mr-2 btn-secondary ${
-                     this.state.previewMode && 'active'
-                   }`}
-                   onClick={linkEvent(this, this.handlePreviewToggle)}
-                 >
-                   {i18n.t('preview')}
-                 </button>
-               )}
-               {this.props.node && (
+               </div>
+             </div>
+             <div class="row">
+               <div class="col-sm-12">
                  <button
-                   type="button"
+                   type="submit"
                    class="btn btn-sm btn-secondary mr-2"
-                   onClick={linkEvent(this, this.handleReplyCancel)}
+                   disabled={this.props.disabled || this.state.loading}
                  >
-                   {i18n.t('cancel')}
+                   {this.state.loading ? (
+                     <svg class="icon icon-spinner spin">
+                       <use xlinkHref="#icon-spinner"></use>
+                     </svg>
+                   ) : (
+                     <span>{this.state.buttonTitle}</span>
+                   )}
                  </button>
-               )}
-               <a
-                 href={markdownHelpUrl}
-                 target="_blank"
-                 class="d-inline-block float-right text-muted font-weight-bold"
-                 title={i18n.t('formatting_help')}
-                 rel="noopener"
-               >
-                 <svg class="icon icon-inline">
-                   <use xlinkHref="#icon-help-circle"></use>
-                 </svg>
-               </a>
-               <form class="d-inline-block mr-3 float-right text-muted font-weight-bold">
-                 <label
-                   htmlFor={`file-upload-${this.id}`}
-                   className={`${UserService.Instance.user && 'pointer'}`}
-                   data-tippy-content={i18n.t('upload_image')}
+                 {this.state.commentForm.content && (
+                   <button
+                     className={`btn btn-sm mr-2 btn-secondary ${
+                       this.state.previewMode && 'active'
+                     }`}
+                     onClick={linkEvent(this, this.handlePreviewToggle)}
+                   >
+                     {i18n.t('preview')}
+                   </button>
+                 )}
+                 {this.props.node && (
+                   <button
+                     type="button"
+                     class="btn btn-sm btn-secondary mr-2"
+                     onClick={linkEvent(this, this.handleReplyCancel)}
+                   >
+                     {i18n.t('cancel')}
+                   </button>
+                 )}
+                 <a
+                   href={markdownHelpUrl}
+                   target="_blank"
+                   class="d-inline-block float-right text-muted font-weight-bold"
+                   title={i18n.t('formatting_help')}
+                   rel="noopener"
                  >
                    <svg class="icon icon-inline">
-                     <use xlinkHref="#icon-image"></use>
+                     <use xlinkHref="#icon-help-circle"></use>
                    </svg>
-                 </label>
-                 <input
-                   id={`file-upload-${this.id}`}
-                   type="file"
-                   accept="image/*,video/*"
-                   name="file"
-                   class="d-none"
-                   disabled={!UserService.Instance.user}
-                   onChange={linkEvent(this, this.handleImageUpload)}
-                 />
-               </form>
-               {this.state.imageLoading && (
-                 <svg class="icon icon-spinner spin">
-                   <use xlinkHref="#icon-spinner"></use>
-                 </svg>
-               )}
+                 </a>
+                 <form class="d-inline-block mr-3 float-right text-muted font-weight-bold">
+                   <label
+                     htmlFor={`file-upload-${this.id}`}
+                     className={`${UserService.Instance.user && 'pointer'}`}
+                     data-tippy-content={i18n.t('upload_image')}
+                   >
+                     <svg class="icon icon-inline">
+                       <use xlinkHref="#icon-image"></use>
+                     </svg>
+                   </label>
+                   <input
+                     id={`file-upload-${this.id}`}
+                     type="file"
+                     accept="image/*,video/*"
+                     name="file"
+                     class="d-none"
+                     disabled={!UserService.Instance.user}
+                     onChange={linkEvent(this, this.handleImageUpload)}
+                   />
+                 </form>
+                 {this.state.imageLoading && (
+                   <svg class="icon icon-spinner spin">
+                     <use xlinkHref="#icon-spinner"></use>
+                   </svg>
+                 )}
 -                <span
 -                  onClick={linkEvent(this, this.handleEmojiPickerClick)}
 -                  class="pointer unselectable d-inline-block mr-3 float-right text-muted font-weight-bold"
 -                  data-tippy-content={i18n.t('emoji_picker')}
 -                >
 -                  <svg class="icon icon-inline">
 -                    <use xlinkHref="#icon-smile"></use>
 -                  </svg>
 -                </span>
+               </div>
              </div>
+           </form>
+         ) : (
+           <div class="alert alert-warning" role="alert">
+             <svg class="icon icon-inline mr-2">
+               <use xlinkHref="#icon-alert-triangle"></use>
+             </svg>
+             <T i18nKey="must_login" class="d-inline">
+               #<Link to="/login">#</Link>
+             </T>
            </div>
-         </form>
+         )}
        </div>
      );
    }

diff --cc ui/src/utils.ts
index b3d0f36806a5d11208176c21cc9a39c33a13c5e0,22536043e23108d5f6bcbc254e000e25d0680f81..2f06b70cd39999b23becf013ef50cd10c505773b
--- 1/ui/src/utils.ts
--- 2/ui/src/utils.ts
+++ b/ui/src/utils.ts
@@@ -54,6 -54,9 +54,7 @@@ import markdown_it_container from 'mark
  import emojiShortName from 'emoji-short-name';
  import Toastify from 'toastify-js';
  import tippy from 'tippy.js';
 -import EmojiButton from '@joeattardi/emoji-button';
+ import moment from 'moment';
  
  export const repoUrl = 'https://github.com/LemmyNet/lemmy';
  export const helpGuideUrl = '/docs/about_guide.html';