From 4e5561283392d2ab1545cabb4455a8ffc490f86b Mon Sep 17 00:00:00 2001
From: Dessalines <tyhou13@gmx.com>
Date: Fri, 18 Oct 2019 17:20:27 -0700
Subject: Running prettier on code.

- #305 , #309
---
 ui/src/components/comment-form.tsx | 188 ++++++++++++++++++++++++++-----------
 1 file changed, 135 insertions(+), 53 deletions(-)

(limited to 'ui/src/components/comment-form.tsx')

diff --git a/ui/src/components/comment-form.tsx b/ui/src/components/comment-form.tsx
index 2095e9e5..bebe6269 100644
--- a/ui/src/components/comment-form.tsx
+++ b/ui/src/components/comment-form.tsx
@@ -1,7 +1,22 @@
 import { Component, linkEvent } from 'inferno';
-import { CommentNode as CommentNodeI, CommentForm as CommentFormI, SearchForm, SearchType, SortType, UserOperation, SearchResponse } from '../interfaces';
-import { Subscription } from "rxjs";
-import { capitalizeFirstLetter, mentionDropdownFetchLimit, msgOp, mdToHtml, randomStr, markdownHelpUrl } from '../utils';
+import {
+  CommentNode as CommentNodeI,
+  CommentForm as CommentFormI,
+  SearchForm,
+  SearchType,
+  SortType,
+  UserOperation,
+  SearchResponse,
+} from '../interfaces';
+import { Subscription } from 'rxjs';
+import {
+  capitalizeFirstLetter,
+  mentionDropdownFetchLimit,
+  msgOp,
+  mdToHtml,
+  randomStr,
+  markdownHelpUrl,
+} from '../utils';
 import { WebSocketService, UserService } from '../services';
 import * as autosize from 'autosize';
 import { i18n } from '../i18next';
@@ -25,7 +40,6 @@ interface CommentFormState {
 }
 
 export class CommentForm extends Component<CommentFormProps, CommentFormState> {
-
   private id = `comment-form-${randomStr()}`;
   private userSub: Subscription;
   private communitySub: Subscription;
@@ -34,13 +48,21 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
     commentForm: {
       auth: null,
       content: null,
-      post_id: this.props.node ? this.props.node.comment.post_id : this.props.postId,
-      creator_id: UserService.Instance.user ? UserService.Instance.user.id : null,
+      post_id: this.props.node
+        ? this.props.node.comment.post_id
+        : this.props.postId,
+      creator_id: UserService.Instance.user
+        ? UserService.Instance.user.id
+        : null,
     },
-    buttonTitle: !this.props.node ? capitalizeFirstLetter(i18n.t('post')) : this.props.edit ? capitalizeFirstLetter(i18n.t('edit')) : capitalizeFirstLetter(i18n.t('reply')),
+    buttonTitle: !this.props.node
+      ? capitalizeFirstLetter(i18n.t('post'))
+      : this.props.edit
+      ? capitalizeFirstLetter(i18n.t('edit'))
+      : capitalizeFirstLetter(i18n.t('reply')),
     previewMode: false,
     imageLoading: false,
-  }
+  };
 
   constructor(props: any, context: any) {
     super(props, context);
@@ -57,7 +79,9 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
           selectTemplate: (item: any) => {
             return `:${item.original.key}:`;
           },
-          values: Object.entries(emojiShortName).map(e => {return {'key': e[1], 'val': e[0]}}),
+          values: Object.entries(emojiShortName).map(e => {
+            return { key: e[1], val: e[0] };
+          }),
           allowSpaces: false,
           autocompleteMode: true,
           menuItemLimit: mentionDropdownFetchLimit,
@@ -88,8 +112,8 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
           allowSpaces: false,
           autocompleteMode: true,
           menuItemLimit: mentionDropdownFetchLimit,
-        }
-      ]
+        },
+      ],
     });
 
     this.state = this.emptyState;
@@ -104,7 +128,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
         // A reply gets a new parent id
         this.state.commentForm.parent_id = this.props.node.comment.id;
       }
-    }  
+    }
   }
 
   componentDidMount() {
@@ -124,27 +148,82 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
         <form 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)} required disabled={this.props.disabled} rows={2} maxLength={10000} />
-              {this.state.previewMode && 
-                <div className="md-div" dangerouslySetInnerHTML={mdToHtml(this.state.commentForm.content)} />
-              }
+              <textarea
+                id={this.id}
+                className={`form-control ${this.state.previewMode && 'd-none'}`}
+                value={this.state.commentForm.content}
+                onInput={linkEvent(this, this.handleCommentContentChange)}
+                required
+                disabled={this.props.disabled}
+                rows={2}
+                maxLength={10000}
+              />
+              {this.state.previewMode && (
+                <div
+                  className="md-div"
+                  dangerouslySetInnerHTML={mdToHtml(
+                    this.state.commentForm.content
+                  )}
+                />
+              )}
             </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.buttonTitle}</button>
-              {this.state.commentForm.content &&
-                <button className={`btn btn-sm mr-2 btn-secondary ${this.state.previewMode && 'active'}`} onClick={linkEvent(this, this.handlePreviewToggle)}><T i18nKey="preview">#</T></button>
-              }
-              {this.props.node && <button type="button" class="btn btn-sm btn-secondary mr-2" onClick={linkEvent(this, this.handleReplyCancel)}><T i18nKey="cancel">#</T></button>}
-              <a href={markdownHelpUrl} target="_blank" class="d-inline-block float-right text-muted small font-weight-bold"><T i18nKey="formatting_help">#</T></a>
+              <button
+                type="submit"
+                class="btn btn-sm btn-secondary mr-2"
+                disabled={this.props.disabled}
+              >
+                {this.state.buttonTitle}
+              </button>
+              {this.state.commentForm.content && (
+                <button
+                  className={`btn btn-sm mr-2 btn-secondary ${this.state
+                    .previewMode && 'active'}`}
+                  onClick={linkEvent(this, this.handlePreviewToggle)}
+                >
+                  <T i18nKey="preview">#</T>
+                </button>
+              )}
+              {this.props.node && (
+                <button
+                  type="button"
+                  class="btn btn-sm btn-secondary mr-2"
+                  onClick={linkEvent(this, this.handleReplyCancel)}
+                >
+                  <T i18nKey="cancel">#</T>
+                </button>
+              )}
+              <a
+                href={markdownHelpUrl}
+                target="_blank"
+                class="d-inline-block float-right text-muted small font-weight-bold"
+              >
+                <T i18nKey="formatting_help">#</T>
+              </a>
               <form class="d-inline-block mr-2 float-right text-muted small font-weight-bold">
-                <label htmlFor={`file-upload-${this.id}`} className={`${UserService.Instance.user && 'pointer'}`}><T i18nKey="upload_image">#</T></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)} />
+                <label
+                  htmlFor={`file-upload-${this.id}`}
+                  className={`${UserService.Instance.user && 'pointer'}`}
+                >
+                  <T i18nKey="upload_image">#</T>
+                </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>
-              }
+              {this.state.imageLoading && (
+                <svg class="icon icon-spinner spin">
+                  <use xlinkHref="#icon-spinner"></use>
+                </svg>
+              )}
             </div>
           </div>
         </form>
@@ -200,23 +279,24 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
       method: 'POST',
       body: formData,
     })
-    .then(res => res.json())
-    .then(res => {
-      let url = `${window.location.origin}/pictshare/${res.url}`;
-      let markdown = (res.filetype == 'mp4') ? `[vid](${url}/raw)` : `![](${url})`;
-      let content = i.state.commentForm.content;
-      content = (content) ? `${content} ${markdown}` : markdown;
-      i.state.commentForm.content = content;
-      i.state.imageLoading = false;
-      i.setState(i.state);
-    })
-    .catch((error) => {
-      i.state.imageLoading = false;
-      i.setState(i.state);
-      alert(error);
-    })
+      .then(res => res.json())
+      .then(res => {
+        let url = `${window.location.origin}/pictshare/${res.url}`;
+        let markdown =
+          res.filetype == 'mp4' ? `[vid](${url}/raw)` : `![](${url})`;
+        let content = i.state.commentForm.content;
+        content = content ? `${content} ${markdown}` : markdown;
+        i.state.commentForm.content = content;
+        i.state.imageLoading = false;
+        i.setState(i.state);
+      })
+      .catch(error => {
+        i.state.imageLoading = false;
+        i.setState(i.state);
+        alert(error);
+      });
   }
-  
+
   userSearch(text: string, cb: any) {
     if (text) {
       let form: SearchForm = {
@@ -229,18 +309,19 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
 
       WebSocketService.Instance.search(form);
 
-      this.userSub = WebSocketService.Instance.subject
-      .subscribe(
-        (msg) => {  
+      this.userSub = WebSocketService.Instance.subject.subscribe(
+        msg => {
           let op: UserOperation = msgOp(msg);
           if (op == UserOperation.Search) {
             let res: SearchResponse = msg;
-            let users = res.users.map(u => {return {key: u.name}});
+            let users = res.users.map(u => {
+              return { key: u.name };
+            });
             cb(users);
             this.userSub.unsubscribe();
           }
         },
-        (err) => console.error(err),
+        err => console.error(err),
         () => console.log('complete')
       );
     } else {
@@ -260,18 +341,19 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
 
       WebSocketService.Instance.search(form);
 
-      this.communitySub = WebSocketService.Instance.subject
-      .subscribe(
-        (msg) => {  
+      this.communitySub = WebSocketService.Instance.subject.subscribe(
+        msg => {
           let op: UserOperation = msgOp(msg);
           if (op == UserOperation.Search) {
             let res: SearchResponse = msg;
-            let communities = res.communities.map(u => {return {key: u.name}});
+            let communities = res.communities.map(u => {
+              return { key: u.name };
+            });
             cb(communities);
             this.communitySub.unsubscribe();
           }
         },
-        (err) => console.error(err),
+        err => console.error(err),
         () => console.log('complete')
       );
     } else {
-- 
cgit v1.2.3