Merge branch 'chat-mobile-toggle' into 'develop'

Chats: allow toggle notification sounds from mobile

See merge request soapbox-pub/soapbox-fe!237

app/soapbox/features/chats/index.js

@@ -4,6 +4,7 @@ import Column from '../../components/column';
 import ColumnHeader from '../../components/column_header';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import ChatList from './components/chat_list';
+import AudioToggle from 'soapbox/features/chats/components/audio_toggle';
 
 const messages = defineMessages({
   title: { id: 'column.chats', defaultMessage: 'Chats' },
@@ -33,6 +34,7 @@ class ChatIndex extends React.PureComponent {
           icon='comment'
           title={intl.formatMessage(messages.title)}
         />
+        <div className='column__switch'><AudioToggle /></div>
 
         <ChatList
           onClickChat={this.handleClickChat}

app/styles/components/columns.scss

@@ -703,3 +703,15 @@
 .column-link--transparent .icon-with-badge__badge {
   border-color: var(--background-color);
 }
+
+.column__switch .audio-toggle {
+  position: absolute;
+  z-index: 4;
+  top: 12px;
+  right: 14px;
+
+  .react-toggle-track-check,
+  .react-toggle-track-x {
+    height: 16px;
+  }
+}