diff --git a/js/components/ActionsButton.js b/js/components/ActionsButton.js
deleted file mode 100644
index 71beb08..0000000
--- a/js/components/ActionsButton.js
+++ /dev/null
@@ -1,98 +0,0 @@
-// @flow
-import React from 'react';
-import { ActionButton } from 'react-native-material-ui';
-import { compose, pure, withHandlers } from 'recompose';
-import { withRouterContext, withViewMode, withPushRoute } from '../enhancers/routeEnhancers';
-import queryString from 'query-string';
-import { routeWithQuery } from '../helpers/RouteHelpers';
-import { prop, head, length, map } from 'ramda';
-
-type Props = {
- actions: Array<'add-food' | 'filter-modal' | 'view-mode'>,
- viewMode: string,
- actionPressed: Function,
- toggleFilterModal: ?Function,
- pushRoute: Function,
- router: Object,
- addFoodItem: Function,
- setViewMode: (mode: string) => void,
- placeId?: string,
-};
-
-const actionDefs = {
- 'add-food': () => ({ icon: 'add', label: 'Add New', name: 'add-food' }),
- 'filter-modal': () => ({ icon: 'filter-list', label: 'Filter', name: 'filter-modal' }),
- 'view-mode': props =>
- props.viewMode === 'map'
- ? { icon: 'list', label: 'View list', name: 'list-view' }
- : { icon: 'map', label: 'View map', name: 'map-view' },
-};
-
-const ActionsButton = (props: Props) => {
- const actions = map(action => actionDefs[action](props), props.actions || []);
- const transition = length(actions) > 1 ? 'speedDial' : null;
- const icon = length(actions) > 1 ? 'add' : prop('icon', head(actions));
-
- return (
-
- );
-};
-
-export default compose(
- pure,
- withRouterContext,
- withViewMode,
- withPushRoute,
- withHandlers({
- addFoodItem: ({ pushRoute, placeId }: Props) => () => {
- pushRoute(
- routeWithQuery('/createFoodItem', {
- routeTitle: 'Add a Food Item',
- placeId,
- })
- );
- },
- setViewMode: ({ router }: Props) => (viewMode: string) => {
- const history = router.history;
- const search = router.route.location.search;
-
- history.replace({
- search: queryString.stringify({
- search,
- viewMode,
- }),
- });
- },
- }),
- withHandlers({
- actionPressed: (props: Props) =>
- function handleActionPressed(action: ?String) {
- switch (action) {
- case 'add-food':
- props.addFoodItem();
- break;
- case 'filter-modal':
- props.toggleFilterModal && props.toggleFilterModal();
- break;
- case 'map-view':
- case 'list-view':
- case 'view-mode':
- props.setViewMode(props.viewMode === 'map' ? 'list' : 'map');
- break;
- case 'main-button':
- if (length(props.actions) === 1) {
- handleActionPressed(head(props.actions));
- }
- break;
- default:
- break;
- }
- },
- })
-)(ActionsButton);
diff --git a/js/components/TopToolbar.js b/js/components/TopToolbar.js
index 1d1bbec..220f053 100644
--- a/js/components/TopToolbar.js
+++ b/js/components/TopToolbar.js
@@ -4,7 +4,7 @@ import { View, TextInput, TouchableOpacity, SafeAreaView } from 'react-native';
import { Toolbar, Icon } from 'react-native-material-ui';
import { path, pipe, not, cond, isNil, compose, always } from 'ramda';
import queryString from 'query-string';
-import { getSearch } from '../helpers/RouteHelpers';
+import { getSearch, getViewMode } from '../helpers/RouteHelpers';
import FoodItemSaveBtn from '../components/FoodItemSaveBtn';
import { withFilter } from '../enhancers/filterEnhancers';
import FilterRecord from '../records/FilterRecord';
@@ -46,16 +46,15 @@ class TopToolbar extends Component {
goBackTo(router);
};
- onRightPress = ({ action }: { action: string }) => {
- const {
- router: { history },
- } = this.props;
+ toggleMapList = () => {
+ const history = path(['router', 'history'], this.props);
const search = getSearch(this.props);
+ const viewMode = getViewMode(this.props);
history.replace({
search: queryString.stringify({
...search,
- viewMode: action,
+ viewMode: viewMode === 'list' ? 'map' : 'list',
}),
});
};
@@ -83,6 +82,7 @@ class TopToolbar extends Component {
const route = path(['router', 'route', 'location', 'pathname'], this.props);
const routeSearch = getSearch(this.props);
const title = routeSearch.routeTitle || this.props.title;
+ const viewMode = getViewMode(this.props);
const showSearch = /^\/list/.test(route);
const showSearchClear = filter.search.length > 0;
@@ -97,45 +97,60 @@ class TopToolbar extends Component {
onLeftElementPress={this.onBackPress}
centerElement={title}
rightElement={this.getRightElement()}
- onRightElementPress={this.onRightPress}
/>
)}
{showSearch && (
-
-
-
+
- {showSearchClear ? (
-
-
-
- ) : (
-
+
+
-
-
- )}
+ flex: 1,
+ fontSize: 18,
+ padding: 5,
+ }}
+ />
+ {showSearchClear ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
+
+
+
)}
diff --git a/js/enhancers/routeEnhancers.js b/js/enhancers/routeEnhancers.js
index 2117720..2720c72 100644
--- a/js/enhancers/routeEnhancers.js
+++ b/js/enhancers/routeEnhancers.js
@@ -2,7 +2,7 @@
import { getContext, withProps, compose } from 'recompose';
import { shape, func, string } from 'prop-types';
import { path } from 'ramda';
-import { getSearch } from '../helpers/RouteHelpers';
+import { getViewMode } from '../helpers/RouteHelpers';
export type routeMatch = {
isExact: boolean,
@@ -48,7 +48,7 @@ export const withRouterContext = getContext({
export const withViewMode = withProps((props: Object) => {
return {
- viewMode: getSearch(props).viewMode || 'list',
+ viewMode: getViewMode(props),
};
});
diff --git a/js/helpers/RouteHelpers.js b/js/helpers/RouteHelpers.js
index 8e175a1..8a659f2 100644
--- a/js/helpers/RouteHelpers.js
+++ b/js/helpers/RouteHelpers.js
@@ -26,3 +26,8 @@ export const getSearch = pipe(
pathOr('', ['router', 'route', 'location', 'search']),
queryString.parse
);
+
+export const getViewMode = pipe(
+ getSearch,
+ pathOr('list', ['viewMode'])
+);
diff --git a/js/pages/LoginPage.js b/js/pages/LoginPage.js
index 965a4f3..8a05408 100644
--- a/js/pages/LoginPage.js
+++ b/js/pages/LoginPage.js
@@ -4,7 +4,6 @@ import { View, Text, TextInput, Button, TouchableOpacity } from 'react-native';
import { withHandlers, compose, withState, lifecycle } from 'recompose';
import { withRouterContext } from '../enhancers/routeEnhancers';
import AuthManager from '../AuthManager';
-import queryString from 'query-string';
import theme from '../ui-theme';
import { Divider, Icon } from 'react-native-material-ui';
diff --git a/js/pages/PlaceDetail.js b/js/pages/PlaceDetail.js
index 344d00d..3f69f8c 100644
--- a/js/pages/PlaceDetail.js
+++ b/js/pages/PlaceDetail.js
@@ -17,7 +17,6 @@ import { type List } from 'immutable';
import typeof FoodItemRecord from '../records/FoodItemRecord';
import FoodItemTile from '../components/FoodItemTile';
import { openUrl } from '../helpers/linkHelpers';
-import ActionsButton from '../components/ActionsButton';
import { routeWithQuery } from '../helpers/RouteHelpers';
import { Link } from 'react-router-native';
@@ -115,7 +114,6 @@ const PlaceDetail = (props: Props) => {
))}
-
);
};
diff --git a/js/pages/PlacesMap.js b/js/pages/PlacesMap.js
index 433acd0..5b5d6e9 100644
--- a/js/pages/PlacesMap.js
+++ b/js/pages/PlacesMap.js
@@ -11,7 +11,6 @@ import PlaceTile from '../components/PlaceTile';
import { withFoodItemsGroupedByPlace } from '../enhancers/foodItemEnhancers';
import { withRegionState } from '../enhancers/mapViewEnhancers';
import typeof PlaceRecord from '../records/PlaceRecord';
-import ActionsButton from '../components/ActionsButton';
type Region = {
latitude: number,
@@ -29,7 +28,6 @@ type Props = {
pushRoute: () => {},
};
-// const PlacesMap = ({ places, region, onRegionChange, pushRoute }: Props) => {
const PlacesMap = ({
places = Map(),
foodItemsByPlace = Map(),
@@ -72,7 +70,6 @@ const PlacesMap = ({
})
.toList()}
-
);
};