fix search logic and UI cosmetic fixes

package.json

@@ -117,6 +117,7 @@
     "redux": "4.0.1",
     "redux-logger": "3.0.6",
     "redux-persist": "^6.0.0",
+    "redux-promise-middleware": "^6.1.2",
     "reselect": "4.0.0",
     "rimraf": "2.6.2",
     "sanitize.css": "^12.0.1",

stylesheets/_modules.scss

@@ -846,6 +846,7 @@
   display: flex;
   flex-direction: row;
   padding-inline-end: 16px;
+  padding-bottom: 8px;
   padding-inline-start: 16px;
   align-items: center;
 

stylesheets/_quote.scss

@@ -254,6 +254,7 @@
     background-color: $color-white-085;
     padding-inline-start: 8px;
     padding-inline-end: 8px;
+    margin-inline-end: 8px;
   }
 
   &-warning__icon {

ts/components/conversation/message/MessageContent.tsx

@@ -177,7 +177,7 @@ export const MessageContent = (props: Props) => {
             handleImageError={handleImageError}
           />
           {hasContentAfterAttachmentAndQuote ? (
-            <Flex padding="7px">
+            <Flex padding="7px" container={true} flexDirection="column">
               <MessagePreview messageId={props.messageId} handleImageError={handleImageError} />
               <MessageText messageId={props.messageId} />
             </Flex>

ts/components/conversation/message/MessageContentWithStatus.tsx

@@ -8,7 +8,6 @@ import {
   getMessageContentWithStatusesSelectorProps,
   isMessageSelectionMode,
 } from '../../../state/selectors/conversations';
-import { Flex } from '../../basic/Flex';
 import { MessageAuthorText } from './MessageAuthorText';
 import { MessageContent } from './MessageContent';
 import { MessageContextMenu } from './MessageContextMenu';
@@ -71,7 +70,7 @@ export const MessageContentWithStatuses = (props: Props) => {
       onClick={onClickOnMessageOuterContainer}
     >
       <MessageStatus messageId={messageId} isCorrectSide={isIncoming} />
-      <Flex container={true} flexDirection="column">
+      <div>
         <MessageAuthorText messageId={messageId} />
 
         <MessageContent
@@ -79,7 +78,7 @@ export const MessageContentWithStatuses = (props: Props) => {
           isDetailView={isDetailView}
           onQuoteClick={onQuoteClick}
         />
-      </Flex>
+      </div>
       <MessageStatus messageId={messageId} isCorrectSide={!isIncoming} />
       <MessageContextMenu messageId={messageId} contextMenuId={ctxMenuID} />
     </div>

ts/state/createStore.ts

@@ -2,6 +2,8 @@ import { createLogger } from 'redux-logger';
 import { configureStore } from '@reduxjs/toolkit';
 import { rootReducer } from './reducer';
 import { persistReducer } from 'redux-persist';
+// tslint:disable-next-line: match-default-export-name
+import promiseMiddleware from 'redux-promise-middleware';
 
 // tslint:disable-next-line: no-submodule-imports match-default-export-name
 import storage from 'redux-persist/lib/storage';
@@ -34,7 +36,7 @@ const persistedReducer = persistReducer(persistConfig, rootReducer);
 
 // Exclude logger if we're in production mode
 const disableLogging = true; //; env === 'production' || true; // ALWAYS TURNED OFF
-const middlewareList = disableLogging ? [] : [logger];
+const middlewareList = disableLogging ? [promiseMiddleware] : [logger, promiseMiddleware];
 
 export const createStore = (initialState: any) =>
   configureStore({

ts/state/ducks/search.ts

@@ -61,7 +61,7 @@ export const actions = {
 export function search(query: string, options: SearchOptions): SearchResultsKickoffActionType {
   return {
     type: 'SEARCH_RESULTS',
-    payload: doSearch(query, options),
+    payload: doSearch(query, options), // this uses redux-promise-middleware
   };
 }
 

yarn.lock

@@ -7535,6 +7535,11 @@ redux-persist@^6.0.0:
   resolved "https://registry.yarnpkg.com/redux-persist/-/redux-persist-6.0.0.tgz#b4d2972f9859597c130d40d4b146fecdab51b3a8"
   integrity sha512-71LLMbUq2r02ng2We9S215LtPu3fY0KgaGE0k8WRgl6RkqxtGfl7HUozz1Dftwsb0D/5mZ8dwAaPbtnzfvbEwQ==
 
+redux-promise-middleware@^6.1.2:
+  version "6.1.2"
+  resolved "https://registry.yarnpkg.com/redux-promise-middleware/-/redux-promise-middleware-6.1.2.tgz#1c14222686934be243cbb292e348ef7d5b20d6d2"
+  integrity sha512-ZqZu/nnSzGgwTtNbGoGVontpk7LjTOv0kigtt3CcgXI9gpq+8WlfXTXRZD0WTD5yaohRq0q2nYmJXSTjwXs83Q==
+
 redux-thunk@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"