diff --git a/src-docs/src/views/filter_group/filter_group_multi.js b/src-docs/src/views/filter_group/filter_group_multi.js
index 702a989713c8..196493bf3c2d 100644
--- a/src-docs/src/views/filter_group/filter_group_multi.js
+++ b/src-docs/src/views/filter_group/filter_group_multi.js
@@ -23,7 +23,7 @@ export default () => {
setIsPopoverOpen(false);
};
- const items = [
+ const [items, setItems] = useState([
{ name: 'Johann Sebastian Bach', checked: 'on' },
{ name: 'Wolfgang Amadeus Mozart', checked: 'on' },
{ name: 'Antonín Dvořák', checked: 'off' },
@@ -43,7 +43,30 @@ export default () => {
{ name: 'Robert Schumann' },
{ name: 'Sergej S. Prokofiew' },
{ name: 'Wolfgang Amadeus Mozart' },
- ];
+ ]);
+
+ function updateItem(index) {
+ if (!items[index]) {
+ return;
+ }
+
+ const newItems = [...items];
+
+ switch (newItems[index].checked) {
+ case 'on':
+ newItems[index].checked = 'off';
+ break;
+
+ case 'off':
+ newItems[index].checked = undefined;
+ break;
+
+ default:
+ newItems[index].checked = 'on';
+ }
+
+ setItems(newItems);
+ }
const button = (