From 4f4598934afe1e821e20cbfc16c73e8e4b49b082 Mon Sep 17 00:00:00 2001
From: Javier Godoy <11554739+javier-godoy@users.noreply.github.com>
Date: Mon, 23 Dec 2024 14:37:48 -0300
Subject: [PATCH] fix(demo): improve dark theme support in demos

---
 pom.xml                                       |  2 +-
 .../ExtendedLoginOverlayDemo.java             | 19 ++++++++++++++-----
 .../addons/extendedlogin/LoginLayoutDemo.java | 19 ++++++++++++++-----
 3 files changed, 29 insertions(+), 11 deletions(-)

diff --git a/pom.xml b/pom.xml
index 5a0012b..8407223 100644
--- a/pom.xml
+++ b/pom.xml
@@ -18,7 +18,7 @@
 		<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
 		<drivers.dir>${project.basedir}/drivers</drivers.dir>
 		<jetty.version>11.0.12</jetty.version>
-		<flowingcode.commons.demo.version>4.0.0</flowingcode.commons.demo.version>
+		<flowingcode.commons.demo.version>4.2.0-SNAPSHOT</flowingcode.commons.demo.version>
 		<frontend.hotdeploy>true</frontend.hotdeploy>
 	</properties>
 
diff --git a/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/ExtendedLoginOverlayDemo.java b/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/ExtendedLoginOverlayDemo.java
index 4541068..7b4b3f6 100644
--- a/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/ExtendedLoginOverlayDemo.java
+++ b/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/ExtendedLoginOverlayDemo.java
@@ -7,9 +7,9 @@
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *      http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
@@ -20,7 +20,7 @@
 package com.flowingcode.vaadin.addons.extendedlogin;
 
 import com.flowingcode.vaadin.addons.demo.DemoSource;
-import com.vaadin.flow.component.dependency.CssImport;
+import com.flowingcode.vaadin.addons.demo.ThemeChangeObserver;
 import com.vaadin.flow.component.html.Div;
 import com.vaadin.flow.component.html.IFrame;
 import com.vaadin.flow.router.PageTitle;
@@ -31,13 +31,22 @@
 @PageTitle("Extended Login Overlay Demo")
 @SuppressWarnings("serial")
 @Route(value = "extended-login/login-overlay-demo", layout = ExtendedLoginDemoView.class)
-public class ExtendedLoginOverlayDemo extends Div {
+public class ExtendedLoginOverlayDemo extends Div implements ThemeChangeObserver {
+
+  private final IFrame iframe;
 
   public ExtendedLoginOverlayDemo() {
     setClassName("wrap-iframe");
-    IFrame iframe = new IFrame("/extended-login/login-overlay");
+    iframe = new IFrame("/extended-login/login-overlay");
     iframe.setSizeFull();
     iframe.getElement().setAttribute("frameBorder", "0");
     add(iframe);
   }
+
+  @Override
+  public void onThemeChange(String themeName) {
+    iframe.getElement().executeJs(
+        "this.contentWindow.document.querySelector('html').setAttribute('theme', $0)", themeName);
+  }
+
 }
diff --git a/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/LoginLayoutDemo.java b/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/LoginLayoutDemo.java
index 9343bf8..08ef89d 100644
--- a/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/LoginLayoutDemo.java
+++ b/src/test/java/com/flowingcode/vaadin/addons/extendedlogin/LoginLayoutDemo.java
@@ -7,9 +7,9 @@
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *      http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
@@ -20,7 +20,7 @@
 package com.flowingcode.vaadin.addons.extendedlogin;
 
 import com.flowingcode.vaadin.addons.demo.DemoSource;
-import com.vaadin.flow.component.dependency.CssImport;
+import com.flowingcode.vaadin.addons.demo.ThemeChangeObserver;
 import com.vaadin.flow.component.html.Div;
 import com.vaadin.flow.component.html.IFrame;
 import com.vaadin.flow.router.PageTitle;
@@ -31,14 +31,23 @@
 @PageTitle("Login Layout Demo")
 @SuppressWarnings("serial")
 @Route(value = "extended-login/login-layout-demo", layout = ExtendedLoginDemoView.class)
-public class LoginLayoutDemo extends Div {
+public class LoginLayoutDemo extends Div implements ThemeChangeObserver {
+
+  private IFrame iframe;
 
   public LoginLayoutDemo() {
     setClassName("wrap-iframe");
-    IFrame iframe = new IFrame("/extended-login/login-layout");
+    iframe = new IFrame("/extended-login/login-layout");
     iframe.setClassName("frame");
     iframe.setSizeFull();
     iframe.getElement().setAttribute("frameBorder", "0");
     add(iframe);
   }
+
+  @Override
+  public void onThemeChange(String themeName) {
+    iframe.getElement().executeJs(
+        "this.contentWindow.document.querySelector('html').setAttribute('theme', $0)", themeName);
+  }
+
 }