Progress

app/javascript/gabsocial/components/panel/media_gallery_panel.js

@@ -37,13 +37,13 @@ class MediaGalleryPanel extends ImmutablePureComponent {
     const { accountId } = this.props
 
     if (accountId) {
-      this.props.dispatch(expandAccountMediaTimeline(accountId, {limit: 8}))
+      this.props.dispatch(expandAccountMediaTimeline(accountId, { limit: 8 }))
     }
   }
 
   componentWillReceiveProps(nextProps) {
     if (nextProps.accountId && nextProps.accountId !== this.props.accountId) {
-      this.props.dispatch(expandAccountMediaTimeline(nextProps.accountId, {limit: 8}))
+      this.props.dispatch(expandAccountMediaTimeline(nextProps.accountId, { limit: 8 }))
     }
   }
 

app/javascript/gabsocial/components/panel/notification_filter_panel.js

@@ -1,33 +1,59 @@
 import { defineMessages, injectIntl } from 'react-intl'
 import ImmutablePureComponent from 'react-immutable-pure-component'
+import ImmutablePropTypes from 'react-immutable-proptypes'
+import { changeSetting, saveSettings } from '../../actions/settings'
 import PanelLayout from './panel_layout'
-import Switch from '../switch'
+import SettingSwitch from '../setting_switch'
 
 const messages = defineMessages({
   title: { id: 'notification_filters', defaultMessage: 'Notification Filters' },
+  onlyVerified: { id: 'notification_only_verified', defaultMessage: 'Only Verified Users' },
+  onlyFollowing: { id: 'notification_only_following', defaultMessage: 'Only People I Follow' },
 })
 
+const mapStateToProps = state => ({
+  settings: state.getIn(['settings', 'notifications']),
+})
+
+const mapDispatchToProps = (dispatch) => {
+  return {
+    onChange(key, checked) {
+      dispatch(changeSetting(['notifications', ...key], checked))
+      dispatch(saveSettings())
+    },
+  }
+}
+
 export default
 @injectIntl
+@connect(mapStateToProps, mapDispatchToProps)
 class NotificationFilterPanel extends ImmutablePureComponent {
 
   static propTypes = {
     intl: PropTypes.object.isRequired,
+    onChange: PropTypes.func.isRequired,
+    settings: ImmutablePropTypes.map.isRequired,
   }
 
   render() {
-    const { intl } = this.props
+    const { intl, onChange, settings } = this.props
 
     return (
       <PanelLayout title={intl.formatMessage(messages.title)}>
-        <Switch 
-          id='notifications-verified'
-          label='Only Verified Users'
+        <SettingSwitch
+          prefix='notification'
+          settings={settings}
+          settingPath={['quickFilter', 'onlyVerifed']}
+          onChange={onChange}
+          label={intl.formatMessage(messages.onlyVerified)}
         />
-        
-        <Switch 
-          id='notifications-verified'
-          label='Only People I Follow'
+
+        <SettingSwitch
+          prefix='notification'
+          settings={settings}
+          settingPath={['quickFilter', 'onlyFollowing']}
+          onChange={onChange}
+          label={intl.formatMessage(messages.onlyFollowing)}
         />
       </PanelLayout>
     )

app/javascript/gabsocial/components/panel/trends_panel.js

@@ -7,7 +7,7 @@ import ColumnIndicator from '../column_indicator'
 import TrendingItem from '../trends_item'
 
 const messages = defineMessages({
-  title: { id:'trends.title', defaultMessage: 'Trending right now' },
+  title: { id: 'trends.title', defaultMessage: 'Trending right now' },
 })
 
 const mapStateToProps = state => ({
@@ -31,7 +31,7 @@ class TrendsPanel extends ImmutablePureComponent {
     onFetchGabTrends: PropTypes.func.isRequired,
   }
 
-  componentWillMount () {
+  componentWillMount() {
     this.props.onFetchGabTrends()
   }
 
@@ -52,7 +52,7 @@ class TrendsPanel extends ImmutablePureComponent {
             gabtrends && gabtrends.slice(0, 8).map((trend, i) => (
               <TrendingItem
                 key={`gab-trend-${i}`}
-                index={i+1}
+                index={i + 1}
                 isLast={i === 7}
                 url={trend.get('url')}
                 title={trend.get('title')}