Fix lint

packages/components-faraday/src/components/Dashboard/Dashboard.js

 import React from 'react'
 import { get } from 'lodash'
 import { Button } from '@pubsweet/ui'
+import { connect } from 'react-redux'
+import { compose, withHandlers } from 'recompose'
 
 import classes from './Dashboard.local.scss'
 import DashboardItems from './DashboardItems'
@@ -13,6 +15,8 @@ const Dashboard = ({
   dashboard,
   deleteProject,
   listView,
+  filters,
+  getItems,
 }) => (
   <div className={classes.root}>
     <div className={classes.header}>
@@ -24,10 +28,48 @@ const Dashboard = ({
     <DashboardFilters changeView={changeViewMode} listView={listView} />
     <DashboardItems
       deleteProject={deleteProject}
-      list={get(currentUser, 'admin') ? dashboard.all : dashboard.owner}
+      list={getItems()}
       listView={listView}
     />
   </div>
 )
 
-export default Dashboard
+export default compose(
+  connect(state => ({
+    filters: state.filters.filter,
+    sortOrder: state.filters.sortValue,
+  })),
+  withHandlers({
+    getItems: ({ filters, sortOrder, currentUser, dashboard }) => () => {
+      const userItems = get(currentUser, 'admin')
+        ? dashboard.all
+        : dashboard.owner
+      const statusItems =
+        filters.status === 'all'
+          ? userItems
+          : userItems.filter(item => {
+              const itemStatus = get(item, 'status')
+              if (!itemStatus && filters.status === 'draft') {
+                return true
+              }
+              return itemStatus === filters.status
+            })
+      const ownerItems =
+        filters.owner === 'all'
+          ? statusItems
+          : statusItems.filter(item => {
+              const itemOwnerIds = item.owners.map(o => o.id)
+              if (filters.owner === 'me') {
+                return itemOwnerIds.includes(currentUser.id)
+              } else if (filters.owner === 'other') {
+                return !itemOwnerIds.includes(currentUser.id)
+              }
+              return false
+            })
+      return ownerItems.sort((a, b) => {
+        if (sortOrder === 'newest') return a.created - b.created < 0
+        return a.created - b.created > 0
+      })
+    },
+  }),
+)(Dashboard)

packages/components-faraday/src/components/Dashboard/Dashboard.local.scss

@@ -15,11 +15,24 @@
 }
 
 .filters {
+  align-items: flex-end;
+  display: flex;
+
   > span {
     border: 1px solid gray;
     margin: 0 0.5em;
     padding: 0 5px;
   }
+
+  .filter-group {
+    align-items: flex-start;
+    display: flex;
+    flex-direction: column;
+
+    > span {
+      margin-left: 10px;
+    }
+  }
 }
 
 .disabled {

packages/components-faraday/src/components/Dashboard/DashboardFilters.js

 import React from 'react'
-import { Icon } from '@pubsweet/ui'
+import { connect } from 'react-redux'
+import { Icon, Menu } from '@pubsweet/ui'
+import { compose, withHandlers } from 'recompose'
 
 import classes from './Dashboard.local.scss'
+import { changeFilter, changeSort } from './redux/filters'
+
+const statusFilterOptions = [
+  { label: 'All', value: 'all' },
+  { label: 'Submitted', value: 'submitted' },
+  { label: 'Draft', value: 'draft' },
+]
+
+const ownerFilterOptions = [
+  { label: 'Everyone', value: 'all' },
+  { label: 'My work', value: 'me' },
+  { label: `Other's work`, value: 'other' },
+]
+
+const sortOptions = [
+  { label: 'Newest first', value: 'newest' },
+  { label: 'Oldest first', value: 'oldest' },
+]
 
 const DashboardFilters = ({
   view,
@@ -9,14 +29,24 @@ const DashboardFilters = ({
   createdAt,
   changeView,
   listView,
+  changeFilter,
+  changeSort,
 }) => (
   <div className={classes.filtersContainer}>
     <div className={classes.filters}>
       Filter view:
-      <span> My work </span>
-      <span> Type </span>
-      <span> Status </span>
-      <span> Newest on top </span>
+      <div className={classes['filter-group']}>
+        <span>Owner</span>
+        <Menu onChange={changeFilter('owner')} options={ownerFilterOptions} />
+      </div>
+      <div className={classes['filter-group']}>
+        <span>Status</span>
+        <Menu onChange={changeFilter('status')} options={statusFilterOptions} />
+      </div>
+      <div className={classes['filter-group']}>
+        <span>Sort</span>
+        <Menu onChange={changeSort} options={sortOptions} />
+      </div>
     </div>
     <div className={classes.viewMode} onClick={changeView}>
       <div className={classes.icon}>
@@ -27,4 +57,11 @@ const DashboardFilters = ({
   </div>
 )
 
-export default DashboardFilters
+export default compose(
+  connect(null, { changeFilter, changeSort }),
+  withHandlers({
+    changeFilter: ({ changeFilter }) => filterKey => value => {
+      changeFilter(filterKey, value)
+    },
+  }),
+)(DashboardFilters)

packages/components-faraday/src/components/Dashboard/redux/filters.js

-export default (state = {}, action) => {
+const initialState = {
+  filter: {
+    status: 'all',
+    owner: 'all',
+  },
+  sortValue: 'newest',
+}
+
+const CHANGE_FILTER = 'filters/CHANGE_FILTER'
+const CHANGE_SORT = 'filters/CHANGE_SORT'
+
+export const changeFilter = (filterKey, value) => ({
+  type: CHANGE_FILTER,
+  filterKey,
+  value,
+})
+
+export const changeSort = value => ({
+  type: CHANGE_SORT,
+  value,
+})
+
+export default (state = initialState, action) => {
   switch (action.type) {
+    case CHANGE_FILTER:
+      return {
+        ...state,
+        filter: {
+          ...state.filter,
+          [action.filterKey]: action.value,
+        },
+      }
+    case CHANGE_SORT:
+      return {
+        ...state,
+        sortValue: action.value,
+      }
     default:
       return state
   }