- {paramNames.map(param => {
- const paramInfo = queryParams.find(qp => qp.name === param)
- // Check that the parameter applies to the specified routingType
- if (!paramInfo.routingTypes.includes(query.routingType)) return
-
- // Check that the applicability test (if provided) is satisfied
- if (typeof paramInfo.applicable === 'function' &&
- !paramInfo.applicable(query, config)) return
-
- // Create the UI component based on the selector type
- switch (paramInfo.selector) {
- case 'DROPDOWN':
- return
- case 'CHECKBOX':
- return
- }
- })}
-
- )
- }
-}
-
-// Make a mode string more readable (e.g. 'BICYCLE_RENT' -> 'Bicycle Rent')
-function readableModeString (mode) {
- const str = mode.replace('_', ' ')
- return str.replace(/\w\S*/g, txt => { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase() })
-}
-
-// connect to redux store
-
-const mapStateToProps = (state, ownProps) => {
- const { companies, mode, routingType } = state.otp.currentQuery
- return {
- companies,
- modeGroups: state.otp.config.modeGroups,
- queryModes: !mode || mode.length === 0 ? [] : mode.split(','),
- routingType
- }
-}
-
-const mapDispatchToProps = { setQueryParam }
-
-export default connect(mapStateToProps, mapDispatchToProps)(ModesPanel)
diff --git a/lib/components/form/settings-selector-panel.js b/lib/components/form/settings-selector-panel.js
deleted file mode 100644
index 9718fcd45..000000000
--- a/lib/components/form/settings-selector-panel.js
+++ /dev/null
@@ -1,588 +0,0 @@
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import { Row, Col, Button } from 'react-bootstrap'
-import { connect } from 'react-redux'
-
-import {
- clearDefaultSettings,
- resetForm,
- setQueryParam,
- storeDefaultSettings
-} from '../../actions/form'
-import GeneralSettingsPanel from './general-settings-panel'
-import Icon from '../narrative/icon'
-import ModeButton from './mode-button'
-import {
- getIcon,
- isAccessMode,
- hasBike,
- isTransit,
- hasMicromobility,
- hasHail,
- hasRental,
- hasTransit,
- getTransitModes
-} from '../../util/itinerary'
-import { getTripOptionsFromQuery, isNotDefaultQuery } from '../../util/query'
-import { getShowUserSettings } from '../../util/state'
-
-class SettingsSelectorPanel extends Component {
- static propTypes = {
- icons: PropTypes.object
- }
-
- constructor (props) {
- super(props)
- this.state = { activePanel: 'MODES' }
- }
-
- // returns whether a micromobility company is selected or not
- _companyIsActive (company) {
- const {companies} = this.props
- return companies && companies.indexOf(company.id) > -1
- }
-
- // Returns whether a particular mode or TNC agency is active
- _modeIsActive (mode) {
- const { companies, queryModes } = this.props
- if (mode.mode === 'CAR_HAIL' || mode.mode === 'CAR_RENT') {
- return Boolean(companies && mode.company && companies.includes(mode.company.toUpperCase()))
- }
-
- for (const m of queryModes) {
- if (m === mode.mode) return true
- }
- // All transit modes are selected
- // if (isTransit(mode.mode) && queryModes.indexOf('TRANSIT') !== -1) return true
- return false
- }
-
- _setSoloMode (mode) {
- // save current access/transit modes
- if (hasTransit(this.props.mode)) this._lastTransitMode = this.props.mode
- this.props.setQueryParam({ mode })
- }
-
- _setWalkOnly = () => { this._setSoloMode('WALK') }
-
- _setBikeOnly = () => { this._setSoloMode('BICYCLE') }
-
- _setMicromobilityOnly = () => { this._setSoloMode('MICROMOBILITY') }
-
- /**
- * Replace own mode with new mode. The only mode will have already been set,
- * so this toggles whether the own mode includes a rental.
- */
- _replaceOwnMode = (newMode, referenceOwnMode) => {
- const { queryModes, setQueryParam } = this.props
- const nonOwnModes = queryModes.filter(m => !m.startsWith(referenceOwnMode))
- setQueryParam({ mode: [...nonOwnModes, newMode].join(',') })
- }
-
- _setOwnBike = () => this._replaceOwnMode('BICYCLE', 'BICYCLE')
-
- _setRentedBike = () => this._replaceOwnMode('BICYCLE_RENT', 'BICYCLE')
-
- _setOwnMicromobility = () => this._replaceOwnMode('MICROMOBILITY', 'MICROMOBILITY')
-
- _setRentedMicromobility = () => {
- this._replaceOwnMode('MICROMOBILITY_RENT', 'MICROMOBILITY')
- this.props.setQueryParam({ companies: this._getCompaniesForMode('MICROMOBILITY_RENT') })
- }
-
- _getCompaniesForMode = (modeStr) => {
- const {config} = this.props
- return config.companies
- .filter(co => co.modes.indexOf(modeStr) > -1)
- .map(co => co.id)
- .join(',')
- }
-
- _toggleCompany (company) {
- const {companies, setQueryParam} = this.props
-
- // set company if no companies set yet
- if (!companies) {
- setQueryParam({ companies: company })
- return
- }
-
- // add or remove from existing companies
- if (companies.indexOf(company) > -1) {
- // company already present in query, remove
- setQueryParam({
- companies: companies
- .split(',')
- .filter(co => co !== company)
- .join(',')
- })
- } else {
- // company not yet present, add to string list
- setQueryParam({ companies: `${companies},${company}` })
- }
- }
-
- _toggleTransitMode (mode) {
- const {queryModes, setQueryParam} = this.props
- const modeStr = mode.mode || mode
- let newQueryModes = queryModes.slice(0) // Clone the modes array
-
- // do not allow the last transit mode to be deselected
- const transitModes = newQueryModes.filter(m => isTransit(m))
- if (transitModes.length === 1 && transitModes[0] === modeStr) return
-
- // If mode is currently selected, deselect it
- if (newQueryModes.includes(modeStr)) {
- newQueryModes = newQueryModes.filter(m => m !== modeStr)
- // Or, if mode is currently not selected, select it
- } else if (!newQueryModes.includes(modeStr)) {
- newQueryModes.push(modeStr)
- }
- setQueryParam({ mode: newQueryModes.join(',') })
- }
-
- _toggleStoredSettings = () => {
- const options = getTripOptionsFromQuery(this.props.query)
- // If user defaults are set, clear them. Otherwise, store them.
- if (this.props.defaults) this.props.clearDefaultSettings()
- else this.props.storeDefaultSettings(options)
- }
-
- _resetForm = () => this.props.resetForm()
-
- _setAccessMode = (mode) => {
- const {config, queryModes} = this.props
- let newQueryModes = queryModes.slice(0) // Clone the modes array
- const modeStr = mode.mode || mode
-
- // Create object to contain multiple parameter updates if needed (i.e. 'mode', 'compainies')
- const queryParamUpdate = {}
-
- if (this._lastTransitMode) {
- // Restore previous transit selection, if present
- newQueryModes = this._lastTransitMode.split(',').filter(m => !isAccessMode(m))
- this._lastTransitMode = null
- } else {
- // Otherwise, retain any currently selected transit modes
- newQueryModes = newQueryModes.filter(m => !isAccessMode(m))
- }
-
- // If no transit modes selected, select all
- if (!newQueryModes || newQueryModes.length === 0) {
- newQueryModes = getTransitModes(config)
- }
-
- // Add the access mode
- newQueryModes.push(modeStr)
-
- // apply needed companies to query
- queryParamUpdate.companies = mode.company
- // mode is associated with a specific company
- ? mode.company.toUpperCase()
- // mode is either a rental or hailing mode, but not associated with
- // a specific company
- : (hasRental(modeStr) || hasHail(modeStr))
- // when switching, add all companies at first
- ? this._getCompaniesForMode(modeStr)
- // mode is not renting or hailing and not associated with any company
- : null
-
- queryParamUpdate.mode = newQueryModes.join(',')
-
- this.props.setQueryParam(queryParamUpdate)
- }
-
- _renderCompanies = () => {
- const {companies: queryCompanies, config, icons, mode} = this.props
- const {companies: configCompanies, modes} = config
- const {accessModes} = modes
-
- // check if a single company has an exclusive button
- if (queryCompanies && accessModes.some(
- accessMode => accessMode.company === queryCompanies.toUpperCase())
- ) {
- // a match has been found for an access mode that exclusively belongs to
- // a particular company
- return null
- }
-
- // hack for TriMet-MOD project, don't show companies if Biketown enabled
- // when using just bike rentals
- if (mode && mode.indexOf('BICYCLE_RENT') > -1) {
- return null
- }
-
- // check if renting or hailing
- if (hasRental(mode) || hasHail(mode)) {
- const queryModes = mode.split(',')
- const activeCompanies = configCompanies
- .filter(company =>
- company.modes
- .split(',')
- .some(companyMode => queryModes.indexOf(companyMode) > -1)
- )
-
- return (
-
-
Use Companies
-
- {activeCompanies.length === 0 &&
-
No comapnies available for this mode!
- }
- {activeCompanies.map((company) => {
- let classNames = ['select-button']
- if (this._companyIsActive(company)) classNames.push('active')
- return
- })}
-
-
-
- )
- }
- }
-
- _renderExclusiveAccessSelectors = () => {
- const {config, mode, icons} = this.props
- const {exclusiveModes} = config.modes
- const modeHasTransit = hasTransit(mode)
- // Use int for array element keys
- let key = 0
- if (!exclusiveModes) return null
-
- // create an array of children to display within a mode-group-row
- // at most 2 exclusive modes will be displayed side-by-side
- const children = []
- const spacer = () => (
-
- )
-
- exclusiveModes.forEach((exclusiveMode, idx) => {
- // add left padding for every evenly indexed exclusiveMode
- if (idx % 2 === 0) {
- children.push(spacer())
- }
-
- switch (exclusiveMode) {
- case 'WALK':
- children.push(
-