feat: added pid filtering searchbox in snapshot download popup

Signed-off-by: SimoneFiorani <[email protected]>
eclipse-kura · Dec 19, 2024 · 241091a · 241091a
1 parent e060bbe
commit 241091a
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 0 deletions.
diff --git a/...ura.web2/src/main/java/org/eclipse/kura/web/client/ui/settings/SnapshotDownloadModal.java b/...ura.web2/src/main/java/org/eclipse/kura/web/client/ui/settings/SnapshotDownloadModal.java
@@ -26,10 +26,12 @@
 import org.gwtbootstrap3.client.ui.CheckBox;
 import org.gwtbootstrap3.client.ui.FormLabel;
 import org.gwtbootstrap3.client.ui.Modal;
+import org.gwtbootstrap3.client.ui.TextBox;
 import org.gwtbootstrap3.client.ui.html.Paragraph;
 
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.event.dom.client.ClickEvent;
+import com.google.gwt.event.dom.client.KeyUpEvent;
 import com.google.gwt.event.shared.HandlerRegistration;
 import com.google.gwt.uibinder.client.UiBinder;
 import com.google.gwt.uibinder.client.UiField;
@@ -51,6 +53,8 @@ interface SnapshotDownloadModalUiBinder extends UiBinder<Widget, SnapshotDownloa
     @UiField
     Paragraph formatModalHint;
     @UiField
+    TextBox pidSearch;
+    @UiField
     ScrollPanel pidSelectionScrollPanel;
     @UiField
     Anchor selectOrRemoveAllAnchor;
@@ -76,6 +80,7 @@ public SnapshotDownloadModal() {
 
         initWidget(uiBinder.createAndBindUi(this));
 
+        this.pidSearch.setVisible(false);
         this.pidSelectionScrollPanel.setVisible(false);
         this.selectOrRemoveAllAnchor.setVisible(false);
         this.noPidSelectedError.setVisible(false);
@@ -97,6 +102,7 @@ public void show(Consumer<SnapshotDownloadOptions> consumer, List<String> availa
         this.noPidSelectedError.setVisible(false);
         this.modal.setTitle(MSGS.deviceSnapshotDownloadModalTitle());
         this.downloadModalDescription.setText(MSGS.deviceSnapshotDownloadModalHint());
+        initPidSearch();
         initSnapshotPidList(availablePids);
         initSnapshotSelectAllAnchor();
         initSnapshotScrollPanel();
@@ -108,6 +114,12 @@ public void show(Consumer<SnapshotDownloadOptions> consumer, List<String> availa
      * Snapshot Download Inits
      */
 
+    private void initPidSearch() {
+        this.pidSearch.clear();
+        this.pidSearch.setVisible(true);
+        this.pidSearch.addKeyUpHandler(this::onSearchBoxEvent);
+    }
+
     private void initSnapshotPidList(List<String> snapshotConfigs) {
 
         this.pidPanel.clear();
@@ -183,6 +195,20 @@ private void initWiregraphDownloadButtons() {
      * Utils
      */
 
+    private void onSearchBoxEvent(KeyUpEvent event) {
+        TextBox searchBox = (TextBox) event.getSource();
+        String searchedPid = searchBox.getValue();
+
+        if (searchedPid == null || searchedPid.isEmpty() || searchedPid.equals("")) {
+            this.pidPanel.iterator().forEachRemaining(widget -> widget.setVisible(true));
+        } else {
+            this.pidPanel.iterator().forEachRemaining(widget -> {
+                CheckBox box = (CheckBox) widget;
+                box.setVisible(box.getText().toLowerCase().contains(searchedPid.toLowerCase()));
+            });
+        }
+    }
+
     private void onCheckboxClick(ClickEvent handler) {
         if (noPidSelectedError.isVisible()) {
             noPidSelectedError.setVisible(false);

diff --git a/...a.web2/src/main/java/org/eclipse/kura/web/client/ui/settings/SnapshotDownloadModal.ui.xml b/...a.web2/src/main/java/org/eclipse/kura/web/client/ui/settings/SnapshotDownloadModal.ui.xml
@@ -29,6 +29,12 @@
 	        font-size: 0.35cm;
 	        font-weight: normal;
 	    }
+	    .small-spacing {
+		  	padding-bottom: 10px;
+		}
+		.big-spacing {
+		  	padding-bottom: 20px;
+		}
 	</ui:style>
 
     <b:Modal closable="false" fade="true" dataBackdrop="STATIC" ui:field="modal">
@@ -38,6 +44,10 @@
                         <b:FormGroup>
                             <b.html:Paragraph ui:field="downloadModalDescription" />
                             <b.html:Paragraph ui:field="formatModalHint" text="{msgs.formatDownloadHint}" />
+                            <g:Label addStyleNames="{style.small-spacing}"/>
+                            <b:TextBox placeholder="{msgs.snapshotDownloadSearchBoxPlaceholder}"
+								ui:field="pidSearch" addStyleNames="services-search" />
+							<g:Label addStyleNames="{style.big-spacing}"/>
                             <g:ScrollPanel ui:field="pidSelectionScrollPanel"></g:ScrollPanel>
                             <b:FormLabel addStyleNames="{style.channel-name-validation-label}" ui:field="noPidSelectedError" text="{msgs.downloadSnapshotError}" />
                         </b:FormGroup>

diff --git a/...pse.kura.web2/src/main/resources/org/eclipse/kura/web/client/messages/Messages.properties b/...pse.kura.web2/src/main/resources/org/eclipse/kura/web/client/messages/Messages.properties
@@ -317,6 +317,7 @@ downloadSnapshotJsonButton=Download as JSON
 downloadSnapshotError=Please select at least one pid from the list
 selectAllAnchorText=Select All Pids
 removeAllAnchorText=Remove All Pids
+snapshotDownloadSearchBoxPlaceholder=Filter pids by name...
 
 netIntro=Select a Network Interface and configure it. DHCP Server and NAT can be configured only for interfaces enabled for LAN usage. When applying your changes, your connection to the gateway may be lost depending on your network configuration changes.  
 netInterfaceName=Interface Name