disable disallowed costs

frontend/src/metabase/xray/components/CostSelect.jsx

 import React from 'react'
 import cx from 'classnames'
 import { Link, withRouter } from 'react-router'
+import { connect } from 'react-redux'
+import { getMaxCost } from 'metabase/xray/selectors'
 
 import Icon from 'metabase/components/Icon'
 import Tooltip from 'metabase/components/Tooltip'
 
 import COSTS from 'metabase/xray/costs'
 
-const CostSelect = ({ currentCost, location }) => {
+const mapStateToProps = (state) => ({
+    maxCost: getMaxCost(state)
+})
+
+const getDisabled = (maxCost) => {
+    if(maxCost === 'approximate') {
+        return ['extended', 'exact']
+    } else if (maxCost === 'exact') {
+        return ['extended']
+    }
+}
+
+const CostSelect = ({ currentCost, location, maxCost }) => {
     const urlWithoutCost = location.pathname.substr(0, location.pathname.lastIndexOf('/'))
     return (
         <ol className="bordered rounded shadowed bg-white flex align-center overflow-hidden">
@@ -23,7 +37,8 @@ const CostSelect = ({ currentCost, location }) => {
                             key={cost}
                             className={cx(
                                 "flex align-center justify-center cursor-pointer bg-brand-hover text-white-hover transition-background transition-text text-grey-2",
-                                { 'bg-brand text-white': currentCost === cost }
+                                { 'bg-brand text-white': currentCost === cost },
+                                { 'disabled': getDisabled(maxCost).indexOf(cost) > 0 }
                             )}
                         >
                             <Tooltip
@@ -43,4 +58,4 @@ const CostSelect = ({ currentCost, location }) => {
     )
 }
 
-export default withRouter(CostSelect)
+export default connect(mapStateToProps)(withRouter(CostSelect))

frontend/src/metabase/xray/selectors.js

@@ -114,3 +114,5 @@ export const getTableItem = (state, index = 1) => createSelector(
 
 export const getComparisonForField = createSelector
 
+export const getMaxCost = state => state.settings.values['xray-max-cost']
+