From 9fa230ea206712b90f39c4ed57f2b6b48731f78b Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Fri, 6 Sep 2024 09:14:19 +0200
Subject: [PATCH 1/7] feat: replace the input password and add fa-eye

---
 my_compassion/templates/signup.xml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/my_compassion/templates/signup.xml b/my_compassion/templates/signup.xml
index 1d9a6a0..976a766 100644
--- a/my_compassion/templates/signup.xml
+++ b/my_compassion/templates/signup.xml
@@ -30,6 +30,12 @@
                         <t t-call="website_legal_page.acceptance_full" />
                     </label>
         </xpath>
+        <xpath expr="//input[@name='password']" position="replace">
+            <div class="position-relative">
+                <input type="password" name="password" id="password" class="form-control form-control-sm pr-5" required="required"/>
+                <i class="fa fa-eye position-absolute" id="eye_password" style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"/>
+            </div>
+        </xpath>
     </template>
 
 </odoo>

From 7d9a51ec2004704b33a8c70a3213a201d3d7ced2 Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Fri, 6 Sep 2024 09:14:36 +0200
Subject: [PATCH 2/7] feat: replace the input confirm_password and add fa-eye

---
 my_compassion/templates/signup.xml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/my_compassion/templates/signup.xml b/my_compassion/templates/signup.xml
index 976a766..fa8ca7d 100644
--- a/my_compassion/templates/signup.xml
+++ b/my_compassion/templates/signup.xml
@@ -36,6 +36,12 @@
                 <i class="fa fa-eye position-absolute" id="eye_password" style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"/>
             </div>
         </xpath>
+        <xpath expr="//input[@name='confirm_password']" position="replace">
+            <div class="position-relative">
+                <input type="password" name="confirm_password" id="confirm_password" class="form-control form-control-sm pr-5" required="required"/>
+                <i class="fa fa-eye position-absolute" id="eye_confirm_password" style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"/>
+            </div>
+        </xpath>
     </template>
 
 </odoo>

From a5deb6269cdcbcd55aee662cb4d2d0ec687e34d4 Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Fri, 6 Sep 2024 14:54:06 +0200
Subject: [PATCH 3/7] feat: create and add js file

---
 my_compassion/static/src/js/show_password.js | 30 ++++++++++++++++++++
 my_compassion/templates/signup.xml           |  4 ++-
 2 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 my_compassion/static/src/js/show_password.js

diff --git a/my_compassion/static/src/js/show_password.js b/my_compassion/static/src/js/show_password.js
new file mode 100644
index 0000000..423f3b3
--- /dev/null
+++ b/my_compassion/static/src/js/show_password.js
@@ -0,0 +1,30 @@
+document.addEventListener("DOMContentLoaded", function (event) {
+
+    odoo.define('my_compassion.show_password', function (require) {
+        'use strict';
+
+        var publicWidget = require('web.public.widget');
+
+        publicWidget.registry.show_password = publicWidget.Widget.extend({
+            selector: '#eye_password',
+            events: {
+                'click': '_onClick',
+            },
+
+            _onClick: function (ev) {
+                console.log("Show password clicked");
+                // ev.preventDefault();
+                // var $icon = $(ev.currentTarget);
+                // var $input = $icon.siblings('input');
+                // var type = $input.attr('type');
+                // if (type === 'password') {
+                //     $input.attr('type', 'text');
+                //     $icon.removeClass('fa-eye').addClass('fa-eye-slash');
+                // } else {
+                //     $input.attr('type', 'password');
+                //     $icon.removeClass('fa-eye-slash').addClass('fa-eye');
+                // }
+            },
+        });
+    });
+});
diff --git a/my_compassion/templates/signup.xml b/my_compassion/templates/signup.xml
index fa8ca7d..be2c29d 100644
--- a/my_compassion/templates/signup.xml
+++ b/my_compassion/templates/signup.xml
@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <odoo>
-
     <template id="signup_sponsor" inherit_id="auth_signup.fields">
         <xpath expr="//div[@class='form-group field-name']" position="after">
             <div class="form-group field-name">
@@ -42,6 +41,9 @@
                 <i class="fa fa-eye position-absolute" id="eye_confirm_password" style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"/>
             </div>
         </xpath>
+         <xpath expr="." position="inside">
+            <script type="text/javascript" src="/my_compassion/static/src/js/show_password.js"/>
+        </xpath>
     </template>
 
 </odoo>

From c0d45c4bae2336da80b57c08bd99f988d9e4741f Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Thu, 12 Sep 2024 11:45:56 +0200
Subject: [PATCH 4/7] feat: Finalize JavaScript file for password visibility
 toggle on sign up

---
 my_compassion/static/src/js/show_password.js | 47 +++++++++++---------
 1 file changed, 25 insertions(+), 22 deletions(-)

diff --git a/my_compassion/static/src/js/show_password.js b/my_compassion/static/src/js/show_password.js
index 423f3b3..a077919 100644
--- a/my_compassion/static/src/js/show_password.js
+++ b/my_compassion/static/src/js/show_password.js
@@ -1,30 +1,33 @@
 document.addEventListener("DOMContentLoaded", function (event) {
 
     odoo.define('my_compassion.show_password', function (require) {
-        'use strict';
+    'use strict';
 
-        var publicWidget = require('web.public.widget');
+        function togglePasswordVisibility(inputId, icon) {
+            const input = document.getElementById(inputId);
+            if (input) {
+                if (input.type === "password") {
+                    input.type = "text";
+                    icon.classList.add("fa-eye-slash");
+                    icon.classList.remove("fa-eye");
+                } else {
+                    input.type = "password";
+                    icon.classList.add("fa-eye");
+                    icon.classList.remove("fa-eye-slash");
+                }
+            }
+        }
 
-        publicWidget.registry.show_password = publicWidget.Widget.extend({
-            selector: '#eye_password',
-            events: {
-                'click': '_onClick',
-            },
+        function addPasswordToggleListener(eyeId, inputId) {
+            const eyeIcon = document.getElementById(eyeId);
+            if (eyeIcon) {
+                eyeIcon.addEventListener("click", function () {
+                    togglePasswordVisibility(inputId, eyeIcon);
+                });
+            }
+        }
 
-            _onClick: function (ev) {
-                console.log("Show password clicked");
-                // ev.preventDefault();
-                // var $icon = $(ev.currentTarget);
-                // var $input = $icon.siblings('input');
-                // var type = $input.attr('type');
-                // if (type === 'password') {
-                //     $input.attr('type', 'text');
-                //     $icon.removeClass('fa-eye').addClass('fa-eye-slash');
-                // } else {
-                //     $input.attr('type', 'password');
-                //     $icon.removeClass('fa-eye-slash').addClass('fa-eye');
-                // }
-            },
-        });
+        addPasswordToggleListener("eye_password", "password");
+        addPasswordToggleListener("eye_confirm_password", "confirm_password");
     });
 });

From 78531af76c4947630814ea5c6ee8bd5363105a3b Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Wed, 18 Sep 2024 09:25:45 +0200
Subject: [PATCH 5/7] fix: fix indentation with pre-commit in show_password.js

---
 my_compassion/static/src/js/show_password.js | 53 ++++++++++----------
 1 file changed, 26 insertions(+), 27 deletions(-)

diff --git a/my_compassion/static/src/js/show_password.js b/my_compassion/static/src/js/show_password.js
index a077919..ff13f04 100644
--- a/my_compassion/static/src/js/show_password.js
+++ b/my_compassion/static/src/js/show_password.js
@@ -1,33 +1,32 @@
 document.addEventListener("DOMContentLoaded", function (event) {
+  odoo.define("my_compassion.show_password", function (require) {
+    "use strict";
 
-    odoo.define('my_compassion.show_password', function (require) {
-    'use strict';
-
-        function togglePasswordVisibility(inputId, icon) {
-            const input = document.getElementById(inputId);
-            if (input) {
-                if (input.type === "password") {
-                    input.type = "text";
-                    icon.classList.add("fa-eye-slash");
-                    icon.classList.remove("fa-eye");
-                } else {
-                    input.type = "password";
-                    icon.classList.add("fa-eye");
-                    icon.classList.remove("fa-eye-slash");
-                }
-            }
+    function togglePasswordVisibility(inputId, icon) {
+      const input = document.getElementById(inputId);
+      if (input) {
+        if (input.type === "password") {
+          input.type = "text";
+          icon.classList.add("fa-eye-slash");
+          icon.classList.remove("fa-eye");
+        } else {
+          input.type = "password";
+          icon.classList.add("fa-eye");
+          icon.classList.remove("fa-eye-slash");
         }
+      }
+    }
 
-        function addPasswordToggleListener(eyeId, inputId) {
-            const eyeIcon = document.getElementById(eyeId);
-            if (eyeIcon) {
-                eyeIcon.addEventListener("click", function () {
-                    togglePasswordVisibility(inputId, eyeIcon);
-                });
-            }
-        }
+    function addPasswordToggleListener(eyeId, inputId) {
+      const eyeIcon = document.getElementById(eyeId);
+      if (eyeIcon) {
+        eyeIcon.addEventListener("click", function () {
+          togglePasswordVisibility(inputId, eyeIcon);
+        });
+      }
+    }
 
-        addPasswordToggleListener("eye_password", "password");
-        addPasswordToggleListener("eye_confirm_password", "confirm_password");
-    });
+    addPasswordToggleListener("eye_password", "password");
+    addPasswordToggleListener("eye_confirm_password", "confirm_password");
+  });
 });

From 835e9f4d3217697b05734b6dc53b36d41d851d81 Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Wed, 18 Sep 2024 09:33:34 +0200
Subject: [PATCH 6/7] fix: fix indentation with pre-commit in signup.xml

---
 my_compassion/templates/signup.xml | 33 +++++++++++++++++++++++++-----
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/my_compassion/templates/signup.xml b/my_compassion/templates/signup.xml
index be2c29d..af5eda0 100644
--- a/my_compassion/templates/signup.xml
+++ b/my_compassion/templates/signup.xml
@@ -31,18 +31,41 @@
         </xpath>
         <xpath expr="//input[@name='password']" position="replace">
             <div class="position-relative">
-                <input type="password" name="password" id="password" class="form-control form-control-sm pr-5" required="required"/>
-                <i class="fa fa-eye position-absolute" id="eye_password" style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"/>
+                <input
+          type="password"
+          name="password"
+          id="password"
+          class="form-control form-control-sm pr-5"
+          required="required"
+        />
+                <i
+          class="fa fa-eye position-absolute"
+          id="eye_password"
+          style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"
+        />
             </div>
         </xpath>
         <xpath expr="//input[@name='confirm_password']" position="replace">
             <div class="position-relative">
-                <input type="password" name="confirm_password" id="confirm_password" class="form-control form-control-sm pr-5" required="required"/>
-                <i class="fa fa-eye position-absolute" id="eye_confirm_password" style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"/>
+                <input
+          type="password"
+          name="confirm_password"
+          id="confirm_password"
+          class="form-control form-control-sm pr-5"
+          required="required"
+        />
+                <i
+          class="fa fa-eye position-absolute"
+          id="eye_confirm_password"
+          style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"
+        />
             </div>
         </xpath>
          <xpath expr="." position="inside">
-            <script type="text/javascript" src="/my_compassion/static/src/js/show_password.js"/>
+            <script
+        type="text/javascript"
+        src="/my_compassion/static/src/js/show_password.js"
+      />
         </xpath>
     </template>
 

From b59bf3de43e3db4e4b44d37bef1d6e9a19aecb23 Mon Sep 17 00:00:00 2001
From: jordyBSK <dylan.bossoku@jobtrek.ch>
Date: Wed, 18 Sep 2024 10:58:47 +0200
Subject: [PATCH 7/7] fix: fix pre-commit warnings by avoiding "replace" in XML

- Updated XML files to use safer `position` options.
---
 my_compassion/templates/signup.xml | 22 ++++------------------
 1 file changed, 4 insertions(+), 18 deletions(-)

diff --git a/my_compassion/templates/signup.xml b/my_compassion/templates/signup.xml
index af5eda0..d551f94 100644
--- a/my_compassion/templates/signup.xml
+++ b/my_compassion/templates/signup.xml
@@ -29,35 +29,21 @@
                         <t t-call="website_legal_page.acceptance_full" />
                     </label>
         </xpath>
-        <xpath expr="//input[@name='password']" position="replace">
+        <xpath expr="//input[@name='password']" position="after">
             <div class="position-relative">
-                <input
-          type="password"
-          name="password"
-          id="password"
-          class="form-control form-control-sm pr-5"
-          required="required"
-        />
                 <i
           class="fa fa-eye position-absolute"
           id="eye_password"
-          style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"
+          style="right: 10px; transform: translateY(-140%); cursor: pointer;"
         />
             </div>
         </xpath>
-        <xpath expr="//input[@name='confirm_password']" position="replace">
+        <xpath expr="//input[@name='confirm_password']" position="after">
             <div class="position-relative">
-                <input
-          type="password"
-          name="confirm_password"
-          id="confirm_password"
-          class="form-control form-control-sm pr-5"
-          required="required"
-        />
                 <i
           class="fa fa-eye position-absolute"
           id="eye_confirm_password"
-          style="right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer;"
+          style="right: 10px; transform: translateY(-140%); cursor: pointer;"
         />
             </div>
         </xpath>