diff --git a/config.js b/config.js index 762aea94..1c57fbd5 100644 --- a/config.js +++ b/config.js @@ -46,6 +46,13 @@ const config = { // // E.g. the 'bike' entry will add a "bike" profile for which we send a request with the specified 'details' parameter. You can even change the profile itself when you specify // bike: { profile: 'raw_bike', ... } + + // Certain profiles should not appear in the list as it would be too many. Instead they're listed in the settings but still a 'main' profile needs to be shown. + // profile_group_mapping: { + // car_avoid_motorway: 'car', + // car_avoid_ferry: 'car', + // car_avoid_toll: 'car', + // } } // this is needed for jest (with our current setup at least) diff --git a/src/App.tsx b/src/App.tsx index 40acc8bb..0c6e305d 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -163,6 +163,7 @@ function LargeScreenLayout({ query, route, map, error, mapOptions, encodedValues setShowCustomModelBox(!showCustomModelBox)} @@ -177,7 +178,7 @@ function LargeScreenLayout({ query, route, map, error, mapOptions, encodedValues drawAreas={drawAreas} /> )} - +
{!error.isDismissed && }
const profiles: object } diff --git a/src/sidebar/MobileSidebar.tsx b/src/sidebar/MobileSidebar.tsx index e4d17318..d41f80d2 100644 --- a/src/sidebar/MobileSidebar.tsx +++ b/src/sidebar/MobileSidebar.tsx @@ -58,6 +58,7 @@ export default function ({ query, route, error, encodedValues, drawAreas }: Mobi setShowCustomModelBox(!showCustomModelBox)} @@ -72,7 +73,7 @@ export default function ({ query, route, error, encodedValues, drawAreas }: Mobi drawAreas={drawAreas} /> )} - + )} {!error.isDismissed && } diff --git a/src/sidebar/SettingsBox.module.css b/src/sidebar/SettingsBox.module.css index 3f8faf26..0e89bdd8 100644 --- a/src/sidebar/SettingsBox.module.css +++ b/src/sidebar/SettingsBox.module.css @@ -26,6 +26,27 @@ align-items: center; } +.carProfileOptionsHeader { + font-weight: bold; +} + +.carProfileOptions div { + padding: 4px 14px; +} + +.carProfileOptions label, +input { + cursor: pointer; +} + +.carProfileOptions label { + margin-left: 10px; +} + +.carProfileOptions { + padding: 12px 5px; +} + .toggleButton { display: flex; align-items: center; diff --git a/src/sidebar/SettingsBox.tsx b/src/sidebar/SettingsBox.tsx index a4fa72a5..920f1ba1 100644 --- a/src/sidebar/SettingsBox.tsx +++ b/src/sidebar/SettingsBox.tsx @@ -1,4 +1,4 @@ -import { UpdateSettings } from '@/actions/Actions' +import { SetVehicleProfile, UpdateSettings } from '@/actions/Actions' import Dispatcher from '@/stores/Dispatcher' import styles from '@/sidebar/SettingsBox.module.css' import { tr } from '@/translation/Translation' @@ -7,14 +7,39 @@ import OnIcon from '@/sidebar/toggle_on.svg' import OffIcon from '@/sidebar/toggle_off.svg' import { useContext, useState } from 'react' import { SettingsContext } from '@/contexts/SettingsContext' +import { RoutingProfile } from '@/api/graphhopper' -export default function SettingsBox() { +export default function SettingsBox({ profile }: { profile: RoutingProfile }) { const settings = useContext(SettingsContext) + function setProfile(n: string) { + Dispatcher.dispatch(new SetVehicleProfile({ name: profile.name === n ? 'car' : n })) + } return (
{tr('settings')}
+ {/* TODO make generic so that it could be used to collapse e.g. hike & foot */} + {profile.name.startsWith('car') && ( +
+ {tr('Avoid')} +
+ {/*prettier-ignore*/} + setProfile('car_avoid_motorway')} /> + +
+
+ {/*prettier-ignore*/} + setProfile('car_avoid_ferry')} /> + +
+
+ {/*prettier-ignore*/} + setProfile('car_avoid_toll')} /> + +
+
+ )}
- {showSettings && } + {showSettings && }
) } diff --git a/src/sidebar/search/routingProfiles/RoutingProfiles.tsx b/src/sidebar/search/routingProfiles/RoutingProfiles.tsx index 5710b057..488aae3e 100644 --- a/src/sidebar/search/routingProfiles/RoutingProfiles.tsx +++ b/src/sidebar/search/routingProfiles/RoutingProfiles.tsx @@ -11,12 +11,14 @@ import { icons } from '@/sidebar/search/routingProfiles/profileIcons' export default function ({ routingProfiles, + profileGroupMapping, selectedProfile, showCustomModelBox, toggleCustomModelBox, customModelBoxEnabled, }: { routingProfiles: RoutingProfile[] + profileGroupMapping: Record selectedProfile: RoutingProfile showCustomModelBox: boolean toggleCustomModelBox: () => void @@ -100,10 +102,12 @@ export default function ({