diff --git a/src/adapters/search_history.js b/src/adapters/search_history.js
index 3c4b3a7ae..c5b142ded 100644
--- a/src/adapters/search_history.js
+++ b/src/adapters/search_history.js
@@ -6,6 +6,14 @@ import Intention from 'src/adapters/intention';
const SEARCH_HISTORY_KEY = 'search_history_v1';
const HISTORY_SIZE = 100;
+export function setHistoryEnabled(value) {
+ set(SEARCH_HISTORY_KEY + '_enabled', value);
+}
+
+export function getHistoryEnabled() {
+ return get(SEARCH_HISTORY_KEY + '_enabled');
+}
+
export function saveQuery(item) {
// Delete query if it's already in the list
deleteQuery(item);
diff --git a/src/components/TopBar.jsx b/src/components/TopBar.jsx
index 9ea540685..787691c41 100644
--- a/src/components/TopBar.jsx
+++ b/src/components/TopBar.jsx
@@ -8,7 +8,7 @@ import Menu from 'src/panel/Menu';
import { useConfig, useDevice, useI18n } from 'src/hooks';
import { handleFocus } from 'src/libs/input';
import { selectItem, fetchSuggests } from 'src/libs/suggest';
-import { saveQuery } from 'src/adapters/search_history';
+import { getHistoryEnabled, saveQuery } from 'src/adapters/search_history';
const MAPBOX_RESERVED_KEYS = ['ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown', '-', '+', '='];
@@ -18,7 +18,7 @@ const TopBar = ({ value, setUserInputValue, inputRef, onSuggestToggle, backButto
const [focused, setFocused] = useState(false);
const { isMobile } = useDevice();
const config = useConfig();
- const searchHistoryConfig = config.searchHistory;
+ const searchHistoryEnabled = getHistoryEnabled();
const { _ } = useI18n();
// give keyboard focus to the field when typing anywhere
@@ -54,7 +54,7 @@ const TopBar = ({ value, setUserInputValue, inputRef, onSuggestToggle, backButto
const onSelectSuggestion = (item, options) => {
selectItem(item, options);
- if (item && searchHistoryConfig?.enabled) {
+ if (item && searchHistoryEnabled) {
saveQuery(item);
}
inputRef.current.blur();
@@ -121,7 +121,7 @@ const TopBar = ({ value, setUserInputValue, inputRef, onSuggestToggle, backButto
onToggle={onSuggestToggle}
onSelect={onSelectSuggestion}
withFeedback
- withHistory={searchHistoryConfig?.enabled}
+ withHistory={searchHistoryEnabled}
>
{({ onKeyDown, onFocus, onBlur, highlightedValue }) => (
{
});
});
+ router.addRoute('History', '/history', () => {
+ setPanelOptions({
+ ActivePanel: HistoryPanel,
+ options: {},
+ panelSize: 'default',
+ });
+ });
+
if (directionConf.enabled) {
const isPublicTransportActive =
(directionConf.publicTransport && directionConf.publicTransport.enabled) ||
diff --git a/src/panel/direction/DirectionInput.jsx b/src/panel/direction/DirectionInput.jsx
index 4b79983df..817e8ecef 100644
--- a/src/panel/direction/DirectionInput.jsx
+++ b/src/panel/direction/DirectionInput.jsx
@@ -11,8 +11,8 @@ import Telemetry from 'src/libs/telemetry';
import { handleFocus } from 'src/libs/input';
import { IconArrowLeftLine, IconClose } from '@qwant/qwant-ponents';
import classnames from 'classnames';
-import { useConfig, useDevice, useI18n } from 'src/hooks';
-import { saveQuery } from 'src/adapters/search_history';
+import { useDevice, useI18n } from 'src/hooks';
+import { getHistoryEnabled, saveQuery } from 'src/adapters/search_history';
const DirectionInput = ({
isLoading,
@@ -26,7 +26,7 @@ const DirectionInput = ({
}) => {
const [readOnly, setReadOnly] = useState(false);
const { isMobile } = useDevice();
- const searchHistoryConfig = useConfig('searchHistory');
+ const searchHistoryEnabled = getHistoryEnabled();
const { _ } = useI18n();
useEffect(() => {
@@ -73,7 +73,7 @@ const DirectionInput = ({
} else {
const name = selectedPoi.type === 'latlon' ? selectedPoi.address.street : selectedPoi.name;
onChangePoint(name, selectedPoi);
- if (searchHistoryConfig?.enabled) {
+ if (searchHistoryEnabled) {
saveQuery(selectedPoi);
}
}
@@ -92,7 +92,7 @@ const DirectionInput = ({
outputNode={document.querySelector('.direction-autocomplete_suggestions')}
withGeoloc={withGeoloc}
onSelect={selectItem}
- withHistory={searchHistoryConfig?.enabled}
+ withHistory={searchHistoryEnabled}
hide={otherPoint}
>
{({ onKeyDown, onFocus, onBlur, highlightedValue }) => (
diff --git a/src/panel/history/HistoryPanel.jsx b/src/panel/history/HistoryPanel.jsx
new file mode 100644
index 000000000..b0589633c
--- /dev/null
+++ b/src/panel/history/HistoryPanel.jsx
@@ -0,0 +1,50 @@
+/* globals _ */
+import React, { useState } from 'react';
+import Panel from 'src/components/ui/Panel';
+import { Flex, Switch, Text } from '@qwant/qwant-ponents';
+import { setHistoryEnabled, getHistoryEnabled } from 'src/adapters/search_history';
+
+const HistoryPanel = () => {
+ const [isChecked, setIsChecked] = useState(getHistoryEnabled());
+ const close = () => {
+ window.app.navigateTo('/');
+ };
+
+ const onChange = e => {
+ setIsChecked(e.target.checked);
+ setHistoryEnabled(e.target.checked);
+ };
+
+ return (
+
+ {_('My history', 'history panel')}
+
+ }
+ minimizedTitle={_('Show history', 'history panel')}
+ onClose={close}
+ className="history_panel"
+ >
+
+
+ {_(
+ 'Your history is disabled. If you enable it, it will only be visible to you on this device',
+ 'history panel'
+ )}
+
+ {_('Learn more')}
+
+
+
+
+ );
+};
+
+export default HistoryPanel;
diff --git a/src/panel/menu/AppMenu.jsx b/src/panel/menu/AppMenu.jsx
index 6440c48b1..f9a08c829 100644
--- a/src/panel/menu/AppMenu.jsx
+++ b/src/panel/menu/AppMenu.jsx
@@ -3,14 +3,15 @@ import PropTypes from 'prop-types';
import MenuItem from './MenuItem';
import Telemetry from 'src/libs/telemetry';
import { Divider } from 'src/components/ui';
-import { IconHeart, IconEdit, IconBug } from 'src/components/ui/icons';
+import { IconHeart, IconHistory, IconEdit, IconBug } from 'src/components/ui/icons';
import { IconLight, IconApps } from '@qwant/qwant-ponents';
-import { PINK_DARK, ACTION_BLUE_BASE } from 'src/libs/colors';
+import { PINK_DARK, ACTION_BLUE_BASE, PURPLE } from 'src/libs/colors';
import { useConfig, useI18n } from 'src/hooks';
const AppMenu = ({ close, openProducts }) => {
const { baseUrl } = useConfig('system');
const { getLocalizedUrl, _ } = useI18n();
+ const searchHistoryConfig = useConfig('searchHistory');
const navTo = (url, options) => {
close();
@@ -30,6 +31,18 @@ const AppMenu = ({ close, openProducts }) => {
>
{_('My favorites', 'menu')}
+ {searchHistoryConfig?.enabled && (
+
+ )}