diff --git a/package.json b/package.json index 709028f9..1576ac6c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@netdata/netdata-ui", - "version": "4.8.2", + "version": "4.8.3", "description": "netdata UI kit", "main": "dist/index.js", "module": "dist/es6/index.js", diff --git a/src/components/table/body/header/filter/dropdown.js b/src/components/table/body/header/filter/dropdown.js index efa35e95..a75d9fdb 100644 --- a/src/components/table/body/header/filter/dropdown.js +++ b/src/components/table/body/header/filter/dropdown.js @@ -16,9 +16,7 @@ const DropdownFilter = ({ isMulti={isMulti} options={options} value={value} - onChange={option => { - onChange(option) - }} + onChange={onChange} styles={{ size: "tiny", ...(styles || {}) }} /> ) diff --git a/src/components/table/body/header/filter/select.js b/src/components/table/body/header/filter/select.js index 35c9f2a0..f06c3592 100644 --- a/src/components/table/body/header/filter/select.js +++ b/src/components/table/body/header/filter/select.js @@ -1,4 +1,4 @@ -import React from "react" +import React, { useState, useCallback } from "react" import DropdownFilter from "./dropdown" const all = { value: "all", label: "All" } @@ -9,13 +9,22 @@ const SelectFilter = ({ column, isMulti = false, options = [], tiny = true, ...r const optionsWithExtraChoice = isMulti ? options : [all, ...options] const selectedValue = isMulti ? filterValue : optionsWithExtraChoice[0] + const [val, setVal] = useState(filterValue ? filterValue : selectedValue) + + const onChange = useCallback( + value => { + setFilterValue(value) + setVal(value) + }, + [setVal] + ) return ( setFilterValue(value)} + onChange={onChange} styles={tiny && { size: "tiny" }} {...rest} />