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/navbar.tsx | 201 +++++++++++++++++++++++++++++--------------
 1 file changed, 136 insertions(+), 65 deletions(-)

(limited to 'ui/src/components/navbar.tsx')

diff --git a/ui/src/components/navbar.tsx b/ui/src/components/navbar.tsx
index c33f8196..ba0dead2 100644
--- a/ui/src/components/navbar.tsx
+++ b/ui/src/components/navbar.tsx
@@ -1,9 +1,16 @@
 import { Component, linkEvent } from 'inferno';
 import { Link } from 'inferno-router';
-import { Subscription } from "rxjs";
+import { Subscription } from 'rxjs';
 import { retryWhen, delay, take } from 'rxjs/operators';
 import { WebSocketService, UserService } from '../services';
-import { UserOperation, GetRepliesForm, GetRepliesResponse, SortType, GetSiteResponse, Comment} from '../interfaces';
+import {
+  UserOperation,
+  GetRepliesForm,
+  GetRepliesResponse,
+  SortType,
+  GetSiteResponse,
+  Comment,
+} from '../interfaces';
 import { msgOp } from '../utils';
 import { version } from '../version';
 import { i18n } from '../i18next';
@@ -13,8 +20,8 @@ interface NavbarState {
   isLoggedIn: boolean;
   expanded: boolean;
   expandUserDropdown: boolean;
-  replies: Array<Comment>,
-  fetchCount: number,
+  replies: Array<Comment>;
+  fetchCount: number;
   unreadCount: number;
   siteName: string;
 }
@@ -23,14 +30,14 @@ export class Navbar extends Component<any, NavbarState> {
   private wsSub: Subscription;
   private userSub: Subscription;
   emptyState: NavbarState = {
-    isLoggedIn: (UserService.Instance.user !== undefined),
+    isLoggedIn: UserService.Instance.user !== undefined,
     unreadCount: 0,
     fetchCount: 0,
     replies: [],
     expanded: false,
     expandUserDropdown: false,
-    siteName: undefined
-  }
+    siteName: undefined,
+  };
 
   constructor(props: any, context: any) {
     super(props, context);
@@ -48,12 +55,19 @@ export class Navbar extends Component<any, NavbarState> {
     });
 
     this.wsSub = WebSocketService.Instance.subject
-    .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
-    .subscribe(
-      (msg) => this.parseMessage(msg),
-        (err) => console.error(err),
+      .pipe(
+        retryWhen(errors =>
+          errors.pipe(
+            delay(3000),
+            take(10)
+          )
+        )
+      )
+      .subscribe(
+        msg => this.parseMessage(msg),
+        err => console.error(err),
         () => console.log('complete')
-    );
+      );
 
     if (this.state.isLoggedIn) {
       this.requestNotificationPermission();
@@ -63,9 +77,7 @@ export class Navbar extends Component<any, NavbarState> {
   }
 
   render() {
-    return (
-      <div>{this.navbar()}</div>
-    )
+    return <div>{this.navbar()}</div>;
   }
 
   componentWillUnmount() {
@@ -80,48 +92,98 @@ export class Navbar extends Component<any, NavbarState> {
         <Link title={version} class="navbar-brand" to="/">
           {this.state.siteName}
         </Link>
-        <button class="navbar-toggler" type="button" onClick={linkEvent(this, this.expandNavbar)}>
+        <button
+          class="navbar-toggler"
+          type="button"
+          onClick={linkEvent(this, this.expandNavbar)}
+        >
           <span class="navbar-toggler-icon"></span>
         </button>
-        <div className={`${!this.state.expanded && 'collapse'} navbar-collapse`}>
+        <div
+          className={`${!this.state.expanded && 'collapse'} navbar-collapse`}
+        >
           <ul class="navbar-nav mr-auto">
             <li class="nav-item">
-              <Link class="nav-link" to="/communities"><T i18nKey="communities">#</T></Link>
+              <Link class="nav-link" to="/communities">
+                <T i18nKey="communities">#</T>
+              </Link>
             </li>
             <li class="nav-item">
-              <Link class="nav-link" to="/search"><T i18nKey="search">#</T></Link>
+              <Link class="nav-link" to="/search">
+                <T i18nKey="search">#</T>
+              </Link>
             </li>
             <li class="nav-item">
-              <Link class="nav-link" to={{pathname: '/create_post', state: { prevPath: this.currentLocation }}}><T i18nKey="create_post">#</T></Link>
+              <Link
+                class="nav-link"
+                to={{
+                  pathname: '/create_post',
+                  state: { prevPath: this.currentLocation },
+                }}
+              >
+                <T i18nKey="create_post">#</T>
+              </Link>
             </li>
             <li class="nav-item">
-              <Link class="nav-link" to="/create_community"><T i18nKey="create_community">#</T></Link>
+              <Link class="nav-link" to="/create_community">
+                <T i18nKey="create_community">#</T>
+              </Link>
             </li>
           </ul>
           <ul class="navbar-nav ml-auto mr-2">
-            {this.state.isLoggedIn ? 
-            <>
-              {
-                <li className="nav-item">
-                  <Link class="nav-link" to="/inbox">
-                    <svg class="icon"><use xlinkHref="#icon-mail"></use></svg>
-                    {this.state.unreadCount> 0 && <span class="ml-1 badge badge-light">{this.state.unreadCount}</span>}
-                  </Link>
+            {this.state.isLoggedIn ? (
+              <>
+                {
+                  <li className="nav-item">
+                    <Link class="nav-link" to="/inbox">
+                      <svg class="icon">
+                        <use xlinkHref="#icon-mail"></use>
+                      </svg>
+                      {this.state.unreadCount > 0 && (
+                        <span class="ml-1 badge badge-light">
+                          {this.state.unreadCount}
+                        </span>
+                      )}
+                    </Link>
+                  </li>
+                }
+                <li
+                  className={`nav-item dropdown ${this.state
+                    .expandUserDropdown && 'show'}`}
+                >
+                  <a
+                    class="pointer nav-link dropdown-toggle"
+                    onClick={linkEvent(this, this.expandUserDropdown)}
+                    role="button"
+                  >
+                    {UserService.Instance.user.username}
+                  </a>
+                  <div
+                    className={`dropdown-menu dropdown-menu-right ${this.state
+                      .expandUserDropdown && 'show'}`}
+                  >
+                    <a
+                      role="button"
+                      class="dropdown-item pointer"
+                      onClick={linkEvent(this, this.handleOverviewClick)}
+                    >
+                      <T i18nKey="overview">#</T>
+                    </a>
+                    <a
+                      role="button"
+                      class="dropdown-item pointer"
+                      onClick={linkEvent(this, this.handleLogoutClick)}
+                    >
+                      <T i18nKey="logout">#</T>
+                    </a>
+                  </div>
                 </li>
-              }
-              <li className={`nav-item dropdown ${this.state.expandUserDropdown && 'show'}`}>
-                <a class="pointer nav-link dropdown-toggle" onClick={linkEvent(this, this.expandUserDropdown)} role="button">
-                  {UserService.Instance.user.username}
-                </a>
-                <div className={`dropdown-menu dropdown-menu-right ${this.state.expandUserDropdown && 'show'}`}>
-                  <a role="button" class="dropdown-item pointer" onClick={linkEvent(this, this.handleOverviewClick)}><T i18nKey="overview">#</T></a>
-                  <a role="button" class="dropdown-item pointer" onClick={ linkEvent(this, this.handleLogoutClick) }><T i18nKey="logout">#</T></a>
-                </div>
-              </li> 
-            </>
-              : 
-              <Link class="nav-link" to="/login"><T i18nKey="login_sign_up">#</T></Link>
-            }
+              </>
+            ) : (
+              <Link class="nav-link" to="/login">
+                <T i18nKey="login_sign_up">#</T>
+              </Link>
+            )}
           </ul>
         </div>
       </nav>
@@ -154,7 +216,7 @@ export class Navbar extends Component<any, NavbarState> {
   parseMessage(msg: any) {
     let op: UserOperation = msgOp(msg);
     if (msg.error) {
-      if (msg.error == "not_logged_in") {
+      if (msg.error == 'not_logged_in') {
         UserService.Instance.logout();
         location.reload();
       }
@@ -162,8 +224,11 @@ export class Navbar extends Component<any, NavbarState> {
     } else if (op == UserOperation.GetReplies) {
       let res: GetRepliesResponse = msg;
       let unreadReplies = res.replies.filter(r => !r.read);
-      if (unreadReplies.length > 0 && this.state.fetchCount > 1 && 
-          (JSON.stringify(this.state.replies) !== JSON.stringify(unreadReplies))) {
+      if (
+        unreadReplies.length > 0 &&
+        this.state.fetchCount > 1 &&
+        JSON.stringify(this.state.replies) !== JSON.stringify(unreadReplies)
+      ) {
         this.notify(unreadReplies);
       }
 
@@ -177,7 +242,7 @@ export class Navbar extends Component<any, NavbarState> {
         WebSocketService.Instance.site = res.site;
         this.setState(this.state);
       }
-    } 
+    }
   }
 
   keepFetchingReplies() {
@@ -193,7 +258,7 @@ export class Navbar extends Component<any, NavbarState> {
         page: 1,
         limit: 9999,
       };
-      if (this.currentLocation !=='/inbox') { 
+      if (this.currentLocation !== '/inbox') {
         WebSocketService.Instance.getReplies(repliesForm);
         this.state.fetchCount++;
       }
@@ -205,37 +270,43 @@ export class Navbar extends Component<any, NavbarState> {
   }
 
   sendRepliesCount(res: GetRepliesResponse) {
-    UserService.Instance.sub.next({user: UserService.Instance.user, unreadCount: res.replies.filter(r => !r.read).length});
+    UserService.Instance.sub.next({
+      user: UserService.Instance.user,
+      unreadCount: res.replies.filter(r => !r.read).length,
+    });
   }
 
   requestNotificationPermission() {
     if (UserService.Instance.user) {
-    document.addEventListener('DOMContentLoaded', function () {
-      if (!Notification) {
-        alert(i18n.t('notifications_error')); 
-        return;
-      }
+      document.addEventListener('DOMContentLoaded', function() {
+        if (!Notification) {
+          alert(i18n.t('notifications_error'));
+          return;
+        }
 
-      if (Notification.permission !== 'granted')
-        Notification.requestPermission();
-    });
+        if (Notification.permission !== 'granted')
+          Notification.requestPermission();
+      });
     }
   }
 
   notify(replies: Array<Comment>) {
     let recentReply = replies[0];
-    if (Notification.permission !== 'granted')
-      Notification.requestPermission();
+    if (Notification.permission !== 'granted') Notification.requestPermission();
     else {
-      var notification = new Notification(`${replies.length} ${i18n.t('unread_messages')}`, {
-        icon: `${window.location.protocol}//${window.location.host}/static/assets/apple-touch-icon.png`,
-        body: `${recentReply.creator_name}: ${recentReply.content}`
-      });
+      var notification = new Notification(
+        `${replies.length} ${i18n.t('unread_messages')}`,
+        {
+          icon: `${window.location.protocol}//${window.location.host}/static/assets/apple-touch-icon.png`,
+          body: `${recentReply.creator_name}: ${recentReply.content}`,
+        }
+      );
 
       notification.onclick = () => {
-        this.context.router.history.push(`/post/${recentReply.post_id}/comment/${recentReply.id}`);
+        this.context.router.history.push(
+          `/post/${recentReply.post_id}/comment/${recentReply.id}`
+        );
       };
-
     }
   }
 }
-- 
cgit v1.2.3