Jmix 2.4 support (#22)

.gitignore

@@ -23,7 +23,7 @@ out/
 
 # The following files are generated/updated by vaadin-gradle-plugin
 node_modules/
-frontend/generated/
+src/main/frontend/generated/
 pnpmfile.js
 vite.generated.ts
 webpack.generated.js

README.md

@@ -24,6 +24,7 @@ The online demo of the Jmix Wind Turbines application is available at <https://d
         + [Annual Inspection](#annual-inspection)
         + [Repair](#repair)
 
+
 ## About the Example
 
 The Jmix Wind Turbines example application demonstrates the mobile capabilities Jmix provides for application developers. Compared to the [Jmix Petclinic](https://github.com/jmix-framework/jmix-petclinic-2) example application, the Wind Turbines application is focuses on a mobile first view of the application.

build.gradle

@@ -1,15 +1,17 @@
 plugins {
-    id 'io.jmix' version '2.3.2'
+    id 'io.jmix' version '2.4.0'
     id 'java'
+    id 'org.jetbrains.gradle.plugin.idea-ext' version '1.1.9'
 }
 
 apply plugin: 'org.springframework.boot'
 apply plugin: 'com.vaadin'
 
 jmix {
-    bomVersion = '2.3.2'
+    bomVersion = '2.4.0'
 }
 
+
 group = 'io.jmix'
 version = '0.0.1-SNAPSHOT'
 
@@ -41,7 +43,7 @@ dependencies {
     implementation 'org.springframework.boot:spring-boot-starter-web'
 
 
-    implementation 'net.datafaker:datafaker:2.2.2'
+    implementation 'net.datafaker:datafaker:2.4.1'
 
     testImplementation('org.springframework.boot:spring-boot-starter-test') {
         exclude group: 'org.junit.vintage', module: 'junit-vintage-engine'
@@ -51,10 +53,21 @@ dependencies {
     implementation 'org.hsqldb:hsqldb'
 }
 
+configurations.implementation {
+    exclude group: 'com.vaadin', module: 'hilla'
+    exclude group: 'com.vaadin', module: 'hilla-dev'
+}
+
 test {
     useJUnitPlatform()
 }
 
+idea {
+    module {
+        excludeDirs.addAll(files '.jmix', 'node_modules', 'src/main/frontend/generated/', 'src/main/bundles')
+    }
+}
+
 vaadin {
     optimizeBundle = false
 }

gradle.properties

@@ -0,0 +1 @@
+hilla.active = false

gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.7-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-bin.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

gradlew

@@ -15,6 +15,8 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 #
+# SPDX-License-Identifier: Apache-2.0
+#
 
 ##############################################################################
 #
@@ -55,7 +57,7 @@
 #       Darwin, MinGW, and NonStop.
 #
 #   (3) This script is generated from the Groovy template
-#       https://github.com/gradle/gradle/blob/HEAD/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
 #       within the Gradle project.
 #
 #       You can find Gradle at https://github.com/gradle/gradle/.
@@ -84,7 +86,8 @@ done
 # shellcheck disable=SC2034
 APP_BASE_NAME=${0##*/}
 # Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
-APP_HOME=$( cd "${APP_HOME:-./}" > /dev/null && pwd -P ) || exit
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
+' "$PWD" ) || exit
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
 MAX_FD=maximum

gradlew.bat

@@ -13,6 +13,8 @@
 @rem See the License for the specific language governing permissions and
 @rem limitations under the License.
 @rem
+@rem SPDX-License-Identifier: Apache-2.0
+@rem
 
 @if "%DEBUG%"=="" @echo off
 @rem ##########################################################################

jmix-studio.xml

@@ -1,5 +1,10 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
+  <component name="IgnoredChangelogIncludeConfig">
+    <datastore-include-infos>
+      <datastore-include-info datastore-name="main" />
+    </datastore-include-infos>
+  </component>
   <component name="JmixDataStoreSettingsManager">
     <moduleSettings>
       <entry key="io.jmix.jmix-windturbines.main">

frontend/index.html → src/main/frontend/index.html

@@ -14,13 +14,11 @@
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <style>
-    /* prevents double scrolling behavior on mobile devices (see https://github.com/jmix-framework/jmix/issues/3469) */
-
     html, body, #outlet {
-      margin: 0;
       height: 100%;
+      width: 100%;
+      margin: 0;
     }
-
     /* prevents pull to refresh situation */
     html {
       overscroll-behavior: none

src/main/frontend/themes/jmix-windturbines/shared/background.css

@@ -0,0 +1,25 @@
+html {
+    background-color: #eee;
+}
+
+/*
+ CSS class that combines and references --lumo-* theme variables.
+ This allows to create aggregation CSS classes in CSS instead of XML / Java code
+
+ See https://vaadin.com/docs/latest/styling/lumo/lumo-style-properties for all
+ Vaadin Lumo style properties
+ */
+.white-card {
+    background-color: var(--lumo-base-color);
+    border-radius: var(--lumo-border-radius-l);
+    box-shadow: var(--lumo-box-shadow-s);
+    padding: 10px;
+}
+
+.light-background {
+    background: linear-gradient(180deg, #EBF2FC 0%, #DBE8FD 100%);
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+    height: 100%;
+    overflow:hidden;
+}

src/main/frontend/themes/jmix-windturbines/shared/buttons.css

@@ -0,0 +1,45 @@
+/*
+ Example of a custom button class as an alternative to Vaadin button predefined styles.
+ See also:
+  - https://vaadin.com/docs/latest/components/button#styles
+ */
+vaadin-button.blue-btn {
+    background: var(--blue-btn-background);
+    box-shadow: 0 1px 2px 0 #1542872E, 0 5px 10px 0 #1542875C;
+    color: white;
+    border-radius: 20px;
+    flex: 1;
+}
+
+/*
+ Vaadin button states can be styled by using the different states via the attribute selector.
+ See also:
+  - Vaadin button states: https://vaadin.com/docs/latest/components/button/styling#states
+  - CSS attribute selector: https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors
+*/
+vaadin-button.blue-btn[disabled] {
+    background:
+            linear-gradient(0deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)),
+            var(--blue-btn-background);
+    box-shadow: none;
+}
+
+vaadin-button.orange-btn {
+    background: var(--orange-btn-background);
+    box-shadow: var(--orange-btn-box-shadow);
+    color: white;
+    border-radius: 20px;
+    flex: 1;
+}
+
+vaadin-button.orange-btn[disabled] {
+    background:
+        linear-gradient(0deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)),
+        var(--orange-btn-background);
+    box-shadow: none;
+}
+
+.jmix-main-view-drawer-toggle, .back-button {
+    color: var(--lumo-base-color) !important;
+    margin-left: -13px;
+}

src/main/frontend/themes/jmix-windturbines/shared/cursor.css

@@ -0,0 +1,3 @@
+.cursor-pointer {
+    cursor: pointer;
+}

src/main/frontend/themes/jmix-windturbines/shared/tabsheet.css

@@ -0,0 +1,29 @@
+/*
+ Example of styling a Jmix / Vaadin component via its shadow DOM parts / states.
+ See also:
+ - https://docs.jmix.io/jmix/flow-ui/themes/styling-ui-components.html
+ - https://vaadin.com/docs/latest/components/tabs/styling#tabsheet
+ */
+jmix-tabsheet.content-tab-sheet::part(tabs-container) {
+    background-color: var(--dark-blue);
+    border-radius: 15px;
+    padding: 5px;
+    margin: 4px 16px 16px;
+    height: 36px;
+}
+
+jmix-tabsheet.content-tab-sheet vaadin-tab {
+    color: var(--lumo-base-color);
+}
+
+jmix-tabsheet.content-tab-sheet vaadin-tab[selected] {
+    background: linear-gradient(180deg, #EBF2FC 0%, #DBE8FD 100%);
+    color: var(--dark-blue);
+    border-radius: 10px;
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
+
+jmix-tabsheet.content-tab-sheet::part(content) {
+    padding: 0 !important;
+}

src/main/frontend/themes/jmix-windturbines/shared/text.css

@@ -0,0 +1,4 @@
+.cut-overflow-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}