@underpostnet/underpost 2.8.1 → 2.8.4

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

@@ -1,7 +1,7 @@
 import { EventSchedulerService } from '../../services/event-scheduler/event-scheduler.service.js';
 import { Auth } from './Auth.js';
 import { BtnIcon } from './BtnIcon.js';
-import { newInstance, range, s4 } from './CommonJs.js';
+import { isValidDate, newInstance, range, s4 } from './CommonJs.js';
 import { renderCssAttr } from './Css.js';
 import { Modal } from './Modal.js';
 import { NotificationManager } from './NotificationManager.js';
@@ -13,15 +13,27 @@ import { append, getQueryParams, getTimeZone, htmls, s, sa } from './VanillaJs.j
 
 // https://fullcalendar.io/docs/event-object
 
+const daysOfWeekOptions = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
+
+const eventDateFactory = (event) =>
+  newInstance({
+    event: { ...event.extendedProps, title: event._def.title },
+    start: event.start,
+    end: event.end,
+  });
+
 const CalendarCore = {
   RenderStyle: async function () {},
   Data: {},
-  Render: async function (options = { idModal: '', Elements: {}, heightTopBar: 50, heightBottomBar: 50 }) {
+  Render: async function (
+    options = { idModal: '', Elements: {}, heightTopBar: 50, heightBottomBar: 50, hiddenDates: [] },
+  ) {
     this.Data[options.idModal] = {
       data: [],
       originData: [],
       filesData: [],
       calendar: {},
+      hiddenDates: options.hiddenDates ? options.hiddenDates : [],
     };
 
     const { heightTopBar, heightBottomBar } = options;
@@ -40,56 +52,89 @@ const CalendarCore = {
     };
     getSrrData();
 
-    const dateFormat = (date) =>
-      html`<span
-        style="${renderCssAttr({
-          style: {
-            'font-size': '14px',
-            color: '#888',
-          },
-        })}"
-        >${new Date(date).toLocaleString().replaceAll(',', '')}</span
-      >`;
-
     const getPanelData = async () => {
       const result = await EventSchedulerService.get({
-        id: `${getQueryParams().cid ? getQueryParams().cid : 'creatorUser'}`,
+        id: `${getQueryParams().cid ? getQueryParams().cid : Auth.getToken() ? 'creatorUser' : ''}`,
       });
       NotificationManager.Push({
         html: result.status === 'success' ? Translate.Render('success-get-events-scheduler') : result.message,
         status: result.status,
       });
       if (result.status === 'success') {
-        const resultData = Array.isArray(result.data) ? result.data : [result.data];
+        const resultData = Array.isArray(result.data) ? result.data : result.data ? [result.data] : [];
         this.Data[options.idModal].filesData = [];
         this.Data[options.idModal].originData = newInstance(resultData);
         this.Data[options.idModal].data = resultData.map((o) => {
           if (o.creatorUserId && options.Elements.Data.user.main.model.user._id === o.creatorUserId) o.tools = true;
           o.id = o._id;
-          o.start = dateFormat(o.start);
-          o.end = dateFormat(o.end);
+
           this.Data[options.idModal].filesData.push({});
           return o;
         });
+        setTimeout(() => {
+          renderCalendar(
+            resultData.map((o) => {
+              // FREQ=WEEKLY;
+              // if (o.daysOfWeek && o.daysOfWeek.length > 0) {
+              //   o.rrule = `RRULE:BYDAY=${o.daysOfWeek.map((d) => `${d[0]}${d[1]}`.toUpperCase()).join(',')}`;
+              // }
+              // o.rrule = 'FREQ=WEEKLY;BYDAY=SU;BYHOUR=10,11;COUNT=10';
+              if (o.daysOfWeek && o.daysOfWeek.length > 0)
+                o.daysOfWeek = o.daysOfWeek.map((v, i) => daysOfWeekOptions.indexOf(v));
+              else delete o.daysOfWeek;
+              // o.exdate = ['2024-04-02'];
+              // delete o.end;
+              // delete o.start;
+
+              return o;
+            }),
+          );
+        });
       }
     };
 
-    const renderCalendar = () => {
+    const renderCalendar = (events) => {
       const calendarEl = s(`.calendar-${idPanel}`);
       this.Data[options.idModal].calendar = new FullCalendar.Calendar(calendarEl, {
-        plugins: [FullCalendar.DayGrid.default, FullCalendar.TimeGrid.default, FullCalendar.List.default],
+        allDaySlot: false,
+        plugins: [
+          FullCalendar.DayGrid.default,
+          FullCalendar.TimeGrid.default,
+          FullCalendar.List.default,
+          // https://fullcalendar.io/docs/rrule-plugin
+          FullCalendar.RRule.default,
+        ],
         // initialView: 'dayGridWeek',
         timeZone: getTimeZone(),
         dateClick: function (arg) {
           console.error('calendar dateClick', arg.date.toString());
         },
-        events: [{ title: 'Meeting', start: new Date() }],
+        events: events ?? [{ title: 'Meeting', start: new Date() }],
         initialView: 'dayGridMonth',
         headerToolbar: {
           left: 'prev,next today',
           center: 'title',
           right: 'dayGridMonth,timeGridWeek,listWeek',
         },
+        eventClick: async function (args) {
+          const dateData = eventDateFactory(args.event);
+          // element -> args.el
+          // remove all events associated ->  args.event.remove();
+          // console.error('eventClick', JSON.stringify(dateData, null, 4));
+          if (options.eventClick) await options.eventClick(dateData, args);
+        },
+        eventClassNames: function (args) {
+          // console.error('eventClassNames', JSON.stringify(dateData, null, 4));
+          if (!args.event.extendedProps._id) return args.event.remove();
+          const dateData = eventDateFactory(args.event);
+          if (
+            new Date(dateData.start).getTime() <= new Date().getTime() ||
+            CalendarCore.Data[options.idModal].hiddenDates.find(
+              (d) => d.eventSchedulerId === dateData.event._id && d.date === dateData.start,
+            )
+          )
+            return ['hide'];
+        },
       });
 
       this.Data[options.idModal].calendar.render();
@@ -139,29 +184,52 @@ const CalendarCore = {
         rules: [{ type: 'isEmpty' }],
       },
       {
-        id: 'description',
-        model: 'description',
+        id: 'title',
+        model: 'title',
         inputType: 'text',
         rules: [{ type: 'isEmpty' }],
         panel: { type: 'title' },
       },
       {
-        id: 'allDay',
-        model: 'allDay',
-        inputType: 'checkbox-on-off',
-        rules: [],
-        panel: { type: 'info-row', icon: html`<i class="fa-solid fa-infinity"></i>` },
+        id: 'description',
+        model: 'description',
+        inputType: 'text',
+        rules: [{ type: 'isEmpty' }],
+        panel: { type: 'info-row' },
       },
       {
         id: 'start',
         model: 'start',
         inputType: 'datetime-local',
-        panel: { type: 'subtitle' },
+        translateCode: 'startTime',
+        panel: { type: 'info-row' },
       },
       {
         id: 'end',
         model: 'end',
         inputType: 'datetime-local',
+        translateCode: 'endTime',
+        panel: { type: 'info-row' },
+      },
+      {
+        id: 'daysOfWeek',
+        model: 'daysOfWeek',
+        inputType: 'dropdown-checkbox',
+        dropdown: {
+          options: daysOfWeekOptions,
+        },
+        panel: { type: 'list' },
+      },
+      {
+        id: 'startTime',
+        model: 'startTime',
+        inputType: 'time',
+        panel: { type: 'info-row' },
+      },
+      {
+        id: 'endTime',
+        model: 'endTime',
+        inputType: 'time',
         panel: { type: 'info-row' },
       },
     ];
@@ -209,14 +277,14 @@ const CalendarCore = {
           data: this.Data[options.idModal].data,
           formContainerClass: '',
           scrollClassContainer: `main-body-calendar-${options.idModal}`,
+          role: options.role,
           originData: () => this.Data[options.idModal].originData,
           filesData: () => this.Data[options.idModal].filesData,
           onClick: async function ({ payload }) {
             if (options.route) {
               setQueryPath({ path: options.route, queryPath: payload._id });
               if (options.parentIdModal) Modal.Data[options.parentIdModal].query = `${window.location.search}`;
-              if (CalendarCore.Data[options.idModal].updatePanel)
-                await CalendarCore.Data[options.idModal].updatePanel();
+              await CalendarCore.Data[options.idModal].updatePanel();
             }
           },
           titleIcon,
@@ -250,12 +318,19 @@ const CalendarCore = {
           ],
           on: {
             add: async function ({ data, editId }) {
+              if (data.daysOfWeek && data.daysOfWeek.length > 0 && daysOfWeekOptions[data.daysOfWeek[0]]) {
+                data.daysOfWeek = data.daysOfWeek.map((d) => daysOfWeekOptions[d]);
+              }
+              data.timeZoneClient = getTimeZone();
               const {
                 status,
                 message,
                 data: documentData,
               } = editId
-                ? await EventSchedulerService.put({ id: editId, body: { ...data, _id: undefined } })
+                ? await EventSchedulerService.put({
+                    id: editId,
+                    body: { ...data, _id: undefined },
+                  })
                 : await EventSchedulerService.post({ body: data });
               NotificationManager.Push({
                 html:
@@ -268,10 +343,9 @@ const CalendarCore = {
               });
 
               if (status === 'success') {
-                data.start = dateFormat(data.start);
-                data.end = dateFormat(data.end);
-                data.tools = true;
-                data._id = documentData._id;
+                documentData.tools = true;
+                // data._id = documentData._id;
+                data = documentData;
 
                 let originObj, indexOriginObj;
                 let filesData = {};
@@ -291,8 +365,7 @@ const CalendarCore = {
 
                 setQueryPath({ path: options.route, queryPath: documentData._id });
                 if (options.parentIdModal) Modal.Data[options.parentIdModal].query = `${window.location.search}`;
-                if (CalendarCore.Data[options.idModal].updatePanel)
-                  await CalendarCore.Data[options.idModal].updatePanel();
+                await CalendarCore.Data[options.idModal].updatePanel();
               }
               return { data, status, message };
             },
@@ -319,11 +392,8 @@ const CalendarCore = {
                   status,
                 });
 
-                if (getQueryParams().cid === data.id) {
-                  setQueryPath({ path: options.route, queryPath: '' });
-                  if (CalendarCore.Data[options.idModal].updatePanel)
-                    await CalendarCore.Data[options.idModal].updatePanel();
-                }
+                setQueryPath({ path: options.route, queryPath: '' });
+                await CalendarCore.Data[options.idModal].updatePanel();
 
                 return { status };
               }
@@ -334,17 +404,13 @@ const CalendarCore = {
         <div class="in" style="margin-bottom: 100px"></div>`;
     };
 
-    let lastCid;
-    let lasUserId;
     this.Data[options.idModal].updatePanel = async () => {
       const cid = getQueryParams().cid ? getQueryParams().cid : '';
-      if (lastCid === cid && lasUserId === options.Elements.Data.user.main.model.user._id) return;
       if (options.route === 'home') Modal.homeCid = newInstance(cid);
-      lasUserId = newInstance(options.Elements.Data.user.main.model.user._id);
-      lastCid = cid;
       if (s(`.main-body-calendar-${options.idModal}`)) {
-        if (Auth.getToken()) await getPanelData();
-        else getSrrData();
+        // if (Auth.getToken())
+        // else getSrrData();
+        await getPanelData();
         htmls(`.main-body-calendar-${options.idModal}`, await panelRender());
       }
     };

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

@@ -518,25 +518,25 @@ function getDirname(path) {
   return parts.join('/'); // Adjust separator if needed for Windows ('\')
 }
 
-const isDayValid = (day) => {
-  const date = new Date();
-  date.setDate(day);
-  return date.getDate() === day;
-};
-
-const isMonthValid = (month) => {
-  const date = new Date();
-  date.setMonth(month - 1);
-  return date.getMonth() === month - 1;
-};
-
 const isValidDate = (day, month, year) => {
-  if (!isDayValid(day) || !isMonthValid(month)) {
-    return false;
-  }
+  if (!month && !year) return !(new Date(day) == 'Invalid Date');
+  // new Date('2025-12-28')
+  // Sat Dec 27 2025 19:00:00 GMT-0500 (Eastern Standard Time)
+  // new Date('2025/12/28')
+  // Sun Dec 28 2025 00:00:00 GMT-0500 (Eastern Standard Time)
+  return !(new Date(`${year}/${month}/${day}`) == 'Invalid Date');
+};
 
-  const date = new Date(year, month - 1, day);
-  return !isNaN(date.getTime());
+// console.log(req.body.timeZoneClient, Intl.DateTimeFormat().resolvedOptions().timeZone);
+// DateTime.fromISO("2017-05-15T09:10:23", { zone: "Europe/Paris" });
+const strToDateUTC = (date = '2025-01-30T14:32') => {
+  const year = parseInt(date.split('-')[0]);
+  const month = parseInt(date.split('-')[1]);
+  const day = parseInt(date.split('-')[2].split('T')[0]);
+  const hour = parseInt(date.split('T')[1].split(':')[0]);
+  const minute = parseInt(date.split('T')[1].split(':')[1]);
+  date = new Date(Date.UTC(year, month - 1, day, hour, minute, 0, 0));
+  return date;
 };
 
 const isValidFormat = (value, format) => {
@@ -662,6 +662,22 @@ function componentFromStr(numStr, percent) {
   return percent ? Math.floor((255 * Math.min(100, num)) / 100) : Math.min(255, num);
 }
 
+const isChileanIdentityDocument = function (rutCompleto) {
+  const dv = function (T) {
+    let M = 0,
+      S = 1;
+    for (; T; T = Math.floor(T / 10)) S = (S + (T % 10) * (9 - (M++ % 6))) % 11;
+    return S ? S - 1 : 'k';
+  };
+  rutCompleto = rutCompleto.replace('‐', '-');
+  if (!/^[0-9]+[-|‐]{1}[0-9kK]{1}$/.test(rutCompleto)) return false;
+  var tmp = rutCompleto.split('-');
+  var digv = tmp[1];
+  var rut = tmp[0];
+  if (digv == 'K') digv = 'k';
+  return dv(rut) == digv;
+};
+
 function rgbToHex(rgb) {
   const rgbRegex = /^rgb\(\s*(-?\d+)(%?)\s*,\s*(-?\d+)(%?)\s*,\s*(-?\d+)(%?)\s*\)$/;
   let result,
@@ -685,10 +701,121 @@ const hexToNumber = (hex = 0xdc) => Number(hex) || parseFloat(hex, 16);
 
 const numberToHex = (number = 0) => number.toString(16);
 
+const generateRandomPasswordSelection = (length) => {
+  const _random = (arr) => {
+    const rand = Math.floor(Math.random() * arr.length);
+    return arr[rand];
+  };
+
+  const uppercase = [
+    'A',
+    'B',
+    'C',
+    'D',
+    'E',
+    'F',
+    'G',
+    'H',
+    'I',
+    'J',
+    'K',
+    'L',
+    'M',
+    'N',
+    'O',
+    'P',
+    'Q',
+    'R',
+    'S',
+    'T',
+    'U',
+    'V',
+    'W',
+    'X',
+    'Y',
+    'Z',
+  ];
+  const lowercase = [
+    'a',
+    'b',
+    'c',
+    'd',
+    'e',
+    'f',
+    'g',
+    'h',
+    'i',
+    'j',
+    'k',
+    'l',
+    'm',
+    'n',
+    'o',
+    'p',
+    'q',
+    'r',
+    's',
+    't',
+    'u',
+    'v',
+    'w',
+    'x',
+    'y',
+    'z',
+  ];
+  const special = [
+    '~',
+    '!',
+    '@',
+    '#',
+    '$',
+    '%',
+    '^',
+    '&',
+    '*',
+    '(',
+    ')',
+    '_',
+    '+',
+    '-',
+    '=',
+    '{',
+    '}',
+    '[',
+    ']',
+    ':',
+    ';',
+    '?',
+    ',',
+    '.',
+    '|',
+    '\\',
+  ];
+  const numbers = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
+
+  const nonSpecial = [...uppercase, ...lowercase, ...numbers];
+
+  let password = '';
+
+  for (let i = 0; i < length; i++) {
+    // Previous character is a special character
+    if (i !== 0 && special.includes(password[i - 1])) {
+      password += _random(nonSpecial);
+    } else password += _random([...nonSpecial, ...special]);
+  }
+
+  return password;
+};
+
 // 0x = Hexadecimal
 // 0b = Binary
 // 0o = Octal
 
+const userRoleEnum = ['admin', 'moderator', 'user', 'guest'];
+
+const commonAdminGuard = (role) => userRoleEnum.indexOf(role) === userRoleEnum.indexOf('admin');
+const commonModeratorGuard = (role) => userRoleEnum.indexOf(role) <= userRoleEnum.indexOf('moderator');
+
 export {
   s4,
   range,
@@ -727,10 +854,9 @@ export {
   getSubpaths,
   formatBytes,
   getDirname,
-  isDayValid,
-  isMonthValid,
   isValidDate,
   isValidFormat,
+  strToDateUTC,
   getTimezoneOffset,
   cleanString,
   splitEveryXChar,
@@ -742,4 +868,9 @@ export {
   getCapVariableName,
   hexToNumber,
   numberToHex,
+  generateRandomPasswordSelection,
+  userRoleEnum,
+  commonAdminGuard,
+  commonModeratorGuard,
+  isChileanIdentityDocument,
 };

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

@@ -117,6 +117,12 @@ const CssCommonCore = async () => {
         animation: ripple 600ms linear;
         background-color: rgba(137, 137, 137, 0.503);
       }
+      .slide-menu-top-bar-fix {
+        top: 0;
+        left: 0;
+        width: 100%;
+        z-index: 1;
+      }
       @keyframes ripple {
         to {
           transform: scale(4);

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

@@ -16,7 +16,11 @@ const DropDown = {
       onClick: () => {
         console.log('DropDown onClick', this.value);
         if (options && options.resetOnClick) options.resetOnClick();
-        this.Tokens[id].value = undefined;
+        if (options && options.type === 'checkbox')
+          for (const opt of DropDown.Tokens[id].value) {
+            s(`.dropdown-option-${id}-${opt}`).click();
+          }
+        else this.Tokens[id].value = undefined;
       },
     });
 

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

@@ -1,6 +1,8 @@
 import { AgGrid } from './AgGrid.js';
 import { BtnIcon } from './BtnIcon.js';
+import { isValidDate } from './CommonJs.js';
 import { darkTheme } from './Css.js';
+import { DropDown } from './DropDown.js';
 import { loggerFactory } from './Logger.js';
 import { RichText } from './RichText.js';
 import { ToggleSwitch } from './ToggleSwitch.js';
@@ -147,6 +149,10 @@ const Input = {
             htmls(`.file-name-render-${inputData.id}`, `${s(`.${inputData.id}`).fileNameInputExtDefaultContent}`);
           continue;
           break;
+        case 'dropdown-checkbox': {
+          s(`.dropdown-option-${inputData.id}-reset`).click();
+          break;
+        }
         case 'md':
           RichText.Tokens[inputData.id].easyMDE.value('');
           continue;
@@ -196,6 +202,12 @@ const Input = {
             RichText.Tokens[inputData.id].easyMDE.value(fileObj[inputData.model].mdPlain);
             continue;
             break;
+
+          case 'dropdown-checkbox': {
+            s(`.dropdown-option-${inputData.id}-reset`).click();
+            for (const opt of originObj[inputData.model]) s(`.dropdown-option-${inputData.id}-${opt}`).click();
+            break;
+          }
           case 'checkbox':
           case 'checkbox-on-off':
             if (
@@ -207,9 +219,11 @@ const Input = {
             break;
           case 'datetime-local':
             {
-              const date = new Date(originObj[inputData.model]);
-              date.setMinutes(date.getMinutes() - date.getTimezoneOffset());
-              s(`.${inputData.id}`).value = date.toISOString().slice(0, 16);
+              if (isValidDate(originObj[inputData.model])) {
+                const date = new Date(originObj[inputData.model]);
+                // date.setMinutes(date.getMinutes() - date.getTimezoneOffset());
+                s(`.${inputData.id}`).value = date.toISOString().slice(0, 16);
+              } else s(`.${inputData.id}`).value = null;
             }
             continue;
             break;

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

@@ -403,6 +403,11 @@ const Modal = {
                     })}
                   </div>
                 </div>
+                ${options?.slideMenuTopBarFix
+                  ? html`<div class="abs modal slide-menu-top-bar-fix" style="height: ${options.heightTopBar}px">
+                      ${await options.slideMenuTopBarFix()}
+                    </div>`
+                  : ''}
               </div>`,
             );
             EventsUI.onClick(`.action-btn-profile-log-in`, () => {
@@ -537,12 +542,12 @@ const Modal = {
                         if (routerId) {
                           if (
                             s(`.main-btn-${routerId}`) &&
-                            (routerId.toLocaleLowerCase().match(s(`.${id}`).value.toLocaleLowerCase()) ||
+                            (routerId.toLowerCase().match(s(`.${id}`).value.toLowerCase()) ||
                               (Translate.Data[routerId] &&
                                 Object.keys(Translate.Data[routerId]).filter((keyLang) =>
                                   Translate.Data[routerId][keyLang]
-                                    .toLocaleLowerCase()
-                                    .match(s(`.${id}`).value.toLocaleLowerCase()),
+                                    .toLowerCase()
+                                    .match(s(`.${id}`).value.toLowerCase()),
                                 ).length > 0))
                           ) {
                             const fontAwesomeIcon = getAllChildNodes(s(`.main-btn-${routerId}`)).find((e) => {
@@ -1691,7 +1696,7 @@ const Modal = {
       const htmlRender = html`
         <br />
         <div class="in section-mp" style="font-size: 40px; text-align: center">
-          <i class="fas fa-question-circle"></i>
+          ${options.icon ? options.icon : html` <i class="fas fa-question-circle"></i>`}
         </div>
         ${await options.html()}
         <div class="in section-mp">
@@ -1702,7 +1707,7 @@ const Modal = {
             style: `margin: auto`,
           })}
         </div>
-        <div class="in section-mp">
+        <div class="in section-mp ${options.disableBtnCancel ? 'hide' : ''}">
           ${await BtnIcon.Render({
             class: `in section-mp form-button btn-cancel-${id}`,
             label: Translate.Render('cancel'),