fix: bootstrap5 modal

hwe/ts/battle_simulator.ts

@@ -9,6 +9,7 @@ import { numberWithCommas } from "@util/numberWithCommas";
 import { unwrap_any } from '@util/unwrap_any';
 import { BasicGeneralListResponse, InvalidResponse } from '@/defs';
 import { formatTime } from '@util/formatTime';
+import { Modal } from 'bootstrap';
 
 type CityAttackerInfo = {
     level: number,
@@ -222,7 +223,7 @@ $(function ($) {
 
             const $modal = $('#importModal');
             $modal.data('target', $card);
-            $modal.modal('show');
+            new Modal($modal[0]).show();
         });
 
         $('.btn-general-save').on('click', function () {
@@ -959,7 +960,7 @@ $(function ($) {
             const $card = $modal.data('target');
             importGeneralInfo($card, data.general);
 
-            $modal.modal('hide');
+            new Modal($modal[0]).hide();
         }, errUnknown);
 
 
@@ -1008,7 +1009,7 @@ $(function ($) {
             }).then(function (data: BasicGeneralListResponse | InvalidResponse) {
                 if (!data.result) {
                     alert(data.reason);
-                    $('#importModal').modal('hide');
+                    new Modal(unwrap(document.querySelector('#importModal'))).hide();
                     return false;
                 }
 

hwe/ts/gateway/login.ts

@@ -231,10 +231,12 @@ async function doLoginUsingOAuth() {
     }
 
     const modalEl = unwrap(document.querySelector('#modalOTP'))
+    if (!modalOTP) {
         modalOTP = new Modal(modalEl);
         modalEl.addEventListener('shown.bs.modal', function () {
-        $('#otp_code').trigger('focus');
+            unwrap(document.querySelector<HTMLElement>('#otp_code')).focus();
         });
+    }
     modalOTP.show();
 }
 
@@ -342,10 +344,14 @@ $(async function ($) {
             return;
         }
 
-        const $modal = $('#modalOTP').modal() as unknown as JQuery;
-        $modal.on('shown.bs.modal', function () {
-            $('#otp_code').trigger('focus');
+        const modalEl = unwrap(document.querySelector('#modalOTP'))
+        if (!modalOTP) {
+            modalOTP = new Modal(modalEl);
+            modalEl.addEventListener('shown.bs.modal', function () {
+                unwrap(document.querySelector<HTMLElement>('#otp_code')).focus();
             });
+        }
+        modalOTP.show();
     });
 
     $('#otp_form').on('submit', async function (e) {

hwe/ts/gateway/user_info.ts

@@ -10,6 +10,7 @@ import { unwrap } from '@util/unwrap';
 import { parseTime } from '@util/parseTime';
 import { formatTime } from '@util/formatTime';
 import '@/gateway/common';
+import { Modal } from 'bootstrap';
 
 type ResultUserInfo = {
     result: true,
@@ -128,14 +129,14 @@ function showAdjustServerModal(serverList: [string, string][]) {
         $form.append($item);
     }
 
-    const $modal = $('#chooseServer');
-    $modal.modal({
+    const modalEl = unwrap(document.querySelector('#chooseServer'));
+     new Modal(modalEl, {
         backdrop: 'static'
     });
-    $modal.on('hidden.bs.modal', function () {
+    modalEl.addEventListener('hidden.bs.modal', function () {
         location.reload();
         return;
-    });
+    })
 
     $("#modal-apply").off("click").on("click", async function () {
         const events: Promise<unknown>[] = [];