From cd4e0ab3c2cfd615e4771fb9181a31ce237b5ceb Mon Sep 17 00:00:00 2001
From: Dessalines <tyhou13@gmx.com>
Date: Wed, 8 Jul 2020 01:02:14 -0400
Subject: HTML title bugs.

- Fixing HTML titles for some pages. Fixes #801
- Removing WebSocketService.Instance.site, fetching site on demand now.
---
 ui/src/components/post-form.tsx | 25 ++++++++++++++-----------
 1 file changed, 14 insertions(+), 11 deletions(-)

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

diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index fdf6ebe4..8c693ac0 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -16,7 +16,6 @@ import {
   SearchForm,
   SearchType,
   SearchResponse,
-  GetSiteResponse,
   WebSocketJsonResponse,
 } from '../interfaces';
 import { WebSocketService, UserService } from '../services';
@@ -52,6 +51,8 @@ interface PostFormProps {
   onCancel?(): any;
   onCreate?(id: number): any;
   onEdit?(post: Post): any;
+  enableNsfw: boolean;
+  enableDownvotes: boolean;
 }
 
 interface PostFormState {
@@ -63,7 +64,6 @@ interface PostFormState {
   suggestedTitle: string;
   suggestedPosts: Array<Post>;
   crossPosts: Array<Post>;
-  enable_nsfw: boolean;
 }
 
 export class PostForm extends Component<PostFormProps, PostFormState> {
@@ -87,7 +87,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     suggestedTitle: undefined,
     suggestedPosts: [],
     crossPosts: [],
-    enable_nsfw: undefined,
   };
 
   constructor(props: any, context: any) {
@@ -138,7 +137,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     };
 
     WebSocketService.Instance.listCommunities(listCommunitiesForm);
-    WebSocketService.Instance.getSite();
   }
 
   componentDidMount() {
@@ -240,7 +238,12 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
                   <div class="my-1 text-muted small font-weight-bold">
                     {i18n.t('cross_posts')}
                   </div>
-                  <PostListings showCommunity posts={this.state.crossPosts} />
+                  <PostListings
+                    showCommunity
+                    posts={this.state.crossPosts}
+                    enableDownvotes={this.props.enableDownvotes}
+                    enableNsfw={this.props.enableNsfw}
+                  />
                 </>
               )}
             </div>
@@ -265,7 +268,11 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
                   <div class="my-1 text-muted small font-weight-bold">
                     {i18n.t('related_posts')}
                   </div>
-                  <PostListings posts={this.state.suggestedPosts} />
+                  <PostListings
+                    posts={this.state.suggestedPosts}
+                    enableDownvotes={this.props.enableDownvotes}
+                    enableNsfw={this.props.enableNsfw}
+                  />
                 </>
               )}
             </div>
@@ -346,7 +353,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
               </div>
             </div>
           )}
-          {this.state.enable_nsfw && (
+          {this.props.enableNsfw && (
             <div class="form-group row">
               <div class="col-sm-10">
                 <div class="form-check">
@@ -631,10 +638,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
         this.state.crossPosts = data.posts;
       }
       this.setState(this.state);
-    } else if (res.op == UserOperation.GetSite) {
-      let data = res.data as GetSiteResponse;
-      this.state.enable_nsfw = data.site.enable_nsfw;
-      this.setState(this.state);
     }
   }
 }
-- 
cgit v1.2.3


From 32d43b85b942e7b9d12b462a13c3dd52252acc6c Mon Sep 17 00:00:00 2001
From: Dessalines <tyhou13@gmx.com>
Date: Wed, 8 Jul 2020 14:32:37 -0400
Subject: Blocking page refresh when forms are filled. Fixes #671

---
 ui/src/components/post-form.tsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

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

diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index 8c693ac0..a88d38c7 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -151,8 +151,22 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     setupTippy();
   }
 
+  componentDidUpdate() {
+    if (
+      !this.state.loading &&
+      (this.state.postForm.name ||
+        this.state.postForm.url ||
+        this.state.postForm.body)
+    ) {
+      window.onbeforeunload = () => true;
+    } else {
+      window.onbeforeunload = undefined;
+    }
+  }
+
   componentWillUnmount() {
     this.subscription.unsubscribe();
+    window.onbeforeunload = null;
   }
 
   render() {
-- 
cgit v1.2.3


From db09730d5f391c37bde87f59ed2ea6f3418034e4 Mon Sep 17 00:00:00 2001
From: Dessalines <tyhou13@gmx.com>
Date: Thu, 9 Jul 2020 13:32:23 -0400
Subject: Removing twemoji, and the massive emoji picker. Fixes #895

---
 ui/src/components/post-form.tsx | 29 -----------------------------
 1 file changed, 29 deletions(-)

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

diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index a88d38c7..fc7884d7 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -33,7 +33,6 @@ import {
   randomStr,
   setupTribute,
   setupTippy,
-  emojiPicker,
   hostname,
   pictrsDeleteToast,
 } from '../utils';
@@ -95,7 +94,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     this.fetchPageTitle = debounce(this.fetchPageTitle).bind(this);
 
     this.tribute = setupTribute();
-    this.setupEmojiPicker();
 
     this.state = this.emptyState;
 
@@ -332,15 +330,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
                   <use xlinkHref="#icon-help-circle"></use>
                 </svg>
               </a>
-              <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>
           {!this.props.post && (
@@ -420,20 +409,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     );
   }
 
-  setupEmojiPicker() {
-    emojiPicker.on('emoji', twemojiHtmlStr => {
-      if (this.state.postForm.body == null) {
-        this.state.postForm.body = '';
-      }
-      var el = document.createElement('div');
-      el.innerHTML = twemojiHtmlStr;
-      let nativeUnicode = (el.childNodes[0] as HTMLElement).getAttribute('alt');
-      let shortName = `:${emojiShortName[nativeUnicode]}:`;
-      this.state.postForm.body += shortName;
-      this.setState(this.state);
-    });
-  }
-
   handlePostSubmit(i: PostForm, event: any) {
     event.preventDefault();
 
@@ -596,10 +571,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
       });
   }
 
-  handleEmojiPickerClick(_i: PostForm, event: any) {
-    emojiPicker.togglePicker(event.target);
-  }
-
   parseMessage(msg: WebSocketJsonResponse) {
     let res = wsJsonToRes(msg);
     if (msg.error) {
-- 
cgit v1.2.3


From 8e96507cb19f7694a31a1407d1bcd2a347a70342 Mon Sep 17 00:00:00 2001
From: Dessalines <dessalines@users.noreply.github.com>
Date: Fri, 10 Jul 2020 14:01:45 -0400
Subject: Replacing selectr with choices.js for community searching. (#932)

- Fixes #839
- Fixes #847
---
 ui/src/components/post-form.tsx | 46 ++++++++++++++++++++++++++++++++++++-----
 1 file changed, 41 insertions(+), 5 deletions(-)

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

diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index fc7884d7..247c4cc6 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -39,7 +39,7 @@ import {
 import autosize from 'autosize';
 import Tribute from 'tributejs/src/Tribute.js';
 import emojiShortName from 'emoji-short-name';
-import Selectr from 'mobius1-selectr';
+import Choices from 'choices.js';
 import { i18n } from '../i18next';
 
 const MAX_POST_TITLE_LENGTH = 200;
@@ -69,6 +69,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
   private id = `post-form-${randomStr()}`;
   private tribute: Tribute;
   private subscription: Subscription;
+  private choices: Choices;
   private emptyState: PostFormState = {
     postForm: {
       name: null,
@@ -164,6 +165,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
 
   componentWillUnmount() {
     this.subscription.unsubscribe();
+    this.choices.destroy();
     window.onbeforeunload = null;
   }
 
@@ -596,11 +598,45 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
       // Set up select searching
       let selectId: any = document.getElementById('post-community');
       if (selectId) {
-        let selector = new Selectr(selectId, { nativeDropdown: false });
-        selector.on('selectr.select', option => {
-          this.state.postForm.community_id = Number(option.value);
-          this.setState(this.state);
+        this.choices = new Choices(selectId, {
+          shouldSort: false,
+          classNames: {
+            containerOuter: 'choices',
+            containerInner: 'choices__inner bg-secondary border-0',
+            input: 'form-control',
+            inputCloned: 'choices__input--cloned',
+            list: 'choices__list',
+            listItems: 'choices__list--multiple',
+            listSingle: 'choices__list--single',
+            listDropdown: 'choices__list--dropdown',
+            item: 'choices__item bg-secondary',
+            itemSelectable: 'choices__item--selectable',
+            itemDisabled: 'choices__item--disabled',
+            itemChoice: 'choices__item--choice',
+            placeholder: 'choices__placeholder',
+            group: 'choices__group',
+            groupHeading: 'choices__heading',
+            button: 'choices__button',
+            activeState: 'is-active',
+            focusState: 'is-focused',
+            openState: 'is-open',
+            disabledState: 'is-disabled',
+            highlightedState: 'text-info',
+            selectedState: 'text-info',
+            flippedState: 'is-flipped',
+            loadingState: 'is-loading',
+            noResults: 'has-no-results',
+            noChoices: 'has-no-choices',
+          },
         });
+        this.choices.passedElement.element.addEventListener(
+          'choice',
+          (e: any) => {
+            this.state.postForm.community_id = Number(e.detail.choice.value);
+            this.setState(this.state);
+          },
+          false
+        );
       }
     } else if (res.op == UserOperation.CreatePost) {
       let data = res.data as PostResponse;
-- 
cgit v1.2.3


From 8d2465989230fae7d9aae334a67a726fd6ced912 Mon Sep 17 00:00:00 2001
From: Tony Antonov <MM263@users.noreply.github.com>
Date: Fri, 10 Jul 2020 19:15:53 -0600
Subject: Forbid users to use empty titles for posts (#930)

- Add a regex that checks if string contains anything but whitespace
- Check for whitespace-only titles on post creation and edit
- Trim whitespace from titles before saving
- Add frontend validation to title
---
 ui/src/components/post-form.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

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

diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index 247c4cc6..30527510 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -35,6 +35,7 @@ import {
   setupTippy,
   hostname,
   pictrsDeleteToast,
+  validTitle,
 } from '../utils';
 import autosize from 'autosize';
 import Tribute from 'tributejs/src/Tribute.js';
@@ -271,12 +272,19 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
                 value={this.state.postForm.name}
                 id="post-title"
                 onInput={linkEvent(this, this.handlePostNameChange)}
-                class="form-control"
+                class={`form-control ${
+                  !validTitle(this.state.postForm.name) && 'is-invalid'
+                }`}
                 required
                 rows={2}
                 minLength={3}
                 maxLength={MAX_POST_TITLE_LENGTH}
               />
+              {!validTitle(this.state.postForm.name) && (
+                <div class="invalid-feedback">
+                  {i18n.t('invalid_post_title')}
+                </div>
+              )}
               {this.state.suggestedPosts.length > 0 && (
                 <>
                   <div class="my-1 text-muted small font-weight-bold">
-- 
cgit v1.2.3


From 4b30b6d764a28008ef1dfff06da43539e9efa1a1 Mon Sep 17 00:00:00 2001
From: ernestwisniewski <ernestwisniewski2@gmail.com>
Date: Sat, 11 Jul 2020 16:13:45 +0200
Subject: Redirect error on create_post page for not logged in users. #937
 (#938)

---
 ui/src/components/post-form.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

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

diff --git a/ui/src/components/post-form.tsx b/ui/src/components/post-form.tsx
index 30527510..e5efeaac 100644
--- a/ui/src/components/post-form.tsx
+++ b/ui/src/components/post-form.tsx
@@ -166,7 +166,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
 
   componentWillUnmount() {
     this.subscription.unsubscribe();
-    this.choices.destroy();
+    this.choices && this.choices.destroy();
     window.onbeforeunload = null;
   }
 
-- 
cgit v1.2.3

