{"ast":null,"code":"var __jsx = React.createElement;\nimport { useTranslation } from '~/utils/i18n';\nimport React, { useCallback, useState } from 'react';\nimport Select from '~/components/Select';\nimport AsideDivider from '~/components/AsideDivider';\nimport ChartPage from '~/components/ChartPage';\nimport Checkbox from '~/components/Checkbox';\nimport Content from '~/components/Content';\nimport Field from '~/components/Field';\nimport Preloader from '~/components/Preloader';\nimport RunSelect from '~/components/RunSelect';\nimport RunningToggle from '~/components/RunningToggle';\nimport ScalarChart from '~/components/ScalarsPage/ScalarChart';\nimport SmoothingSlider from '~/components/ScalarsPage/SmoothingSlider';\nimport TagFilter from '~/components/TagFilter';\nimport Title from '~/components/Title';\nimport useSearchValue from '~/hooks/useSearchValue';\nimport useTagFilter from '~/hooks/useTagFilter';\nconst xAxisValues = ['step', 'relative', 'wall'];\nconst toolTipSortingValues = ['default', 'descending', 'ascending', 'nearest'];\n\nconst Scalars = () => {\n  const {\n    t\n  } = useTranslation(['scalars', 'common']);\n  const {\n    0: running,\n    1: setRunning\n  } = useState(true);\n  const {\n    runs,\n    tags,\n    selectedRuns,\n    selectedTags,\n    onChangeRuns,\n    onFilterTags,\n    loadingRuns,\n    loadingTags\n  } = useTagFilter('scalars', running);\n  const debounceTags = useSearchValue(selectedTags);\n  const {\n    0: smoothing,\n    1: setSmoothing\n  } = useState(0.6);\n  const {\n    0: xAxis,\n    1: setXAxis\n  } = useState(xAxisValues[0]);\n\n  const onChangeXAxis = value => setXAxis(value);\n\n  const {\n    0: tooltipSorting,\n    1: setTooltipSorting\n  } = useState(toolTipSortingValues[0]);\n\n  const onChangeTooltipSorting = value => setTooltipSorting(value);\n\n  const {\n    0: ignoreOutliers,\n    1: setIgnoreOutliers\n  } = useState(false);\n\n  const aside = __jsx(\"section\", null, __jsx(RunSelect, {\n    runs: runs,\n    value: selectedRuns,\n    onChange: onChangeRuns\n  }), __jsx(AsideDivider, null), __jsx(SmoothingSlider, {\n    value: smoothing,\n    onChange: setSmoothing\n  }), __jsx(Field, {\n    label: t('x-axis')\n  }, __jsx(Select, {\n    list: xAxisValues.map(value => ({\n      label: t(`x-axis-value.${value}`),\n      value\n    })),\n    value: xAxis,\n    onChange: onChangeXAxis\n  })), __jsx(Field, {\n    label: t('tooltip-sorting')\n  }, __jsx(Select, {\n    list: toolTipSortingValues.map(value => ({\n      label: t(`tooltip-sorting-value.${value}`),\n      value\n    })),\n    value: tooltipSorting,\n    onChange: onChangeTooltipSorting\n  })), __jsx(Field, null, __jsx(Checkbox, {\n    value: ignoreOutliers,\n    onChange: setIgnoreOutliers\n  }, t('ignore-outliers'))), __jsx(RunningToggle, {\n    running: running,\n    onToggle: setRunning\n  }));\n\n  const withChart = useCallback(item => __jsx(ScalarChart, {\n    runs: item.runs,\n    tag: item.label,\n    smoothing: smoothing,\n    xAxis: xAxis,\n    sortingMethod: tooltipSorting,\n    outlier: ignoreOutliers,\n    running: running\n  }), [smoothing, xAxis, tooltipSorting, ignoreOutliers, running]);\n  return __jsx(React.Fragment, null, __jsx(Preloader, {\n    url: \"/runs\"\n  }), __jsx(Preloader, {\n    url: \"/scalars/tags\"\n  }), __jsx(Title, null, t('common:scalars')), __jsx(Content, {\n    aside: aside,\n    loading: loadingRuns\n  }, __jsx(TagFilter, {\n    tags: tags,\n    onChange: onFilterTags\n  }), __jsx(ChartPage, {\n    items: debounceTags,\n    withChart: withChart,\n    loading: loadingRuns || loadingTags\n  })));\n};\n\nScalars.getInitialProps = () => ({\n  namespacesRequired: ['scalars', 'common']\n});\n\nexport default Scalars;","map":null,"metadata":{},"sourceType":"module"}