diff --git a/console-webapp/package-lock.json b/console-webapp/package-lock.json
index 8bb0f4ab1..7d44b9767 100644
--- a/console-webapp/package-lock.json
+++ b/console-webapp/package-lock.json
@@ -70,12 +70,12 @@
       }
     },
     "node_modules/@angular-devkit/architect": {
-      "version": "0.1703.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1703.1.tgz",
-      "integrity": "sha512-vkfvURv7O+3fHMTE9K+yUEiFS0v4JNYKsDP0LE1ChH5Ocy0bJXGcH2Cyz2W8qdJGDG/tKe41VzvOLpu88Xv3zQ==",
+      "version": "0.1703.2",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1703.2.tgz",
+      "integrity": "sha512-fT5gSzwDHOyGv8zF97t8rjeoYSGSxXjWWstl3rN1nXdO0qgJ5m6Sv0fupON+HltdXDCBLRH+2khNpqx/Fh0Qww==",
       "dev": true,
       "dependencies": {
-        "@angular-devkit/core": "17.3.1",
+        "@angular-devkit/core": "17.3.2",
         "rxjs": "7.8.1"
       },
       "engines": {
@@ -94,15 +94,15 @@
       }
     },
     "node_modules/@angular-devkit/build-angular": {
-      "version": "17.3.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-17.3.1.tgz",
-      "integrity": "sha512-e+hZvLVH5AvHCFbVtKRd5oJeFsEmjg7kK1V6hsVxH4YE2f2x399TSr+AGxwV+R3jnjZ67ujIeXXd0Uuf1RwcSg==",
+      "version": "17.3.2",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-angular/-/build-angular-17.3.2.tgz",
+      "integrity": "sha512-muPCUyL0uHvRkLH4NLWiccER6P2vCm/Q5DDvqyN4XOzzY3tAHHLrKrpvY87sgd2oNJ6Ci8x7GPNcfzR5KELCnw==",
       "dev": true,
       "dependencies": {
         "@ampproject/remapping": "2.3.0",
-        "@angular-devkit/architect": "0.1703.1",
-        "@angular-devkit/build-webpack": "0.1703.1",
-        "@angular-devkit/core": "17.3.1",
+        "@angular-devkit/architect": "0.1703.2",
+        "@angular-devkit/build-webpack": "0.1703.2",
+        "@angular-devkit/core": "17.3.2",
         "@babel/core": "7.24.0",
         "@babel/generator": "7.23.6",
         "@babel/helper-annotate-as-pure": "7.22.5",
@@ -113,7 +113,7 @@
         "@babel/preset-env": "7.24.0",
         "@babel/runtime": "7.24.0",
         "@discoveryjs/json-ext": "0.5.7",
-        "@ngtools/webpack": "17.3.1",
+        "@ngtools/webpack": "17.3.2",
         "@vitejs/plugin-basic-ssl": "1.1.0",
         "ansi-colors": "4.1.3",
         "autoprefixer": "10.4.18",
@@ -158,7 +158,7 @@
         "vite": "5.1.5",
         "watchpack": "2.4.0",
         "webpack": "5.90.3",
-        "webpack-dev-middleware": "6.1.1",
+        "webpack-dev-middleware": "6.1.2",
         "webpack-dev-server": "4.15.1",
         "webpack-merge": "5.10.0",
         "webpack-subresource-integrity": "5.1.0"
@@ -232,12 +232,12 @@
       }
     },
     "node_modules/@angular-devkit/build-webpack": {
-      "version": "0.1703.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1703.1.tgz",
-      "integrity": "sha512-nVUzewX8RCzaEPQZ1JQpE42wpsYchKQwfXUSCkoUsuCMB2c6zuEz0Jt94nzJg3UjSEEV4ZqCH8v5MDOvB49Rlw==",
+      "version": "0.1703.2",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/build-webpack/-/build-webpack-0.1703.2.tgz",
+      "integrity": "sha512-w7rVFQcZK4iTCd/MLfQWIkDkwBOfAs++txNQyS9qYID8KvLs1V+oWYd2qDBRelRv1u3YtaCIS1pQx3GFKBC3OA==",
       "dev": true,
       "dependencies": {
-        "@angular-devkit/architect": "0.1703.1",
+        "@angular-devkit/architect": "0.1703.2",
         "rxjs": "7.8.1"
       },
       "engines": {
@@ -260,9 +260,9 @@
       }
     },
     "node_modules/@angular-devkit/core": {
-      "version": "17.3.1",
-      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-17.3.1.tgz",
-      "integrity": "sha512-EP7zwqBEaOPuBJwzKmh2abfgNFITGX178BOyTG6zTymeMzEbrvy2OdeQXSslkJ/RGLCpx60GT+0CFW7wGlQR6Q==",
+      "version": "17.3.2",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-17.3.2.tgz",
+      "integrity": "sha512-1vxKo9+pdSwTOwqPDSYQh84gZYmCJo6OgR5+AZoGLGMZSeqvi9RG5RiUcOMLQYOnuYv0arlhlWxz0ZjyR8ApKw==",
       "dev": true,
       "dependencies": {
         "ajv": "8.12.0",
@@ -3462,9 +3462,9 @@
       }
     },
     "node_modules/@leichtgewicht/ip-codec": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
-      "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==",
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
+      "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==",
       "dev": true
     },
     "node_modules/@ljharb/through": {
@@ -4232,9 +4232,9 @@
       }
     },
     "node_modules/@ngtools/webpack": {
-      "version": "17.3.1",
-      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-17.3.1.tgz",
-      "integrity": "sha512-6qRYFN6DqogZK0ZFrSlhg1OsIWm3lL3m+/Ixoj6/MLLjDBrTtHqmI93vg6P1EKYTH4fWChL7jtv7iS/LSZubgw==",
+      "version": "17.3.2",
+      "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-17.3.2.tgz",
+      "integrity": "sha512-E8zejFF4aJ8l2XcF+GgnE/1IqsZepnPT1xzulLB4LXtjVuXLFLoF9xkHQwxs7cJWWZsxd/SlNsCIcn/ezrYBcQ==",
       "dev": true,
       "engines": {
         "node": "^18.13.0 || >=20.9.0",
@@ -4780,9 +4780,9 @@
       }
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.13.0.tgz",
-      "integrity": "sha512-5ZYPOuaAqEH/W3gYsRkxQATBW3Ii1MfaT4EQstTnLKViLi2gLSQmlmtTpGucNP3sXEpOiI5tdGhjdE111ekyEg==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.13.1.tgz",
+      "integrity": "sha512-4C4UERETjXpC4WpBXDbkgNVgHyWfG3B/NKY46e7w5H134UDOFqUJKpsLm0UYmuupW+aJmRgeScrDNfvZ5WV80A==",
       "cpu": [
         "arm"
       ],
@@ -4793,9 +4793,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.13.0.tgz",
-      "integrity": "sha512-BSbaCmn8ZadK3UAQdlauSvtaJjhlDEjS5hEVVIN3A4bbl3X+otyf/kOJV08bYiRxfejP3DXFzO2jz3G20107+Q==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.13.1.tgz",
+      "integrity": "sha512-TrTaFJ9pXgfXEiJKQ3yQRelpQFqgRzVR9it8DbeRzG0RX7mKUy0bqhCFsgevwXLJepQKTnLl95TnPGf9T9AMOA==",
       "cpu": [
         "arm64"
       ],
@@ -4806,9 +4806,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.13.0.tgz",
-      "integrity": "sha512-Ovf2evVaP6sW5Ut0GHyUSOqA6tVKfrTHddtmxGQc1CTQa1Cw3/KMCDEEICZBbyppcwnhMwcDce9ZRxdWRpVd6g==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.13.1.tgz",
+      "integrity": "sha512-fz7jN6ahTI3cKzDO2otQuybts5cyu0feymg0bjvYCBrZQ8tSgE8pc0sSNEuGvifrQJWiwx9F05BowihmLxeQKw==",
       "cpu": [
         "arm64"
       ],
@@ -4819,9 +4819,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.13.0.tgz",
-      "integrity": "sha512-U+Jcxm89UTK592vZ2J9st9ajRv/hrwHdnvyuJpa5A2ngGSVHypigidkQJP+YiGL6JODiUeMzkqQzbCG3At81Gg==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.13.1.tgz",
+      "integrity": "sha512-WTvdz7SLMlJpektdrnWRUN9C0N2qNHwNbWpNo0a3Tod3gb9leX+yrYdCeB7VV36OtoyiPAivl7/xZ3G1z5h20g==",
       "cpu": [
         "x64"
       ],
@@ -4832,9 +4832,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.13.0.tgz",
-      "integrity": "sha512-8wZidaUJUTIR5T4vRS22VkSMOVooG0F4N+JSwQXWSRiC6yfEsFMLTYRFHvby5mFFuExHa/yAp9juSphQQJAijQ==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.13.1.tgz",
+      "integrity": "sha512-dBHQl+7wZzBYcIF6o4k2XkAfwP2ks1mYW2q/Gzv9n39uDcDiAGDqEyml08OdY0BIct0yLSPkDTqn4i6czpBLLw==",
       "cpu": [
         "arm"
       ],
@@ -4845,9 +4845,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.13.0.tgz",
-      "integrity": "sha512-Iu0Kno1vrD7zHQDxOmvweqLkAzjxEVqNhUIXBsZ8hu8Oak7/5VTPrxOEZXYC1nmrBVJp0ZcL2E7lSuuOVaE3+w==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.13.1.tgz",
+      "integrity": "sha512-bur4JOxvYxfrAmocRJIW0SADs3QdEYK6TQ7dTNz6Z4/lySeu3Z1H/+tl0a4qDYv0bCdBpUYM0sYa/X+9ZqgfSQ==",
       "cpu": [
         "arm64"
       ],
@@ -4858,9 +4858,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.13.0.tgz",
-      "integrity": "sha512-C31QrW47llgVyrRjIwiOwsHFcaIwmkKi3PCroQY5aVq4H0A5v/vVVAtFsI1nfBngtoRpeREvZOkIhmRwUKkAdw==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.13.1.tgz",
+      "integrity": "sha512-ssp77SjcDIUSoUyj7DU7/5iwM4ZEluY+N8umtCT9nBRs3u045t0KkW02LTyHouHDomnMXaXSZcCSr2bdMK63kA==",
       "cpu": [
         "arm64"
       ],
@@ -4871,9 +4871,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.13.0.tgz",
-      "integrity": "sha512-Oq90dtMHvthFOPMl7pt7KmxzX7E71AfyIhh+cPhLY9oko97Zf2C9tt/XJD4RgxhaGeAraAXDtqxvKE1y/j35lA==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.13.1.tgz",
+      "integrity": "sha512-Jv1DkIvwEPAb+v25/Unrnnq9BO3F5cbFPT821n3S5litkz+O5NuXuNhqtPx5KtcwOTtaqkTsO+IVzJOsxd11aQ==",
       "cpu": [
         "riscv64"
       ],
@@ -4883,10 +4883,23 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.13.1.tgz",
+      "integrity": "sha512-U564BrhEfaNChdATQaEODtquCC7Ez+8Hxz1h5MAdMYj0AqD0GA9rHCpElajb/sQcaFL6NXmHc5O+7FXpWMa73Q==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.13.0.tgz",
-      "integrity": "sha512-yUD/8wMffnTKuiIsl6xU+4IA8UNhQ/f1sAnQebmE/lyQ8abjsVyDkyRkWop0kdMhKMprpNIhPmYlCxgHrPoXoA==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.13.1.tgz",
+      "integrity": "sha512-zGRDulLTeDemR8DFYyFIQ8kMP02xpUsX4IBikc7lwL9PrwR3gWmX2NopqiGlI2ZVWMl15qZeUjumTwpv18N7sQ==",
       "cpu": [
         "x64"
       ],
@@ -4897,9 +4910,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.13.0.tgz",
-      "integrity": "sha512-9RyNqoFNdF0vu/qqX63fKotBh43fJQeYC98hCaf89DYQpv+xu0D8QFSOS0biA7cGuqJFOc1bJ+m2rhhsKcw1hw==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.13.1.tgz",
+      "integrity": "sha512-VTk/MveyPdMFkYJJPCkYBw07KcTkGU2hLEyqYMsU4NjiOfzoaDTW9PWGRsNwiOA3qI0k/JQPjkl/4FCK1smskQ==",
       "cpu": [
         "x64"
       ],
@@ -4910,9 +4923,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.13.0.tgz",
-      "integrity": "sha512-46ue8ymtm/5PUU6pCvjlic0z82qWkxv54GTJZgHrQUuZnVH+tvvSP0LsozIDsCBFO4VjJ13N68wqrKSeScUKdA==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.13.1.tgz",
+      "integrity": "sha512-L+hX8Dtibb02r/OYCsp4sQQIi3ldZkFI0EUkMTDwRfFykXBPptoz/tuuGqEd3bThBSLRWPR6wsixDSgOx/U3Zw==",
       "cpu": [
         "arm64"
       ],
@@ -4923,9 +4936,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.13.0.tgz",
-      "integrity": "sha512-P5/MqLdLSlqxbeuJ3YDeX37srC8mCflSyTrUsgbU1c/U9j6l2g2GiIdYaGD9QjdMQPMSgYm7hgg0551wHyIluw==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.13.1.tgz",
+      "integrity": "sha512-+dI2jVPfM5A8zme8riEoNC7UKk0Lzc7jCj/U89cQIrOjrZTCWZl/+IXUeRT2rEZ5j25lnSA9G9H1Ob9azaF/KQ==",
       "cpu": [
         "ia32"
       ],
@@ -4936,9 +4949,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.13.0.tgz",
-      "integrity": "sha512-UKXUQNbO3DOhzLRwHSpa0HnhhCgNODvfoPWv2FCXme8N/ANFfhIPMGuOT+QuKd16+B5yxZ0HdpNlqPvTMS1qfw==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.13.1.tgz",
+      "integrity": "sha512-YY1Exxo2viZ/O2dMHuwQvimJ0SqvL+OAWQLLY6rvXavgQKjhQUzn7nc1Dd29gjB5Fqi00nrBWctJBOyfVMIVxw==",
       "cpu": [
         "x64"
       ],
@@ -5031,9 +5044,9 @@
       }
     },
     "node_modules/@sigstore/core": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/core/-/core-1.0.0.tgz",
-      "integrity": "sha512-dW2qjbWLRKGu6MIDUTBuJwXCnR8zivcSpf5inUzk7y84zqy/dji0/uahppoIgMoKeR+6pUZucrwHfkQQtiG9Rw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@sigstore/core/-/core-1.1.0.tgz",
+      "integrity": "sha512-JzBqdVIyqm2FRQCulY6nbQzMpJJpSiJ8XXWMhtOX9eKgaXXpfNOF53lzQEjIydlStnd/eFtuC1dW4VYdD93oRg==",
       "dev": true,
       "engines": {
         "node": "^16.14.0 || >=18.0.0"
@@ -5064,9 +5077,9 @@
       }
     },
     "node_modules/@sigstore/tuf": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/@sigstore/tuf/-/tuf-2.3.1.tgz",
-      "integrity": "sha512-9Iv40z652td/QbV0o5n/x25H9w6IYRt2pIGbTX55yFDYlApDQn/6YZomjz6+KBx69rXHLzHcbtTS586mDdFD+Q==",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/@sigstore/tuf/-/tuf-2.3.2.tgz",
+      "integrity": "sha512-mwbY1VrEGU4CO55t+Kl6I7WZzIl+ysSzEYdA1Nv/FTrl2bkeaPXo5PnWZAVfcY2zSdhOpsUTJW67/M2zHXGn5w==",
       "dev": true,
       "dependencies": {
         "@sigstore/protobuf-specs": "^0.3.0",
@@ -5077,13 +5090,13 @@
       }
     },
     "node_modules/@sigstore/verify": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@sigstore/verify/-/verify-1.1.0.tgz",
-      "integrity": "sha512-1fTqnqyTBWvV7cftUUFtDcHPdSox0N3Ub7C0lRyReYx4zZUlNTZjCV+HPy4Lre+r45dV7Qx5JLKvqqsgxuyYfg==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/verify/-/verify-1.1.1.tgz",
+      "integrity": "sha512-BNANJms49rw9Q5J+fJjrDqOQSzjXDcOq/pgKDaVdDoIvQwqIfaoUriy+fQfh8sBX04hr4bkkrwu3EbhQqoQH7A==",
       "dev": true,
       "dependencies": {
         "@sigstore/bundle": "^2.2.0",
-        "@sigstore/core": "^1.0.0",
+        "@sigstore/core": "^1.1.0",
         "@sigstore/protobuf-specs": "^0.3.0"
       },
       "engines": {
@@ -6772,9 +6785,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001599",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001599.tgz",
-      "integrity": "sha512-LRAQHZ4yT1+f9LemSMeqdMpMxZcc4RMWdj4tiFe3G8tNkWK+E58g+/tzotb5cU6TbcVJLr4fySiAW7XmxQvZQA==",
+      "version": "1.0.30001600",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001600.tgz",
+      "integrity": "sha512-+2S9/2JFhYmYaDpZvo0lKkfvuKIglrx68MwOBqMGHhQsNkLjB5xtc/TGoEPs+MxjSyN/72qer2g97nzR641mOQ==",
       "dev": true,
       "funding": [
         {
@@ -7935,9 +7948,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.713",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.713.tgz",
-      "integrity": "sha512-vDarADhwntXiULEdmWd77g2dV6FrNGa8ecAC29MZ4TwPut2fvosD0/5sJd1qWNNe8HcJFAC+F5Lf9jW1NPtWmw==",
+      "version": "1.4.719",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.719.tgz",
+      "integrity": "sha512-FbWy2Q2YgdFzkFUW/W5jBjE9dj+804+98E4Pup78JBPnbdb3pv6IneY2JCPKdeKLh3AOKHQeYf+KwLr7mxGh6Q==",
       "dev": true
     },
     "node_modules/emoji-regex": {
@@ -8128,9 +8141,9 @@
       }
     },
     "node_modules/es-module-lexer": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.4.2.tgz",
-      "integrity": "sha512-7nOqkomXZEaxUDJw21XZNtRk739QvrPSoZoRtbsEfcii00vdzZUh6zh1CQwHhrib8MdEtJfv5rJiGeb4KuV/vw==",
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.0.tgz",
+      "integrity": "sha512-pqrTKmwEIgafsYZAGw9kszYzmagcE/n4dbgwGWLEXg7J4QFJVQRBld8j3Q3GNez79jzxZshq0bcT962QHOghjw==",
       "dev": true
     },
     "node_modules/esbuild": {
@@ -11594,9 +11607,9 @@
       }
     },
     "node_modules/node-gyp": {
-      "version": "10.0.1",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-10.0.1.tgz",
-      "integrity": "sha512-gg3/bHehQfZivQVfqIyy8wTdSymF9yTyP4CJifK73imyNMU8AIGQE2pUa7dNWfmMeG9cDVF2eehiRMv0LC1iAg==",
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-10.1.0.tgz",
+      "integrity": "sha512-B4J5M1cABxPc5PwfjhbV5hoy2DP9p8lFXASnEN6hugXOa61416tnTZ29x9sSwAd0o99XNIcpvDDy1swAExsVKA==",
       "dev": true,
       "dependencies": {
         "env-paths": "^2.2.0",
@@ -12546,12 +12559,12 @@
       "dev": true
     },
     "node_modules/path-scurry": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.1.tgz",
-      "integrity": "sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==",
+      "version": "1.10.2",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.2.tgz",
+      "integrity": "sha512-7xTavNy5RQXnsjANvVvMkEjvloOinkAjv/Z6Ildz9v2RinZ4SBKTWFOVRbaF8p0vpHnyjV/UwNDdKuUv6M5qcA==",
       "dev": true,
       "dependencies": {
-        "lru-cache": "^9.1.1 || ^10.0.0",
+        "lru-cache": "^10.2.0",
         "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
       },
       "engines": {
@@ -13411,9 +13424,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.13.0.tgz",
-      "integrity": "sha512-3YegKemjoQnYKmsBlOHfMLVPPA5xLkQ8MHLLSw/fBrFaVkEayL51DilPpNNLq1exr98F2B1TzrV0FUlN3gWRPg==",
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.13.1.tgz",
+      "integrity": "sha512-hFi+fU132IvJ2ZuihN56dwgpltpmLZHZWsx27rMCTZ2sYwrqlgL5sECGy1eeV2lAihD8EzChBVVhsXci0wD4Tg==",
       "dev": true,
       "dependencies": {
         "@types/estree": "1.0.5"
@@ -13426,19 +13439,20 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.13.0",
-        "@rollup/rollup-android-arm64": "4.13.0",
-        "@rollup/rollup-darwin-arm64": "4.13.0",
-        "@rollup/rollup-darwin-x64": "4.13.0",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.13.0",
-        "@rollup/rollup-linux-arm64-gnu": "4.13.0",
-        "@rollup/rollup-linux-arm64-musl": "4.13.0",
-        "@rollup/rollup-linux-riscv64-gnu": "4.13.0",
-        "@rollup/rollup-linux-x64-gnu": "4.13.0",
-        "@rollup/rollup-linux-x64-musl": "4.13.0",
-        "@rollup/rollup-win32-arm64-msvc": "4.13.0",
-        "@rollup/rollup-win32-ia32-msvc": "4.13.0",
-        "@rollup/rollup-win32-x64-msvc": "4.13.0",
+        "@rollup/rollup-android-arm-eabi": "4.13.1",
+        "@rollup/rollup-android-arm64": "4.13.1",
+        "@rollup/rollup-darwin-arm64": "4.13.1",
+        "@rollup/rollup-darwin-x64": "4.13.1",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.13.1",
+        "@rollup/rollup-linux-arm64-gnu": "4.13.1",
+        "@rollup/rollup-linux-arm64-musl": "4.13.1",
+        "@rollup/rollup-linux-riscv64-gnu": "4.13.1",
+        "@rollup/rollup-linux-s390x-gnu": "4.13.1",
+        "@rollup/rollup-linux-x64-gnu": "4.13.1",
+        "@rollup/rollup-linux-x64-musl": "4.13.1",
+        "@rollup/rollup-win32-arm64-msvc": "4.13.1",
+        "@rollup/rollup-win32-ia32-msvc": "4.13.1",
+        "@rollup/rollup-win32-x64-msvc": "4.13.1",
         "fsevents": "~2.3.2"
       }
     },
@@ -14375,9 +14389,9 @@
       }
     },
     "node_modules/tar": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-6.2.0.tgz",
-      "integrity": "sha512-/Wo7DcT0u5HUV486xg675HtjNd3BXZ6xDbzsCUZPt5iw8bTQ63bP0Raut3mvro9u+CUyq7YQd8Cx55fsZXxqLQ==",
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/tar/-/tar-6.2.1.tgz",
+      "integrity": "sha512-DZ4yORTwrbTj/7MZYq2w+/ZFdI6OZ/f9SFHR+71gIVUZhOQPHzVCLpvRnPgyaMpfWxxk/4ONva3GQSyNIKRv6A==",
       "dev": true,
       "dependencies": {
         "chownr": "^2.0.0",
@@ -15533,9 +15547,9 @@
       }
     },
     "node_modules/webpack-dev-middleware": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-6.1.1.tgz",
-      "integrity": "sha512-y51HrHaFeeWir0YO4f0g+9GwZawuigzcAdRNon6jErXy/SqV/+O6eaVAzDqE6t3e3NpGeR5CS+cCDaTC+V3yEQ==",
+      "version": "6.1.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-6.1.2.tgz",
+      "integrity": "sha512-Wu+EHmX326YPYUpQLKmKbTyZZJIB8/n6R09pTmB03kJmnMsVPTo9COzHZFr01txwaCAuZvfBJE4ZCHRcKs5JaQ==",
       "dev": true,
       "dependencies": {
         "colorette": "^2.0.10",
diff --git a/console-webapp/src/app/app.module.ts b/console-webapp/src/app/app.module.ts
index 7e8c7848e..d14701553 100644
--- a/console-webapp/src/app/app.module.ts
+++ b/console-webapp/src/app/app.module.ts
@@ -36,6 +36,7 @@ import { RegistrarComponent } from './registrar/registrarsTable.component';
 import { ResourcesComponent } from './resources/resources.component';
 import SettingsContactComponent from './settings/contact/contact.component';
 import { ContactDetailsComponent } from './settings/contact/contactDetails.component';
+import EppPasswordEditComponent from './settings/security/eppPasswordEdit.component';
 import SecurityComponent from './settings/security/security.component';
 import SecurityEditComponent from './settings/security/securityEdit.component';
 import { SettingsComponent } from './settings/settings.component';
@@ -57,6 +58,7 @@ import { TldsComponent } from './tlds/tlds.component';
     BillingInfoComponent,
     ContactDetailsComponent,
     DomainListComponent,
+    EppPasswordEditComponent,
     HeaderComponent,
     HomeComponent,
     LocationBackDirective,
diff --git a/console-webapp/src/app/material.module.ts b/console-webapp/src/app/material.module.ts
index cc8fbbf0d..e541b806b 100644
--- a/console-webapp/src/app/material.module.ts
+++ b/console-webapp/src/app/material.module.ts
@@ -12,16 +12,23 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { NgModule } from '@angular/core';
 import { A11yModule } from '@angular/cdk/a11y';
+import { DialogModule } from '@angular/cdk/dialog';
+import { CdkMenuModule } from '@angular/cdk/menu';
+import { OverlayModule } from '@angular/cdk/overlay';
 import { CdkTableModule } from '@angular/cdk/table';
 import { CdkTreeModule } from '@angular/cdk/tree';
+import { NgModule } from '@angular/core';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
 import { MatBadgeModule } from '@angular/material/badge';
+import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
 import { MatButtonModule } from '@angular/material/button';
 import { MatButtonToggleModule } from '@angular/material/button-toggle';
-import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
 import { MatCardModule } from '@angular/material/card';
 import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatNativeDateModule, MatRippleModule } from '@angular/material/core';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatDividerModule } from '@angular/material/divider';
 import { MatGridListModule } from '@angular/material/grid-list';
@@ -29,24 +36,18 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatInputModule } from '@angular/material/input';
 import { MatListModule } from '@angular/material/list';
 import { MatMenuModule } from '@angular/material/menu';
-import { MatNativeDateModule, MatRippleModule } from '@angular/material/core';
+import { MatPaginatorModule } from '@angular/material/paginator';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { MatRadioModule } from '@angular/material/radio';
 import { MatSelectModule } from '@angular/material/select';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { MatTableModule } from '@angular/material/table';
 import { MatTabsModule } from '@angular/material/tabs';
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { MatTreeModule } from '@angular/material/tree';
-import { OverlayModule } from '@angular/cdk/overlay';
-import { CdkMenuModule } from '@angular/cdk/menu';
-import { DialogModule } from '@angular/cdk/dialog';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import { MatSnackBarModule } from '@angular/material/snack-bar';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import { MatChipsModule } from '@angular/material/chips';
-import { MatAutocompleteModule } from '@angular/material/autocomplete';
 
 @NgModule({
   exports: [
@@ -85,6 +86,7 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete';
     MatPaginatorModule,
     MatChipsModule,
     MatAutocompleteModule,
+    ReactiveFormsModule,
   ],
 })
 export class MaterialModule {}
diff --git a/console-webapp/src/app/registrar/registrar.service.ts b/console-webapp/src/app/registrar/registrar.service.ts
index 51ec29df5..35f45af71 100644
--- a/console-webapp/src/app/registrar/registrar.service.ts
+++ b/console-webapp/src/app/registrar/registrar.service.ts
@@ -23,6 +23,10 @@ import {
   GlobalLoaderService,
 } from '../shared/services/globalLoader.service';
 
+export interface IpAllowListItem {
+  value: string;
+}
+
 export interface Address {
   city?: string;
   countryCode?: string;
@@ -31,6 +35,19 @@ export interface Address {
   zip?: string;
 }
 
+export interface SecuritySettingsBackendModel {
+  clientCertificate?: string;
+  failoverClientCertificate?: string;
+  ipAddressAllowList?: Array<string>;
+  // TODO: @ptkach At some point we want to add a back-end support for this
+  eppPasswordLastUpdated?: string;
+}
+
+export interface SecuritySettings
+  extends Omit<SecuritySettingsBackendModel, 'ipAddressAllowList'> {
+  ipAddressAllowList?: Array<IpAllowListItem>;
+}
+
 export interface WhoisRegistrarFields {
   ianaIdentifier?: number;
   icannReferralEmail: string;
@@ -40,13 +57,14 @@ export interface WhoisRegistrarFields {
   whoisServer: string;
 }
 
-export interface Registrar extends WhoisRegistrarFields {
+export interface Registrar
+  extends WhoisRegistrarFields,
+    SecuritySettingsBackendModel {
   allowedTlds?: string[];
   billingAccountMap?: object;
   driveFolderId?: string;
   emailAddress?: string;
   faxNumber?: string;
-  ipAddressAllowList?: string[];
   phoneNumber?: string;
   registrarId: string;
   registrarName: string;
diff --git a/console-webapp/src/app/settings/contact/contact.component.scss b/console-webapp/src/app/settings/contact/contact.component.scss
index 0bb303007..f0c3df973 100644
--- a/console-webapp/src/app/settings/contact/contact.component.scss
+++ b/console-webapp/src/app/settings/contact/contact.component.scss
@@ -25,6 +25,9 @@
       font-weight: 500;
       padding: 10px 0;
     }
+    .contact__name-column-roles {
+      margin-bottom: 10px;
+    }
   }
   &__empty-contacts {
     display: flex;
diff --git a/console-webapp/src/app/settings/contact/contact.component.ts b/console-webapp/src/app/settings/contact/contact.component.ts
index ed5ca2e2f..6d4332c49 100644
--- a/console-webapp/src/app/settings/contact/contact.component.ts
+++ b/console-webapp/src/app/settings/contact/contact.component.ts
@@ -17,10 +17,9 @@ import { MatTableDataSource } from '@angular/material/table';
 import { take } from 'rxjs';
 import { RegistrarService } from 'src/app/registrar/registrar.service';
 import {
-  Contact,
   ContactService,
-  ViewReadyContact,
   contactTypeToViewReadyContact,
+  ViewReadyContact,
 } from './contact.service';
 
 @Component({
@@ -85,7 +84,7 @@ export default class ContactComponent {
     });
   }
 
-  openDetails(contact: Contact) {
+  openDetails(contact: ViewReadyContact) {
     this.contactService.setEditableContact(contact);
     this.contactService.isContactDetailsView = true;
   }
diff --git a/console-webapp/src/app/settings/contact/contact.service.ts b/console-webapp/src/app/settings/contact/contact.service.ts
index 01a10273a..72ede09c4 100644
--- a/console-webapp/src/app/settings/contact/contact.service.ts
+++ b/console-webapp/src/app/settings/contact/contact.service.ts
@@ -77,19 +77,17 @@ export class ContactService {
     private registrarService: RegistrarService
   ) {}
 
-  setEditableContact(contact?: Contact) {
-    this.contactInEdit = contactTypeToViewReadyContact(
-      contact
-        ? contact
-        : {
-            emailAddress: '',
-            name: '',
-            types: ['ADMIN'],
-            faxNumber: '',
-            phoneNumber: '',
-            registrarId: '',
-          }
-    );
+  setEditableContact(contact?: ViewReadyContact) {
+    this.contactInEdit = contact
+      ? contact
+      : contactTypeToViewReadyContact({
+          emailAddress: '',
+          name: '',
+          types: ['ADMIN'],
+          faxNumber: '',
+          phoneNumber: '',
+          registrarId: '',
+        });
   }
 
   fetchContacts(): Observable<Contact[]> {
@@ -106,13 +104,6 @@ export class ContactService {
       .pipe(switchMap((_) => this.fetchContacts()));
   }
 
-  updateContact(index: number, contact: ViewReadyContact) {
-    const newContacts = this.contacts().map((c, i) =>
-      i === index ? contact : c
-    );
-    return this.saveContacts(newContacts);
-  }
-
   addContact(contact: ViewReadyContact) {
     const newContacts = this.contacts().concat([contact]);
     return this.saveContacts(newContacts);
diff --git a/console-webapp/src/app/settings/contact/contactDetails.component.ts b/console-webapp/src/app/settings/contact/contactDetails.component.ts
index 9754c87af..ad5a470dd 100644
--- a/console-webapp/src/app/settings/contact/contactDetails.component.ts
+++ b/console-webapp/src/app/settings/contact/contactDetails.component.ts
@@ -65,16 +65,17 @@ export class ContactDetailsComponent {
 
   save(e: SubmitEvent) {
     e.preventDefault();
-    this.contactService
-      .saveContacts([this.contactService.contactInEdit])
-      .subscribe({
-        complete: () => {
-          this.goBack();
-        },
-        error: (err: HttpErrorResponse) => {
-          this._snackBar.open(err.error);
-        },
-      });
+    const request = this.contactService.isContactNewView
+      ? this.contactService.addContact(this.contactService.contactInEdit)
+      : this.contactService.saveContacts(this.contactService.contacts());
+    request.subscribe({
+      complete: () => {
+        this.goBack();
+      },
+      error: (err: HttpErrorResponse) => {
+        this._snackBar.open(err.error);
+      },
+    });
   }
 
   checkboxIsChecked(type: string) {
diff --git a/console-webapp/src/app/settings/security/eppPasswordEdit.component.html b/console-webapp/src/app/settings/security/eppPasswordEdit.component.html
new file mode 100644
index 000000000..759016fe1
--- /dev/null
+++ b/console-webapp/src/app/settings/security/eppPasswordEdit.component.html
@@ -0,0 +1,76 @@
+<div class="settings-security__edit-password">
+  <p>
+    <button
+      mat-icon-button
+      aria-label="Back to security settings"
+      (click)="goBack()"
+    >
+      <mat-icon>arrow_back</mat-icon>
+    </button>
+  </p>
+  <h1>Update EPP password</h1>
+  <p class="secondary-text">
+    Passwords must be between 6 and 16 alphanumeric characters
+  </p>
+  <form
+    (ngSubmit)="save()"
+    [formGroup]="passwordUpdateForm"
+    class="settings-security__edit-password-form"
+  >
+    <div class="settings-security__edit-password-field">
+      <mat-form-field appearance="outline">
+        <mat-label>Old password: </mat-label>
+        <input
+          matInput
+          type="text"
+          formControlName="oldPassword"
+          required
+          autocomplete="current-password"
+        />
+        <mat-error *ngIf="hasError('oldPassword') as errorText">{{
+          errorText
+        }}</mat-error>
+      </mat-form-field>
+    </div>
+    <div class="settings-security__edit-password-field">
+      <mat-form-field appearance="outline">
+        <mat-label>New password: </mat-label>
+        <input
+          matInput
+          type="text"
+          formControlName="newPassword"
+          required
+          autocomplete="new-password"
+        />
+        <mat-error *ngIf="hasError('newPassword') as errorText">{{
+          errorText
+        }}</mat-error>
+      </mat-form-field>
+    </div>
+    <div class="settings-security__edit-password-field">
+      <mat-form-field appearance="outline">
+        <mat-label>Confirm new password: </mat-label>
+        <input
+          matInput
+          type="text"
+          formControlName="newPasswordRepeat"
+          required
+          autocomplete="new-password"
+        />
+        <mat-error *ngIf="hasError('newPasswordRepeat') as errorText">{{
+          errorText
+        }}</mat-error>
+      </mat-form-field>
+    </div>
+    <button
+      mat-flat-button
+      color="primary"
+      [disabled]="!passwordUpdateForm.valid"
+      aria-label="Save epp password update"
+      type="submit"
+      class="settings-security__edit-password-save"
+    >
+      Save
+    </button>
+  </form>
+</div>
diff --git a/console-webapp/src/app/settings/security/eppPasswordEdit.component.scss b/console-webapp/src/app/settings/security/eppPasswordEdit.component.scss
new file mode 100644
index 000000000..aaaacf125
--- /dev/null
+++ b/console-webapp/src/app/settings/security/eppPasswordEdit.component.scss
@@ -0,0 +1,16 @@
+.settings-security__edit-password {
+  max-width: 616px;
+  &-field {
+    width: 100%;
+    mat-form-field {
+      margin-bottom: 20px;
+      width: 100%;
+    }
+  }
+  &-form {
+    margin-top: 30px;
+  }
+  &-save {
+    margin-top: 30px;
+  }
+}
diff --git a/console-webapp/src/app/settings/security/eppPasswordEdit.component.ts b/console-webapp/src/app/settings/security/eppPasswordEdit.component.ts
new file mode 100644
index 000000000..4fb8dca16
--- /dev/null
+++ b/console-webapp/src/app/settings/security/eppPasswordEdit.component.ts
@@ -0,0 +1,109 @@
+// Copyright 2024 The Nomulus Authors. All Rights Reserved.
+//
+// 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.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import { Component } from '@angular/core';
+import {
+  AbstractControl,
+  FormControl,
+  FormGroup,
+  ValidatorFn,
+  Validators,
+} from '@angular/forms';
+import { MatSnackBar } from '@angular/material/snack-bar';
+import { RegistrarService } from 'src/app/registrar/registrar.service';
+import { SecurityService } from './security.service';
+
+type errorCode = 'required' | 'maxlength' | 'minlength' | 'passwordsDontMatch';
+
+type errorFriendlyText = { [type in errorCode]: String };
+
+@Component({
+  selector: 'app-epp-password-edit',
+  templateUrl: './eppPasswordEdit.component.html',
+  styleUrls: ['./eppPasswordEdit.component.scss'],
+})
+export default class EppPasswordEditComponent {
+  MIN_MAX_LENGHT = new String(
+    'Passwords must be between 6 and 16 alphanumeric characters'
+  );
+
+  errorTextMap: errorFriendlyText = {
+    required: "This field can't be empty",
+    maxlength: this.MIN_MAX_LENGHT,
+    minlength: this.MIN_MAX_LENGHT,
+    passwordsDontMatch: "Passwords don't match",
+  };
+
+  constructor(
+    public securityService: SecurityService,
+    private _snackBar: MatSnackBar,
+    public registrarService: RegistrarService
+  ) {}
+
+  hasError(controlName: string) {
+    const maybeErrors = this.passwordUpdateForm.get(controlName)?.errors;
+    const maybeError =
+      maybeErrors && (Object.keys(maybeErrors)[0] as errorCode);
+    if (maybeError) {
+      return this.errorTextMap[maybeError];
+    }
+    return '';
+  }
+
+  newPasswordsMatch: ValidatorFn = (control: AbstractControl) => {
+    if (
+      this.passwordUpdateForm?.get('newPassword')?.value ===
+      this.passwordUpdateForm?.get('newPasswordRepeat')?.value
+    ) {
+      this.passwordUpdateForm?.get('newPasswordRepeat')?.setErrors(null);
+    } else {
+      this.passwordUpdateForm
+        ?.get('newPasswordRepeat')
+        ?.setErrors({ passwordsDontMatch: control.value });
+    }
+    return null;
+  };
+
+  passwordUpdateForm = new FormGroup({
+    oldPassword: new FormControl('', [Validators.required]),
+    newPassword: new FormControl('', [
+      Validators.required,
+      Validators.minLength(6),
+      Validators.maxLength(16),
+      this.newPasswordsMatch,
+    ]),
+    newPasswordRepeat: new FormControl('', [
+      Validators.required,
+      Validators.minLength(6),
+      Validators.maxLength(16),
+      this.newPasswordsMatch,
+    ]),
+  });
+
+  save() {
+    debugger;
+    // this.securityService.saveEppPassword().subscribe({
+    //   complete: () => {
+    //     this.goBack();
+    //   },
+    //   error: (err: HttpErrorResponse) => {
+    //     this._snackBar.open(err.error);
+    //   },
+    // });
+  }
+
+  goBack() {
+    this.securityService.isEditingPassword = false;
+  }
+}
diff --git a/console-webapp/src/app/settings/security/security.component.html b/console-webapp/src/app/settings/security/security.component.html
index 25bdbc9f7..b0f551e7e 100644
--- a/console-webapp/src/app/settings/security/security.component.html
+++ b/console-webapp/src/app/settings/security/security.component.html
@@ -1,7 +1,48 @@
 @if(securityService.isEditingSecurity) {
 <app-security-edit></app-security-edit>
+} @else if(securityService.isEditingPassword) {
+<app-epp-password-edit></app-epp-password-edit>
 } @else {
 <div class="settings-security">
+  <mat-card appearance="outlined">
+    <mat-card-content>
+      <mat-list role="list">
+        <!-- IP Allowlist Start -->
+        <mat-list-item role="listitem">
+          <div class="settings-security__section-header">
+            <h2>EPP Password</h2>
+            <button
+              mat-flat-button
+              color="primary"
+              aria-label="Edit EPP Password"
+              (click)="editEppPassword()"
+            >
+              <mat-icon>edit</mat-icon>
+              Edit
+            </button>
+          </div>
+        </mat-list-item>
+        <mat-list-item role="listitem" lines="3">
+          <span class="console-app__list-value"
+            >todo: come up with a text here</span
+          >
+        </mat-list-item>
+        <mat-list-item role="listitem">
+          <span class="console-app__list-key">Password</span>
+          <span class="console-app__list-value">••••••••••••••</span>
+        </mat-list-item>
+        @if(dataSource.eppPasswordLastUpdated) {
+        <mat-divider></mat-divider>
+        <mat-list-item role="listitem">
+          <span class="console-app__list-key">Last Changed</span>
+          <span class="console-app__list-value">{{
+            dataSource.eppPasswordLastUpdated
+          }}</span>
+        </mat-list-item>
+        }
+      </mat-list>
+    </mat-card-content>
+  </mat-card>
   <mat-card appearance="outlined">
     <mat-card-content>
       <mat-list role="list">
@@ -12,7 +53,7 @@
             <button
               mat-flat-button
               color="primary"
-              aria-label="Edit Contact"
+              aria-label="Edit security settings"
               (click)="editSecurity()"
             >
               <mat-icon>edit</mat-icon>
diff --git a/console-webapp/src/app/settings/security/security.component.ts b/console-webapp/src/app/settings/security/security.component.ts
index 770f5c567..55d73660e 100644
--- a/console-webapp/src/app/settings/security/security.component.ts
+++ b/console-webapp/src/app/settings/security/security.component.ts
@@ -13,12 +13,11 @@
 // limitations under the License.
 
 import { Component, effect } from '@angular/core';
-import { RegistrarService } from 'src/app/registrar/registrar.service';
 import {
-  SecurityService,
+  RegistrarService,
   SecuritySettings,
-  apiToUiConverter,
-} from './security.service';
+} from 'src/app/registrar/registrar.service';
+import { SecurityService, apiToUiConverter } from './security.service';
 
 @Component({
   selector: 'app-security',
@@ -43,4 +42,8 @@ export default class SecurityComponent {
   editSecurity() {
     this.securityService.isEditingSecurity = true;
   }
+
+  editEppPassword() {
+    this.securityService.isEditingPassword = true;
+  }
 }
diff --git a/console-webapp/src/app/settings/security/security.service.ts b/console-webapp/src/app/settings/security/security.service.ts
index 16e96b298..ada53f993 100644
--- a/console-webapp/src/app/settings/security/security.service.ts
+++ b/console-webapp/src/app/settings/security/security.service.ts
@@ -14,24 +14,14 @@
 
 import { Injectable } from '@angular/core';
 import { switchMap } from 'rxjs';
-import { RegistrarService } from 'src/app/registrar/registrar.service';
+import {
+  IpAllowListItem,
+  RegistrarService,
+  SecuritySettings,
+  SecuritySettingsBackendModel,
+} from 'src/app/registrar/registrar.service';
 import { BackendService } from 'src/app/shared/services/backend.service';
 
-export interface ipAllowListItem {
-  value: string;
-}
-export interface SecuritySettings {
-  clientCertificate?: string;
-  failoverClientCertificate?: string;
-  ipAddressAllowList?: Array<ipAllowListItem>;
-}
-
-export interface SecuritySettingsBackendModel {
-  clientCertificate?: string;
-  failoverClientCertificate?: string;
-  ipAddressAllowList?: Array<string>;
-}
-
 export function apiToUiConverter(
   securitySettings: SecuritySettingsBackendModel = {}
 ): SecuritySettings {
@@ -48,7 +38,7 @@ export function uiToApiConverter(
   return Object.assign({}, securitySettings, {
     ipAddressAllowList: (securitySettings.ipAddressAllowList || [])
       .filter((s) => s.value)
-      .map((ipAllowItem: ipAllowListItem) => ipAllowItem.value),
+      .map((ipAllowItem: IpAllowListItem) => ipAllowItem.value),
   });
 }
 
@@ -58,6 +48,7 @@ export function uiToApiConverter(
 export class SecurityService {
   securitySettings: SecuritySettings = {};
   isEditingSecurity: boolean = false;
+  isEditingPassword: boolean = false;
 
   constructor(
     private backend: BackendService,
@@ -76,4 +67,6 @@ export class SecurityService {
         })
       );
   }
+
+  saveEppPassword() {}
 }
diff --git a/console-webapp/src/app/settings/security/securityEdit.component.ts b/console-webapp/src/app/settings/security/securityEdit.component.ts
index e2f8deb47..36baa69c0 100644
--- a/console-webapp/src/app/settings/security/securityEdit.component.ts
+++ b/console-webapp/src/app/settings/security/securityEdit.component.ts
@@ -15,13 +15,12 @@
 import { HttpErrorResponse } from '@angular/common/http';
 import { Component } from '@angular/core';
 import { MatSnackBar } from '@angular/material/snack-bar';
-import { RegistrarService } from 'src/app/registrar/registrar.service';
 import {
-  SecurityService,
+  IpAllowListItem,
+  RegistrarService,
   SecuritySettings,
-  apiToUiConverter,
-  ipAllowListItem,
-} from './security.service';
+} from 'src/app/registrar/registrar.service';
+import { SecurityService, apiToUiConverter } from './security.service';
 
 @Component({
   selector: 'app-security-edit',
@@ -58,7 +57,7 @@ export default class SecurityEditComponent {
     this.securityService.isEditingSecurity = false;
   }
 
-  removeIpEntry(ip: ipAllowListItem) {
+  removeIpEntry(ip: IpAllowListItem) {
     this.dataSource.ipAddressAllowList =
       this.dataSource.ipAddressAllowList?.filter((item) => item !== ip);
   }
diff --git a/console-webapp/src/app/shared/services/backend.service.ts b/console-webapp/src/app/shared/services/backend.service.ts
index fc81a0fd5..d53b37df8 100644
--- a/console-webapp/src/app/shared/services/backend.service.ts
+++ b/console-webapp/src/app/shared/services/backend.service.ts
@@ -15,11 +15,11 @@
 import { HttpClient, HttpErrorResponse } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable, catchError, of, throwError } from 'rxjs';
-import { SecuritySettingsBackendModel } from 'src/app/settings/security/security.service';
 
 import { DomainListResult } from 'src/app/domains/domainList.service';
 import {
   Registrar,
+  SecuritySettingsBackendModel,
   WhoisRegistrarFields,
 } from '../../registrar/registrar.service';
 import { Contact } from '../../settings/contact/contact.service';