1 files changed, 40 insertions, 0 deletions

diff --git a/recipes/whatsapp/webview.js b/recipes/whatsapp/webview.js
index 77c4ebb..d0b0cd8 100644
--- a/recipes/whatsapp/webview.js
+++ b/recipes/whatsapp/webview.js
@@ -4,6 +4,45 @@ function _interopRequireDefault(obj) {
   return obj && obj.__esModule ? obj : { default: obj };
 }
 
+function createElement(messageBody, idString) {
+  const messageText = document.createTextNode(messageBody);
+  const message = document.createElement("p");
+  message?.setAttribute("id", idString);
+  message?.setAttribute("class", idString);
+  message?.appendChild(messageText);
+
+  return message;
+}
+
+function addThemeMessage() {
+  const idString = 'ferdium-theme-message';
+  const idStringTitle = 'ferdium-theme-title';
+  const elementExists = document.querySelectorAll(`.${idString}`)[0] || document.querySelectorAll(`.${idStringTitle}`)[0] ? true : false;
+
+  if (!elementExists) {
+    const themePopupDiv = document.querySelectorAll("._2Nr6U")[0];
+
+    // Create Ferdium Warning title element
+    const messageTitleString = 'FERDIUM WARNING!';
+    const messageTitleElement = createElement(messageTitleString, idStringTitle);
+
+    // Create Ferdium Warning message element
+    const messageBody1 = 'To change your Whatsapp Theme, please use the native settings on Ferdium.';
+    const messageBody2 = 'For that, right-click on the Whatsapp Service and click on Enable/Disable Dark mode.';
+    const message1 = createElement(messageBody1, idString);
+    const message2 = createElement(messageBody2, idString);
+
+    // Add messages to Whatsapp Window
+    themePopupDiv?.prepend(message2)
+    themePopupDiv?.prepend(message1)
+    themePopupDiv?.prepend(messageTitleElement)
+
+    // Hide OK Button.
+    document.querySelectorAll("._20C5O")[1]?.setAttribute('style', 'display: none;');
+    document.querySelectorAll("._2Nr6U > form")[0]?.setAttribute('style', 'display: none;');
+  }
+}
+
 module.exports = Ferdium => {
   const getMessages = () => {
     let count = 0;
@@ -48,6 +87,7 @@ module.exports = Ferdium => {
   const loopFunc = () => {
     getMessages();
     getActiveDialogTitle();
+    addThemeMessage();
   };
 
   window.addEventListener('beforeunload', async () => {