@red-hat-developer-hub/plugin-cost-management 2.0.3-rc.4 → 2.1.0

package/dist/pages/openshift/components/AutocompleteComponent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteComponent.esm.js","sources":["../../../../src/pages/openshift/components/AutocompleteComponent.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Box from '@material-ui/core/Box';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport {\n  Autocomplete,\n  AutocompleteChangeDetails,\n  AutocompleteChangeReason,\n} from '@material-ui/lab';\nimport { useThemeBackgroundColor } from '../../../hooks/useThemeBackgroundColor';\n\nconst useAutocompleteStyles = makeStyles(\n  {\n    root: {},\n    label: {},\n    input: { backgroundColor: 'transparent' },\n    fullWidth: { width: '100%' },\n  },\n  { name: 'AutocompleteComponent' },\n);\n\ntype BaseProps = {\n  label: string;\n  options: string[];\n  placeholder?: string;\n  className?: string;\n};\n\ntype SingleProps = BaseProps & {\n  multiple?: false;\n  value?: string;\n  onChange?: (\n    event: React.ChangeEvent<{}>,\n    value: string | null,\n    reason: AutocompleteChangeReason,\n    details?: AutocompleteChangeDetails<string> | undefined,\n  ) => void;\n  onInputChange?: (\n    event: React.ChangeEvent<{}>,\n    value: string,\n    reason: string,\n  ) => void;\n  loading?: boolean;\n};\n\ntype MultipleProps = BaseProps & {\n  multiple: true;\n  value?: string[];\n  onChange?: (\n    event: React.ChangeEvent<{}>,\n    value: string[],\n    reason: AutocompleteChangeReason,\n    details?: AutocompleteChangeDetails<string> | undefined,\n  ) => void;\n};\n\ntype AutocompleteComponentProps = SingleProps | MultipleProps;\n\n/** @public */\nexport function AutocompleteComponent(props: AutocompleteComponentProps) {\n  const classes = useAutocompleteStyles();\n  const { label, options, placeholder, className } = props;\n  const { backgroundColor } = useThemeBackgroundColor();\n\n  return (\n    <Box className={className ?? classes.root} pb={1} pt={1}>\n      <Typography\n        className={classes.label}\n        variant=\"button\"\n        component=\"label\"\n        style={{ textTransform: 'none' }}\n      >\n        {label}\n      </Typography>\n      <Autocomplete\n        options={options}\n        multiple={Boolean((props as MultipleProps).multiple)}\n        value={\n          (props as any).value ??\n          (Boolean((props as MultipleProps).multiple) ? [] : null)\n        }\n        onChange={(event, value, reason, details) => {\n          if (props.onChange) {\n            // Cast is safe because the callback shape matches the multiple flag\n            (props.onChange as any)(event, value, reason, details);\n          }\n        }}\n        onInputChange={(event, value, reason) => {\n          if ((props as SingleProps).onInputChange) {\n            (props as SingleProps).onInputChange!(event, value, reason);\n          }\n        }}\n        loading={(props as SingleProps).loading ?? false}\n        popupIcon={<ExpandMoreIcon data-testid=\"expand-icon\" />}\n        renderInput={params => (\n          <TextField\n            {...params}\n            variant=\"outlined\"\n            placeholder={placeholder}\n            style={{ backgroundColor }}\n          />\n        )}\n        size=\"medium\"\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AA6BA,MAAM,qBAAwB,GAAA,UAAA;AAAA,EAC5B;AAAA,IACE,MAAM,EAAC;AAAA,IACP,OAAO,EAAC;AAAA,IACR,KAAA,EAAO,EAAE,eAAA,EAAiB,aAAc,EAAA;AAAA,IACxC,SAAA,EAAW,EAAE,KAAA,EAAO,MAAO;AAAA,GAC7B;AAAA,EACA,EAAE,MAAM,uBAAwB;AAClC,CAAA;AAwCO,SAAS,sBAAsB,KAAmC,EAAA;AACvE,EAAA,MAAM,UAAU,qBAAsB,EAAA;AACtC,EAAA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,WAAA,EAAa,WAAc,GAAA,KAAA;AACnD,EAAM,MAAA,EAAE,eAAgB,EAAA,GAAI,uBAAwB,EAAA;AAEpD,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAI,SAAW,EAAA,SAAA,IAAa,QAAQ,IAAM,EAAA,EAAA,EAAI,CAAG,EAAA,EAAA,EAAI,CACpD,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAQ,CAAA,KAAA;AAAA,MACnB,OAAQ,EAAA,QAAA;AAAA,MACR,SAAU,EAAA,OAAA;AAAA,MACV,KAAA,EAAO,EAAE,aAAA,EAAe,MAAO;AAAA,KAAA;AAAA,IAE9B;AAAA,GAEH,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,QAAA,EAAU,OAAS,CAAA,KAAA,CAAwB,QAAQ,CAAA;AAAA,MACnD,KAAA,EACG,MAAc,KACd,KAAA,OAAA,CAAS,MAAwB,QAAQ,CAAA,GAAI,EAAK,GAAA,IAAA,CAAA;AAAA,MAErD,QAAU,EAAA,CAAC,KAAO,EAAA,KAAA,EAAO,QAAQ,OAAY,KAAA;AAC3C,QAAA,IAAI,MAAM,QAAU,EAAA;AAElB,UAAC,KAAM,CAAA,QAAA,CAAiB,KAAO,EAAA,KAAA,EAAO,QAAQ,OAAO,CAAA;AAAA;AACvD,OACF;AAAA,MACA,aAAe,EAAA,CAAC,KAAO,EAAA,KAAA,EAAO,MAAW,KAAA;AACvC,QAAA,IAAK,MAAsB,aAAe,EAAA;AACxC,UAAC,KAAsB,CAAA,aAAA,CAAe,KAAO,EAAA,KAAA,EAAO,MAAM,CAAA;AAAA;AAC5D,OACF;AAAA,MACA,OAAA,EAAU,MAAsB,OAAW,IAAA,KAAA;AAAA,MAC3C,SAAW,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAe,EAAA,EAAA,aAAA,EAAY,aAAc,EAAA,CAAA;AAAA,MACrD,aAAa,CACX,MAAA,qBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,SAAA;AAAA,QAAA;AAAA,UACE,GAAG,MAAA;AAAA,UACJ,OAAQ,EAAA,UAAA;AAAA,UACR,WAAA;AAAA,UACA,KAAA,EAAO,EAAE,eAAgB;AAAA;AAAA,OAC3B;AAAA,MAEF,IAAK,EAAA;AAAA;AAAA,GAET,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AutocompleteComponent.esm.js","sources":["../../../../src/pages/openshift/components/AutocompleteComponent.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Box from '@material-ui/core/Box';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport {\n  Autocomplete,\n  AutocompleteChangeDetails,\n  AutocompleteChangeReason,\n} from '@material-ui/lab';\nimport { useThemeBackgroundColor } from '../../../hooks/useThemeBackgroundColor';\n\nconst useAutocompleteStyles = makeStyles(\n  {\n    root: {},\n    label: {},\n    input: { backgroundColor: 'transparent' },\n    fullWidth: { width: '100%' },\n  },\n  { name: 'AutocompleteComponent' },\n);\n\ntype BaseProps = {\n  label: string;\n  options: string[];\n  placeholder?: string;\n  className?: string;\n};\n\ntype SingleProps = BaseProps & {\n  multiple?: false;\n  value?: string;\n  onChange?: (\n    event: React.ChangeEvent<{}>,\n    value: string | null,\n    reason: AutocompleteChangeReason,\n    details?: AutocompleteChangeDetails<string> | undefined,\n  ) => void;\n  onInputChange?: (\n    event: React.ChangeEvent<{}>,\n    value: string,\n    reason: string,\n  ) => void;\n  loading?: boolean;\n};\n\ntype MultipleProps = BaseProps & {\n  multiple: true;\n  value?: string[];\n  onChange?: (\n    event: React.ChangeEvent<{}>,\n    value: string[],\n    reason: AutocompleteChangeReason,\n    details?: AutocompleteChangeDetails<string> | undefined,\n  ) => void;\n};\n\ntype AutocompleteComponentProps = SingleProps | MultipleProps;\n\n/** @public */\nexport function AutocompleteComponent(props: AutocompleteComponentProps) {\n  const classes = useAutocompleteStyles();\n  const { label, options, placeholder, className } = props;\n  const { backgroundColor } = useThemeBackgroundColor();\n\n  return (\n    <Box className={className ?? classes.root} pb={1} pt={1}>\n      <Typography\n        className={classes.label}\n        variant=\"button\"\n        component=\"label\"\n        style={{ textTransform: 'none' }}\n      >\n        {label}\n      </Typography>\n      <Autocomplete\n        options={options}\n        multiple={Boolean((props as MultipleProps).multiple)}\n        value={\n          (props as any).value ??\n          (Boolean((props as MultipleProps).multiple) ? [] : null)\n        }\n        onChange={(event, value, reason, details) => {\n          if (props.onChange) {\n            // Cast is safe because the callback shape matches the multiple flag\n            (props.onChange as any)(event, value, reason, details);\n          }\n        }}\n        onInputChange={(event, value, reason) => {\n          if ((props as SingleProps).onInputChange) {\n            (props as SingleProps).onInputChange!(event, value, reason);\n          }\n        }}\n        loading={(props as SingleProps).loading ?? false}\n        popupIcon={<ExpandMoreIcon data-testid=\"expand-icon\" />}\n        renderInput={params => (\n          <TextField\n            {...params}\n            variant=\"outlined\"\n            placeholder={placeholder}\n            style={{ backgroundColor }}\n          />\n        )}\n        size=\"medium\"\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AA6BA,MAAM,qBAAA,GAAwB,UAAA;AAAA,EAC5B;AAAA,IACE,MAAM,EAAC;AAAA,IACP,OAAO,EAAC;AAAA,IACR,KAAA,EAAO,EAAE,eAAA,EAAiB,aAAA,EAAc;AAAA,IACxC,SAAA,EAAW,EAAE,KAAA,EAAO,MAAA;AAAO,GAC7B;AAAA,EACA,EAAE,MAAM,uBAAA;AACV,CAAA;AAwCO,SAAS,sBAAsB,KAAA,EAAmC;AACvE,EAAA,MAAM,UAAU,qBAAA,EAAsB;AACtC,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAS,WAAA,EAAa,WAAU,GAAI,KAAA;AACnD,EAAA,MAAM,EAAE,eAAA,EAAgB,GAAI,uBAAA,EAAwB;AAEpD,EAAA,uBACE,KAAA,CAAA,aAAA,CAAC,OAAI,SAAA,EAAW,SAAA,IAAa,QAAQ,IAAA,EAAM,EAAA,EAAI,CAAA,EAAG,EAAA,EAAI,CAAA,EAAA,kBACpD,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAA,CAAQ,KAAA;AAAA,MACnB,OAAA,EAAQ,QAAA;AAAA,MACR,SAAA,EAAU,OAAA;AAAA,MACV,KAAA,EAAO,EAAE,aAAA,EAAe,MAAA;AAAO,KAAA;AAAA,IAE9B;AAAA,GACH,kBACA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,QAAA,EAAU,OAAA,CAAS,KAAA,CAAwB,QAAQ,CAAA;AAAA,MACnD,KAAA,EACG,MAAc,KAAA,KACd,OAAA,CAAS,MAAwB,QAAQ,CAAA,GAAI,EAAC,GAAI,IAAA,CAAA;AAAA,MAErD,QAAA,EAAU,CAAC,KAAA,EAAO,KAAA,EAAO,QAAQ,OAAA,KAAY;AAC3C,QAAA,IAAI,MAAM,QAAA,EAAU;AAElB,UAAC,KAAA,CAAM,QAAA,CAAiB,KAAA,EAAO,KAAA,EAAO,QAAQ,OAAO,CAAA;AAAA,QACvD;AAAA,MACF,CAAA;AAAA,MACA,aAAA,EAAe,CAAC,KAAA,EAAO,KAAA,EAAO,MAAA,KAAW;AACvC,QAAA,IAAK,MAAsB,aAAA,EAAe;AACxC,UAAC,KAAA,CAAsB,aAAA,CAAe,KAAA,EAAO,KAAA,EAAO,MAAM,CAAA;AAAA,QAC5D;AAAA,MACF,CAAA;AAAA,MACA,OAAA,EAAU,MAAsB,OAAA,IAAW,KAAA;AAAA,MAC3C,SAAA,kBAAW,KAAA,CAAA,aAAA,CAAC,cAAA,EAAA,EAAe,aAAA,EAAY,aAAA,EAAc,CAAA;AAAA,MACrD,aAAa,CAAA,MAAA,qBACX,KAAA,CAAA,aAAA;AAAA,QAAC,SAAA;AAAA,QAAA;AAAA,UACE,GAAG,MAAA;AAAA,UACJ,OAAA,EAAQ,UAAA;AAAA,UACR,WAAA;AAAA,UACA,KAAA,EAAO,EAAE,eAAA;AAAgB;AAAA,OAC3B;AAAA,MAEF,IAAA,EAAK;AAAA;AAAA,GAET,CAAA;AAEJ;;;;"}

package/dist/pages/openshift/components/DownloadIconButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DownloadIconButton.esm.js","sources":["../../../../src/pages/openshift/components/DownloadIconButton.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport Typography from '@material-ui/core/Typography';\nimport React from 'react';\n\ntype DownloadIconButtonProps = {\n  label: string;\n  variant: 'gray' | 'black' | 'white';\n  onClick?: () => void;\n  disabled?: boolean;\n};\n\nconst getColor = (variant: 'gray' | 'black' | 'white', disabled?: boolean) => {\n  if (disabled) return '#999999';\n  if (variant === 'gray') return '#C7C7C7';\n  if (variant === 'black') return '#000000';\n  if (variant === 'white') return '#FFFFFF';\n  return '#C7C7C7';\n};\n\nexport function DownloadIconButton(props: Readonly<DownloadIconButtonProps>) {\n  const { label, variant, onClick, disabled } = props;\n  const color = getColor(variant, disabled);\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={\n        disabled\n          ? undefined\n          : e => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault();\n                onClick?.();\n              }\n            }\n      }\n      style={{\n        border: `2px solid ${color}`,\n        borderRadius: 2,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        cursor: disabled ? 'not-allowed' : 'pointer',\n        paddingTop: 2,\n        opacity: disabled ? 0.6 : 1,\n      }}\n    >\n      <Typography\n        variant=\"body2\"\n        style={{ color, fontSize: 9, fontWeight: 'bold' }}\n      >\n        {label}\n      </Typography>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AA0BA,MAAM,QAAA,GAAW,CAAC,OAAA,EAAqC,QAAuB,KAAA;AAC5E,EAAA,IAAI,UAAiB,OAAA,SAAA;AACrB,EAAI,IAAA,OAAA,KAAY,QAAe,OAAA,SAAA;AAC/B,EAAI,IAAA,OAAA,KAAY,SAAgB,OAAA,SAAA;AAChC,EAAI,IAAA,OAAA,KAAY,SAAgB,OAAA,SAAA;AAChC,EAAO,OAAA,SAAA;AACT,CAAA;AAEO,SAAS,mBAAmB,KAA0C,EAAA;AAC3E,EAAA,MAAM,EAAE,KAAA,EAAO,OAAS,EAAA,OAAA,EAAS,UAAa,GAAA,KAAA;AAC9C,EAAM,MAAA,KAAA,GAAQ,QAAS,CAAA,OAAA,EAAS,QAAQ,CAAA;AAExC,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,QAAA;AAAA,MACL,QAAA,EAAU,WAAW,EAAK,GAAA,CAAA;AAAA,MAC1B,OAAA,EAAS,WAAW,MAAY,GAAA,OAAA;AAAA,MAChC,SAAA,EACE,QACI,GAAA,MAAA,GACA,CAAK,CAAA,KAAA;AACH,QAAA,IAAI,CAAE,CAAA,GAAA,KAAQ,OAAW,IAAA,CAAA,CAAE,QAAQ,GAAK,EAAA;AACtC,UAAA,CAAA,CAAE,cAAe,EAAA;AACjB,UAAU,OAAA,IAAA;AAAA;AACZ,OACF;AAAA,MAEN,KAAO,EAAA;AAAA,QACL,MAAA,EAAQ,aAAa,KAAK,CAAA,CAAA;AAAA,QAC1B,YAAc,EAAA,CAAA;AAAA,QACd,OAAS,EAAA,MAAA;AAAA,QACT,UAAY,EAAA,QAAA;AAAA,QACZ,cAAgB,EAAA,QAAA;AAAA,QAChB,MAAA,EAAQ,WAAW,aAAgB,GAAA,SAAA;AAAA,QACnC,UAAY,EAAA,CAAA;AAAA,QACZ,OAAA,EAAS,WAAW,GAAM,GAAA;AAAA;AAC5B,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,OAAA;AAAA,QACR,OAAO,EAAE,KAAA,EAAO,QAAU,EAAA,CAAA,EAAG,YAAY,MAAO;AAAA,OAAA;AAAA,MAE/C;AAAA;AACH,GACF;AAEJ;;;;"}
+{"version":3,"file":"DownloadIconButton.esm.js","sources":["../../../../src/pages/openshift/components/DownloadIconButton.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport Typography from '@material-ui/core/Typography';\nimport React from 'react';\n\ntype DownloadIconButtonProps = {\n  label: string;\n  variant: 'gray' | 'black' | 'white';\n  onClick?: () => void;\n  disabled?: boolean;\n};\n\nconst getColor = (variant: 'gray' | 'black' | 'white', disabled?: boolean) => {\n  if (disabled) return '#999999';\n  if (variant === 'gray') return '#C7C7C7';\n  if (variant === 'black') return '#000000';\n  if (variant === 'white') return '#FFFFFF';\n  return '#C7C7C7';\n};\n\nexport function DownloadIconButton(props: Readonly<DownloadIconButtonProps>) {\n  const { label, variant, onClick, disabled } = props;\n  const color = getColor(variant, disabled);\n\n  return (\n    <div\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={\n        disabled\n          ? undefined\n          : e => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault();\n                onClick?.();\n              }\n            }\n      }\n      style={{\n        border: `2px solid ${color}`,\n        borderRadius: 2,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        cursor: disabled ? 'not-allowed' : 'pointer',\n        paddingTop: 2,\n        opacity: disabled ? 0.6 : 1,\n      }}\n    >\n      <Typography\n        variant=\"body2\"\n        style={{ color, fontSize: 9, fontWeight: 'bold' }}\n      >\n        {label}\n      </Typography>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AA0BA,MAAM,QAAA,GAAW,CAAC,OAAA,EAAqC,QAAA,KAAuB;AAC5E,EAAA,IAAI,UAAU,OAAO,SAAA;AACrB,EAAA,IAAI,OAAA,KAAY,QAAQ,OAAO,SAAA;AAC/B,EAAA,IAAI,OAAA,KAAY,SAAS,OAAO,SAAA;AAChC,EAAA,IAAI,OAAA,KAAY,SAAS,OAAO,SAAA;AAChC,EAAA,OAAO,SAAA;AACT,CAAA;AAEO,SAAS,mBAAmB,KAAA,EAA0C;AAC3E,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAS,OAAA,EAAS,UAAS,GAAI,KAAA;AAC9C,EAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,OAAA,EAAS,QAAQ,CAAA;AAExC,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,QAAA,EAAU,WAAW,EAAA,GAAK,CAAA;AAAA,MAC1B,OAAA,EAAS,WAAW,MAAA,GAAY,OAAA;AAAA,MAChC,SAAA,EACE,QAAA,GACI,MAAA,GACA,CAAA,CAAA,KAAK;AACH,QAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAA,OAAA,IAAU;AAAA,QACZ;AAAA,MACF,CAAA;AAAA,MAEN,KAAA,EAAO;AAAA,QACL,MAAA,EAAQ,aAAa,KAAK,CAAA,CAAA;AAAA,QAC1B,YAAA,EAAc,CAAA;AAAA,QACd,OAAA,EAAS,MAAA;AAAA,QACT,UAAA,EAAY,QAAA;AAAA,QACZ,cAAA,EAAgB,QAAA;AAAA,QAChB,MAAA,EAAQ,WAAW,aAAA,GAAgB,SAAA;AAAA,QACnC,UAAA,EAAY,CAAA;AAAA,QACZ,OAAA,EAAS,WAAW,GAAA,GAAM;AAAA;AAC5B,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,OAAA;AAAA,QACR,OAAO,EAAE,KAAA,EAAO,QAAA,EAAU,CAAA,EAAG,YAAY,MAAA;AAAO,OAAA;AAAA,MAE/C;AAAA;AACH,GACF;AAEJ;;;;"}

package/dist/pages/openshift/components/Filters.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.esm.js","sources":["../../../../src/pages/openshift/components/Filters.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState, useEffect, useMemo, useCallback } from 'react';\nimport Box from '@material-ui/core/Box';\nimport Divider from '@material-ui/core/Divider';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useBaseFiltersStyles } from '../../../components/filtersStyles';\nimport { SelectComponent } from './SelectComponent';\nimport { AutocompleteComponent } from './AutocompleteComponent';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { costManagementSlimApiRef } from '../../../apis';\nimport useAsync from 'react-use/lib/useAsync';\nimport debounce from 'lodash/debounce';\nimport { useThemeBackgroundColor } from '../../../hooks/useThemeBackgroundColor';\n\nconst useFiltersStyles = makeStyles(\n  theme => ({\n    filters: {\n      '& > *': {\n        marginTop: theme.spacing(0),\n      },\n    },\n    filterSection: {\n      marginBottom: theme.spacing(0),\n    },\n    divider: {\n      margin: theme.spacing(2, 0),\n    },\n  }),\n  { name: 'OpenShiftFilters' },\n);\n\n/** @public */\nexport type FiltersProps = {\n  groupBy: string;\n  overheadDistribution: string;\n  timeRange: string;\n  currency: string;\n  filterBy: string;\n  filterOperation: string;\n  filterValue: string;\n  tags?: string[];\n  selectedTag?: string;\n  selectedTagKey?: string;\n  selectedTagValue?: string;\n  onGroupByChange: (value: string) => void;\n  onOverheadDistributionChange: (value: string) => void;\n  onTimeRangeChange: (value: string) => void;\n  onCurrencyChange: (value: string) => void;\n  onFilterByChange: (value: string) => void;\n  onFilterOperationChange: (value: string) => void;\n  onFilterValueChange: (value: string) => void;\n  onSelectedTagChange: (value: string) => void;\n  onSelectedTagKeyChange: (value: string) => void;\n  onSelectedTagValueChange: (value: string) => void;\n};\n\nexport type CurrencyOption = {\n  label: string;\n  value: string;\n};\n\n/** @public */\nexport function Filters(props: FiltersProps) {\n  const {\n    groupBy,\n    overheadDistribution,\n    timeRange,\n    currency,\n    filterBy,\n    filterOperation,\n    filterValue,\n    tags = [],\n    selectedTag = '',\n    selectedTagKey = '',\n    selectedTagValue = '',\n    onGroupByChange,\n    onOverheadDistributionChange,\n    onTimeRangeChange,\n    onCurrencyChange,\n    onFilterByChange,\n    onFilterOperationChange,\n    onFilterValueChange,\n    onSelectedTagChange,\n    onSelectedTagKeyChange,\n    onSelectedTagValueChange,\n  } = props;\n  const baseClasses = useBaseFiltersStyles();\n  const classes = useFiltersStyles();\n  const api = useApi(costManagementSlimApiRef);\n\n  const { filterTableBackgroundColor } = useThemeBackgroundColor();\n  // State for search input and debounced search\n  const [searchInput, setSearchInput] = useState<string>('');\n  const [debouncedSearch, setDebouncedSearch] = useState<string>('');\n\n  // Debounce function to update debouncedSearch after 500ms\n  const debouncedSetSearch = useMemo(\n    () =>\n      debounce((value: string) => {\n        setDebouncedSearch(value);\n      }, 500),\n    [],\n  );\n\n  // Update debounced search when searchInput changes\n  useEffect(() => {\n    debouncedSetSearch(searchInput);\n    return () => {\n      debouncedSetSearch.cancel();\n    };\n  }, [searchInput, debouncedSetSearch]);\n\n  // Reset search when filterBy changes\n  useEffect(() => {\n    setSearchInput('');\n    setDebouncedSearch('');\n  }, [filterBy]);\n\n  // Fetch resource options based on filterBy and debouncedSearch\n  const { value: resourceOptions, loading: isLoadingOptions } =\n    useAsync(async () => {\n      // For tags, filter the tags array based on search input (for tag key selection)\n      if (filterBy === 'tag') {\n        if (!debouncedSearch.trim()) {\n          return tags;\n        }\n        const searchLower = debouncedSearch.toLocaleLowerCase('en-US');\n        return tags.filter(tag =>\n          tag.toLocaleLowerCase('en-US').includes(searchLower),\n        );\n      }\n\n      // Don't fetch if there's no search term\n      if (!debouncedSearch.trim()) {\n        return [];\n      }\n\n      try {\n        let response;\n        switch (filterBy) {\n          case 'project':\n            response = await api.searchOpenShiftProjects(debouncedSearch);\n            break;\n          case 'cluster':\n            response = await api.searchOpenShiftClusters(debouncedSearch);\n            break;\n          case 'node':\n            response = await api.searchOpenShiftNodes(debouncedSearch);\n            break;\n          default:\n            return [];\n        }\n        const data = await response.json();\n        // Extract the 'value' property from each object in the data array\n        return (data.data || []).map((item: { value: string }) => item.value);\n      } catch {\n        // Silently return empty array on error\n        return [];\n      }\n    }, [filterBy, debouncedSearch, api, tags]);\n\n  // Fetch tag values when a tag key is selected for filtering\n  const { value: tagValuesData, loading: isLoadingTagValues } =\n    useAsync(async () => {\n      if (filterBy === 'tag' && selectedTagKey) {\n        try {\n          const timeScopeValue = timeRange === 'month-to-date' ? -1 : -2;\n          const response = await api.getOpenShiftTagValues(\n            selectedTagKey,\n            timeScopeValue,\n          );\n          const data = await response.json();\n          // Extract all unique values from all items in the data array\n          const allValues = new Set<string>();\n          for (const item of data.data || []) {\n            if (item.values) {\n              for (const value of item.values) {\n                allValues.add(value);\n              }\n            }\n          }\n          return Array.from(allValues).sort((a, b) =>\n            a.localeCompare(b, 'en-US'),\n          );\n        } catch {\n          return [];\n        }\n      }\n      return [];\n    }, [filterBy, selectedTagKey, timeRange, api]);\n\n  // Generate filter value options based on API results\n  // Always include the current filterValue if it's set, so it doesn't disappear\n  const getFilterValueOptions = useMemo((): string[] => {\n    const options = resourceOptions || [];\n    // If filterValue is set and not already in options, add it\n    if (filterValue && !options.includes(filterValue)) {\n      return [filterValue, ...options];\n    }\n    return options;\n  }, [resourceOptions, filterValue]);\n\n  // Handle input change in autocomplete\n  const handleInputChange = useCallback(\n    (_event: React.ChangeEvent<{}>, value: string, reason: string) => {\n      // Only update search input when user is typing (not when clearing or resetting)\n      if (reason === 'input') {\n        setSearchInput(value);\n      }\n    },\n    [],\n  );\n\n  const currencyOptions: CurrencyOption[] = [\n    { label: 'AUD (A$) - Australian Dollar', value: 'AUD' },\n    { label: 'BRL (R$) - Brazilian Real', value: 'BRL' },\n    { label: 'CAD (CA$) - Canadian Dollar', value: 'CAD' },\n    { label: 'CHF (CHF) - Swiss Franc', value: 'CHF' },\n    { label: 'CNY (CN¥) - Chinese Yuan', value: 'CNY' },\n    { label: 'CZK (Kč) - Czech Koruna', value: 'CZK' },\n    { label: 'DKK (DKK) - Danish Krone', value: 'DKK' },\n    { label: 'EUR (€) - Euro', value: 'EUR' },\n    { label: 'GBP (£) - British Pound', value: 'GBP' },\n    { label: 'HKD (HK$) - Hong Kong Dollar', value: 'HKD' },\n    { label: 'INR (₹) - Indian Rupee', value: 'INR' },\n    { label: 'JPY (¥) - Japanese Yen', value: 'JPY' },\n    { label: 'NGN (₦) - Nigerian Naira', value: 'NGN' },\n    { label: 'NOK (NOK) - Norwegian Krone', value: 'NOK' },\n    { label: 'NZD (NZ$) - New Zealand Dollar', value: 'NZD' },\n    { label: 'SEK (SEK) - Swedish Krona', value: 'SEK' },\n    { label: 'SGD (SGD) - Singapore Dollar', value: 'SGD' },\n    { label: 'USD ($) - United States Dollar', value: 'USD' },\n    { label: 'ZAR (ZAR) - South African Rand', value: 'ZAR' },\n  ];\n\n  return (\n    <Box className={baseClasses.root}>\n      <Box className={`${baseClasses.filters} ${classes.filters}`}>\n        {/* Group by */}\n        <div className={classes.filterSection}>\n          <Box p={1} pt={0}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Group by\"\n              options={['project', 'cluster', 'node', 'tag']}\n              value={groupBy}\n              placeholder=\"Group by\"\n              onChange={(event): void =>\n                onGroupByChange(event.target.value as string)\n              }\n            />\n            {groupBy === 'tag' && (\n              <Box p={0} pt={0}>\n                <AutocompleteComponent\n                  label=\"Choose key\"\n                  options={tags}\n                  value={selectedTag}\n                  placeholder=\"Choose key\"\n                  loading={false}\n                  onChange={(_event, value): void => {\n                    onSelectedTagChange((value as string) ?? '');\n                  }}\n                />\n              </Box>\n            )}\n          </Box>\n        </div>\n\n        {/* Overhead cost */}\n        <div className={classes.filterSection}>\n          <Box p={1}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Overhead cost\"\n              options={[\n                'Distribute through cost models',\n                \"Don't distribute overhead costs\",\n              ]}\n              value={\n                overheadDistribution === 'distribute'\n                  ? 'Distribute through cost models'\n                  : \"Don't distribute overhead costs\"\n              }\n              placeholder=\"Overhead cost\"\n              onChange={(event): void => {\n                const value = event.target.value as string;\n                const mappedValue =\n                  value === 'Distribute through cost models'\n                    ? 'distribute'\n                    : 'dont_distribute';\n                onOverheadDistributionChange(mappedValue);\n              }}\n            />\n          </Box>\n        </div>\n\n        {/* Time */}\n        <div className={classes.filterSection}>\n          <Box p={1}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Time\"\n              options={['Month to date', 'Previous month']}\n              value={\n                timeRange === 'month-to-date'\n                  ? 'Month to date'\n                  : 'Previous month'\n              }\n              placeholder=\"Time\"\n              onChange={(event): void => {\n                const value = event.target.value as string;\n                const mappedValue =\n                  value === 'Month to date'\n                    ? 'month-to-date'\n                    : 'previous-month';\n                onTimeRangeChange(mappedValue);\n              }}\n            />\n          </Box>\n        </div>\n\n        <Box marginX={2}>\n          <Divider className={classes.divider} />\n        </Box>\n\n        {/* Filter table by */}\n        <div className={classes.filterSection}>\n          <div\n            style={{\n              backgroundColor: filterTableBackgroundColor,\n              padding: 16,\n              borderRadius: 8,\n            }}\n          >\n            <div style={{ fontWeight: 'bold', marginBottom: '8px' }}>\n              Filter table by\n            </div>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"\"\n              options={['project', 'cluster', 'node', 'tag']}\n              value={filterBy}\n              placeholder=\"\"\n              onChange={(event): void => {\n                const newFilterBy = event.target.value as string;\n                onFilterByChange(newFilterBy);\n                onFilterValueChange('');\n                // Clear tag-related selections when filterBy changes away from 'tag'\n                if (newFilterBy !== 'tag') {\n                  onSelectedTagKeyChange('');\n                  onSelectedTagValueChange('');\n                }\n              }}\n            />\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"\"\n              options={['includes', 'excludes', 'exact']}\n              value={filterOperation}\n              placeholder=\"\"\n              onChange={(event): void => {\n                onFilterOperationChange(event.target.value as string);\n              }}\n            />\n\n            {filterBy === 'tag' ? (\n              <>\n                <AutocompleteComponent\n                  label=\"\"\n                  options={getFilterValueOptions}\n                  value={selectedTagKey}\n                  placeholder=\"Select tag key\"\n                  loading={false}\n                  onInputChange={handleInputChange}\n                  onChange={(_event, value): void => {\n                    const tagKey = (value as string) ?? '';\n                    onSelectedTagKeyChange(tagKey);\n                    // Clear tag value when tag key changes\n                    onSelectedTagValueChange('');\n                    // Clear search input when a value is selected\n                    setSearchInput('');\n                    setDebouncedSearch('');\n                  }}\n                />\n                {selectedTagKey && (\n                  <Box style={{ marginTop: '-8px' }}>\n                    <AutocompleteComponent\n                      label=\"\"\n                      options={tagValuesData || []}\n                      value={selectedTagValue}\n                      placeholder=\"Select tag value\"\n                      loading={isLoadingTagValues}\n                      onChange={(_event, value): void => {\n                        onSelectedTagValueChange((value as string) ?? '');\n                      }}\n                    />\n                  </Box>\n                )}\n              </>\n            ) : (\n              <AutocompleteComponent\n                label=\"\"\n                options={getFilterValueOptions}\n                value={filterValue}\n                placeholder={`Filter by ${filterBy || 'project'}`}\n                loading={isLoadingOptions}\n                onInputChange={handleInputChange}\n                onChange={(_event, value): void => {\n                  onFilterValueChange((value as string) ?? '');\n                  // Clear search input when a value is selected\n                  setSearchInput('');\n                  setDebouncedSearch('');\n                }}\n              />\n            )}\n          </div>\n        </div>\n\n        <Box marginX={2}>\n          <Divider className={classes.divider} />\n        </Box>\n\n        {/* Currency */}\n        <div className={classes.filterSection}>\n          <Box p={2}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Currency\"\n              options={currencyOptions.map(\n                (value: CurrencyOption) => value.label,\n              )}\n              value={\n                currencyOptions.find(\n                  (item: CurrencyOption) => item.value === currency,\n                )?.label ?? ''\n              }\n              placeholder=\"Select currency\"\n              onChange={(event): void => {\n                const selectedLabel = event.target.value as string;\n                const selectedCurrency =\n                  currencyOptions.find(\n                    (item: CurrencyOption) => item.label === selectedLabel,\n                  )?.value ?? '';\n                onCurrencyChange(selectedCurrency);\n              }}\n            />\n          </Box>\n        </div>\n      </Box>\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Filters.esm.js","sources":["../../../../src/pages/openshift/components/Filters.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState, useEffect, useMemo, useCallback } from 'react';\nimport Box from '@material-ui/core/Box';\nimport Divider from '@material-ui/core/Divider';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useBaseFiltersStyles } from '../../../components/filtersStyles';\nimport { SelectComponent } from './SelectComponent';\nimport { AutocompleteComponent } from './AutocompleteComponent';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { costManagementSlimApiRef } from '../../../apis';\nimport useAsync from 'react-use/lib/useAsync';\nimport debounce from 'lodash/debounce';\nimport { useThemeBackgroundColor } from '../../../hooks/useThemeBackgroundColor';\n\nconst useFiltersStyles = makeStyles(\n  theme => ({\n    filters: {\n      '& > *': {\n        marginTop: theme.spacing(0),\n      },\n    },\n    filterSection: {\n      marginBottom: theme.spacing(0),\n    },\n    divider: {\n      margin: theme.spacing(2, 0),\n    },\n  }),\n  { name: 'OpenShiftFilters' },\n);\n\n/** @public */\nexport type FiltersProps = {\n  groupBy: string;\n  overheadDistribution: string;\n  timeRange: string;\n  currency: string;\n  filterBy: string;\n  filterOperation: string;\n  filterValue: string;\n  tags?: string[];\n  selectedTag?: string;\n  selectedTagKey?: string;\n  selectedTagValue?: string;\n  onGroupByChange: (value: string) => void;\n  onOverheadDistributionChange: (value: string) => void;\n  onTimeRangeChange: (value: string) => void;\n  onCurrencyChange: (value: string) => void;\n  onFilterByChange: (value: string) => void;\n  onFilterOperationChange: (value: string) => void;\n  onFilterValueChange: (value: string) => void;\n  onSelectedTagChange: (value: string) => void;\n  onSelectedTagKeyChange: (value: string) => void;\n  onSelectedTagValueChange: (value: string) => void;\n};\n\nexport type CurrencyOption = {\n  label: string;\n  value: string;\n};\n\n/** @public */\nexport function Filters(props: FiltersProps) {\n  const {\n    groupBy,\n    overheadDistribution,\n    timeRange,\n    currency,\n    filterBy,\n    filterOperation,\n    filterValue,\n    tags = [],\n    selectedTag = '',\n    selectedTagKey = '',\n    selectedTagValue = '',\n    onGroupByChange,\n    onOverheadDistributionChange,\n    onTimeRangeChange,\n    onCurrencyChange,\n    onFilterByChange,\n    onFilterOperationChange,\n    onFilterValueChange,\n    onSelectedTagChange,\n    onSelectedTagKeyChange,\n    onSelectedTagValueChange,\n  } = props;\n  const baseClasses = useBaseFiltersStyles();\n  const classes = useFiltersStyles();\n  const api = useApi(costManagementSlimApiRef);\n\n  const { filterTableBackgroundColor } = useThemeBackgroundColor();\n  // State for search input and debounced search\n  const [searchInput, setSearchInput] = useState<string>('');\n  const [debouncedSearch, setDebouncedSearch] = useState<string>('');\n\n  // Debounce function to update debouncedSearch after 500ms\n  const debouncedSetSearch = useMemo(\n    () =>\n      debounce((value: string) => {\n        setDebouncedSearch(value);\n      }, 500),\n    [],\n  );\n\n  // Update debounced search when searchInput changes\n  useEffect(() => {\n    debouncedSetSearch(searchInput);\n    return () => {\n      debouncedSetSearch.cancel();\n    };\n  }, [searchInput, debouncedSetSearch]);\n\n  // Reset search when filterBy changes\n  useEffect(() => {\n    setSearchInput('');\n    setDebouncedSearch('');\n  }, [filterBy]);\n\n  // Fetch resource options based on filterBy and debouncedSearch\n  const { value: resourceOptions, loading: isLoadingOptions } =\n    useAsync(async () => {\n      // For tags, filter the tags array based on search input (for tag key selection)\n      if (filterBy === 'tag') {\n        if (!debouncedSearch.trim()) {\n          return tags;\n        }\n        const searchLower = debouncedSearch.toLocaleLowerCase('en-US');\n        return tags.filter(tag =>\n          tag.toLocaleLowerCase('en-US').includes(searchLower),\n        );\n      }\n\n      // Don't fetch if there's no search term\n      if (!debouncedSearch.trim()) {\n        return [];\n      }\n\n      try {\n        let response;\n        switch (filterBy) {\n          case 'project':\n            response = await api.searchOpenShiftProjects(debouncedSearch);\n            break;\n          case 'cluster':\n            response = await api.searchOpenShiftClusters(debouncedSearch);\n            break;\n          case 'node':\n            response = await api.searchOpenShiftNodes(debouncedSearch);\n            break;\n          default:\n            return [];\n        }\n        const data = await response.json();\n        // Extract the 'value' property from each object in the data array\n        return (data.data || []).map((item: { value: string }) => item.value);\n      } catch {\n        // Silently return empty array on error\n        return [];\n      }\n    }, [filterBy, debouncedSearch, api, tags]);\n\n  // Fetch tag values when a tag key is selected for filtering\n  const { value: tagValuesData, loading: isLoadingTagValues } =\n    useAsync(async () => {\n      if (filterBy === 'tag' && selectedTagKey) {\n        try {\n          const timeScopeValue = timeRange === 'month-to-date' ? -1 : -2;\n          const response = await api.getOpenShiftTagValues(\n            selectedTagKey,\n            timeScopeValue,\n          );\n          const data = await response.json();\n          // Extract all unique values from all items in the data array\n          const allValues = new Set<string>();\n          for (const item of data.data || []) {\n            if (item.values) {\n              for (const value of item.values) {\n                allValues.add(value);\n              }\n            }\n          }\n          return Array.from(allValues).sort((a, b) =>\n            a.localeCompare(b, 'en-US'),\n          );\n        } catch {\n          return [];\n        }\n      }\n      return [];\n    }, [filterBy, selectedTagKey, timeRange, api]);\n\n  // Generate filter value options based on API results\n  // Always include the current filterValue if it's set, so it doesn't disappear\n  const getFilterValueOptions = useMemo((): string[] => {\n    const options = resourceOptions || [];\n    // If filterValue is set and not already in options, add it\n    if (filterValue && !options.includes(filterValue)) {\n      return [filterValue, ...options];\n    }\n    return options;\n  }, [resourceOptions, filterValue]);\n\n  // Handle input change in autocomplete\n  const handleInputChange = useCallback(\n    (_event: React.ChangeEvent<{}>, value: string, reason: string) => {\n      // Only update search input when user is typing (not when clearing or resetting)\n      if (reason === 'input') {\n        setSearchInput(value);\n      }\n    },\n    [],\n  );\n\n  const currencyOptions: CurrencyOption[] = [\n    { label: 'AUD (A$) - Australian Dollar', value: 'AUD' },\n    { label: 'BRL (R$) - Brazilian Real', value: 'BRL' },\n    { label: 'CAD (CA$) - Canadian Dollar', value: 'CAD' },\n    { label: 'CHF (CHF) - Swiss Franc', value: 'CHF' },\n    { label: 'CNY (CN¥) - Chinese Yuan', value: 'CNY' },\n    { label: 'CZK (Kč) - Czech Koruna', value: 'CZK' },\n    { label: 'DKK (DKK) - Danish Krone', value: 'DKK' },\n    { label: 'EUR (€) - Euro', value: 'EUR' },\n    { label: 'GBP (£) - British Pound', value: 'GBP' },\n    { label: 'HKD (HK$) - Hong Kong Dollar', value: 'HKD' },\n    { label: 'INR (₹) - Indian Rupee', value: 'INR' },\n    { label: 'JPY (¥) - Japanese Yen', value: 'JPY' },\n    { label: 'NGN (₦) - Nigerian Naira', value: 'NGN' },\n    { label: 'NOK (NOK) - Norwegian Krone', value: 'NOK' },\n    { label: 'NZD (NZ$) - New Zealand Dollar', value: 'NZD' },\n    { label: 'SEK (SEK) - Swedish Krona', value: 'SEK' },\n    { label: 'SGD (SGD) - Singapore Dollar', value: 'SGD' },\n    { label: 'USD ($) - United States Dollar', value: 'USD' },\n    { label: 'ZAR (ZAR) - South African Rand', value: 'ZAR' },\n  ];\n\n  return (\n    <Box className={baseClasses.root}>\n      <Box className={`${baseClasses.filters} ${classes.filters}`}>\n        {/* Group by */}\n        <div className={classes.filterSection}>\n          <Box p={1} pt={0}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Group by\"\n              options={['project', 'cluster', 'node', 'tag']}\n              value={groupBy}\n              placeholder=\"Group by\"\n              onChange={(event): void =>\n                onGroupByChange(event.target.value as string)\n              }\n            />\n            {groupBy === 'tag' && (\n              <Box p={0} pt={0}>\n                <AutocompleteComponent\n                  label=\"Choose key\"\n                  options={tags}\n                  value={selectedTag}\n                  placeholder=\"Choose key\"\n                  loading={false}\n                  onChange={(_event, value): void => {\n                    onSelectedTagChange((value as string) ?? '');\n                  }}\n                />\n              </Box>\n            )}\n          </Box>\n        </div>\n\n        {/* Overhead cost */}\n        <div className={classes.filterSection}>\n          <Box p={1}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Overhead cost\"\n              options={[\n                'Distribute through cost models',\n                \"Don't distribute overhead costs\",\n              ]}\n              value={\n                overheadDistribution === 'distribute'\n                  ? 'Distribute through cost models'\n                  : \"Don't distribute overhead costs\"\n              }\n              placeholder=\"Overhead cost\"\n              onChange={(event): void => {\n                const value = event.target.value as string;\n                const mappedValue =\n                  value === 'Distribute through cost models'\n                    ? 'distribute'\n                    : 'dont_distribute';\n                onOverheadDistributionChange(mappedValue);\n              }}\n            />\n          </Box>\n        </div>\n\n        {/* Time */}\n        <div className={classes.filterSection}>\n          <Box p={1}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Time\"\n              options={['Month to date', 'Previous month']}\n              value={\n                timeRange === 'month-to-date'\n                  ? 'Month to date'\n                  : 'Previous month'\n              }\n              placeholder=\"Time\"\n              onChange={(event): void => {\n                const value = event.target.value as string;\n                const mappedValue =\n                  value === 'Month to date'\n                    ? 'month-to-date'\n                    : 'previous-month';\n                onTimeRangeChange(mappedValue);\n              }}\n            />\n          </Box>\n        </div>\n\n        <Box marginX={2}>\n          <Divider className={classes.divider} />\n        </Box>\n\n        {/* Filter table by */}\n        <div className={classes.filterSection}>\n          <div\n            style={{\n              backgroundColor: filterTableBackgroundColor,\n              padding: 16,\n              borderRadius: 8,\n            }}\n          >\n            <div style={{ fontWeight: 'bold', marginBottom: '8px' }}>\n              Filter table by\n            </div>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"\"\n              options={['project', 'cluster', 'node', 'tag']}\n              value={filterBy}\n              placeholder=\"\"\n              onChange={(event): void => {\n                const newFilterBy = event.target.value as string;\n                onFilterByChange(newFilterBy);\n                onFilterValueChange('');\n                // Clear tag-related selections when filterBy changes away from 'tag'\n                if (newFilterBy !== 'tag') {\n                  onSelectedTagKeyChange('');\n                  onSelectedTagValueChange('');\n                }\n              }}\n            />\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"\"\n              options={['includes', 'excludes', 'exact']}\n              value={filterOperation}\n              placeholder=\"\"\n              onChange={(event): void => {\n                onFilterOperationChange(event.target.value as string);\n              }}\n            />\n\n            {filterBy === 'tag' ? (\n              <>\n                <AutocompleteComponent\n                  label=\"\"\n                  options={getFilterValueOptions}\n                  value={selectedTagKey}\n                  placeholder=\"Select tag key\"\n                  loading={false}\n                  onInputChange={handleInputChange}\n                  onChange={(_event, value): void => {\n                    const tagKey = (value as string) ?? '';\n                    onSelectedTagKeyChange(tagKey);\n                    // Clear tag value when tag key changes\n                    onSelectedTagValueChange('');\n                    // Clear search input when a value is selected\n                    setSearchInput('');\n                    setDebouncedSearch('');\n                  }}\n                />\n                {selectedTagKey && (\n                  <Box style={{ marginTop: '-8px' }}>\n                    <AutocompleteComponent\n                      label=\"\"\n                      options={tagValuesData || []}\n                      value={selectedTagValue}\n                      placeholder=\"Select tag value\"\n                      loading={isLoadingTagValues}\n                      onChange={(_event, value): void => {\n                        onSelectedTagValueChange((value as string) ?? '');\n                      }}\n                    />\n                  </Box>\n                )}\n              </>\n            ) : (\n              <AutocompleteComponent\n                label=\"\"\n                options={getFilterValueOptions}\n                value={filterValue}\n                placeholder={`Filter by ${filterBy || 'project'}`}\n                loading={isLoadingOptions}\n                onInputChange={handleInputChange}\n                onChange={(_event, value): void => {\n                  onFilterValueChange((value as string) ?? '');\n                  // Clear search input when a value is selected\n                  setSearchInput('');\n                  setDebouncedSearch('');\n                }}\n              />\n            )}\n          </div>\n        </div>\n\n        <Box marginX={2}>\n          <Divider className={classes.divider} />\n        </Box>\n\n        {/* Currency */}\n        <div className={classes.filterSection}>\n          <Box p={2}>\n            <SelectComponent\n              freeSolo\n              selectOnFocus\n              clearOnBlur\n              handleHomeEndKeys\n              filterSelectedOptions\n              label=\"Currency\"\n              options={currencyOptions.map(\n                (value: CurrencyOption) => value.label,\n              )}\n              value={\n                currencyOptions.find(\n                  (item: CurrencyOption) => item.value === currency,\n                )?.label ?? ''\n              }\n              placeholder=\"Select currency\"\n              onChange={(event): void => {\n                const selectedLabel = event.target.value as string;\n                const selectedCurrency =\n                  currencyOptions.find(\n                    (item: CurrencyOption) => item.label === selectedLabel,\n                  )?.value ?? '';\n                onCurrencyChange(selectedCurrency);\n              }}\n            />\n          </Box>\n        </div>\n      </Box>\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/pages/openshift/components/PageHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageHeader.esm.js","sources":["../../../../src/pages/openshift/components/PageHeader.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Typography from '@material-ui/core/Typography';\nimport { CURRENCY_SYMBOLS } from '../../../constants/currencies';\n\nconst formatCurrency = (value: number, currencyCode: string): string => {\n  const symbol = CURRENCY_SYMBOLS[currencyCode] || currencyCode;\n  return `${symbol}${value.toLocaleString('en-US', {\n    minimumFractionDigits: 2,\n    maximumFractionDigits: 2,\n  })}`;\n};\n\ntype PageHeaderProps = {\n  totalCost: number;\n  month: string;\n  endDate: string;\n  currencyCode: string;\n  customStyle?: React.CSSProperties;\n};\n\n/** @public */\nexport function PageHeader(props: PageHeaderProps) {\n  const { totalCost, month, endDate, currencyCode, customStyle = {} } = props;\n  return (\n    <div\n      style={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        alignItems: 'center',\n        marginBottom: '24px',\n        ...customStyle,\n      }}\n    >\n      <Typography variant=\"h1\" style={{ fontWeight: 'bold', margin: 0 }}>\n        OpenShift\n      </Typography>\n      <div style={{ textAlign: 'right' }}>\n        <Typography variant=\"h3\" style={{ fontWeight: 'bold', margin: 0 }}>\n          {formatCurrency(totalCost, currencyCode)}\n        </Typography>\n        <Typography variant=\"body1\" style={{ color: '#666', marginTop: '4px' }}>\n          {`${month} 1-${endDate}`}\n        </Typography>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAoBA,MAAM,cAAA,GAAiB,CAAC,KAAA,EAAe,YAAiC,KAAA;AACtE,EAAM,MAAA,MAAA,GAAS,gBAAiB,CAAA,YAAY,CAAK,IAAA,YAAA;AACjD,EAAA,OAAO,CAAG,EAAA,MAAM,CAAG,EAAA,KAAA,CAAM,eAAe,OAAS,EAAA;AAAA,IAC/C,qBAAuB,EAAA,CAAA;AAAA,IACvB,qBAAuB,EAAA;AAAA,GACxB,CAAC,CAAA,CAAA;AACJ,CAAA;AAWO,SAAS,WAAW,KAAwB,EAAA;AACjD,EAAM,MAAA,EAAE,WAAW,KAAO,EAAA,OAAA,EAAS,cAAc,WAAc,GAAA,IAAO,GAAA,KAAA;AACtE,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,OAAS,EAAA,MAAA;AAAA,QACT,cAAgB,EAAA,eAAA;AAAA,QAChB,UAAY,EAAA,QAAA;AAAA,QACZ,YAAc,EAAA,MAAA;AAAA,QACd,GAAG;AAAA;AACL,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,IAAK,EAAA,KAAA,EAAO,EAAE,UAAA,EAAY,MAAQ,EAAA,MAAA,EAAQ,CAAE,EAAA,EAAA,EAAG,WAEnE,CAAA;AAAA,wCACC,KAAI,EAAA,EAAA,KAAA,EAAO,EAAE,SAAA,EAAW,SACvB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,MAAK,KAAO,EAAA,EAAE,YAAY,MAAQ,EAAA,MAAA,EAAQ,GAC3D,EAAA,EAAA,cAAA,CAAe,SAAW,EAAA,YAAY,CACzC,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,OAAQ,EAAA,OAAA,EAAQ,OAAO,EAAE,KAAA,EAAO,MAAQ,EAAA,SAAA,EAAW,OAC5D,EAAA,EAAA,CAAA,EAAG,KAAK,CAAM,GAAA,EAAA,OAAO,EACxB,CACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"PageHeader.esm.js","sources":["../../../../src/pages/openshift/components/PageHeader.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Typography from '@material-ui/core/Typography';\nimport { CURRENCY_SYMBOLS } from '../../../constants/currencies';\n\nconst formatCurrency = (value: number, currencyCode: string): string => {\n  const symbol = CURRENCY_SYMBOLS[currencyCode] || currencyCode;\n  return `${symbol}${value.toLocaleString('en-US', {\n    minimumFractionDigits: 2,\n    maximumFractionDigits: 2,\n  })}`;\n};\n\ntype PageHeaderProps = {\n  totalCost: number;\n  month: string;\n  endDate: string;\n  currencyCode: string;\n  customStyle?: React.CSSProperties;\n};\n\n/** @public */\nexport function PageHeader(props: PageHeaderProps) {\n  const { totalCost, month, endDate, currencyCode, customStyle = {} } = props;\n  return (\n    <div\n      style={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        alignItems: 'center',\n        marginBottom: '24px',\n        ...customStyle,\n      }}\n    >\n      <Typography variant=\"h1\" style={{ fontWeight: 'bold', margin: 0 }}>\n        OpenShift\n      </Typography>\n      <div style={{ textAlign: 'right' }}>\n        <Typography variant=\"h3\" style={{ fontWeight: 'bold', margin: 0 }}>\n          {formatCurrency(totalCost, currencyCode)}\n        </Typography>\n        <Typography variant=\"body1\" style={{ color: '#666', marginTop: '4px' }}>\n          {`${month} 1-${endDate}`}\n        </Typography>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAoBA,MAAM,cAAA,GAAiB,CAAC,KAAA,EAAe,YAAA,KAAiC;AACtE,EAAA,MAAM,MAAA,GAAS,gBAAA,CAAiB,YAAY,CAAA,IAAK,YAAA;AACjD,EAAA,OAAO,CAAA,EAAG,MAAM,CAAA,EAAG,KAAA,CAAM,eAAe,OAAA,EAAS;AAAA,IAC/C,qBAAA,EAAuB,CAAA;AAAA,IACvB,qBAAA,EAAuB;AAAA,GACxB,CAAC,CAAA,CAAA;AACJ,CAAA;AAWO,SAAS,WAAW,KAAA,EAAwB;AACjD,EAAA,MAAM,EAAE,WAAW,KAAA,EAAO,OAAA,EAAS,cAAc,WAAA,GAAc,IAAG,GAAI,KAAA;AACtE,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO;AAAA,QACL,OAAA,EAAS,MAAA;AAAA,QACT,cAAA,EAAgB,eAAA;AAAA,QAChB,UAAA,EAAY,QAAA;AAAA,QACZ,YAAA,EAAc,MAAA;AAAA,QACd,GAAG;AAAA;AACL,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,IAAA,EAAK,KAAA,EAAO,EAAE,UAAA,EAAY,MAAA,EAAQ,MAAA,EAAQ,CAAA,EAAE,EAAA,EAAG,WAEnE,CAAA;AAAA,wCACC,KAAA,EAAA,EAAI,KAAA,EAAO,EAAE,SAAA,EAAW,SAAQ,EAAA,kBAC/B,KAAA,CAAA,aAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,MAAK,KAAA,EAAO,EAAE,YAAY,MAAA,EAAQ,MAAA,EAAQ,GAAE,EAAA,EAC7D,cAAA,CAAe,SAAA,EAAW,YAAY,CACzC,CAAA,kBACA,KAAA,CAAA,aAAA,CAAC,cAAW,OAAA,EAAQ,OAAA,EAAQ,OAAO,EAAE,KAAA,EAAO,MAAA,EAAQ,SAAA,EAAW,OAAM,EAAA,EAClE,CAAA,EAAG,KAAK,CAAA,GAAA,EAAM,OAAO,EACxB,CACF;AAAA,GACF;AAEJ;;;;"}

package/dist/pages/openshift/components/SelectComponent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectComponent.esm.js","sources":["../../../../src/pages/openshift/components/SelectComponent.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Box from '@material-ui/core/Box';\nimport Typography from '@material-ui/core/Typography';\nimport FormControl from '@material-ui/core/FormControl';\nimport Select from '@material-ui/core/Select';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { useThemeBackgroundColor } from '../../../hooks/useThemeBackgroundColor';\n\nconst useSelectStyles = makeStyles(\n  {\n    root: { paddingTop: 0, paddingBottom: 0 },\n    label: { textTransform: 'none', fontWeight: 'bold' },\n    formControl: {\n      width: '100%',\n      marginTop: 5,\n      backgroundColor: 'transparent',\n    },\n  },\n  {\n    name: 'Select',\n  },\n);\n\ntype SelectProps = {\n  label: string;\n  options: string[];\n  value?: string;\n  onChange?: (event: React.ChangeEvent<{ value: unknown }>) => void;\n  multiple?: boolean;\n  freeSolo?: boolean;\n  selectOnFocus?: boolean;\n  clearOnBlur?: boolean;\n  handleHomeEndKeys?: boolean;\n  filterSelectedOptions?: boolean;\n  placeholder?: string;\n};\n\n/** @public */\nexport function SelectComponent(props: SelectProps) {\n  const classes = useSelectStyles();\n  const { backgroundColor } = useThemeBackgroundColor();\n  const {\n    label,\n    options,\n    value,\n    onChange,\n    multiple = false,\n    placeholder,\n  } = props;\n\n  return (\n    <Box className={classes.root} pb={1} pt={1}>\n      <Typography className={classes.label} variant=\"button\" component=\"label\">\n        {label}\n      </Typography>\n      <FormControl\n        className={classes.formControl}\n        variant=\"outlined\"\n        hiddenLabel\n        style={{ backgroundColor }}\n      >\n        <Select\n          displayEmpty\n          value={value || ''}\n          onChange={onChange}\n          multiple={multiple}\n          IconComponent={ExpandMoreIcon}\n          renderValue={(selected): React.ReactNode => {\n            if (\n              !selected ||\n              (Array.isArray(selected) && selected.length === 0)\n            ) {\n              return (\n                <Typography style={{ color: '#999' }}>\n                  {placeholder || 'Select an option'}\n                </Typography>\n              );\n            }\n            if (Array.isArray(selected)) {\n              return selected.join(', ');\n            }\n            return selected as React.ReactNode;\n          }}\n        >\n          {options.map(option => (\n            <MenuItem key={option} value={option}>\n              {option}\n            </MenuItem>\n          ))}\n        </Select>\n      </FormControl>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AA0BA,MAAM,eAAkB,GAAA,UAAA;AAAA,EACtB;AAAA,IACE,IAAM,EAAA,EAAE,UAAY,EAAA,CAAA,EAAG,eAAe,CAAE,EAAA;AAAA,IACxC,KAAO,EAAA,EAAE,aAAe,EAAA,MAAA,EAAQ,YAAY,MAAO,EAAA;AAAA,IACnD,WAAa,EAAA;AAAA,MACX,KAAO,EAAA,MAAA;AAAA,MACP,SAAW,EAAA,CAAA;AAAA,MACX,eAAiB,EAAA;AAAA;AACnB,GACF;AAAA,EACA;AAAA,IACE,IAAM,EAAA;AAAA;AAEV,CAAA;AAiBO,SAAS,gBAAgB,KAAoB,EAAA;AAClD,EAAA,MAAM,UAAU,eAAgB,EAAA;AAChC,EAAM,MAAA,EAAE,eAAgB,EAAA,GAAI,uBAAwB,EAAA;AACpD,EAAM,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAW,GAAA,KAAA;AAAA,IACX;AAAA,GACE,GAAA,KAAA;AAEJ,EAAA,2CACG,GAAI,EAAA,EAAA,SAAA,EAAW,QAAQ,IAAM,EAAA,EAAA,EAAI,GAAG,EAAI,EAAA,CAAA,EAAA,sCACtC,UAAW,EAAA,EAAA,SAAA,EAAW,QAAQ,KAAO,EAAA,OAAA,EAAQ,UAAS,SAAU,EAAA,OAAA,EAAA,EAC9D,KACH,CACA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAQ,CAAA,WAAA;AAAA,MACnB,OAAQ,EAAA,UAAA;AAAA,MACR,WAAW,EAAA,IAAA;AAAA,MACX,KAAA,EAAO,EAAE,eAAgB;AAAA,KAAA;AAAA,oBAEzB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,YAAY,EAAA,IAAA;AAAA,QACZ,OAAO,KAAS,IAAA,EAAA;AAAA,QAChB,QAAA;AAAA,QACA,QAAA;AAAA,QACA,aAAe,EAAA,cAAA;AAAA,QACf,WAAA,EAAa,CAAC,QAA8B,KAAA;AAC1C,UACE,IAAA,CAAC,YACA,KAAM,CAAA,OAAA,CAAQ,QAAQ,CAAK,IAAA,QAAA,CAAS,WAAW,CAChD,EAAA;AACA,YACE,uBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,KAAO,EAAA,EAAE,OAAO,MAAO,EAAA,EAAA,EAChC,eAAe,kBAClB,CAAA;AAAA;AAGJ,UAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,QAAQ,CAAG,EAAA;AAC3B,YAAO,OAAA,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA;AAE3B,UAAO,OAAA,QAAA;AAAA;AACT,OAAA;AAAA,MAEC,OAAA,CAAQ,GAAI,CAAA,CAAA,MAAA,qBACV,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAK,MAAQ,EAAA,KAAA,EAAO,MAC3B,EAAA,EAAA,MACH,CACD;AAAA;AACH,GAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SelectComponent.esm.js","sources":["../../../../src/pages/openshift/components/SelectComponent.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { makeStyles } from '@material-ui/core/styles';\nimport Box from '@material-ui/core/Box';\nimport Typography from '@material-ui/core/Typography';\nimport FormControl from '@material-ui/core/FormControl';\nimport Select from '@material-ui/core/Select';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { useThemeBackgroundColor } from '../../../hooks/useThemeBackgroundColor';\n\nconst useSelectStyles = makeStyles(\n  {\n    root: { paddingTop: 0, paddingBottom: 0 },\n    label: { textTransform: 'none', fontWeight: 'bold' },\n    formControl: {\n      width: '100%',\n      marginTop: 5,\n      backgroundColor: 'transparent',\n    },\n  },\n  {\n    name: 'Select',\n  },\n);\n\ntype SelectProps = {\n  label: string;\n  options: string[];\n  value?: string;\n  onChange?: (event: React.ChangeEvent<{ value: unknown }>) => void;\n  multiple?: boolean;\n  freeSolo?: boolean;\n  selectOnFocus?: boolean;\n  clearOnBlur?: boolean;\n  handleHomeEndKeys?: boolean;\n  filterSelectedOptions?: boolean;\n  placeholder?: string;\n};\n\n/** @public */\nexport function SelectComponent(props: SelectProps) {\n  const classes = useSelectStyles();\n  const { backgroundColor } = useThemeBackgroundColor();\n  const {\n    label,\n    options,\n    value,\n    onChange,\n    multiple = false,\n    placeholder,\n  } = props;\n\n  return (\n    <Box className={classes.root} pb={1} pt={1}>\n      <Typography className={classes.label} variant=\"button\" component=\"label\">\n        {label}\n      </Typography>\n      <FormControl\n        className={classes.formControl}\n        variant=\"outlined\"\n        hiddenLabel\n        style={{ backgroundColor }}\n      >\n        <Select\n          displayEmpty\n          value={value || ''}\n          onChange={onChange}\n          multiple={multiple}\n          IconComponent={ExpandMoreIcon}\n          renderValue={(selected): React.ReactNode => {\n            if (\n              !selected ||\n              (Array.isArray(selected) && selected.length === 0)\n            ) {\n              return (\n                <Typography style={{ color: '#999' }}>\n                  {placeholder || 'Select an option'}\n                </Typography>\n              );\n            }\n            if (Array.isArray(selected)) {\n              return selected.join(', ');\n            }\n            return selected as React.ReactNode;\n          }}\n        >\n          {options.map(option => (\n            <MenuItem key={option} value={option}>\n              {option}\n            </MenuItem>\n          ))}\n        </Select>\n      </FormControl>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AA0BA,MAAM,eAAA,GAAkB,UAAA;AAAA,EACtB;AAAA,IACE,IAAA,EAAM,EAAE,UAAA,EAAY,CAAA,EAAG,eAAe,CAAA,EAAE;AAAA,IACxC,KAAA,EAAO,EAAE,aAAA,EAAe,MAAA,EAAQ,YAAY,MAAA,EAAO;AAAA,IACnD,WAAA,EAAa;AAAA,MACX,KAAA,EAAO,MAAA;AAAA,MACP,SAAA,EAAW,CAAA;AAAA,MACX,eAAA,EAAiB;AAAA;AACnB,GACF;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV,CAAA;AAiBO,SAAS,gBAAgB,KAAA,EAAoB;AAClD,EAAA,MAAM,UAAU,eAAA,EAAgB;AAChC,EAAA,MAAM,EAAE,eAAA,EAAgB,GAAI,uBAAA,EAAwB;AACpD,EAAA,MAAM;AAAA,IACJ,KAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA,GAAW,KAAA;AAAA,IACX;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,2CACG,GAAA,EAAA,EAAI,SAAA,EAAW,QAAQ,IAAA,EAAM,EAAA,EAAI,GAAG,EAAA,EAAI,CAAA,EAAA,sCACtC,UAAA,EAAA,EAAW,SAAA,EAAW,QAAQ,KAAA,EAAO,OAAA,EAAQ,UAAS,SAAA,EAAU,OAAA,EAAA,EAC9D,KACH,CAAA,kBACA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAA,CAAQ,WAAA;AAAA,MACnB,OAAA,EAAQ,UAAA;AAAA,MACR,WAAA,EAAW,IAAA;AAAA,MACX,KAAA,EAAO,EAAE,eAAA;AAAgB,KAAA;AAAA,oBAEzB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,IAAA;AAAA,QACZ,OAAO,KAAA,IAAS,EAAA;AAAA,QAChB,QAAA;AAAA,QACA,QAAA;AAAA,QACA,aAAA,EAAe,cAAA;AAAA,QACf,WAAA,EAAa,CAAC,QAAA,KAA8B;AAC1C,UAAA,IACE,CAAC,YACA,KAAA,CAAM,OAAA,CAAQ,QAAQ,CAAA,IAAK,QAAA,CAAS,WAAW,CAAA,EAChD;AACA,YAAA,uBACE,KAAA,CAAA,aAAA,CAAC,cAAW,KAAA,EAAO,EAAE,OAAO,MAAA,EAAO,EAAA,EAChC,eAAe,kBAClB,CAAA;AAAA,UAEJ;AACA,UAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,QAAQ,CAAA,EAAG;AAC3B,YAAA,OAAO,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA,UAC3B;AACA,UAAA,OAAO,QAAA;AAAA,QACT;AAAA,OAAA;AAAA,MAEC,OAAA,CAAQ,GAAA,CAAI,CAAA,MAAA,qBACX,KAAA,CAAA,aAAA,CAAC,QAAA,EAAA,EAAS,KAAK,MAAA,EAAQ,KAAA,EAAO,MAAA,EAAA,EAC3B,MACH,CACD;AAAA;AACH,GAEJ,CAAA;AAEJ;;;;"}

package/dist/pages/openshift/components/TableToolbar.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableToolbar.esm.js","sources":["../../../../src/pages/openshift/components/TableToolbar.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport {\n  Switch,\n  IconButton,\n  Menu,\n  MenuItem,\n  Checkbox,\n  FormControlLabel,\n  Box,\n} from '@material-ui/core';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ViewWeekIcon from '@material-ui/icons/ViewWeek';\nimport { DownloadIconButton } from './DownloadIconButton';\n\nconst useStyles = makeStyles({\n  switchOff: {\n    '& .MuiSwitch-thumb': {\n      backgroundColor: '#6A6E73',\n    },\n    '& .MuiSwitch-track': {\n      backgroundColor: '#6A6E73',\n    },\n  },\n  menuItem: {\n    padding: '12px 16px',\n    '&:hover': {\n      backgroundColor: 'transparent',\n    },\n  },\n  menuItemLabel: {\n    marginLeft: 0,\n    marginRight: 0,\n    width: '100%',\n  },\n  menuItemDescription: {\n    fontSize: '0.75rem',\n    color: '#6A6E73',\n    marginTop: '4px',\n    marginLeft: '32px',\n  },\n});\n\ntype TableToolbarProps = {\n  showPlatformSum: boolean;\n  setShowPlatformSum: (showPlatformSum: boolean) => void;\n  projectsCount: number;\n  groupBy: string;\n  showMonthOverMonthChange: boolean;\n  setShowMonthOverMonthChange: (show: boolean) => void;\n  showInfrastructureCost: boolean;\n  setShowInfrastructureCost: (show: boolean) => void;\n  showSupplementaryCost: boolean;\n  setShowSupplementaryCost: (show: boolean) => void;\n  onDownloadCsv?: () => void;\n  onDownloadJson?: () => void;\n  isDownloading?: boolean;\n};\n\n/** @public */\nexport function TableToolbar(props: TableToolbarProps) {\n  const {\n    showPlatformSum,\n    setShowPlatformSum,\n    projectsCount,\n    groupBy,\n    showMonthOverMonthChange,\n    setShowMonthOverMonthChange,\n    showInfrastructureCost,\n    setShowInfrastructureCost,\n    showSupplementaryCost,\n    setShowSupplementaryCost,\n    onDownloadCsv,\n    onDownloadJson,\n    isDownloading,\n  } = props;\n  const classes = useStyles();\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n\n  const handleMenuOpen = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleMenuClose = () => {\n    setAnchorEl(null);\n  };\n\n  const getTableTitle = (groupByValue: string): string => {\n    const titleMap: Record<string, string> = {\n      project: 'Projects',\n      cluster: 'Clusters',\n      node: 'Nodes',\n      tag: 'Tags',\n    };\n    return titleMap[groupByValue] || 'Projects';\n  };\n\n  return (\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n      }}\n    >\n      <div\n        style={{\n          display: 'flex',\n          alignItems: 'center',\n          gap: '16px',\n          marginBottom: 48,\n        }}\n      >\n        <Typography variant=\"h2\" style={{ fontWeight: 'bold' }}>\n          {getTableTitle(groupBy)} ({projectsCount})\n        </Typography>\n\n        {groupBy === 'project' && (\n          <div\n            style={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: '8px',\n            }}\n          >\n            <Switch\n              checked={showPlatformSum}\n              onChange={e => setShowPlatformSum(e.target.checked)}\n              className={classes.switchOff}\n            />\n            <Typography variant=\"body2\" style={{ color: '#6A6E73' }}>\n              Sum platform costs\n            </Typography>\n          </div>\n        )}\n\n        <DownloadIconButton\n          label=\"CSV\"\n          variant=\"gray\"\n          onClick={onDownloadCsv}\n          disabled={isDownloading}\n        />\n        <DownloadIconButton\n          label=\"JSON\"\n          variant=\"gray\"\n          onClick={onDownloadJson}\n          disabled={isDownloading}\n        />\n      </div>\n      <IconButton\n        aria-label=\"menu\"\n        style={{ color: '#6A6E73', padding: '8px' }}\n        onClick={handleMenuOpen}\n      >\n        <ViewWeekIcon />\n      </IconButton>\n      <Menu\n        anchorEl={anchorEl}\n        open={Boolean(anchorEl)}\n        onClose={handleMenuClose}\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'right',\n        }}\n        transformOrigin={{\n          vertical: 'top',\n          horizontal: 'right',\n        }}\n        PaperProps={{\n          style: {\n            minWidth: '300px',\n            padding: '8px 0',\n          },\n        }}\n      >\n        <Box px={2} py={1}>\n          <Typography variant=\"subtitle2\" style={{ fontWeight: 'bold' }}>\n            Add or remove columns\n          </Typography>\n        </Box>\n        <MenuItem\n          className={classes.menuItem}\n          onClick={e => {\n            e.stopPropagation();\n            setShowMonthOverMonthChange(!showMonthOverMonthChange);\n          }}\n        >\n          <FormControlLabel\n            className={classes.menuItemLabel}\n            control={\n              <Checkbox\n                checked={showMonthOverMonthChange}\n                onChange={e => {\n                  e.stopPropagation();\n                  setShowMonthOverMonthChange(e.target.checked);\n                }}\n                onClick={e => e.stopPropagation()}\n              />\n            }\n            label=\"Month over month change\"\n            onClick={e => e.stopPropagation()}\n          />\n        </MenuItem>\n        <MenuItem\n          className={classes.menuItem}\n          onClick={e => {\n            e.stopPropagation();\n            setShowInfrastructureCost(!showInfrastructureCost);\n          }}\n        >\n          <Box>\n            <FormControlLabel\n              className={classes.menuItemLabel}\n              control={\n                <Checkbox\n                  checked={showInfrastructureCost}\n                  onChange={e => {\n                    e.stopPropagation();\n                    setShowInfrastructureCost(e.target.checked);\n                  }}\n                  onClick={e => e.stopPropagation()}\n                />\n              }\n              label=\"Infrastructure cost\"\n              onClick={e => e.stopPropagation()}\n            />\n            <Typography className={classes.menuItemDescription}>\n              The cost based on raw usage data from the underlying\n              infrastructure.\n            </Typography>\n          </Box>\n        </MenuItem>\n        <MenuItem\n          className={classes.menuItem}\n          onClick={e => {\n            e.stopPropagation();\n            setShowSupplementaryCost(!showSupplementaryCost);\n          }}\n        >\n          <Box>\n            <FormControlLabel\n              className={classes.menuItemLabel}\n              control={\n                <Checkbox\n                  checked={showSupplementaryCost}\n                  onChange={e => {\n                    e.stopPropagation();\n                    setShowSupplementaryCost(e.target.checked);\n                  }}\n                  onClick={e => e.stopPropagation()}\n                />\n              }\n              label=\"Supplementary cost\"\n              onClick={e => e.stopPropagation()}\n            />\n            <Typography className={classes.menuItemDescription}>\n              All costs not directly attributed to the infrastructure.\n              <br />\n              These costs are determined by applying a price list within a cost\n              model to OpenShift cluster metrics.\n            </Typography>\n          </Box>\n        </MenuItem>\n      </Menu>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TableToolbar.esm.js","sources":["../../../../src/pages/openshift/components/TableToolbar.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport {\n  Switch,\n  IconButton,\n  Menu,\n  MenuItem,\n  Checkbox,\n  FormControlLabel,\n  Box,\n} from '@material-ui/core';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ViewWeekIcon from '@material-ui/icons/ViewWeek';\nimport { DownloadIconButton } from './DownloadIconButton';\n\nconst useStyles = makeStyles({\n  switchOff: {\n    '& .MuiSwitch-thumb': {\n      backgroundColor: '#6A6E73',\n    },\n    '& .MuiSwitch-track': {\n      backgroundColor: '#6A6E73',\n    },\n  },\n  menuItem: {\n    padding: '12px 16px',\n    '&:hover': {\n      backgroundColor: 'transparent',\n    },\n  },\n  menuItemLabel: {\n    marginLeft: 0,\n    marginRight: 0,\n    width: '100%',\n  },\n  menuItemDescription: {\n    fontSize: '0.75rem',\n    color: '#6A6E73',\n    marginTop: '4px',\n    marginLeft: '32px',\n  },\n});\n\ntype TableToolbarProps = {\n  showPlatformSum: boolean;\n  setShowPlatformSum: (showPlatformSum: boolean) => void;\n  projectsCount: number;\n  groupBy: string;\n  showMonthOverMonthChange: boolean;\n  setShowMonthOverMonthChange: (show: boolean) => void;\n  showInfrastructureCost: boolean;\n  setShowInfrastructureCost: (show: boolean) => void;\n  showSupplementaryCost: boolean;\n  setShowSupplementaryCost: (show: boolean) => void;\n  onDownloadCsv?: () => void;\n  onDownloadJson?: () => void;\n  isDownloading?: boolean;\n};\n\n/** @public */\nexport function TableToolbar(props: TableToolbarProps) {\n  const {\n    showPlatformSum,\n    setShowPlatformSum,\n    projectsCount,\n    groupBy,\n    showMonthOverMonthChange,\n    setShowMonthOverMonthChange,\n    showInfrastructureCost,\n    setShowInfrastructureCost,\n    showSupplementaryCost,\n    setShowSupplementaryCost,\n    onDownloadCsv,\n    onDownloadJson,\n    isDownloading,\n  } = props;\n  const classes = useStyles();\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n\n  const handleMenuOpen = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleMenuClose = () => {\n    setAnchorEl(null);\n  };\n\n  const getTableTitle = (groupByValue: string): string => {\n    const titleMap: Record<string, string> = {\n      project: 'Projects',\n      cluster: 'Clusters',\n      node: 'Nodes',\n      tag: 'Tags',\n    };\n    return titleMap[groupByValue] || 'Projects';\n  };\n\n  return (\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n      }}\n    >\n      <div\n        style={{\n          display: 'flex',\n          alignItems: 'center',\n          gap: '16px',\n          marginBottom: 48,\n        }}\n      >\n        <Typography variant=\"h2\" style={{ fontWeight: 'bold' }}>\n          {getTableTitle(groupBy)} ({projectsCount})\n        </Typography>\n\n        {groupBy === 'project' && (\n          <div\n            style={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: '8px',\n            }}\n          >\n            <Switch\n              checked={showPlatformSum}\n              onChange={e => setShowPlatformSum(e.target.checked)}\n              className={classes.switchOff}\n            />\n            <Typography variant=\"body2\" style={{ color: '#6A6E73' }}>\n              Sum platform costs\n            </Typography>\n          </div>\n        )}\n\n        <DownloadIconButton\n          label=\"CSV\"\n          variant=\"gray\"\n          onClick={onDownloadCsv}\n          disabled={isDownloading}\n        />\n        <DownloadIconButton\n          label=\"JSON\"\n          variant=\"gray\"\n          onClick={onDownloadJson}\n          disabled={isDownloading}\n        />\n      </div>\n      <IconButton\n        aria-label=\"menu\"\n        style={{ color: '#6A6E73', padding: '8px' }}\n        onClick={handleMenuOpen}\n      >\n        <ViewWeekIcon />\n      </IconButton>\n      <Menu\n        anchorEl={anchorEl}\n        open={Boolean(anchorEl)}\n        onClose={handleMenuClose}\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'right',\n        }}\n        transformOrigin={{\n          vertical: 'top',\n          horizontal: 'right',\n        }}\n        PaperProps={{\n          style: {\n            minWidth: '300px',\n            padding: '8px 0',\n          },\n        }}\n      >\n        <Box px={2} py={1}>\n          <Typography variant=\"subtitle2\" style={{ fontWeight: 'bold' }}>\n            Add or remove columns\n          </Typography>\n        </Box>\n        <MenuItem\n          className={classes.menuItem}\n          onClick={e => {\n            e.stopPropagation();\n            setShowMonthOverMonthChange(!showMonthOverMonthChange);\n          }}\n        >\n          <FormControlLabel\n            className={classes.menuItemLabel}\n            control={\n              <Checkbox\n                checked={showMonthOverMonthChange}\n                onChange={e => {\n                  e.stopPropagation();\n                  setShowMonthOverMonthChange(e.target.checked);\n                }}\n                onClick={e => e.stopPropagation()}\n              />\n            }\n            label=\"Month over month change\"\n            onClick={e => e.stopPropagation()}\n          />\n        </MenuItem>\n        <MenuItem\n          className={classes.menuItem}\n          onClick={e => {\n            e.stopPropagation();\n            setShowInfrastructureCost(!showInfrastructureCost);\n          }}\n        >\n          <Box>\n            <FormControlLabel\n              className={classes.menuItemLabel}\n              control={\n                <Checkbox\n                  checked={showInfrastructureCost}\n                  onChange={e => {\n                    e.stopPropagation();\n                    setShowInfrastructureCost(e.target.checked);\n                  }}\n                  onClick={e => e.stopPropagation()}\n                />\n              }\n              label=\"Infrastructure cost\"\n              onClick={e => e.stopPropagation()}\n            />\n            <Typography className={classes.menuItemDescription}>\n              The cost based on raw usage data from the underlying\n              infrastructure.\n            </Typography>\n          </Box>\n        </MenuItem>\n        <MenuItem\n          className={classes.menuItem}\n          onClick={e => {\n            e.stopPropagation();\n            setShowSupplementaryCost(!showSupplementaryCost);\n          }}\n        >\n          <Box>\n            <FormControlLabel\n              className={classes.menuItemLabel}\n              control={\n                <Checkbox\n                  checked={showSupplementaryCost}\n                  onChange={e => {\n                    e.stopPropagation();\n                    setShowSupplementaryCost(e.target.checked);\n                  }}\n                  onClick={e => e.stopPropagation()}\n                />\n              }\n              label=\"Supplementary cost\"\n              onClick={e => e.stopPropagation()}\n            />\n            <Typography className={classes.menuItemDescription}>\n              All costs not directly attributed to the infrastructure.\n              <br />\n              These costs are determined by applying a price list within a cost\n              model to OpenShift cluster metrics.\n            </Typography>\n          </Box>\n        </MenuItem>\n      </Menu>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/pages/optimizations/OptimizationsPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"OptimizationsPage.esm.js","sources":["../../../src/pages/optimizations/OptimizationsPage.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useMemo, useState } from 'react';\nimport useAsync from 'react-use/lib/useAsync';\nimport snakeCase from 'lodash/snakeCase';\nimport {\n  Link,\n  ResponseErrorPanel,\n  Table,\n  TableColumn,\n} from '@backstage/core-components';\nimport type { Recommendations } from '@red-hat-developer-hub/plugin-cost-management-common/models';\nimport type { GetRecommendationListRequest } from '@red-hat-developer-hub/plugin-cost-management-common/clients';\nimport { useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { PageLayout } from '../../components/PageLayout';\nimport { TableToolbar } from './components/TableToolbar';\nimport { Filters } from './components/Filters';\nimport { BasePage } from '../../components/BasePage';\nimport { optimizationsBreakdownRouteRef } from '../../routes';\nimport { getTimeFromNow } from '../../utils/dates';\nimport { optimizationsApiRef } from '../../apis';\n\nexport const DEFAULT_DEBOUNCE_INTERVAL: number = 700;\nexport const DEFAULT_PAGE_SIZE_OPTIONS: number[] = [10, 20, 50, 100];\nexport const DEFAULT_SORTING_DIRECTION: GetRecommendationListRequest['query']['orderHow'] =\n  'desc';\nexport const DEFAULT_SORTING_COLUMN: GetRecommendationListRequest['query']['orderBy'] =\n  'last_reported';\nexport const DEFAULT_PADDING: 'dense' | 'default' = 'dense';\n\n/** This type actually represents what's going to be sent to the back-end. */\ntype QueryState = Omit<\n  GetRecommendationListRequest['query'],\n  'startDate' | 'endDate'\n>;\n\ntype AvailableFilteringOptions = Pick<\n  QueryState,\n  'cluster' | 'project' | 'workload' | 'workloadType'\n>;\n\nconst initialQueryState: QueryState = {\n  limit: DEFAULT_PAGE_SIZE_OPTIONS[0],\n  offset: 0,\n  orderBy: DEFAULT_SORTING_COLUMN,\n  orderHow: DEFAULT_SORTING_DIRECTION,\n};\n\nconst availableFilteringOptionsInitialState: AvailableFilteringOptions = {\n  cluster: [],\n  project: [],\n  workload: [],\n  workloadType: [],\n};\n\n/** @public */\nexport function OptimizationsPage() {\n  const [currentPage, setCurrentPage] = useState<number>(0); // First page starts from 0\n  const [queryState, setQueryState] = useState<QueryState>(initialQueryState);\n  const api = useApi(optimizationsApiRef);\n  const { value, error, loading } = useAsync(async () => {\n    const response = await api.getRecommendationList({ query: queryState });\n    return response.json();\n  }, [queryState]);\n\n  const columns = useMemo<TableColumn<Recommendations>[]>(\n    () => [\n      {\n        title: 'Container',\n        field: 'container',\n        render: data => {\n          // eslint-disable-next-line react-hooks/rules-of-hooks\n          const link = useRouteRef(optimizationsBreakdownRouteRef);\n          return React.createElement(Link, {\n            to: link({ id: data.id! }),\n            children: data.container,\n          });\n        },\n      },\n      {\n        title: 'Project',\n        field: 'project',\n      },\n      {\n        title: 'Workload',\n        field: 'workload',\n      },\n      {\n        title: 'Type',\n        field: 'workloadType',\n      },\n      {\n        title: 'Cluster',\n        field: 'clusterAlias',\n      },\n      {\n        title: 'Last reported',\n        field: 'lastReported',\n        render(data, _type) {\n          return getTimeFromNow(data.lastReported?.toString());\n        },\n      },\n    ],\n    [],\n  );\n  const optimizableContainersCount = useMemo(\n    () => value?.meta?.count ?? 0,\n    [value?.meta?.count],\n  );\n  const data = useMemo(() => value?.data ?? [], [value?.data]);\n\n  const handlePageChange = useCallback(\n    (pageNumber: number, pageSize: number): void => {\n      setCurrentPage(pageNumber);\n      setQueryState(lastQueryState => ({\n        ...lastQueryState,\n        offset: pageNumber * pageSize,\n        limit: pageSize,\n      }));\n    },\n    [],\n  );\n\n  const handleRowsPerPageChange = useCallback((pageSize: number): void => {\n    setQueryState(lastState => ({\n      ...lastState,\n      offset: (lastState.offset ?? 0) * pageSize,\n      limit: pageSize,\n    }));\n  }, []);\n\n  const handleOrderChange = useCallback(\n    (orderBy: number, orderDirection: 'desc' | 'asc'): void => {\n      const { field } = columns[orderBy];\n      setQueryState(lastState => ({\n        ...lastState,\n        orderBy:\n          field === 'clusterAlias'\n            ? 'cluster'\n            : (snakeCase(field as string) as NonNullable<\n                typeof lastState.orderBy\n              >),\n        orderHow: orderDirection as NonNullable<typeof lastState.orderHow>,\n      }));\n    },\n    [columns],\n  );\n\n  const handleFiltersChange = useCallback(\n    (\n      fieldId: 'cluster' | 'workloadType' | 'workload' | 'project',\n      values: string[],\n    ): void => {\n      setQueryState(lastQueryState => ({\n        ...lastQueryState,\n        offset: 0,\n        [fieldId]: values,\n      }));\n      setCurrentPage(0);\n    },\n    [],\n  );\n\n  const handleFiltersReset = useCallback((): void => {\n    if (\n      queryState.cluster?.length === 0 &&\n      queryState.project?.length === 0 &&\n      queryState.workload?.length === 0 &&\n      queryState.workloadType?.length === 0\n    ) {\n      return;\n    }\n\n    setQueryState(lastQueryState => ({\n      ...lastQueryState,\n      ...availableFilteringOptionsInitialState,\n    }));\n  }, [\n    queryState.cluster?.length,\n    queryState.project?.length,\n    queryState.workload?.length,\n    queryState.workloadType?.length,\n  ]);\n\n  const handleSearchChange = useCallback((searchText: string): void => {\n    setQueryState(lastState => ({\n      ...lastState,\n      container: Array.from(new Set(searchText.split(',').filter(Boolean))),\n    }));\n  }, []);\n\n  if (error) {\n    return <ResponseErrorPanel error={error} />;\n  }\n\n  return (\n    <BasePage pageTitle=\"Resource Optimization\" withContentPadding>\n      <PageLayout>\n        <PageLayout.Filters>\n          <Filters\n            cluster={{\n              options: [],\n              label: 'CLUSTERS',\n            }}\n            project={{\n              options: [],\n              label: 'PROJECTS',\n            }}\n            workload={{\n              options: [],\n              label: 'WORKLOADS',\n            }}\n            workloadType={{\n              options: [],\n              label: 'TYPES',\n            }}\n            onFiltersChange={handleFiltersChange}\n            onFiltersReset={handleFiltersReset}\n          />\n        </PageLayout.Filters>\n        <PageLayout.Table>\n          <Table<Recommendations>\n            components={{\n              Toolbar: TableToolbar,\n            }}\n            title={`Optimizable containers (${\n              optimizableContainersCount ?? 'N/A'\n            })`}\n            options={{\n              debounceInterval: DEFAULT_DEBOUNCE_INTERVAL,\n              padding: DEFAULT_PADDING,\n              pageSize: queryState.limit,\n              pageSizeOptions: DEFAULT_PAGE_SIZE_OPTIONS,\n              paging: true,\n              search: true,\n              sorting: true,\n              thirdSortClick: false,\n            }}\n            localization={{\n              toolbar: {\n                searchPlaceholder: 'Search container name',\n              },\n            }}\n            data={data}\n            columns={columns}\n            isLoading={loading}\n            totalCount={optimizableContainersCount}\n            page={currentPage}\n            onPageChange={handlePageChange}\n            onRowsPerPageChange={handleRowsPerPageChange}\n            onOrderChange={handleOrderChange}\n            onSearchChange={handleSearchChange}\n          />\n        </PageLayout.Table>\n      </PageLayout>\n    </BasePage>\n  );\n}\nOptimizationsPage.displayName = 'OptimizationsPage';\n"],"names":["data"],"mappings":"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"}
+{"version":3,"file":"OptimizationsPage.esm.js","sources":["../../../src/pages/optimizations/OptimizationsPage.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useMemo, useState } from 'react';\nimport useAsync from 'react-use/lib/useAsync';\nimport snakeCase from 'lodash/snakeCase';\nimport {\n  Link,\n  ResponseErrorPanel,\n  Table,\n  TableColumn,\n} from '@backstage/core-components';\nimport type { Recommendations } from '@red-hat-developer-hub/plugin-cost-management-common/models';\nimport type { GetRecommendationListRequest } from '@red-hat-developer-hub/plugin-cost-management-common/clients';\nimport { useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { PageLayout } from '../../components/PageLayout';\nimport { TableToolbar } from './components/TableToolbar';\nimport { Filters } from './components/Filters';\nimport { BasePage } from '../../components/BasePage';\nimport { optimizationsBreakdownRouteRef } from '../../routes';\nimport { getTimeFromNow } from '../../utils/dates';\nimport { optimizationsApiRef } from '../../apis';\n\nexport const DEFAULT_DEBOUNCE_INTERVAL: number = 700;\nexport const DEFAULT_PAGE_SIZE_OPTIONS: number[] = [10, 20, 50, 100];\nexport const DEFAULT_SORTING_DIRECTION: GetRecommendationListRequest['query']['orderHow'] =\n  'desc';\nexport const DEFAULT_SORTING_COLUMN: GetRecommendationListRequest['query']['orderBy'] =\n  'last_reported';\nexport const DEFAULT_PADDING: 'dense' | 'default' = 'dense';\n\n/** This type actually represents what's going to be sent to the back-end. */\ntype QueryState = Omit<\n  GetRecommendationListRequest['query'],\n  'startDate' | 'endDate'\n>;\n\ntype AvailableFilteringOptions = Pick<\n  QueryState,\n  'cluster' | 'project' | 'workload' | 'workloadType'\n>;\n\nconst initialQueryState: QueryState = {\n  limit: DEFAULT_PAGE_SIZE_OPTIONS[0],\n  offset: 0,\n  orderBy: DEFAULT_SORTING_COLUMN,\n  orderHow: DEFAULT_SORTING_DIRECTION,\n};\n\nconst availableFilteringOptionsInitialState: AvailableFilteringOptions = {\n  cluster: [],\n  project: [],\n  workload: [],\n  workloadType: [],\n};\n\n/** @public */\nexport function OptimizationsPage() {\n  const [currentPage, setCurrentPage] = useState<number>(0); // First page starts from 0\n  const [queryState, setQueryState] = useState<QueryState>(initialQueryState);\n  const api = useApi(optimizationsApiRef);\n  const { value, error, loading } = useAsync(async () => {\n    const response = await api.getRecommendationList({ query: queryState });\n    return response.json();\n  }, [queryState]);\n\n  const columns = useMemo<TableColumn<Recommendations>[]>(\n    () => [\n      {\n        title: 'Container',\n        field: 'container',\n        render: data => {\n          // eslint-disable-next-line react-hooks/rules-of-hooks\n          const link = useRouteRef(optimizationsBreakdownRouteRef);\n          return React.createElement(Link, {\n            to: link({ id: data.id! }),\n            children: data.container,\n          });\n        },\n      },\n      {\n        title: 'Project',\n        field: 'project',\n      },\n      {\n        title: 'Workload',\n        field: 'workload',\n      },\n      {\n        title: 'Type',\n        field: 'workloadType',\n      },\n      {\n        title: 'Cluster',\n        field: 'clusterAlias',\n      },\n      {\n        title: 'Last reported',\n        field: 'lastReported',\n        render(data, _type) {\n          return getTimeFromNow(data.lastReported?.toString());\n        },\n      },\n    ],\n    [],\n  );\n  const optimizableContainersCount = useMemo(\n    () => value?.meta?.count ?? 0,\n    [value?.meta?.count],\n  );\n  const data = useMemo(() => value?.data ?? [], [value?.data]);\n\n  const handlePageChange = useCallback(\n    (pageNumber: number, pageSize: number): void => {\n      setCurrentPage(pageNumber);\n      setQueryState(lastQueryState => ({\n        ...lastQueryState,\n        offset: pageNumber * pageSize,\n        limit: pageSize,\n      }));\n    },\n    [],\n  );\n\n  const handleRowsPerPageChange = useCallback((pageSize: number): void => {\n    setQueryState(lastState => ({\n      ...lastState,\n      offset: (lastState.offset ?? 0) * pageSize,\n      limit: pageSize,\n    }));\n  }, []);\n\n  const handleOrderChange = useCallback(\n    (orderBy: number, orderDirection: 'desc' | 'asc'): void => {\n      const { field } = columns[orderBy];\n      setQueryState(lastState => ({\n        ...lastState,\n        orderBy:\n          field === 'clusterAlias'\n            ? 'cluster'\n            : (snakeCase(field as string) as NonNullable<\n                typeof lastState.orderBy\n              >),\n        orderHow: orderDirection as NonNullable<typeof lastState.orderHow>,\n      }));\n    },\n    [columns],\n  );\n\n  const handleFiltersChange = useCallback(\n    (\n      fieldId: 'cluster' | 'workloadType' | 'workload' | 'project',\n      values: string[],\n    ): void => {\n      setQueryState(lastQueryState => ({\n        ...lastQueryState,\n        offset: 0,\n        [fieldId]: values,\n      }));\n      setCurrentPage(0);\n    },\n    [],\n  );\n\n  const handleFiltersReset = useCallback((): void => {\n    if (\n      queryState.cluster?.length === 0 &&\n      queryState.project?.length === 0 &&\n      queryState.workload?.length === 0 &&\n      queryState.workloadType?.length === 0\n    ) {\n      return;\n    }\n\n    setQueryState(lastQueryState => ({\n      ...lastQueryState,\n      ...availableFilteringOptionsInitialState,\n    }));\n  }, [\n    queryState.cluster?.length,\n    queryState.project?.length,\n    queryState.workload?.length,\n    queryState.workloadType?.length,\n  ]);\n\n  const handleSearchChange = useCallback((searchText: string): void => {\n    setQueryState(lastState => ({\n      ...lastState,\n      container: Array.from(new Set(searchText.split(',').filter(Boolean))),\n    }));\n  }, []);\n\n  if (error) {\n    return <ResponseErrorPanel error={error} />;\n  }\n\n  return (\n    <BasePage pageTitle=\"Resource Optimization\" withContentPadding>\n      <PageLayout>\n        <PageLayout.Filters>\n          <Filters\n            cluster={{\n              options: [],\n              label: 'CLUSTERS',\n            }}\n            project={{\n              options: [],\n              label: 'PROJECTS',\n            }}\n            workload={{\n              options: [],\n              label: 'WORKLOADS',\n            }}\n            workloadType={{\n              options: [],\n              label: 'TYPES',\n            }}\n            onFiltersChange={handleFiltersChange}\n            onFiltersReset={handleFiltersReset}\n          />\n        </PageLayout.Filters>\n        <PageLayout.Table>\n          <Table<Recommendations>\n            components={{\n              Toolbar: TableToolbar,\n            }}\n            title={`Optimizable containers (${\n              optimizableContainersCount ?? 'N/A'\n            })`}\n            options={{\n              debounceInterval: DEFAULT_DEBOUNCE_INTERVAL,\n              padding: DEFAULT_PADDING,\n              pageSize: queryState.limit,\n              pageSizeOptions: DEFAULT_PAGE_SIZE_OPTIONS,\n              paging: true,\n              search: true,\n              sorting: true,\n              thirdSortClick: false,\n            }}\n            localization={{\n              toolbar: {\n                searchPlaceholder: 'Search container name',\n              },\n            }}\n            data={data}\n            columns={columns}\n            isLoading={loading}\n            totalCount={optimizableContainersCount}\n            page={currentPage}\n            onPageChange={handlePageChange}\n            onRowsPerPageChange={handleRowsPerPageChange}\n            onOrderChange={handleOrderChange}\n            onSearchChange={handleSearchChange}\n          />\n        </PageLayout.Table>\n      </PageLayout>\n    </BasePage>\n  );\n}\nOptimizationsPage.displayName = 'OptimizationsPage';\n"],"names":["data"],"mappings":"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"}

package/dist/pages/optimizations/components/ComboBox.esm.js

@@ -40,25 +40,21 @@ const useComboBoxStyles = makeStyles(
 );
 function ComboBox(props) {
   const classes = useComboBoxStyles();
-  const [_text, setText] = useState("");
+  const [isOpen, setIsOpen] = useState(false);
+  const [inputValue, setInputValue] = useState("");
   return /* @__PURE__ */ React.createElement(Box, { className: classes.root, pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(Typography, { className: classes.label, variant: "button", component: "label" }, props.label), /* @__PURE__ */ React.createElement(
     Autocomplete,
     {
       ...props,
+      open: isOpen && props.options.length > 0,
+      onOpen: () => setIsOpen(true),
+      onClose: () => setIsOpen(false),
+      inputValue,
+      onInputChange: (_, value) => setInputValue(value),
       disableCloseOnSelect: props.multiple,
       includeInputInList: true,
       popupIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, { "data-testid": "expand-icon" }),
-      renderInput: (params) => /* @__PURE__ */ React.createElement(
-        TextField,
-        {
-          ...params,
-          className: classes.input,
-          onChange: (e) => {
-            setText(e.currentTarget.value);
-          },
-          variant: "outlined"
-        }
-      ),
+      renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, { ...params, className: classes.input, variant: "outlined" }),
       renderOption: (option, { selected }) => !props.freeSolo ? /* @__PURE__ */ React.createElement(Box, { className: classes.fullWidth }, /* @__PURE__ */ React.createElement(
         FixedWidthFormControlLabel,
         {

package/dist/pages/optimizations/components/ComboBox.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.esm.js","sources":["../../../../src/pages/optimizations/components/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport { makeStyles, withStyles } from '@material-ui/core/styles';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport Box from '@material-ui/core/Box';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport CheckBoxIcon from '@material-ui/icons/CheckBox';\nimport CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { Autocomplete, AutocompleteProps } from '@material-ui/lab';\n\nconst FixedWidthFormControlLabel = withStyles(\n  _theme => ({\n    label: {\n      width: '100%',\n    },\n    root: {\n      width: '90%',\n    },\n  }),\n  { name: 'FixedWidthFormControlLabel' },\n)(FormControlLabel);\n\nconst useComboBoxStyles = makeStyles(\n  {\n    root: {},\n    label: {},\n    input: {},\n    fullWidth: { width: '100%' },\n    boxLabel: {\n      width: '100%',\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n    },\n  },\n  {\n    name: 'ComboBox',\n  },\n);\n\ntype ExcludedAutocompleteProps =\n  | 'clearOnEscape'\n  | 'disableCloseOnSelect'\n  | 'includeInputInList'\n  | 'size'\n  | 'popupIcon'\n  | 'renderInput'\n  | 'renderOption';\n\ntype ComboBoxProps<\n  T,\n  Multiple extends boolean | undefined = undefined,\n  DisableClearable extends boolean | undefined = undefined,\n  FreeSolo extends boolean | undefined = undefined,\n> = Omit<\n  AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>,\n  ExcludedAutocompleteProps\n> & {\n  label: string;\n};\n\n/** @public */\nexport function ComboBox<\n  T extends string,\n  Multiple extends boolean | undefined = undefined,\n  DisableClearable extends boolean | undefined = undefined,\n  FreeSolo extends boolean | undefined = undefined,\n>(props: ComboBoxProps<T, Multiple, DisableClearable, FreeSolo>) {\n  const classes = useComboBoxStyles();\n  const [_text, setText] = useState('');\n\n  return (\n    <Box className={classes.root} pb={1} pt={1}>\n      <Typography className={classes.label} variant=\"button\" component=\"label\">\n        {props.label}\n      </Typography>\n      <Autocomplete<T, Multiple, DisableClearable, FreeSolo>\n        {...props}\n        disableCloseOnSelect={props.multiple}\n        includeInputInList\n        popupIcon={<ExpandMoreIcon data-testid=\"expand-icon\" />}\n        renderInput={params => (\n          <TextField\n            {...params}\n            className={classes.input}\n            onChange={e => {\n              setText(e.currentTarget.value);\n            }}\n            variant=\"outlined\"\n          />\n        )}\n        renderOption={(option, { selected }) =>\n          !props.freeSolo ? (\n            <Box className={classes.fullWidth}>\n              <FixedWidthFormControlLabel\n                className={classes.fullWidth}\n                control={\n                  <Checkbox\n                    icon={<CheckBoxOutlineBlankIcon fontSize=\"small\" />}\n                    checkedIcon={<CheckBoxIcon fontSize=\"small\" />}\n                    checked={selected}\n                  />\n                }\n                onClick={event => event.preventDefault()}\n                label={\n                  <Tooltip title={option}>\n                    <Box display=\"flex\" alignItems=\"center\">\n                      <Box className={classes.boxLabel}>\n                        <Typography noWrap>{props.title}</Typography>\n                      </Box>\n                    </Box>\n                  </Tooltip>\n                }\n              />\n            </Box>\n          ) : (\n            option\n          )\n        }\n        size=\"small\"\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ComboBox.esm.js","sources":["../../../../src/pages/optimizations/components/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport { makeStyles, withStyles } from '@material-ui/core/styles';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport Box from '@material-ui/core/Box';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport Tooltip from '@material-ui/core/Tooltip';\nimport CheckBoxIcon from '@material-ui/icons/CheckBox';\nimport CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { Autocomplete, AutocompleteProps } from '@material-ui/lab';\n\nconst FixedWidthFormControlLabel = withStyles(\n  _theme => ({\n    label: {\n      width: '100%',\n    },\n    root: {\n      width: '90%',\n    },\n  }),\n  { name: 'FixedWidthFormControlLabel' },\n)(FormControlLabel);\n\nconst useComboBoxStyles = makeStyles(\n  {\n    root: {},\n    label: {},\n    input: {},\n    fullWidth: { width: '100%' },\n    boxLabel: {\n      width: '100%',\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n    },\n  },\n  {\n    name: 'ComboBox',\n  },\n);\n\ntype ExcludedAutocompleteProps =\n  | 'clearOnEscape'\n  | 'disableCloseOnSelect'\n  | 'includeInputInList'\n  | 'size'\n  | 'popupIcon'\n  | 'renderInput'\n  | 'renderOption';\n\ntype ComboBoxProps<\n  T,\n  Multiple extends boolean | undefined = undefined,\n  DisableClearable extends boolean | undefined = undefined,\n  FreeSolo extends boolean | undefined = undefined,\n> = Omit<\n  AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>,\n  ExcludedAutocompleteProps\n> & {\n  label: string;\n};\n\n/** @public */\nexport function ComboBox<\n  T extends string,\n  Multiple extends boolean | undefined = undefined,\n  DisableClearable extends boolean | undefined = undefined,\n  FreeSolo extends boolean | undefined = undefined,\n>(props: ComboBoxProps<T, Multiple, DisableClearable, FreeSolo>) {\n  const classes = useComboBoxStyles();\n  const [isOpen, setIsOpen] = useState(false);\n  const [inputValue, setInputValue] = useState('');\n\n  return (\n    <Box className={classes.root} pb={1} pt={1}>\n      <Typography className={classes.label} variant=\"button\" component=\"label\">\n        {props.label}\n      </Typography>\n      <Autocomplete<T, Multiple, DisableClearable, FreeSolo>\n        {...props}\n        open={isOpen && props.options.length > 0}\n        onOpen={() => setIsOpen(true)}\n        onClose={() => setIsOpen(false)}\n        inputValue={inputValue}\n        onInputChange={(_, value) => setInputValue(value)}\n        disableCloseOnSelect={props.multiple}\n        includeInputInList\n        popupIcon={<ExpandMoreIcon data-testid=\"expand-icon\" />}\n        renderInput={params => (\n          <TextField {...params} className={classes.input} variant=\"outlined\" />\n        )}\n        renderOption={(option, { selected }) =>\n          !props.freeSolo ? (\n            <Box className={classes.fullWidth}>\n              <FixedWidthFormControlLabel\n                className={classes.fullWidth}\n                control={\n                  <Checkbox\n                    icon={<CheckBoxOutlineBlankIcon fontSize=\"small\" />}\n                    checkedIcon={<CheckBoxIcon fontSize=\"small\" />}\n                    checked={selected}\n                  />\n                }\n                onClick={event => event.preventDefault()}\n                label={\n                  <Tooltip title={option}>\n                    <Box display=\"flex\" alignItems=\"center\">\n                      <Box className={classes.boxLabel}>\n                        <Typography noWrap>{props.title}</Typography>\n                      </Box>\n                    </Box>\n                  </Tooltip>\n                }\n              />\n            </Box>\n          ) : (\n            option\n          )\n        }\n        size=\"small\"\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/pages/optimizations/components/Filters.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.esm.js","sources":["../../../../src/pages/optimizations/components/Filters.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useBaseFiltersStyles } from '../../../components/filtersStyles';\nimport { ComboBox } from './ComboBox';\n\nconst useFiltersStyles = makeStyles(\n  theme => ({\n    filters: {\n      '& > *': {\n        marginTop: theme.spacing(2),\n      },\n    },\n  }),\n  { name: 'BackstageTableFilters' },\n);\n\nconst filterFieldIds = [\n  'cluster',\n  'project',\n  'workload',\n  'workloadType',\n] as const;\n\n/** @public */\nexport type FiltersProps = {\n  cluster: { label: string; options: string[] };\n  project: { label: string; options: string[] };\n  workload: { label: string; options: string[] };\n  workloadType: { label: string; options: string[] };\n  onFiltersChange: (\n    fieldId: 'cluster' | 'project' | 'workload' | 'workloadType',\n    values: string[],\n  ) => void;\n  onFiltersReset: () => void;\n};\n\n/** @public */\nexport function Filters(props: FiltersProps) {\n  const { onFiltersChange, onFiltersReset, ...filters } = props;\n  const baseClasses = useBaseFiltersStyles();\n  const classes = useFiltersStyles();\n  const [globalKeyId, setGlobalKeyId] = useState(0); // Used for reseting the ComboBoxes internal state\n\n  return (\n    <Box className={baseClasses.root}>\n      <Box className={baseClasses.header}>\n        <Box className={baseClasses.value}>Filters</Box>\n        <Button\n          color=\"primary\"\n          onClick={(_): void => {\n            onFiltersReset();\n            setGlobalKeyId(globalKeyId + 1);\n          }}\n        >\n          Reset\n        </Button>\n      </Box>\n      <Box className={`${baseClasses.filters} ${classes.filters}`}>\n        {filterFieldIds.map(ffid => (\n          <ComboBox\n            multiple\n            freeSolo\n            selectOnFocus\n            clearOnBlur\n            handleHomeEndKeys\n            filterSelectedOptions\n            key={`${ffid}-${globalKeyId}`}\n            label={filters[ffid].label}\n            options={filters[ffid].options}\n            onChange={(_, values): void => {\n              onFiltersChange(ffid, values);\n            }}\n          />\n        ))}\n      </Box>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,gBAAmB,GAAA,UAAA;AAAA,EACvB,CAAU,KAAA,MAAA;AAAA,IACR,OAAS,EAAA;AAAA,MACP,OAAS,EAAA;AAAA,QACP,SAAA,EAAW,KAAM,CAAA,OAAA,CAAQ,CAAC;AAAA;AAC5B;AACF,GACF,CAAA;AAAA,EACA,EAAE,MAAM,uBAAwB;AAClC,CAAA;AAEA,MAAM,cAAiB,GAAA;AAAA,EACrB,SAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAAA;AAgBO,SAAS,QAAQ,KAAqB,EAAA;AAC3C,EAAA,MAAM,EAAE,eAAA,EAAiB,cAAgB,EAAA,GAAG,SAAY,GAAA,KAAA;AACxD,EAAA,MAAM,cAAc,oBAAqB,EAAA;AACzC,EAAA,MAAM,UAAU,gBAAiB,EAAA;AACjC,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,CAAC,CAAA;AAEhD,EAAA,2CACG,GAAI,EAAA,EAAA,SAAA,EAAW,WAAY,CAAA,IAAA,EAAA,sCACzB,GAAI,EAAA,EAAA,SAAA,EAAW,WAAY,CAAA,MAAA,EAAA,sCACzB,GAAI,EAAA,EAAA,SAAA,EAAW,WAAY,CAAA,KAAA,EAAA,EAAO,SAAO,CAC1C,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,CAAC,CAAY,KAAA;AACpB,QAAe,cAAA,EAAA;AACf,QAAA,cAAA,CAAe,cAAc,CAAC,CAAA;AAAA;AAChC,KAAA;AAAA,IACD;AAAA,GAGH,CAAA,kBACC,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,WAAW,CAAG,EAAA,WAAA,CAAY,OAAO,CAAA,CAAA,EAAI,OAAQ,CAAA,OAAO,CACtD,CAAA,EAAA,EAAA,cAAA,CAAe,IAAI,CAClB,IAAA,qBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,QAAQ,EAAA,IAAA;AAAA,MACR,QAAQ,EAAA,IAAA;AAAA,MACR,aAAa,EAAA,IAAA;AAAA,MACb,WAAW,EAAA,IAAA;AAAA,MACX,iBAAiB,EAAA,IAAA;AAAA,MACjB,qBAAqB,EAAA,IAAA;AAAA,MACrB,GAAK,EAAA,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,WAAW,CAAA,CAAA;AAAA,MAC3B,KAAA,EAAO,OAAQ,CAAA,IAAI,CAAE,CAAA,KAAA;AAAA,MACrB,OAAA,EAAS,OAAQ,CAAA,IAAI,CAAE,CAAA,OAAA;AAAA,MACvB,QAAA,EAAU,CAAC,CAAA,EAAG,MAAiB,KAAA;AAC7B,QAAA,eAAA,CAAgB,MAAM,MAAM,CAAA;AAAA;AAC9B;AAAA,GAEH,CACH,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Filters.esm.js","sources":["../../../../src/pages/optimizations/components/Filters.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useState } from 'react';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useBaseFiltersStyles } from '../../../components/filtersStyles';\nimport { ComboBox } from './ComboBox';\n\nconst useFiltersStyles = makeStyles(\n  theme => ({\n    filters: {\n      '& > *': {\n        marginTop: theme.spacing(2),\n      },\n    },\n  }),\n  { name: 'BackstageTableFilters' },\n);\n\nconst filterFieldIds = [\n  'cluster',\n  'project',\n  'workload',\n  'workloadType',\n] as const;\n\n/** @public */\nexport type FiltersProps = {\n  cluster: { label: string; options: string[] };\n  project: { label: string; options: string[] };\n  workload: { label: string; options: string[] };\n  workloadType: { label: string; options: string[] };\n  onFiltersChange: (\n    fieldId: 'cluster' | 'project' | 'workload' | 'workloadType',\n    values: string[],\n  ) => void;\n  onFiltersReset: () => void;\n};\n\n/** @public */\nexport function Filters(props: FiltersProps) {\n  const { onFiltersChange, onFiltersReset, ...filters } = props;\n  const baseClasses = useBaseFiltersStyles();\n  const classes = useFiltersStyles();\n  const [globalKeyId, setGlobalKeyId] = useState(0); // Used for reseting the ComboBoxes internal state\n\n  return (\n    <Box className={baseClasses.root}>\n      <Box className={baseClasses.header}>\n        <Box className={baseClasses.value}>Filters</Box>\n        <Button\n          color=\"primary\"\n          onClick={(_): void => {\n            onFiltersReset();\n            setGlobalKeyId(globalKeyId + 1);\n          }}\n        >\n          Reset\n        </Button>\n      </Box>\n      <Box className={`${baseClasses.filters} ${classes.filters}`}>\n        {filterFieldIds.map(ffid => (\n          <ComboBox\n            multiple\n            freeSolo\n            selectOnFocus\n            clearOnBlur\n            handleHomeEndKeys\n            filterSelectedOptions\n            key={`${ffid}-${globalKeyId}`}\n            label={filters[ffid].label}\n            options={filters[ffid].options}\n            onChange={(_, values): void => {\n              onFiltersChange(ffid, values);\n            }}\n          />\n        ))}\n      </Box>\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,gBAAA,GAAmB,UAAA;AAAA,EACvB,CAAA,KAAA,MAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,OAAA,EAAS;AAAA,QACP,SAAA,EAAW,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA;AAC5B;AACF,GACF,CAAA;AAAA,EACA,EAAE,MAAM,uBAAA;AACV,CAAA;AAEA,MAAM,cAAA,GAAiB;AAAA,EACrB,SAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA;AACF,CAAA;AAgBO,SAAS,QAAQ,KAAA,EAAqB;AAC3C,EAAA,MAAM,EAAE,eAAA,EAAiB,cAAA,EAAgB,GAAG,SAAQ,GAAI,KAAA;AACxD,EAAA,MAAM,cAAc,oBAAA,EAAqB;AACzC,EAAA,MAAM,UAAU,gBAAA,EAAiB;AACjC,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,CAAC,CAAA;AAEhD,EAAA,2CACG,GAAA,EAAA,EAAI,SAAA,EAAW,WAAA,CAAY,IAAA,EAAA,sCACzB,GAAA,EAAA,EAAI,SAAA,EAAW,WAAA,CAAY,MAAA,EAAA,sCACzB,GAAA,EAAA,EAAI,SAAA,EAAW,WAAA,CAAY,KAAA,EAAA,EAAO,SAAO,CAAA,kBAC1C,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,SAAA;AAAA,MACN,OAAA,EAAS,CAAC,CAAA,KAAY;AACpB,QAAA,cAAA,EAAe;AACf,QAAA,cAAA,CAAe,cAAc,CAAC,CAAA;AAAA,MAChC;AAAA,KAAA;AAAA,IACD;AAAA,GAGH,CAAA,kBACA,KAAA,CAAA,aAAA,CAAC,GAAA,EAAA,EAAI,WAAW,CAAA,EAAG,WAAA,CAAY,OAAO,CAAA,CAAA,EAAI,OAAA,CAAQ,OAAO,CAAA,CAAA,EAAA,EACtD,cAAA,CAAe,IAAI,CAAA,IAAA,qBAClB,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAQ,IAAA;AAAA,MACR,QAAA,EAAQ,IAAA;AAAA,MACR,aAAA,EAAa,IAAA;AAAA,MACb,WAAA,EAAW,IAAA;AAAA,MACX,iBAAA,EAAiB,IAAA;AAAA,MACjB,qBAAA,EAAqB,IAAA;AAAA,MACrB,GAAA,EAAK,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,WAAW,CAAA,CAAA;AAAA,MAC3B,KAAA,EAAO,OAAA,CAAQ,IAAI,CAAA,CAAE,KAAA;AAAA,MACrB,OAAA,EAAS,OAAA,CAAQ,IAAI,CAAA,CAAE,OAAA;AAAA,MACvB,QAAA,EAAU,CAAC,CAAA,EAAG,MAAA,KAAiB;AAC7B,QAAA,eAAA,CAAgB,MAAM,MAAM,CAAA;AAAA,MAC9B;AAAA;AAAA,GAEH,CACH,CACF,CAAA;AAEJ;;;;"}

package/dist/pages/optimizations/components/TableToolbar.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableToolbar.esm.js","sources":["../../../../src/pages/optimizations/components/TableToolbar.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { MutableRefObject, useCallback } from 'react';\nimport { MTableToolbar } from '@material-table/core';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst StyledMTableToolbar = withStyles(\n  theme => ({\n    root: {\n      padding: theme.spacing(3, 0, 2.5, 2.5),\n    },\n    title: {\n      '& > h6': {\n        fontWeight: theme.typography.fontWeightBold,\n      },\n    },\n    searchField: {\n      paddingRight: theme.spacing(2),\n    },\n  }),\n  { name: 'ResourceOptimizationTableToolbar' },\n)(MTableToolbar);\n\n/**\n * Props for {@link TableToolbar}.\n *\n * @public\n */\nexport interface TableToolbarProps {\n  toolbarRef: MutableRefObject<any>;\n  setSearch: (value: string) => void;\n  onSearchChanged: (value: string) => void;\n  toggleFilters: () => void;\n  selectedFiltersLength: number;\n  showFiltersButton: boolean;\n}\n\n/**\n * Used to override `@backstage/core-components` Table's toolbar.\n *\n * @remarks\n *\n * The Table's built-in toolbar displays a \"Filters\" button to show or hide the table's filters.\n * This button becomes redundant when the table's initial state is set to\n * `{ filtersOpen: true }` which indicates the filters should always be visible.\n *\n * @public\n */\nexport function TableToolbar(toolbarProps: TableToolbarProps) {\n  const { toolbarRef, onSearchChanged } = toolbarProps;\n  const handleSearchChanged = useCallback(\n    (searchText: string) => {\n      onSearchChanged(searchText);\n    },\n    [onSearchChanged],\n  );\n\n  return (\n    <StyledMTableToolbar\n      {...toolbarProps}\n      ref={toolbarRef}\n      onSearchChanged={handleSearchChanged}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AAoBA,MAAM,mBAAsB,GAAA,UAAA;AAAA,EAC1B,CAAU,KAAA,MAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,SAAS,KAAM,CAAA,OAAA,CAAQ,CAAG,EAAA,CAAA,EAAG,KAAK,GAAG;AAAA,KACvC;AAAA,IACA,KAAO,EAAA;AAAA,MACL,QAAU,EAAA;AAAA,QACR,UAAA,EAAY,MAAM,UAAW,CAAA;AAAA;AAC/B,KACF;AAAA,IACA,WAAa,EAAA;AAAA,MACX,YAAA,EAAc,KAAM,CAAA,OAAA,CAAQ,CAAC;AAAA;AAC/B,GACF,CAAA;AAAA,EACA,EAAE,MAAM,kCAAmC;AAC7C,CAAA,CAAE,aAAa,CAAA;AA2BR,SAAS,aAAa,YAAiC,EAAA;AAC5D,EAAM,MAAA,EAAE,UAAY,EAAA,eAAA,EAAoB,GAAA,YAAA;AACxC,EAAA,MAAM,mBAAsB,GAAA,WAAA;AAAA,IAC1B,CAAC,UAAuB,KAAA;AACtB,MAAA,eAAA,CAAgB,UAAU,CAAA;AAAA,KAC5B;AAAA,IACA,CAAC,eAAe;AAAA,GAClB;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACE,GAAG,YAAA;AAAA,MACJ,GAAK,EAAA,UAAA;AAAA,MACL,eAAiB,EAAA;AAAA;AAAA,GACnB;AAEJ;;;;"}
+{"version":3,"file":"TableToolbar.esm.js","sources":["../../../../src/pages/optimizations/components/TableToolbar.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { MutableRefObject, useCallback } from 'react';\nimport { MTableToolbar } from '@material-table/core';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst StyledMTableToolbar = withStyles(\n  theme => ({\n    root: {\n      padding: theme.spacing(3, 0, 2.5, 2.5),\n    },\n    title: {\n      '& > h6': {\n        fontWeight: theme.typography.fontWeightBold,\n      },\n    },\n    searchField: {\n      paddingRight: theme.spacing(2),\n    },\n  }),\n  { name: 'ResourceOptimizationTableToolbar' },\n)(MTableToolbar);\n\n/**\n * Props for {@link TableToolbar}.\n *\n * @public\n */\nexport interface TableToolbarProps {\n  toolbarRef: MutableRefObject<any>;\n  setSearch: (value: string) => void;\n  onSearchChanged: (value: string) => void;\n  toggleFilters: () => void;\n  selectedFiltersLength: number;\n  showFiltersButton: boolean;\n}\n\n/**\n * Used to override `@backstage/core-components` Table's toolbar.\n *\n * @remarks\n *\n * The Table's built-in toolbar displays a \"Filters\" button to show or hide the table's filters.\n * This button becomes redundant when the table's initial state is set to\n * `{ filtersOpen: true }` which indicates the filters should always be visible.\n *\n * @public\n */\nexport function TableToolbar(toolbarProps: TableToolbarProps) {\n  const { toolbarRef, onSearchChanged } = toolbarProps;\n  const handleSearchChanged = useCallback(\n    (searchText: string) => {\n      onSearchChanged(searchText);\n    },\n    [onSearchChanged],\n  );\n\n  return (\n    <StyledMTableToolbar\n      {...toolbarProps}\n      ref={toolbarRef}\n      onSearchChanged={handleSearchChanged}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AAoBA,MAAM,mBAAA,GAAsB,UAAA;AAAA,EAC1B,CAAA,KAAA,MAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,SAAS,KAAA,CAAM,OAAA,CAAQ,CAAA,EAAG,CAAA,EAAG,KAAK,GAAG;AAAA,KACvC;AAAA,IACA,KAAA,EAAO;AAAA,MACL,QAAA,EAAU;AAAA,QACR,UAAA,EAAY,MAAM,UAAA,CAAW;AAAA;AAC/B,KACF;AAAA,IACA,WAAA,EAAa;AAAA,MACX,YAAA,EAAc,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA;AAC/B,GACF,CAAA;AAAA,EACA,EAAE,MAAM,kCAAA;AACV,CAAA,CAAE,aAAa,CAAA;AA2BR,SAAS,aAAa,YAAA,EAAiC;AAC5D,EAAA,MAAM,EAAE,UAAA,EAAY,eAAA,EAAgB,GAAI,YAAA;AACxC,EAAA,MAAM,mBAAA,GAAsB,WAAA;AAAA,IAC1B,CAAC,UAAA,KAAuB;AACtB,MAAA,eAAA,CAAgB,UAAU,CAAA;AAAA,IAC5B,CAAA;AAAA,IACA,CAAC,eAAe;AAAA,GAClB;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACE,GAAG,YAAA;AAAA,MACJ,GAAA,EAAK,UAAA;AAAA,MACL,eAAA,EAAiB;AAAA;AAAA,GACnB;AAEJ;;;;"}