1.5.0

- Add new code input design
- Add new 2fa password input design
- Allow user to send code only once to prevent FloodWaits

CHANGELOG.md

@@ -26,6 +26,8 @@
 - Add switch to mute @BotFather only once in hikka inline
 - Add ability to forbid certain tl methods using `.config APIRatelimiter`
 - Add new web interface design
+- Add new code input design
+- Add new 2fa password input design
 - Add ability to set custom emojis in `.info` using command `.setinfo`. In order to use it, remove buttons using config
 - Patch internal help module with bugfixes
 - Clean type-hint mess, document utils and other methods, which were undocumented
@@ -37,6 +39,7 @@
 - Enable `joinChannel` and `importChatInvite` calls-by-external-modules blockage for all users by default
 - Change inline query placeholder to `user@hikka:~$` + legacy migration
 - Completely drop Heroku support due to legacy code, limits and removing of free tier
+- Allow user to send code only once to prevent FloodWaits
 
 ## 🌑 Hikka 1.4.2
 

hikka/main.py

@@ -81,6 +81,7 @@ try:
 except Exception:
     pass
 
+
 def run_config(data_root: str):
     """Load configurator.py"""
     from . import configurator
@@ -375,10 +376,7 @@ class Hikka:
                 importlib.invalidate_caches()
                 self._get_api_token()
 
-    async def save_client_session(
-        self,
-        client: CustomTelegramClient
-    ):
+    async def save_client_session(self, client: CustomTelegramClient):
         if hasattr(client, "_tg_id"):
             telegram_id = client._tg_id
         else:

hikka/modules/loader.py

@@ -732,14 +732,11 @@ class LoaderMod(loader.Module):
             await utils.answer(message, self.strings("bad_unicode"))
             return
 
-        if (
-            not self._db.get(
-                main.__name__,
-                "disable_modules_fs",
-                False,
-            )
-            and not self._db.get(main.__name__, "permanent_modules_fs", False)
-        ):
+        if not self._db.get(
+            main.__name__,
+            "disable_modules_fs",
+            False,
+        ) and not self._db.get(main.__name__, "permanent_modules_fs", False):
             if message.file:
                 await message.edit("")
                 message = await message.respond("🌘")

hikka/modules/updater.py

@@ -340,7 +340,9 @@ class UpdaterMod(loader.Module):
                 or not self.inline.init_complete
                 or not await self.inline.form(
                     message=message,
-                    text=self.strings("update_confirm").format(current, current[:8], upcoming, upcoming[:8])
+                    text=self.strings("update_confirm").format(
+                        current, current[:8], upcoming, upcoming[:8]
+                    )
                     if upcoming != current
                     else self.strings("no_update"),
                     reply_markup=[

hikka/web/root.py

@@ -206,6 +206,9 @@ class Web:
         if not self._check_session(request):
             return web.Response(status=401, body="Authorization required")
 
+        if self._pending_client:
+            return web.Response(status=208, body="Already pending")
+
         text = await request.text()
         phone = telethon.utils.parse_phone(text)
 

web-resources/root.jinja2

@@ -29,6 +29,12 @@
   <div class="waiting_for_auth">Waiting for permission...</div>
   <div class="confirm_auth">Please, confirm action in <span style="color:#28a0dc">Telegram</span></div>
 </div>
+<div class="auth-code-form blur">
+  <div id="monkey"></div>
+  <div id="monkey-close"></div>
+  <span class="code-caption">Enter the code you recieved from Telegram</span>
+  <input type="text" class="code-input" inputmode="numeric" autocomplete="off">
+</div>
 <div class="wrapper">
   <div class="blur main finish_block">
     <div id="installation_icon"></div>

web-resources/static/base.css

@@ -578,4 +578,50 @@ label {
     margin: auto;
     z-index: -1;
     overflow: hidden;
-}
+}
+
+.auth-code-form {
+    display: none;
+    width: 60%;
+    height: 80%;
+    padding: 0;
+    border-radius: 15px;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    margin: auto;
+    z-index: 101;
+    text-align: center;
+}
+
+#monkey, #monkey-close {
+    height: 200px;
+    margin-top: 30px;
+}
+
+#monkey-close {
+    display: none;
+}
+
+.code-input {
+    width: 50%;
+    margin-top: 25px;
+    height: 32px;
+    border-radius: 15px;
+    border: 1px solid #121212;
+    background: #212121;
+    transition: border .2s ease-in;
+    font-size: 18px;
+}
+
+.code-input:focus {
+    border: 2px solid rgb(135, 116, 225);
+}
+
+.code-caption {
+    font-size: 26px;
+    color: #fefefe;
+    padding-top: 50px;
+}

web-resources/static/root.js

@@ -115,15 +115,44 @@ function tg_code() {
         .then((response) => {
             if (!response.ok) {
                 if (response.status == 401) {
-                    switch_block("2fa");
+                    $(".auth-code-form").hide().fadeIn(300, () => {
+                        $("#monkey-close").html();
+                        anim = bodymovin.loadAnimation({
+                            container: document.getElementById("monkey-close"),
+                            renderer: "canvas",
+                            loop: false,
+                            autoplay: true,
+                            path: "https://static.hikari.gay/monkey-close.json",
+                            rendererSettings: {
+                                clearCanvas: true,
+                            }
+                        });
+                        anim.addEventListener("complete", function () {
+                            setTimeout(function () {
+                                anim.goToAndPlay(0);
+                            }, 2000);
+                        })
+                    });
+                    $(".code-input").removeAttr("disabled");
+                    $(".code-caption").html("Enter your Telegram 2FA password, then press <span style='color: #dc137b;'>Enter</span>");
+                    cnt_btn.setAttribute("current-step", "2fa");
+                    $("#monkey").hide();
+                    $("#monkey-close").hide().fadeIn(100);
+                    _current_block = "2fa";
                 } else {
+                    $(".code-input").removeAttr("disabled");
                     response.text().then((text) => {
                         error_state();
-                        Swal.showValidationMessage(text);
+                        Swal.fire(
+                            "Error",
+                            text,
+                            "error"
+                        );
                     });
                 }
             } else {
-                switch_block("custom_bot")
+                $(".auth-code-form").fadeOut();
+                switch_block("custom_bot");
             }
         })
         .catch(error => {
@@ -241,22 +270,28 @@ function process_next() {
                         error_message(text);
                     });
                 } else {
-                    Swal.fire({
-                        title: "Enter received code",
-                        input: "text",
-                        inputAttributes: {
-                            autocapitalize: "off"
-                        },
-                        showCancelButton: false,
-                        allowOutsideClick: false,
-                        allowEscapeKey: false,
-                        confirmButtonText: "Confirm",
-                        showLoaderOnConfirm: true,
-                        preConfirm: (login) => {
-                            _tg_pass = login
-                            tg_code();
-                        },
-                    })
+                    $(".auth-code-form").hide().fadeIn(300, () => {
+                        $("#monkey").html();
+                        anim2 = bodymovin.loadAnimation({
+                            container: document.getElementById("monkey"),
+                            renderer: "canvas",
+                            loop: false,
+                            autoplay: true,
+                            path: "https://static.hikari.gay/monkey.json",
+                            rendererSettings: {
+                                clearCanvas: true,
+                            }
+                        });
+                        anim2.addEventListener("complete", function () {
+                            setTimeout(function () {
+                                anim2.goToAndPlay(0);
+                            }, 2000);
+                        })
+                    });
+                    $(".code-input").removeAttr("disabled");
+                    $(".code-caption").text("Enter the code you recieved in Telegram");
+                    cnt_btn.setAttribute("current-step", "code");
+                    _current_block = "code";
                 }
             })
             .catch((err) => {
@@ -323,7 +358,7 @@ cnt_btn.onclick = () => {
     process_next();
 }
 
-$("input").on("keyup", (e) => {
+$(".installation input").on("keyup", (e) => {
     if (cnt_btn.disabled) return;
     if (auth_required) return auth(() => {
         cnt_btn.click();
@@ -332,4 +367,19 @@ $("input").on("keyup", (e) => {
     if (e.key === "Enter" || e.keyCode === 13) {
         process_next();
     }
+});
+
+$(".code-input").on("keyup", (e) => {
+    if (_current_block == "code" && $(".code-input").val().length == 5) {
+        _tg_pass = $(".code-input").val();
+        $(".code-input").attr("disabled", "true");
+        $(".code-input").val("");
+        tg_code();
+    } else if (_current_block == "2fa" && (e.key === "Enter" || e.keyCode === 13)) {
+        let _2fa = $(".code-input").val();
+        _2fa_pass = _2fa;
+        $(".code-input").attr("disabled", "true");
+        $(".code-input").val("");
+        tg_code();
+    }
 });