underpost 2.8.532 → 2.8.611

package/src/cli/deploy.js

@@ -32,7 +32,7 @@ class UnderpostDeploy {
       await Config.build(undefined, 'proxy', deployList);
       return buildPortProxyRouter(env === 'development' ? 80 : 443, buildProxyRouter());
     },
-    async buildManifest(deployList, env) {
+    async buildManifest(deployList, env, version) {
       for (const _deployId of deployList.split(',')) {
         const deployId = _deployId.trim();
         if (!deployId) continue;
@@ -69,7 +69,18 @@ spec:
     spec:
       containers:
         - name: ${deployId}-${env}
-          image: localhost/${deployId}-${env}:${Underpost.version}
+          image: localhost/underpost-engine:${version && typeof version === 'string' ? version : Underpost.version}
+          lifecycle:
+            postStart:
+              exec:
+                command:
+                  - /bin/sh
+                  - -c
+                  - >
+                    sleep 60 &&
+                    underpost config set deploy-id ${deployId} &&
+                    underpost config set deploy-env ${env}
+# image: localhost/${deployId}-${env}:${version && typeof version === 'string' ? version : Underpost.version}
 ---
 apiVersion: v1
 kind: Service
@@ -180,32 +191,55 @@ spec:
     async callback(
       deployList = 'default',
       env = 'development',
-      options = { remove: false, infoRouter: false, sync: false, buildManifest: false },
+      options = {
+        remove: false,
+        infoRouter: false,
+        sync: false,
+        buildManifest: false,
+        infoUtil: false,
+        expose: false,
+        cert: false,
+        version: '',
+      },
     ) {
+      if (options.infoUtil === true)
+        return logger.info(`
+kubectl rollout restart deployment/deployment-name
+kubectl rollout undo deployment/deployment-name
+kubectl scale statefulsets <stateful-set-name> --replicas=<new-replicas>
+        `);
       if (deployList === 'dd' && fs.existsSync(`./engine-private/deploy/dd.router`))
         deployList = fs.readFileSync(`./engine-private/deploy/dd.router`, 'utf8');
       if (options.sync) UnderpostDeploy.API.sync(deployList);
-      if (options.buildManifest === true) await UnderpostDeploy.API.buildManifest(deployList, env);
+      if (options.buildManifest === true) await UnderpostDeploy.API.buildManifest(deployList, env, options.version);
       if (options.infoRouter === true)
         return logger.info('router', await UnderpostDeploy.API.routerFactory(deployList, env));
+      const etcHost = (
+        concat,
+      ) => `127.0.0.1  ${concat} localhost localhost.localdomain localhost4 localhost4.localdomain4
+::1         localhost localhost.localdomain localhost6 localhost6.localdomain6`;
+      let concatHots = '';
 
       for (const _deployId of deployList.split(',')) {
         const deployId = _deployId.trim();
         if (!deployId) continue;
-
+        if (options.expose === true) {
+          const svc = UnderpostDeploy.API.get(deployId, 'svc')[0];
+          const port = parseInt(svc[`PORT(S)`].split('/TCP')[0]);
+          logger.info(deployId, {
+            svc,
+            port,
+          });
+          shellExec(`sudo kubectl port-forward -n default svc/${svc.NAME} ${port}:${port}`, { async: true });
+          continue;
+        }
         shellExec(`sudo kubectl delete svc ${deployId}-${env}-service`);
         shellExec(`sudo kubectl delete deployment ${deployId}-${env}`);
 
-        const etcHost = (
-          concat,
-        ) => `127.0.0.1  ${concat} localhost localhost.localdomain localhost4 localhost4.localdomain4
-::1         localhost localhost.localdomain localhost6 localhost6.localdomain6`;
-        let concatHots = '';
-
         const confServer = JSON.parse(fs.readFileSync(`./engine-private/conf/${deployId}/conf.server.json`, 'utf8'));
         for (const host of Object.keys(confServer)) {
           shellExec(`sudo kubectl delete HTTPProxy ${host}`);
-          if (env === 'production') shellExec(`sudo kubectl delete Certificate ${host}`);
+          if (env === 'production' && options.cert === true) shellExec(`sudo kubectl delete Certificate ${host}`);
           if (!options.remove === true && env === 'development') concatHots += ` ${host}`;
         }
 
@@ -217,39 +251,38 @@ spec:
         if (!options.remove === true) {
           shellExec(`sudo kubectl apply -f ./${manifestsPath}/deployment.yaml`);
           shellExec(`sudo kubectl apply -f ./${manifestsPath}/proxy.yaml`);
-          if (env === 'production') shellExec(`sudo kubectl apply -f ./${manifestsPath}/secret.yaml`);
+          if (env === 'production' && options.cert === true)
+            shellExec(`sudo kubectl apply -f ./${manifestsPath}/secret.yaml`);
         }
+      }
+      let renderHosts;
+      switch (process.platform) {
+        case 'linux':
+          {
+            switch (env) {
+              case 'development':
+                renderHosts = etcHost(concatHots);
+                fs.writeFileSync(`/etc/hosts`, renderHosts, 'utf8');
 
-        let renderHosts;
-
-        switch (process.platform) {
-          case 'linux':
-            {
-              switch (env) {
-                case 'development':
-                  renderHosts = etcHost(concatHots);
-                  fs.writeFileSync(`/etc/hosts`, renderHosts, 'utf8');
-
-                  break;
+                break;
 
-                default:
-                  break;
-              }
+              default:
+                break;
             }
-            break;
+          }
+          break;
 
-          default:
-            break;
-        }
-        if (renderHosts)
-          logger.info(
-            `
-` + renderHosts,
-          );
+        default:
+          break;
       }
+      if (renderHosts)
+        logger.info(
+          `
+` + renderHosts,
+        );
     },
-    getPods(deployId) {
-      const raw = shellExec(`sudo kubectl get pods --all-namespaces -o wide`, {
+    get(deployId, kindType = 'pods') {
+      const raw = shellExec(`sudo kubectl get ${kindType} --all-namespaces -o wide`, {
         stdout: true,
         disableLog: true,
         silent: true,

package/src/cli/fs.js

@@ -0,0 +1,149 @@
+import { v2 as cloudinary } from 'cloudinary';
+import { loggerFactory } from '../server/logger.js';
+import dotenv from 'dotenv';
+import AdmZip from 'adm-zip';
+import * as dir from 'path';
+import fs from 'fs-extra';
+import { Downloader } from '../server/downloader.js';
+import UnderpostRepository from './repository.js';
+import { shellExec } from '../server/process.js';
+dotenv.config();
+
+const logger = loggerFactory(import.meta);
+
+class UnderpostFileStorage {
+  static API = {
+    cloudinaryConfig() {
+      // https://console.cloudinary.com/
+      cloudinary.config({
+        cloud_name: process.env.CLOUDINARY_CLOUD_NAME,
+        api_key: process.env.CLOUDINARY_API_KEY,
+        api_secret: process.env.CLOUDINARY_API_SECRET,
+      });
+    },
+    getStorageConf(options) {
+      let storage, storageConf;
+      if (options.deployId && typeof options.deployId === 'string') {
+        storageConf = `./engine-private/conf/${options.deployId}/storage.json`;
+        if (!fs.existsSync(storageConf)) fs.writeFileSync(storageConf, JSON.stringify({}), 'utf8');
+        storage = JSON.parse(fs.readFileSync(storageConf, 'utf8'));
+      }
+      return { storage, storageConf };
+    },
+    writeStorageConf(storage, storageConf) {
+      if (storage) fs.writeFileSync(storageConf, JSON.stringify(storage, null, 4), 'utf8');
+    },
+    async recursiveCallback(
+      path,
+      options = { rm: false, recursive: false, deployId: '', force: false, pull: false, git: false },
+    ) {
+      const { storage, storageConf } = UnderpostFileStorage.API.getStorageConf(options);
+      const deleteFiles = UnderpostRepository.API.getDeleteFiles(path);
+      for (const relativePath of deleteFiles) {
+        const _path = path + '/' + relativePath;
+        if (_path in storage) {
+          await UnderpostFileStorage.API.delete(_path);
+          delete storage[_path];
+        }
+      }
+      const files =
+        options.git === true
+          ? UnderpostRepository.API.getChangedFiles(path)
+          : await fs.readdir(path, { recursive: true });
+      if (options.pull === true) {
+        for (const _path of Object.keys(storage)) {
+          if (!fs.existsSync(_path) || options.force === true) {
+            if (options.force === true && fs.existsSync(_path)) fs.removeSync(_path);
+            await UnderpostFileStorage.API.pull(_path, options);
+          } else logger.warn(`Pull path already exists`, _path);
+        }
+      } else
+        for (const relativePath of files) {
+          const _path = path + '/' + relativePath;
+          if (fs.statSync(_path).isDirectory()) {
+            if (options.pull === true && !fs.existsSync(_path)) fs.mkdirSync(_path, { recursive: true });
+            continue;
+          } else if (!(_path in storage) || options.force === true) {
+            await UnderpostFileStorage.API.upload(_path, options);
+            if (storage) storage[_path] = {};
+          } else logger.warn('File already exists', _path);
+        }
+      UnderpostFileStorage.API.writeStorageConf(storage, storageConf);
+      if (options.git === true) {
+        shellExec(`cd ${path} && git add .`);
+        shellExec(`underpost cmt ${path} feat`);
+      }
+    },
+    async callback(
+      path,
+      options = { rm: false, recursive: false, deployId: '', force: false, pull: false, git: false },
+    ) {
+      if (options.recursive === true || options.git === true)
+        return await UnderpostFileStorage.API.recursiveCallback(path, options);
+      if (options.pull === true) return await UnderpostFileStorage.API.pull(path, options);
+      if (options.rm === true) return await UnderpostFileStorage.API.delete(path, options);
+      return await UnderpostFileStorage.API.upload(path, options);
+    },
+    async upload(path, options = { rm: false, recursive: false, deployId: '', force: false, pull: false }) {
+      UnderpostFileStorage.API.cloudinaryConfig();
+      const { storage, storageConf } = UnderpostFileStorage.API.getStorageConf(options);
+      // path = UnderpostFileStorage.API.file2Zip(path);
+      const uploadResult = await cloudinary.uploader
+        .upload(path, {
+          public_id: path,
+          resource_type: 'raw',
+          overwrite: options.force === true ? true : false,
+        })
+        .catch((error) => {
+          logger.error(error, { path, stack: error.stack });
+        });
+      logger.info('upload result', uploadResult);
+      if (storage) storage[path] = {};
+      UnderpostFileStorage.API.writeStorageConf(storage, storageConf);
+      return uploadResult;
+    },
+    async pull(path) {
+      UnderpostFileStorage.API.cloudinaryConfig();
+      const folder = dir.dirname(path);
+      if (!fs.existsSync(folder)) fs.mkdirSync(folder, { recursive: true });
+      const downloadResult = await cloudinary.utils.download_archive_url({
+        public_ids: [path],
+        resource_type: 'raw',
+      });
+      logger.info('download result', downloadResult);
+      await Downloader(downloadResult, path + '.zip');
+      path = UnderpostFileStorage.API.zip2File(path + '.zip');
+      fs.removeSync(path + '.zip');
+    },
+    async delete(path) {
+      UnderpostFileStorage.API.cloudinaryConfig();
+      const deleteResult = await cloudinary.api
+        .delete_resources([path], { type: 'upload', resource_type: 'raw' })
+        .catch((error) => {
+          logger.error(error, { path, stack: error.stack });
+        });
+      logger.info('delete result', deleteResult);
+      return deleteResult;
+    },
+    file2Zip(path) {
+      const zip = new AdmZip();
+      zip.addLocalFile(path, '/');
+      path = path + '.zip';
+      zip.writeZip(path);
+      return path;
+    },
+    zip2File(path) {
+      const zip = new AdmZip(path);
+      path = path.replaceAll('.zip', '');
+      zip.extractEntryTo(
+        /*entry name*/ path.split('/').pop(),
+        /*target path*/ dir.dirname(path),
+        /*maintainEntryPath*/ false,
+        /*overwrite*/ true,
+      );
+      return path;
+    },
+  };
+}
+
+export default UnderpostFileStorage;

package/src/cli/image.js

@@ -1,9 +1,10 @@
 import fs from 'fs-extra';
 import Underpost from '../index.js';
-import { shellExec } from '../server/process.js';
+import { shellCd, shellExec } from '../server/process.js';
 import dotenv from 'dotenv';
 import { getNpmRootPath } from '../server/conf.js';
 import { timer } from '../client/components/core/CommonJs.js';
+import UnderpostRootEnv from './env.js';
 
 dotenv.config();
 
@@ -17,9 +18,13 @@ class UnderpostImage {
         deployId = 'default',
         env = 'development',
         path = '.',
-        options = { imageArchive: false, podmanSave: false },
+        options = { imageArchive: false, podmanSave: false, imageName: '', imageVersion: '' },
       ) {
-        const imgName = `${deployId}-${env}:${Underpost.version}`;
+        const imgName = `${
+          options.imageName && typeof options.imageName === 'string' ? options.imageName : `${deployId}-${env}`
+        }:${
+          options.imageVersion && typeof options.imageVersions === 'string' ? options.imageVersion : Underpost.version
+        }`;
         const podManImg = `localhost/${imgName}`;
         const imagesStoragePath = `/images`;
         if (!fs.existsSync(`${path}${imagesStoragePath}`))
@@ -48,7 +53,32 @@ class UnderpostImage {
           shellExec(`cd ${path} && podman save -o ${tarFile} ${podManImg}`);
         shellExec(`cd ${path} && sudo kind load image-archive ${tarFile}`);
       },
-      async script(deployId = 'default', env = 'development', options = { run: false }) {
+      async script(deployId = 'default', env = 'development', options = { run: false, build: false }) {
+        if (deployId === 'deploy') {
+          const _deployId = UnderpostRootEnv.API.get('deploy-id');
+          const _env = UnderpostRootEnv.API.get('deploy-env');
+          if (_deployId) {
+            deployId = _deployId;
+            if (_env) env = _env;
+          } else {
+            await timer(30 * 1000);
+            return await UnderpostImage.API.dockerfile.script(deployId, env, options);
+          }
+        }
+        if (options.build === true) {
+          const buildBasePath = `/home/dd`;
+          const repoName = `engine-${deployId.split('-')[1]}`;
+          fs.mkdirSync(buildBasePath, { recursive: true });
+          shellExec(`cd ${buildBasePath} && underpost clone underpostnet/${repoName}`);
+          shellExec(`cd ${buildBasePath} && sudo mv ./${repoName} ./engine`);
+          shellExec(`cd ${buildBasePath}/engine && underpost clone underpostnet/${repoName}-private`);
+          shellExec(`cd ${buildBasePath}/engine && sudo mv ./${repoName}-private ./engine-private`);
+          shellCd(`${buildBasePath}/engine`);
+          shellExec(`npm install`);
+          const itcScripts = fs.readdir('./engine-private/itc-scripts');
+          for (const itcScript of itcScripts)
+            if (itcScript.match(deployId)) shellExec(`node ./engine-private/itc-scripts/${itcScript}`);
+        }
         switch (deployId) {
           case 'dd-lampp':
             {
@@ -97,7 +127,7 @@ class UnderpostImage {
             const replicas = await fs.readdir(`./engine-private/replica`);
             for (const replica of replicas) {
               shellExec(`node bin/deploy conf ${replica} ${env}`);
-              shellExec(`npm ${runCmd} ${replica} deploy`, { async: true });
+              shellExec(`npm ${runCmd} deploy deploy-id:${replica}`, { async: true });
               fs.writeFileSync(`./tmp/await-deploy`, '', 'utf8');
               const monitor = async () => {
                 await timer(1000);
@@ -107,7 +137,7 @@ class UnderpostImage {
             }
             shellExec(`node bin/deploy conf ${deployId} ${env}`);
           }
-          shellExec(`npm ${runCmd} ${deployId} deploy`);
+          shellExec(`npm ${runCmd} deploy deploy-id:${deployId}`);
         }
       },
     },

package/src/cli/repository.js

@@ -98,6 +98,27 @@ class UnderpostRepository {
         }
       });
     },
+
+    getDeleteFiles(path = '.') {
+      const commandUntrack = `cd ${path} && git ls-files --deleted`;
+      const diffUntrackOutput = shellExec(commandUntrack, { stdout: true, silent: true });
+      return diffUntrackOutput.toString().split('\n').filter(Boolean);
+    },
+
+    getChangedFiles(path = '.', extension = '', head = false) {
+      const extensionFilter = extension ? `-- '***.${extension}'` : '';
+      const command = `cd ${path} && git diff ${head ? 'HEAD^ HEAD ' : ''}--name-only ${extensionFilter}`;
+      const commandUntrack = `cd ${path} && git ls-files --others --exclude-standard`;
+      const diffOutput = shellExec(command, { stdout: true, silent: true });
+      const diffUntrackOutput = shellExec(commandUntrack, { stdout: true, silent: true });
+      const deleteFiles = UnderpostRepository.API.getDeleteFiles(path);
+      return diffOutput
+        .toString()
+        .split('\n')
+        .filter(Boolean)
+        .concat(diffUntrackOutput.toString().split('\n').filter(Boolean))
+        .filter((f) => !deleteFiles.includes(f));
+    },
   };
 }
 

package/src/cli/script.js

@@ -26,13 +26,13 @@ class UnderpostScript {
         const podMatch = options.podName && typeof options.podName === 'string' ? options.podName : key;
 
         if (fs.existsSync(`${value}`)) {
-          for (const pod of UnderpostDeploy.API.getPods(podMatch)) {
+          for (const pod of UnderpostDeploy.API.get(podMatch)) {
             shellExec(`sudo kubectl cp ${value} ${nameSpace}/${pod.NAME}:${podScriptPath}`);
             const cmd = `node ${podScriptPath}`;
             shellExec(`sudo kubectl exec -i ${pod.NAME} -- sh -c "${cmd}"`);
           }
         } else {
-          for (const pod of UnderpostDeploy.API.getPods(podMatch)) {
+          for (const pod of UnderpostDeploy.API.get(podMatch)) {
             shellExec(`sudo kubectl exec -i ${pod.NAME} -- sh -c "${value}"`);
           }
         }

package/src/cli/test.js

@@ -36,10 +36,10 @@ class UnderpostTest {
         options.podStatus &&
         typeof options.podStatus === 'string'
       )
-        return await UnderpostTest.API.podStatusMonitor(options.podName, options.podStatus);
+        return await UnderpostTest.API.statusMonitor(options.podName, options.podStatus, options.kindType);
 
       if (options.sh === true || options.logs === true) {
-        const [pod] = UnderpostDeploy.API.getPods(deployList);
+        const [pod] = UnderpostDeploy.API.get(deployList);
         if (pod) {
           if (options.sh) return pbcopy(`sudo kubectl exec -it ${pod.NAME} -- sh`);
           if (options.logs) return shellExec(`sudo kubectl logs -f ${pod.NAME}`);
@@ -73,7 +73,7 @@ class UnderpostTest {
                 break;
             }
           else {
-            const pods = UnderpostDeploy.API.getPods(deployId);
+            const pods = UnderpostDeploy.API.get(deployId);
             if (pods.length > 0)
               for (const deployData of pods) {
                 const { NAME } = deployData;
@@ -86,16 +86,27 @@ class UnderpostTest {
         }
       } else return UnderpostTest.API.run();
     },
-    podStatusMonitor(podName, status = 'Running', deltaMs = 1000) {
+    statusMonitor(podName, status = 'Running', kindType = '', deltaMs = 1000, maxAttempts = 60 * 5) {
+      if (!(kindType && typeof kindType === 'string')) kindType = 'pods';
       return new Promise(async (resolve) => {
         let index = 0;
-        logger.info(`Loading ${podName} instance`, { status, deltaMs });
+        logger.info(`Loading instance`, { podName, status, kindType, deltaMs, maxAttempts });
         const _monitor = async () => {
           await timer(deltaMs);
-          const result = UnderpostDeploy.API.getPods(podName).find((p) => p.STATUS === status);
-          logger.info(`Testing pod ${podName}... ${result ? 1 : 0}/1 - elapsed time ${deltaMs * (index + 1)}ms`);
-          if (result) return resolve();
+          const pods = UnderpostDeploy.API.get(podName, kindType);
+          const result = pods.find((p) => p.STATUS === status);
+          logger.info(
+            `Testing pod ${podName}... ${result ? 1 : 0}/1 - elapsed time ${deltaMs * (index + 1)}s - attempt ${
+              index + 1
+            }/${maxAttempts}`,
+            pods[0] ? pods[0].STATUS : 'Not found kind object',
+          );
+          if (result) return resolve(true);
           index++;
+          if (index === maxAttempts) {
+            logger.error(`Failed to test pod ${podName} within ${maxAttempts} attempts`);
+            return resolve(false);
+          }
           return _monitor();
         };
         await _monitor();

package/src/client/components/core/CalendarCore.js

@@ -404,7 +404,15 @@ const CalendarCore = {
         <div class="in" style="margin-bottom: 100px"></div>`;
     };
 
+    let delayBlock = false;
     this.Data[options.idModal].updatePanel = async () => {
+      if (delayBlock) return;
+      else {
+        delayBlock = true;
+        setTimeout(() => {
+          delayBlock = false;
+        }, 500);
+      }
       const cid = getQueryParams().cid ? getQueryParams().cid : '';
       if (options.route === 'home') Modal.homeCid = newInstance(cid);
       if (s(`.main-body-calendar-${options.idModal}`)) {
@@ -426,7 +434,10 @@ const CalendarCore = {
         },
       });
 
-    if (options.route === 'home') setTimeout(CalendarCore.Data[options.idModal].updatePanel);
+    // if (options.route === 'home')
+    setTimeout(() => {
+      CalendarCore.Data[options.idModal].updatePanel();
+    });
 
     return html`
       <style>

package/src/client/components/core/CommonJs.js

@@ -890,8 +890,58 @@ const commitData = {
   },
 };
 
-const userRoleEnum = ['admin', 'moderator', 'user', 'guest'];
+const emotionsData = [
+  {
+    name: 'like',
+    ad_display: {
+      es: 'Me gusta',
+      en: 'Like',
+    },
+    emoji: '👍',
+  },
+  {
+    name: 'love',
+    ad_display: {
+      es: 'Me encanta',
+      en: 'Love',
+    },
+    emoji: '❤️',
+  },
+  {
+    name: 'haha',
+    ad_display: {
+      es: 'Me divierte',
+      en: 'Haha',
+    },
+    emoji: '😂',
+  },
+  {
+    name: 'wow',
+    ad_display: {
+      es: 'Me asombra',
+      en: 'Wow',
+    },
+    emoji: '😮',
+  },
+  {
+    name: 'sad',
+    ad_display: {
+      es: 'Me entristece',
+      en: 'Sad',
+    },
+    emoji: '😢',
+  },
+  {
+    name: 'angry',
+    ad_display: {
+      es: 'Me enoja',
+      en: 'Angry',
+    },
+    emoji: '😠',
+  },
+];
 
+const userRoleEnum = ['admin', 'moderator', 'user', 'guest'];
 const commonAdminGuard = (role) => userRoleEnum.indexOf(role) === userRoleEnum.indexOf('admin');
 const commonModeratorGuard = (role) => userRoleEnum.indexOf(role) <= userRoleEnum.indexOf('moderator');
 
@@ -954,4 +1004,5 @@ export {
   getCurrentTrace,
   userRoleEnum,
   commitData,
+  emotionsData,
 };

package/src/client/components/core/CssCore.js

@@ -396,8 +396,7 @@ const CssCoreDark = {
           text-align: center;
           background: #1a1a1a;
           font-size: 17px;
-          padding-top: 7px;
-          padding-bottom: 6px;
+          height: 35px;
         }
         ::placeholder {
           color: #c6c4c4;
@@ -701,8 +700,7 @@ const CssCoreLight = {
           text-align: center;
           background: #eaeaea;
           font-size: 17px;
-          padding-top: 7px;
-          padding-bottom: 6px;
+          height: 35px;
         }
         ::placeholder {
           color: #333;

package/src/client/components/core/Docs.js

@@ -1,4 +1,3 @@
-import { _VERSION, CoreService } from '../../services/core/core.service.js';
 import { Badge } from './Badge.js';
 import { BtnIcon } from './BtnIcon.js';
 import { rgbToHex } from './CommonJs.js';
@@ -80,7 +79,7 @@ const Docs = {
       icon: html`<i class="fa-brands fa-osi"></i>`,
       text: 'Source Docs',
       url: function () {
-        return `${getProxyPath()}docs/engine/${_VERSION}`;
+        return `${getProxyPath()}docs/engine/${window.renderPayload.version}`;
       },
     },
     {

package/src/client/components/core/Input.js

@@ -88,8 +88,10 @@ const Input = {
               <div class="fl input-row-${id}">
                 <div class="in fll" style="width: 80%;">${inputElement}</div>
                 <div class="in fll btn-eye-password btn-eye-${id}" style="width: 20%;">
-                  <i class="fas fa-eye fa-eye-${id} eye-password"></i>
-                  <i class="fas fa-eye-slash fa-eye-slash-${id} eye-password" style="display: none"></i>
+                  <div class="abs center">
+                    <i class="fas fa-eye fa-eye-${id} eye-password"></i>
+                    <i class="fas fa-eye-slash fa-eye-slash-${id} eye-password" style="display: none"></i>
+                  </div>
                 </div>
               </div>
             `

package/src/client/components/core/LoadingAnimation.js

@@ -75,12 +75,17 @@ const LoadingAnimation = {
       const style = {
         'text-align': 'center',
       };
-
       if (s(container).classList) {
         const classes = Array.from(s(container).classList);
         if (classes.find((e) => e.match('management-table-btn-mini'))) {
           style.top = '-2px';
           style.left = '-2px';
+        } else if (classes.find((e) => e.match('-btn-tool'))) {
+          style.top = '-26px';
+          style.left = '-10px';
+        } else if (classes.find((e) => e.match('main-btn-')) && !classes.find((e) => e.match('main-btn-square-menu'))) {
+          style.top = '-8px';
+          style.left = '-10px';
         } else if (classes.find((e) => e.match('action-bar-box'))) {
           style.top = '-30px';
           style.left = '-12px';
@@ -145,6 +150,8 @@ const LoadingAnimation = {
         s(backgroundContainer).style.opacity = 0;
         setTimeout(async () => {
           s(backgroundContainer).style.display = 'none';
+          if (s(`.modal-menu`)) s(`.modal-menu`).classList.remove('hide');
+          if (s(`.main-body-btn-container`)) s(`.main-body-btn-container`).classList.remove('hide');
           if (callBack) callBack();
         }, 300);
       });