Progress

hashtag in top of tag feed, scroll to comment, chat blocking, muting, filtering

app/javascript/gabsocial/features/messages/components/chat_conversations_list.js

@@ -9,6 +9,8 @@ import {
   expandChatConversations,
   fetchChatConversationRequested,
   expandChatConversationRequested,
+  fetchChatConversationMuted,
+  expandChatConversationMuted,
 } from '../../../actions/chat_conversations'
 import AccountPlaceholder from '../../../components/placeholder/account_placeholder'
 import ChatConversationsListItem from './chat_conversations_list_item'
@@ -72,6 +74,8 @@ const mapDispatchToProps = (dispatch) => ({
       dispatch(fetchChatConversations())
     } else if (source ==='requested') {
       dispatch(fetchChatConversationRequested())
+    } else if (source ==='muted') {
+      dispatch(fetchChatConversationMuted())
     }
   },
   onExpandChatConversations(source) {
@@ -79,6 +83,8 @@ const mapDispatchToProps = (dispatch) => ({
       dispatch(expandChatConversations())
     } else if (source ==='requested') {
       dispatch(expandChatConversationRequested())
+    } else if (source ==='muted') {
+      dispatch(expandChatConversationMuted())
     }
   },
 })

app/javascript/gabsocial/features/messages/components/chat_conversations_search.js

@@ -1,29 +1,31 @@
 import React from 'react'
 import PropTypes from 'prop-types'
+import { connect } from 'react-redux'
 import Input from '../../../components/input'
 
 class ChatConversationsSearch extends React.PureComponent {
 
-  static contextTypes = {
-    router: PropTypes.object,
+  state = {
+    value: '',
   }
 
-  state = {
-    composeFocused: false,
+  handleOnChange = (value) => {
+    this.setState({ value })
+    this.props.onChange(value)
   }
 
   render() {
-    const {
-      children
-    } = this.props
+    const { value } = this.state
 
     return (
       <div className={[_s.d, _s.h60PX, _s.w100PC, _s.px10, _s.py10, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
         <Input
           type='search'
-          placeholder='Search for messages'
+          placeholder='Search for conversations'
           id='messages-search'
           prependIcon='search'
+          value={value}
+          onChange={this.handleOnChange}
         />
       </div>
     )
@@ -31,8 +33,10 @@ class ChatConversationsSearch extends React.PureComponent {
 
 }
 
-ChatConversationsSearch.propTypes = {
-  //
-}
+const mapDispatchToProps = (dispatch) => ({
+  onChange(value) {
+    // dispatch()
+  }
+})
 
-export default ChatConversationsSearch
+export default connect(null, mapDispatchToProps)(ChatConversationsSearch)

app/javascript/gabsocial/features/messages/components/chat_message_header.js

@@ -21,7 +21,12 @@ class ChatMessageHeader extends React.PureComponent {
   }
 
   handleOnOpenChatConversationOptionsPopover = () => {
-    this.props.onOpenChatConversationOptionsPopover(this.props.chatConversationId, this.optionsBtnRef)
+    const isChatConversationRequest = !!this.props.chatConversation ? !this.props.chatConversation.get('is_approved') : false
+    this.props.onOpenChatConversationOptionsPopover({
+      isChatConversationRequest,
+      chatConversationId: this.props.chatConversationId,
+      targetRef: this.optionsBtnRef,
+    })
   }
 
   setOptionsBtnRef = (c) => {
@@ -63,7 +68,7 @@ class ChatMessageHeader extends React.PureComponent {
             onClick={this.handleOnApproveMessageRequest}
             className={_s.ml10}
           >
-            <Text>
+            <Text color='inherit'>
               Approve Message Request
             </Text>
           </Button>
@@ -82,10 +87,9 @@ const mapDispatchToProps = (dispatch) => ({
   onApproveChatConversationRequest(chatConversationId) {
     dispatch(approveChatConversationRequest(chatConversationId))
   },
-  onOpenChatConversationOptionsPopover(chatConversationId, targetRef) {
+  onOpenChatConversationOptionsPopover(options) {
     dispatch(openPopover(POPOVER_CHAT_CONVERSATION_OPTIONS, {
-      chatConversationId,
-      targetRef,
+      ...options,
       position: 'left-end',
     }))
   },

app/javascript/gabsocial/features/messages/components/chat_message_scrolling_list.js

@@ -22,6 +22,7 @@ import ChatMessagePlaceholder from '../../../components/placeholder/chat_message
 import ChatMessageItem from './chat_message_item'
 import ColumnIndicator from '../../../components/column_indicator'
 import LoadMore from '../../../components/load_more'
+import Text from '../../../components/text'
 
 class ChatMessageScrollingList extends ImmutablePureComponent {
 
@@ -238,6 +239,7 @@ class ChatMessageScrollingList extends ImmutablePureComponent {
       isLoading,
       isPartial,
       hasMore,
+      amITalkingToMyself,
       onScrollToBottom,
       onScroll,
       isXS,
@@ -299,6 +301,15 @@ class ChatMessageScrollingList extends ImmutablePureComponent {
             className={[_s.d, _s.h100PC, _s.w100PC, _s.px15, _s.py15, _s.overflowYScroll].join(' ')}
             ref={this.setScrollContainerRef}
           >
+            {
+              amITalkingToMyself &&
+              <div className={[_s.d, _s.bgTertiary, _s.radiusSmall, _s.mt5, _s.ml10, _s.mr15, _s.px15, _s.py15, _s.mb15].join(' ')}>
+                <Text size='medium' color='secondary'>
+                  This is a chat conversation with yourself. Use this space to keep messages, links and texts. Please remember that these messages are not encrypted.
+                </Text>
+              </div>
+            }
+
             {
               (hasMore && !isLoading) &&
               <LoadMore onClick={this.handleLoadOlder} />
@@ -349,7 +360,11 @@ class ChatMessageScrollingList extends ImmutablePureComponent {
 const mapStateToProps = (state, { chatConversationId }) => {
   if (!chatConversationId) return {}
 
+  const otherAccountIds = state.getIn(['chat_conversations', chatConversationId, 'other_account_ids'], null)
+  const amITalkingToMyself = !!otherAccountIds ? otherAccountIds.size == 1 && otherAccountIds.get(0) === me : false
+
   return {
+    amITalkingToMyself,
     chatMessageIds: state.getIn(['chat_conversation_messages', chatConversationId, 'items'], ImmutableList()),
     isLoading: state.getIn(['chat_conversation_messages', chatConversationId, 'isLoading'], true),
     isPartial: state.getIn(['chat_conversation_messages', chatConversationId, 'isPartial'], false),