Merge pull request #3 from xdev-software/refactor-v2

Refactor v2

Author: AB-xdev

CHANGELOG.md

@@ -1,2 +1,14 @@
+# 2.0.0
+_Reworked component_
+
+* New customizable UI, including
+  * nested filters (AND, OR, NOT)
+    * depth can be limited
+  * customizable operations (=,>,<,contains,is empty)
+  * support for multiple value types
+    * can easily be bound with Vaadin components
+* Improved support for QueryParameters
+* Better translation support
+
 # 1.0.0
 _Initial release_

README.md

@@ -6,10 +6,45 @@
 
 # vaadin-grid-filter
 
-A Vaadin Flow component for filtering Grids.
+A customizable Vaadin Flow component for filtering Grids.
 
 ![demo](assets/demo.png)
 
+## Features
+* Customizable and dynamic filter UI
+  * Most common filters, operations and value types are supported out of the box
+  * Nested filters (AND, OR, NOT)
+    * depth can be limited
+  * customizable operations (=,>,<,contains,is empty)
+  * support for multiple value types
+    * can easily be bound with Vaadin components
+* Query parameter support
+* Support for custom translations
+
+> [!NOTE]
+> If you are looking for a simpler component you may check out our [simple-grid-filter](https://github.com/xdev-software/vaadin-simple-grid-filter).
+
+## Usage
+
+Here is a very simple example how the GridFilter can be used:
+```java
+Grid<Person> grid = createGrid();
+
+GridFilter<Person> filter = GridFilter.createDefault(grid)
+  .withFilterableField("ID", Person::id, Integer.class)
+  .withFilterableField("First Name", Person::firstName, String.class);
+
+this.add(filter, grid);
+```
+
+To get started further it's recommended to have a look at the [demo](./vaadin-grid-filter-demo).<br/>
+A description how to get it running can be found [below](#run-the-demo).
+
+> [!IMPORTANT]
+> This component is designed for "in memory" filtering of small to medium sized amounts of data.
+
+> [!NOTE]
+> Filtering multiple thousand items with complex filtering conditions can drastically impact performance and make the UI unresponsive!<br/> In these cases it's recommended to use backend filtering solutions like database queries or search engines like [ElasticSearch](https://en.wikipedia.org/wiki/Elasticsearch) in combination with a customized UI search framework. If you need help in implementing these feel free to [contact us](https://xdev.software/en/services/support).
 
 ## Installation
 [Installation guide for the latest release](https://github.com/xdev-software/vaadin-grid-filter/releases/latest#Installation)

assets/demo.avif

@@ -6,7 +6,7 @@
 
 	<groupId>software.xdev</groupId>
 	<artifactId>vaadin-grid-filter-root</artifactId>
-	<version>1.0.2-SNAPSHOT</version>
+	<version>2.0.0-SNAPSHOT</version>
 	<packaging>pom</packaging>
 
 	<organization>

assets/demo.png

@@ -7,11 +7,11 @@
 	<parent>
 		<groupId>software.xdev</groupId>
 		<artifactId>vaadin-grid-filter-root</artifactId>
-		<version>1.0.2-SNAPSHOT</version>
+		<version>2.0.0-SNAPSHOT</version>
 	</parent>
 
 	<artifactId>vaadin-grid-filter-demo</artifactId>
-	<version>1.0.2-SNAPSHOT</version>
+	<version>2.0.0-SNAPSHOT</version>
 	<packaging>jar</packaging>
 
 	<organization>

pom.xml

@@ -0,0 +1,81 @@
+package software.xdev.vaadin.gridfilter;
+
+import java.util.List;
+
+import com.vaadin.flow.component.AttachEvent;
+import com.vaadin.flow.component.Composite;
+import com.vaadin.flow.component.grid.Grid;
+import com.vaadin.flow.component.grid.GridVariant;
+import com.vaadin.flow.component.html.Anchor;
+import com.vaadin.flow.component.html.Span;
+import com.vaadin.flow.component.orderedlayout.VerticalLayout;
+import com.vaadin.flow.data.renderer.ComponentRenderer;
+import com.vaadin.flow.router.PageTitle;
+import com.vaadin.flow.router.Route;
+
+import software.xdev.vaadin.gridfilter.demo.LocalizationDemo;
+import software.xdev.vaadin.gridfilter.demo.MaxNestedDepthDemo;
+import software.xdev.vaadin.gridfilter.demo.MinimalisticDemo;
+import software.xdev.vaadin.gridfilter.demo.QueryParameterDemo;
+
+
+@PageTitle("Grid Filter demos")
+@Route("")
+public class DemoView extends Composite<VerticalLayout>
+{
+	private final Grid<Example> grExamples = new Grid<>();
+	
+	public DemoView()
+	{
+		this.grExamples
+			.addColumn(new ComponentRenderer<>(example -> {
+				final Anchor anchor = new Anchor(example.route(), example.name());
+				
+				final Span spDesc = new Span(example.desc());
+				spDesc.getStyle().set("font-size", "90%");
+				spDesc.getStyle().set("white-space", "pre");
+				
+				final VerticalLayout vl = new VerticalLayout(anchor, spDesc);
+				vl.setSpacing(false);
+				return vl;
+			}))
+			.setHeader("Available demos");
+		
+		this.grExamples.setSizeFull();
+		this.grExamples.addThemeVariants(GridVariant.LUMO_COMPACT, GridVariant.LUMO_NO_BORDER);
+		
+		this.getContent().add(this.grExamples);
+		this.getContent().setHeightFull();
+	}
+	
+	@Override
+	protected void onAttach(final AttachEvent attachEvent)
+	{
+		this.grExamples.setItems(List.of(
+			new Example(
+				MinimalisticDemo.NAV,
+				"Minimalistic",
+				"Showcasing the simplest form of using the component"
+			),
+			new Example(
+				QueryParameterDemo.NAV,
+				"Store filters in QueryParameter",
+				"Shows how filters can be persisted in and loaded from QueryParameters/Url"
+			),
+			new Example(
+				MaxNestedDepthDemo.NAV,
+				"Limit depth/nesting of filters",
+				"Limits the how many filters can be nested"
+			),
+			new Example(
+				LocalizationDemo.NAV,
+				"Localization",
+				"Showcases how localization can be done (UI in German)"
+			)
+		));
+	}
+	
+	record Example(String route, String name, String desc)
+	{
+	}
+}

vaadin-grid-filter-demo/pom.xml

@@ -0,0 +1,33 @@
+package software.xdev.vaadin.gridfilter.demo;
+
+import java.time.LocalDate;
+
+import com.vaadin.flow.component.AttachEvent;
+import com.vaadin.flow.component.grid.Grid;
+import com.vaadin.flow.component.orderedlayout.VerticalLayout;
+
+import software.xdev.vaadin.gridfilter.GridFilter;
+import software.xdev.vaadin.gridfilter.model.Department;
+import software.xdev.vaadin.gridfilter.model.Person;
+
+
+public class AbstractDemo extends VerticalLayout
+{
+	protected final Grid<Person> grid = new Grid<>(Person.class, true);
+	
+	protected GridFilter<Person> createDefaultFilter()
+	{
+		return GridFilter.createDefault(this.grid)
+			.withFilterableField("ID", Person::id, Integer.class)
+			.withFilterableField("First Name", Person::firstName, String.class)
+			.withFilterableField("Birthday", Person::birthday, LocalDate.class)
+			.withFilterableField("Married", Person::married, Boolean.class)
+			.withFilterableField("Department", Person::department, Department.class);
+	}
+	
+	@Override
+	protected void onAttach(final AttachEvent attachEvent)
+	{
+		this.grid.setItems(Person.list());
+	}
+}

vaadin-grid-filter-demo/src/main/java/software/xdev/vaadin/gridfilter/DemoView.java

@@ -0,0 +1,31 @@
+package software.xdev.vaadin.gridfilter.demo;
+
+import com.vaadin.flow.router.Route;
+
+import software.xdev.vaadin.gridfilter.GridFilter;
+import software.xdev.vaadin.gridfilter.GridFilterLocalizationConfig;
+import software.xdev.vaadin.gridfilter.model.Person;
+
+
+@Route(LocalizationDemo.NAV)
+public class LocalizationDemo extends AbstractDemo
+{
+	public static final String NAV = "/localization";
+	
+	public LocalizationDemo()
+	{
+		final GridFilter<Person> filter = this.createDefaultFilter()
+			.withLocalizationConfig(new GridFilterLocalizationConfig()
+				.with(GridFilterLocalizationConfig.BLOCK_AND, "UND")
+				.with(GridFilterLocalizationConfig.BLOCK_OR, "ODER")
+				.with(GridFilterLocalizationConfig.BLOCK_NOT, "NICHT")
+				.with(GridFilterLocalizationConfig.OP_CONTAINS, "enthält")
+				.with(GridFilterLocalizationConfig.OP_GREATER_THAN, "größer als")
+				.with(GridFilterLocalizationConfig.OP_LESS_THAN, "kleiner als")
+				.with(GridFilterLocalizationConfig.OP_EQUALS, "ist gleich")
+				.with(GridFilterLocalizationConfig.OP_IS_EMPTY, "ist leer")
+				.with(GridFilterLocalizationConfig.CONDITION, "Bedingung"));
+		
+		this.add(filter, this.grid);
+	}
+}

vaadin-grid-filter-demo/src/main/java/software/xdev/vaadin/gridfilter/demo/AbstractDemo.java

@@ -0,0 +1,21 @@
+package software.xdev.vaadin.gridfilter.demo;
+
+import com.vaadin.flow.router.Route;
+
+import software.xdev.vaadin.gridfilter.GridFilter;
+import software.xdev.vaadin.gridfilter.model.Person;
+
+
+@Route(MaxNestedDepthDemo.NAV)
+public class MaxNestedDepthDemo extends AbstractDemo
+{
+	public static final String NAV = "/maxNestedDepth";
+	
+	public MaxNestedDepthDemo()
+	{
+		final GridFilter<Person> filter = this.createDefaultFilter()
+			.withMaxNestedDepth(1);
+		
+		this.add(filter, this.grid);
+	}
+}