diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/shared/DropdownSearch.jsx b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/shared/DropdownSearch.jsx
index 5b18124b63..3042762244 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/shared/DropdownSearch.jsx
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/shared/DropdownSearch.jsx
@@ -1,4 +1,4 @@
-import { Autocomplete, Avatar, Icon, TextContainer } from '@shopify/polaris';
+import { Autocomplete, Avatar, Checkbox, Icon, TextContainer } from '@shopify/polaris';
import { SearchMinor, ChevronDownMinor } from '@shopify/polaris-icons';
import React, { useState, useCallback, useEffect } from 'react';
import func from "@/util/func";
@@ -13,6 +13,7 @@ function DropdownSearch(props) {
const [inputValue, setInputValue] = useState(value ? value : undefined);
const [options, setOptions] = useState(deselectedOptions);
const [loading, setLoading] = useState(false);
+ const [checked,setChecked] = useState(false)
useEffect(() => {
@@ -102,6 +103,18 @@ function DropdownSearch(props) {
[options],
);
+ const selectAllFunc = () => {
+ if(!checked){
+ const valueArr = deselectedOptions.map((obj) => obj.value)
+ updateSelection(valueArr)
+ setChecked(true)
+ }else{
+ setChecked(false)
+ updateSelection([])
+ }
+
+ }
+
const textField = (
);
+ const showSelectAll = (allowMultiple && optionsList.length > 5)
+ const checkboxLabel = checked ? "Deselect all" : "Select all"
+
const emptyState = (
@@ -141,6 +157,10 @@ function DropdownSearch(props) {
loading={loading}
textField={textField}
preferredPosition='below'
+ {...(showSelectAll ? {actionBefore:{
+ content:( selectAllFunc()}/>),
+ onAction: () => selectAllFunc(),
+ }} : {})}
/>
);
}