From 556b053ae7ff43a3ecfa79ad39c29cbff10ec632 Mon Sep 17 00:00:00 2001
From: Misha Vyrtsev <reeywhaar@gmail.com>
Date: Mon, 17 Jun 2019 00:02:13 +0300
Subject: [PATCH] Fix ui errors (preview and image upload) (#347)

* fix broken preview

* fix broken image upload
---
 frontend/app/components/comment/comment.tsx        |  3 +++
 .../app/components/comment/connected-comment.ts    | 14 +++++++++++---
 frontend/app/components/root/root.tsx              |  6 ++++--
 3 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/frontend/app/components/comment/comment.tsx b/frontend/app/components/comment/comment.tsx
index 817666e5..cac52d67 100644
--- a/frontend/app/components/comment/comment.tsx
+++ b/frontend/app/components/comment/comment.tsx
@@ -19,6 +19,7 @@ import { Input } from '@app/components/input';
 import { AvatarIcon } from '@app/components/avatar-icon';
 import Countdown from '../countdown';
 import { boundActions } from './connected-comment';
+import { getPreview, uploadImage } from '@app/common/api';
 
 export type Props = {
   user: User | null;
@@ -43,6 +44,8 @@ export type Props = {
   theme: Theme;
   level?: number;
   mix?: string;
+  getPreview?: typeof getPreview;
+  uploadImage?: typeof uploadImage;
 } & Partial<typeof boundActions>;
 
 export interface State {
diff --git a/frontend/app/components/comment/connected-comment.ts b/frontend/app/components/comment/connected-comment.ts
index 06fa5d2a..4e5dc89b 100644
--- a/frontend/app/components/comment/connected-comment.ts
+++ b/frontend/app/components/comment/connected-comment.ts
@@ -28,7 +28,15 @@ import { bindActions } from '@app/utils/actionBinder';
 const mapStateToProps = (state: StoreState, cprops: { data: CommentType }) => {
   const props: Pick<
     Props,
-    'editMode' | 'user' | 'isUserBanned' | 'post_info' | 'isCommentsDisabled' | 'theme' | 'collapsed'
+    | 'editMode'
+    | 'user'
+    | 'isUserBanned'
+    | 'post_info'
+    | 'isCommentsDisabled'
+    | 'theme'
+    | 'collapsed'
+    | 'getPreview'
+    | 'uploadImage'
   > = {
     editMode: getCommentMode(state, cprops.data.id),
     user: state.user,
@@ -37,6 +45,8 @@ const mapStateToProps = (state: StoreState, cprops: { data: CommentType }) => {
     isCommentsDisabled: state.info.read_only || false,
     theme: state.theme,
     collapsed: getThreadIsCollapsed(state, cprops.data),
+    getPreview,
+    uploadImage,
   };
   return props;
 };
@@ -53,8 +63,6 @@ export const boundActions = bindActions({
   unblockUser,
   hideUser,
   setVerifyStatus: setVerifiedStatus,
-  uploadImage,
-  getPreview,
 });
 
 /** Comment component connected to redux */
diff --git a/frontend/app/components/root/root.tsx b/frontend/app/components/root/root.tsx
index e9f48fa2..ce5ba242 100644
--- a/frontend/app/components/root/root.tsx
+++ b/frontend/app/components/root/root.tsx
@@ -59,7 +59,6 @@ const boundActions = bindActions({
   logIn,
   logOut: logout,
   setTheme,
-  getPreview,
   enableComments: () => setCommentsReadOnlyState(false),
   disableComments: () => setCommentsReadOnlyState(true),
   changeSort: setSort,
@@ -69,7 +68,6 @@ const boundActions = bindActions({
   unhideUser,
   addComment,
   updateComment,
-  uploadImage,
 });
 
 type Props = {
@@ -82,6 +80,8 @@ type Props = {
   hiddenUsers: StoreState['hiddenUsers'];
   blockedUsers: BlockedUser[];
   isSettingsVisible: boolean;
+  getPreview: typeof getPreview;
+  uploadImage: typeof uploadImage;
 } & typeof boundActions;
 
 interface State {
@@ -330,6 +330,8 @@ export const ConnectedRoot = connect(
     info: state.info,
     hiddenUsers: state.hiddenUsers,
     blockedUsers: state.bannedUsers,
+    getPreview,
+    uploadImage,
   }),
   boundActions
 )(Root);