underpost 2.7.1 → 2.7.2

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

@@ -1,181 +1,187 @@
-import { CoreService } from '../../services/core/core.service.js';
-import { FileService } from '../../services/file/file.service.js';
-import { UserService } from '../../services/user/user.service.js';
-import { BtnIcon } from './BtnIcon.js';
-import { EventsUI } from './EventsUI.js';
-import { Input } from './Input.js';
-import { NotificationManager } from './NotificationManager.js';
-import { Translate } from './Translate.js';
-import { Validator } from './Validator.js';
-import { htmls, s } from './VanillaJs.js';
-import { Webhook } from './Webhook.js';
-
-const LogIn = {
-  Scope: {
-    user: {
-      main: {
-        model: {
-          user: {},
-        },
-      },
-    },
-  },
-  Event: {},
-  Trigger: async function (options) {
-    const { user } = options;
-    await Webhook.register({ user });
-    for (const eventKey of Object.keys(this.Event)) await this.Event[eventKey](options);
-    if (s(`.session`))
-      htmls(
-        `.session`,
-        html`<style>
-          .session-in-log-in {
-            display: block;
-          }
-          .session-inl-log-in {
-            display: inline-table;
-          }
-          .session-in-log-out {
-            display: none;
-          }
-          .session-inl-log-out {
-            display: none;
-          }
-        </style>`,
-      );
-    if (!this.Scope.user.main.model.user.profileImage) {
-      const resultFile = await FileService.get({ id: user.profileImageId });
-      if (resultFile && resultFile.status === 'success' && resultFile.data[0]) {
-        const imageData = resultFile.data[0];
-
-        const imageBlob = new Blob([new Uint8Array(imageData.data.data)], { type: imageData.mimetype });
-
-        const imageFile = new File([imageBlob], imageData.name, { type: imageData.mimetype });
-
-        const imageSrc = URL.createObjectURL(imageFile);
-
-        // const  rawSvg = await CoreService.getRaw({ url: imageSrc });
-        // rawSvg = rawSvg.replace(`<svg`, `<svg class="abs account-profile-image" `).replace(`#5f5f5f`, `#ffffffc8`);
-
-        this.Scope.user.main.model.user.profileImage = {
-          resultFile,
-          imageData,
-          imageBlob,
-          imageFile,
-          imageSrc,
-        };
-      }
-    }
-
-    htmls(
-      `.action-btn-profile-log-in-render`,
-      html`<div class="abs center top-box-profile-img-container">
-        <img
-          class="abs center top-box-profile-img"
-          ${this.Scope.user.main.model.user.profileImage
-            ? `src="${this.Scope.user.main.model.user.profileImage.imageSrc}"`
-            : ``}
-        />
-      </div>`,
-    );
-  },
-  Render: async function () {
-    setTimeout(async () => {
-      const formData = [
-        { model: 'email', id: `log-in-email`, rules: [{ type: 'isEmpty' }, { type: 'isEmail' }] },
-        { model: 'password', id: `log-in-password`, rules: [{ type: 'isEmpty' }] },
-      ];
-      const validators = await Validator.instance(formData);
-
-      EventsUI.onClick(`.btn-log-in`, async (e) => {
-        e.preventDefault();
-        const { errorMessage } = await validators();
-        if (errorMessage) return;
-        const body = {};
-        for (const inputData of formData) {
-          if ('model' in inputData) body[inputData.model] = s(`.${inputData.id}`).value;
-        }
-        const result = await UserService.post({ id: 'auth', body });
-        if (result.status === 'success') this.Trigger(result.data);
-        if (result.status === 'error' && result.message.match('attempts')) {
-          htmls(`.login-attempt-warn-value`, result.message.split(':')[1]);
-          s(`.login-attempt-warn-container`).classList.remove('hide');
-        } else s(`.login-attempt-warn-container`).classList.add('hide');
-
-        if (result.status === 'error' && result.message.match('locked')) {
-          htmls(`.login-attempt-warn-value0`, result.message.split(':')[1]);
-          s(`.login-attempt-warn-container0`).classList.remove('hide');
-        } else s(`.login-attempt-warn-container0`).classList.add('hide');
-        NotificationManager.Push({
-          html: result.status === 'success' ? Translate.Render(`${result.status}-user-log-in`) : result.message,
-          status: result.status,
-        });
-      });
-      s(`.btn-log-in-forgot-password`).onclick = () => {
-        s(`.main-btn-recover`).click();
-      };
-
-      s(`.btn-log-in-i-not-have-account`).onclick = () => {
-        s(`.main-btn-sign-up`).click();
-      };
-    });
-    return html`
-      <div class="in">
-        ${await BtnIcon.Render({
-          class: 'section-mp form-button btn-log-in-i-not-have-account',
-          label: html`<i class="fas fa-user-plus"></i> ${Translate.Render(`i-not-have-account`)}
-            <br />
-            ${Translate.Render(`sign-up`)}`,
-          type: 'button',
-        })}
-      </div>
-      <form class="in">
-        <div class="in">
-          ${await Input.Render({
-            id: `log-in-email`,
-            type: 'email',
-            label: html`<i class="fa-solid fa-envelope"></i> ${Translate.Render('email')}`,
-            containerClass: 'inl section-mp width-mini-box input-container',
-            placeholder: true,
-            autocomplete: 'email',
-          })}
-        </div>
-        <div class="in">
-          ${await Input.Render({
-            id: `log-in-password`,
-            type: 'password',
-            autocomplete: 'new-password',
-            label: html`<i class="fa-solid fa-lock"></i> ${Translate.Render('password')}`,
-            containerClass: 'inl section-mp width-mini-box input-container',
-            placeholder: true,
-          })}
-        </div>
-        <div class="in">
-          ${await BtnIcon.Render({
-            class: 'section-mp form-button btn-log-in-forgot-password',
-            label: html`<i class="fas fa-question-circle"></i> ${Translate.Render(`forgot-password`)}`,
-            type: 'button',
-          })}
-        </div>
-        <div class="in section-mp form-button login-attempt-warn-container hide">
-          <i class="fa-solid fa-triangle-exclamation"></i> ${Translate.Render('login-attempts-remaining')}
-          <span style="color: #ed9d0f" class="login-attempt-warn-value"></span>
-        </div>
-        <div class="in section-mp form-button login-attempt-warn-container0 hide">
-          <i class="fa-solid fa-triangle-exclamation"></i> ${Translate.Render('account-locked-try-again-in')}
-          <span style="color: #ed9d0f" class="login-attempt-warn-value0"></span>
-        </div>
-
-        <div class="in">
-          ${await BtnIcon.Render({
-            class: 'section-mp form-button btn-log-in',
-            label: Translate.Render('log-in'),
-            type: 'submit',
-          })}
-        </div>
-      </form>
-    `;
-  },
-};
-
-export { LogIn };
+import { CoreService } from '../../services/core/core.service.js';
+import { FileService } from '../../services/file/file.service.js';
+import { UserService } from '../../services/user/user.service.js';
+import { BtnIcon } from './BtnIcon.js';
+import { EventsUI } from './EventsUI.js';
+import { Input } from './Input.js';
+import { NotificationManager } from './NotificationManager.js';
+import { Translate } from './Translate.js';
+import { Validator } from './Validator.js';
+import { htmls, s } from './VanillaJs.js';
+import { Webhook } from './Webhook.js';
+
+const LogIn = {
+  Scope: {
+    user: {
+      main: {
+        model: {
+          user: {},
+        },
+      },
+    },
+  },
+  Event: {},
+  Trigger: async function (options) {
+    const { user } = options;
+    await Webhook.register({ user });
+    for (const eventKey of Object.keys(this.Event)) await this.Event[eventKey](options);
+    if (s(`.session`))
+      htmls(
+        `.session`,
+        html`<style>
+          .session-in-log-in {
+            display: block;
+          }
+          .session-inl-log-in {
+            display: inline-table;
+          }
+          .session-fl-log-in {
+            display: flow-root;
+          }
+          .session-in-log-out {
+            display: none;
+          }
+          .session-inl-log-out {
+            display: none;
+          }
+          .session-fl-log-out {
+            display: none;
+          }
+        </style>`,
+      );
+    if (!this.Scope.user.main.model.user.profileImage) {
+      const resultFile = await FileService.get({ id: user.profileImageId });
+      if (resultFile && resultFile.status === 'success' && resultFile.data[0]) {
+        const imageData = resultFile.data[0];
+
+        const imageBlob = new Blob([new Uint8Array(imageData.data.data)], { type: imageData.mimetype });
+
+        const imageFile = new File([imageBlob], imageData.name, { type: imageData.mimetype });
+
+        const imageSrc = URL.createObjectURL(imageFile);
+
+        // const  rawSvg = await CoreService.getRaw({ url: imageSrc });
+        // rawSvg = rawSvg.replace(`<svg`, `<svg class="abs account-profile-image" `).replace(`#5f5f5f`, `#ffffffc8`);
+
+        this.Scope.user.main.model.user.profileImage = {
+          resultFile,
+          imageData,
+          imageBlob,
+          imageFile,
+          imageSrc,
+        };
+      }
+    }
+
+    htmls(
+      `.action-btn-profile-log-in-render`,
+      html`<div class="abs center top-box-profile-img-container">
+        <img
+          class="abs center top-box-profile-img"
+          ${this.Scope.user.main.model.user.profileImage
+            ? `src="${this.Scope.user.main.model.user.profileImage.imageSrc}"`
+            : ``}
+        />
+      </div>`,
+    );
+  },
+  Render: async function () {
+    setTimeout(async () => {
+      const formData = [
+        { model: 'email', id: `log-in-email`, rules: [{ type: 'isEmpty' }, { type: 'isEmail' }] },
+        { model: 'password', id: `log-in-password`, rules: [{ type: 'isEmpty' }] },
+      ];
+      const validators = await Validator.instance(formData);
+
+      EventsUI.onClick(`.btn-log-in`, async (e) => {
+        e.preventDefault();
+        const { errorMessage } = await validators();
+        if (errorMessage) return;
+        const body = {};
+        for (const inputData of formData) {
+          if ('model' in inputData) body[inputData.model] = s(`.${inputData.id}`).value;
+        }
+        const result = await UserService.post({ id: 'auth', body });
+        if (result.status === 'success') this.Trigger(result.data);
+        if (result.status === 'error' && result.message.match('attempts')) {
+          htmls(`.login-attempt-warn-value`, result.message.split(':')[1]);
+          s(`.login-attempt-warn-container`).classList.remove('hide');
+        } else s(`.login-attempt-warn-container`).classList.add('hide');
+
+        if (result.status === 'error' && result.message.match('locked')) {
+          htmls(`.login-attempt-warn-value0`, result.message.split(':')[1]);
+          s(`.login-attempt-warn-container0`).classList.remove('hide');
+        } else s(`.login-attempt-warn-container0`).classList.add('hide');
+        NotificationManager.Push({
+          html: result.status === 'success' ? Translate.Render(`${result.status}-user-log-in`) : result.message,
+          status: result.status,
+        });
+      });
+      s(`.btn-log-in-forgot-password`).onclick = () => {
+        s(`.main-btn-recover`).click();
+      };
+
+      s(`.btn-log-in-i-not-have-account`).onclick = () => {
+        s(`.main-btn-sign-up`).click();
+      };
+    });
+    return html`
+      <div class="in">
+        ${await BtnIcon.Render({
+          class: 'section-mp form-button btn-log-in-i-not-have-account',
+          label: html`<i class="fas fa-user-plus"></i> ${Translate.Render(`i-not-have-account`)}
+            <br />
+            ${Translate.Render(`sign-up`)}`,
+          type: 'button',
+        })}
+      </div>
+      <form class="in">
+        <div class="in">
+          ${await Input.Render({
+            id: `log-in-email`,
+            type: 'email',
+            label: html`<i class="fa-solid fa-envelope"></i> ${Translate.Render('email')}`,
+            containerClass: 'inl section-mp width-mini-box input-container',
+            placeholder: true,
+            autocomplete: 'email',
+          })}
+        </div>
+        <div class="in">
+          ${await Input.Render({
+            id: `log-in-password`,
+            type: 'password',
+            autocomplete: 'new-password',
+            label: html`<i class="fa-solid fa-lock"></i> ${Translate.Render('password')}`,
+            containerClass: 'inl section-mp width-mini-box input-container',
+            placeholder: true,
+          })}
+        </div>
+        <div class="in">
+          ${await BtnIcon.Render({
+            class: 'section-mp form-button btn-log-in-forgot-password',
+            label: html`<i class="fas fa-question-circle"></i> ${Translate.Render(`forgot-password`)}`,
+            type: 'button',
+          })}
+        </div>
+        <div class="in section-mp form-button login-attempt-warn-container hide">
+          <i class="fa-solid fa-triangle-exclamation"></i> ${Translate.Render('login-attempts-remaining')}
+          <span style="color: #ed9d0f" class="login-attempt-warn-value"></span>
+        </div>
+        <div class="in section-mp form-button login-attempt-warn-container0 hide">
+          <i class="fa-solid fa-triangle-exclamation"></i> ${Translate.Render('account-locked-try-again-in')}
+          <span style="color: #ed9d0f" class="login-attempt-warn-value0"></span>
+        </div>
+
+        <div class="in">
+          ${await BtnIcon.Render({
+            class: 'section-mp form-button btn-log-in',
+            label: Translate.Render('log-in'),
+            type: 'submit',
+          })}
+        </div>
+      </form>
+    `;
+  },
+};
+
+export { LogIn };

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

@@ -1,52 +1,58 @@
-import { BtnIcon } from './BtnIcon.js';
-import { LogIn } from './LogIn.js';
-import { Translate } from './Translate.js';
-import { htmls, s } from './VanillaJs.js';
-import { Webhook } from './Webhook.js';
-
-const LogOut = {
-  Event: {},
-  Trigger: async function (options) {
-    LogIn.Scope.user.main.model.user = {};
-    await Webhook.unregister();
-    for (const eventKey of Object.keys(this.Event)) await this.Event[eventKey](options);
-    if (s(`.session`))
-      htmls(
-        `.session`,
-        html`<style>
-          .session-in-log-out {
-            display: block;
-          }
-          .session-inl-log-out {
-            display: inline-table;
-          }
-          .session-in-log-in {
-            display: none;
-          }
-          .session-inl-log-in {
-            display: none;
-          }
-        </style>`,
-      );
-  },
-  Render: async function () {
-    setTimeout(() => {
-      s('.btn-log-out').onclick = (e) => {
-        e.preventDefault();
-        LogOut.Trigger();
-      };
-    });
-    // Translate.Render('confirm-logout')
-    return html` <form class="in">
-      <div class="in">
-        ${await BtnIcon.Render({
-          class: 'section-mp btn-custom btn-log-out',
-          label: html`<i class="fa-solid fa-power-off"></i> ${Translate.Render('log-out')}`,
-          type: 'submit',
-        })}
-      </div>
-    </form>`;
-  },
-};
-
-export { LogOut };
+import { BtnIcon } from './BtnIcon.js';
+import { LogIn } from './LogIn.js';
+import { Translate } from './Translate.js';
+import { htmls, s } from './VanillaJs.js';
+import { Webhook } from './Webhook.js';
+
+const LogOut = {
+  Event: {},
+  Trigger: async function (options) {
+    LogIn.Scope.user.main.model.user = {};
+    await Webhook.unregister();
+    for (const eventKey of Object.keys(this.Event)) await this.Event[eventKey](options);
+    if (s(`.session`))
+      htmls(
+        `.session`,
+        html`<style>
+          .session-in-log-out {
+            display: block;
+          }
+          .session-inl-log-out {
+            display: inline-table;
+          }
+          .session-fl-log-out {
+            display: flow-root;
+          }
+          .session-in-log-in {
+            display: none;
+          }
+          .session-inl-log-in {
+            display: none;
+          }
+          .session-fl-log-in {
+            display: none;
+          }
+        </style>`,
+      );
+  },
+  Render: async function () {
+    setTimeout(() => {
+      s('.btn-log-out').onclick = (e) => {
+        e.preventDefault();
+        LogOut.Trigger();
+      };
+    });
+    // Translate.Render('confirm-logout')
+    return html` <form class="in">
+      <div class="in">
+        ${await BtnIcon.Render({
+          class: 'section-mp btn-custom btn-log-out',
+          label: html`<i class="fa-solid fa-power-off"></i> ${Translate.Render('log-out')}`,
+          type: 'submit',
+        })}
+      </div>
+    </form>`;
+  },
+};
+
+export { LogOut };

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

@@ -1,26 +1,26 @@
-const loggerFactory = (meta) => {
-  meta = meta.url.split('/').pop();
-  const types = ['error', 'warn', 'info', 'debug'];
-  const logger = {
-    log: function (type, args) {
-      if (location.hostname !== 'localhost' && console.log() !== null) {
-        console.log = () => null;
-        console.error = () => null;
-        console.info = () => null;
-        console.warn = () => null;
-      }
-      return location.hostname === 'localhost'
-        ? console[type](`[${meta}] ${new Date().toISOString()} ${type}:`, ...args)
-        : null;
-    },
-  };
-  types.map(
-    (type) =>
-      (logger[type] = function (...args) {
-        return this.log(type, args);
-      }),
-  );
-  return logger;
-};
-
-export { loggerFactory };
+const loggerFactory = (meta) => {
+  meta = meta.url.split('/').pop();
+  const types = ['error', 'warn', 'info', 'debug'];
+  const logger = {
+    log: function (type, args) {
+      if (location.hostname !== 'localhost' && console.log() !== null) {
+        console.log = () => null;
+        console.error = () => null;
+        console.info = () => null;
+        console.warn = () => null;
+      }
+      return location.hostname === 'localhost'
+        ? console[type](`[${meta}] ${new Date().toISOString()} ${type}:`, ...args)
+        : null;
+    },
+  };
+  types.map(
+    (type) =>
+      (logger[type] = function (...args) {
+        return this.log(type, args);
+      }),
+  );
+  return logger;
+};
+
+export { loggerFactory };