nuxeo-development-framework 3.1.6 → 3.1.8

package/src/lib/components/notifications/components/notification-toast/notification-toast.component.scss

@@ -1,62 +0,0 @@
-@import "../../../../assets/scss/myApp.scss";
-
-.toast-container {
-  cursor: pointer;
-  display: grid;
-  grid-template-columns: repeat(5, minmax(0, 1fr));
-  margin-left: 16px;
-  margin-right: 16px;
-  position: relative;
-  width: 400px;
-  height: 80px;
-  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.23);
-  background-color: white;
-  border-radius: 5px;
-  .icon-container {
-    background-color: $cyan-100;
-    grid-column: span 1 / span 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-  .toast-content-container {
-    grid-column: span 3 / span 3;
-    display: flex;
-    flex-direction: column;
-    padding-top: 4px;
-    padding-bottom: 4px;
-    padding-inline-start: 8px;
-    overflow: hidden;
-    .toast-content {
-      font-size: 15px;
-      color: $gray-400;
-      overflow: hidden;
-    }
-    .message {
-      color: $cyan-100;
-      font-size: 14px;
-      line-height: 20px;
-    }
-  }
-  .remove {
-    grid-column: span 1 / span 1;
-    cursor: pointer;
-    display: flex;
-    justify-content: flex-end;
-    padding-inline-end: 8px;
-    mat-icon {
-      color: $gray-300;
-      font-size: 20px;
-      line-height: 28px;
-    }
-  }
-}
-.rounded-s-md {
-  border-top-left-radius: 6px;
-  border-bottom-left-radius: 6px;
-}
-
-[dir="rtl"] .rounded-s-md {
-  border-top-right-radius: 6px;
-  border-bottom-right-radius: 6px;
-}

package/src/lib/components/notifications/components/notification-toast/notification-toast.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { NotificationToastComponent } from './notification-toast.component';
-
-describe('NotificationToastComponent', () => {
-  let component: NotificationToastComponent;
-  let fixture: ComponentFixture<NotificationToastComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ NotificationToastComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(NotificationToastComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/notifications/components/notification-toast/notification-toast.component.ts

@@ -1,55 +0,0 @@
-import { Component, OnInit, ViewEncapsulation } from '@angular/core';
-import { Router } from '@angular/router';
-import { Toast, ToastPackage, ToastrService } from 'ngx-toastr';
-import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
-import {
-  UserPreferencesService,
-  UserPreferenceValues,
-} from '../../../../Core/services/user/user-preferences.service';
-
-@Component({
-  selector: 'app-notification-toast',
-  templateUrl: './notification-toast.component.html',
-  styleUrls: ['./notification-toast.component.scss'],
-  // encapsulation: ViewEncapsulation.None,
-})
-export class NotificationToastComponent extends Toast implements OnInit {
-  id;
-  lang;
-  private onDestroy$ = new Subject<boolean>();
-  constructor(
-    protected toastrService: ToastrService,
-    public toastPackage: ToastPackage,
-    private router: Router,
-    public userPreferenceService?: UserPreferencesService
-  ) {
-    super(toastrService, toastPackage);
-  }
-  ngOnInit(): void {
-    this.id = this.toastPackage.toastRef.componentInstance.id;
-    if (this.userPreferenceService) {
-      this.userPreferenceService
-        .select(UserPreferenceValues.Locale)
-        .pipe(takeUntil(this.onDestroy$))
-        .subscribe((locale) => {
-          this.lang = locale === 'ar' ? 'rtl' : 'ltr';
-        });
-    }
-  }
-  navigateToDetais() {
-    // this.router.navigate(
-    //   [
-    //     {
-    //       outlets: { viewer: ['view', this.id] },
-    //     },
-    //   ],
-    //   {
-    //     queryParams: { location: this.router.url },
-    //   }
-    // );
-  }
-}
-// <div class="col-span-1 cursor-pointer text-lg text-gray-300 flex justify-end">
-// X
-// </div>

package/src/lib/components/notifications/components/notifications-button/notifications-button.component.html

@@ -1,7 +0,0 @@
-<div [matMenuTriggerFor]="langMenu" class="notification" (click)="getNotifications()" class="search-wrapper">
-  <span matBadgeSize="small" matBadge="{{ notificationsCount }}" matBadgeColor="warn" matbadgeposition="before"
-    class="bi bi-bell bell"></span>
-</div>
-<mat-menu class="mat-menu-panel myMenu notification-list" #langMenu="matMenu">
-  <app-notifications-list (listItemClick)="onListItemClick($event)"></app-notifications-list>
-</mat-menu>

package/src/lib/components/notifications/components/notifications-button/notifications-button.component.scss

@@ -1,90 +0,0 @@
-.notifications-count {
-  background-color: #eee;
-  border-radius: 5px;
-  color: #333;
-  font-size: 11px;
-  padding: 0px 6px;
-  box-sizing: border-box;
-}
-.notification-list {
-  max-width: 450px !important;
-  width: 450px;
-  height: 66vh;
-  .mat-menu-content {
-    padding: 0px !important;
-    position: relative;
-    height: calc(100% - 29px);
-    .mat-toolbar {
-      margin: 0px 0 -10px 0;
-    }
-  }
-}
-.mat-menu-panel.myMenu {
-  border-radius: 5px !important;
-  overflow: hidden;
-}
-.notification {
-  .mat-icon {
-    margin-right: 0px !important;
-    vertical-align: middle;
-  }
-}
-.notification-toast {
-}
-.toast-container {
-  right: 12px !important;
-  bottom: 12px !important;
-  pointer-events: all;
-  .ngx-toastr {
-    padding: 25px !important;
-    background-position: 263px center;
-    border-radius: 5px !important;
-    box-shadow: none !important;
-  }
-  .toast-title {
-    font-weight: normal;
-  }
-}
-.wrap {
-  white-space: normal !important;
-  font-size: 14px !important;
-  margin-bottom: 8px !important;
-}
-.mat-menu-content:not(:empty) {
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-[dir="rtl"] {
-  .toast-container {
-    left: 12px !important;
-    right: auto !important;
-    direction: rtl;
-    text-align: right;
-    .ngx-toastr {
-      background-position: 10px center;
-    }
-    .toast-close-button {
-      float: left;
-    }
-  }
-}
-
-.mat-badge-content{
-  // width: 15px !important;
-  //   height: 15px !important;
-    right: -4px !important;
-    top: -1px !important;
-  //   display: flex;
-  //   justify-content: center;
-  //   align-items: center;
-  //   /* line-height: 10px; */
-  //   font-size: 10px;
-  //   text-align: center;
-}
-.rtl {
-  .mat-badge-content {
-    font-weight: 600;
-    right: -6px !important;
-    top: -5px !important;
-  }
-}

package/src/lib/components/notifications/components/notifications-button/notifications-button.component.ts

@@ -1,190 +0,0 @@
-import {
-  ChangeDetectorRef,
-  Component,
-  EventEmitter,
-  OnDestroy,
-  OnInit,
-  Output,
-  ViewEncapsulation,
-} from "@angular/core";
-import { Router } from "@angular/router";
-import { TranslateService } from "@ngx-translate/core";
-import { ActiveToast, ToastrService } from "ngx-toastr";
-import { take } from "rxjs/internal/operators/take";
-import { TimeAgoPipe } from "../../../../pipes/time-ago.pipe";
-import { NotificationsService } from "../../notifications.service";
-import { NotificationToastComponent } from "../notification-toast/notification-toast.component";
-import { TranslationService } from "../../../../Core/services/translation/translation.service";
-import { first } from "rxjs/operators";
-
-
-@Component({
-  selector: "app-notifications-button",
-  templateUrl: "./notifications-button.component.html",
-  styleUrls: ["./notifications-button.component.scss"],
-  encapsulation: ViewEncapsulation.None,
-})
-export class NotificationsButtonComponent implements OnInit, OnDestroy {
-  get notificationsCount() {
-    return this.notificationsService.notificationsCount;
-  }
-
-  subscription;
-  updater;
-  @Output()
-  toastrClick = new EventEmitter();
-  @Output()
-  listItemClick = new EventEmitter();
-  constructor(
-    public notificationsService: NotificationsService,
-    public translate: TranslateService,
-    public toastr: ToastrService,
-    public TimeAgo: TimeAgoPipe,
-    public router: Router,
-    private ref: ChangeDetectorRef,
-    private translationService: TranslationService
-  ) {}
-  /*
-  async openNotifications(event) {
-    const dir = this.translate.instant('dir');
-    const notificationsModal = await this.modalController.create({
-      cssClass: 'side-modal notifications',
-      enterAnimation: dir === 'rtl' ? slideInRtl : slideIn,
-      leaveAnimation: dir === 'rtl' ? slideOutRtl : slideOut,
-      component: NotificationsModalComponent,
-      showBackdrop: false
-    });
-    return await notificationsModal.present().then(() => {
-      this.notificationsService.resetCount();
-
-    });
-  }
-  */
-  getNotifications() {
-    this.notificationsService.resetNotifications()
-    this.notificationsService.fetchNotifications().subscribe(() => {
-      this.notificationsService.resetCount();
-    });
-  }
-  ngOnInit() {
-    this.subscription = this.notificationsService.listenerObserver.subscribe(
-      async (activity) => {
-        let ar = await this.translationService.isArabic
-          .pipe(first())
-          .toPromise();
-        let sourceType = activity.sourceType;
-        const isAssignmentOrApproval: boolean =
-          sourceType === "approval" || sourceType === "assignment";
-        const correspondence = sourceType === "correspondence";
-        const assignment = sourceType === "assignment";
-        const approval = sourceType === "approval";
-        const memo = sourceType === "memo";
-        const general = sourceType === "general";
-        const id = memo ? activity.sourceId : activity.data.correspondenceId;
-
-        this.showToastr(activity, ar)
-          .onTap.pipe(take(1))
-          .subscribe(() => {
-            this.notificationsService.updateStatus(activity, true);
-            if (activity.data?.correspondenceId) {
-              this.router.navigate(
-                [
-                  {
-                    outlets: {
-                      viewer: ["view", id],
-                    },
-                  },
-                ],
-                {
-                  queryParams: {
-                    location: this.router.url,
-                    ...(isAssignmentOrApproval && { approvalMode: true }),
-                    ...(assignment && {
-                      assignmentId: activity.data.assignmentId,
-                    }),
-                  },
-                }
-              );
-            }
-            if (memo) {
-              this.router.navigate([{ outlets: { viewer: ["memo", id] } }], {
-                queryParams: { location: this.router.url },
-              });
-            }
-            this.toastrClick.next(activity);
-          });
-        this.ref.markForCheck();
-      }
-    );
-
-    this.updater = this.notificationsService.update.subscribe((data) => {
-      this.ref.detectChanges();
-    });
-    // setTimeout(() => {
-    //   this.showToastr({
-    //     sendDate:"111",
-    //     content:"test",
-    //     data:{
-    //       correspondenceId:"f9c36fe1-7054-4f81-a89b-096ad24a03b5"
-    //     }
-    //   }).onTap.pipe(take(1)).subscribe(() => {
-    //     // this.notificationsService.updateStatus(activity, true);
-    //     console.log("here")
-    //   })
-    // }, 1000);
-  }
-  onListItemClick(event){
-    this.listItemClick.next(event);
-  }
-  ngOnDestroy(): void {
-    this.subscription.unsubscribe();
-    this.updater.unsubscribe();
-    this.notificationsService.unsubscribe();
-  }
-  // test() {
-  //   this.toastr.show(`dsssdsds`, 'here is the content of the notification ', {
-  //     toastComponent: NotificationToastComponent,
-  //     closeButton: true,
-  //     // extendedTimeOut: 0,
-  //     timeOut: 10000,
-  //     // tapToDismiss: false,
-  //     enableHtml: true,
-  //     positionClass:
-  //       this.translate.instant('dir') === 'rtl'
-  //         ? 'toast-bottom-left'
-  //         : 'toast-bottom-right',
-  //     toastClass: 'notification-toast',
-  //   });
-  // }
-
-  showToastr(activity, ar): ActiveToast<any> {
-    let arContent;
-    let enContent;
-    activity.notificationContents.forEach((res) => {
-      if (res.lang === "AR") {
-        arContent = res.message;
-      }
-      if (res.lang === "EN") {
-        enContent = res.message;
-      }
-    });
-    const activeToast = this.toastr.show(
-      `${this.TimeAgo.transform(activity.sendDate)}`,
-      ar ? arContent : enContent,
-      {
-        toastComponent: NotificationToastComponent,
-        closeButton: true,
-        timeOut: 10000,
-        enableHtml: true,
-        positionClass:
-          this.translate.instant("dir") === "rtl"
-            ? "toast-bottom-left"
-            : "toast-bottom-right",
-        toastClass: "notification-toast",
-      }
-    );
-    activeToast.toastRef.componentInstance.id = activity.data.correspondenceId;
-
-    return activeToast;
-  }
-}

package/src/lib/components/notifications/components/notifications-list/notifications-list.component.html

@@ -1,55 +0,0 @@
-<div class="toolbar">
-  <div class="title">
-    <div>{{ "notifications.notifications" | translate }}</div>
-  </div>
-  <div class="flex justify-end">
-    <button
-      mat-button
-      (click)="markAllAsRead()"
-      size="small"
-      fill="none"
-      class="markAllAsRead-btn"
-    >
-      {{ "notifications.markAllAsRead" | translate }}
-    </button>
-  </div>
-</div>
-<!-- [matTooltip]="'notifications.markAllAsRead' | translate"
-      [matTooltipPosition]="'before'" -->
-<div *ngIf="!notifications?.length" class="no-notifications">
-  <p>
-    {{ "notifications.noNotifications" | translate }}
-  </p>
-</div>
-<div
-  infiniteScroll
-  [scrollWindow]="false"
-  [infiniteScrollDistance]="scrollDistance"
-  [infiniteScrollThrottle]="throttle"
-  (scrolled)="onScrollDown()"
-  class="notifications-container scroll"
->
-  <mat-list class="">
-    <ng-container
-      *ngFor="
-        let notification of notifications;
-        let i = index;
-        trackBy: trackBy
-      "
-    >
-      <!-- <mat-divider class="marginize"></mat-divider> -->
-      <app-notification-item
-        (click)="openNotification(notification)"
-        (update)="onUpdate($event)"
-        [notification]="notification"
-        [isArabic]="isArabic"
-      ></app-notification-item>
-    </ng-container>
-    <div
-      *ngIf="loading"
-      style="display: grid; place-items: center; margin-top: 10px"
-    >
-      <mat-spinner [diameter]="48" style="margin: 0 auto"></mat-spinner>
-    </div>
-  </mat-list>
-</div>

package/src/lib/components/notifications/components/notifications-list/notifications-list.component.scss

@@ -1,108 +0,0 @@
-@import "../../../../assets/scss/myApp.scss";
-
-:host {
-  height: 100%;
-  position: relative;
-}
-.toolbar {
-  background-image: $wrapper-gradient;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  color: white;
-  font-weight: 700;
-  padding-top: 0.25rem /* 4px */;
-  padding-bottom: 0.25rem /* 4px */;
-  padding-left: 1.5rem /* 24px */;
-  padding-right: 1.5rem /* 24px */;
-  .title {
-    font-size: 1.125rem /* 18px */;
-    line-height: 1.75rem /* 28px */;
-    display: flex;
-    align-items: center;
-  }
-  .markAllAsRead-btn {
-    background: none;
-    border: none;
-    margin: 0;
-    padding: 0;
-    cursor: pointer;
-    font-size: 0.75rem /* 12px */;
-    line-height: 1rem /* 16px */;
-    display: flex;
-    align-items: center;
-    color: white;
-  }
-}
-.no-notifications {
-  margin-top: 1.25rem /* 20px */;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.no-notifications p {
-  text-align: center;
-  color: $gray-200;
-}
-.notifications-container {
-  height: 100%;
-  overflow: scroll;
-  ::-webkit-scrollbar {
-    width: 8px;
-  }
-  mat-list {
-    padding: 16px;
-    display: grid;
-    row-gap: 8px;
-  }
-}
-
-.scroll::-webkit-scrollbar-thumb {
-  background-color: $gray-100;
-}
-div[scrollx="true"],
-div[scrolly="true"] {
-  position: relative;
-  overflow: hidden;
-  max-height: 80vh;
-
-  ::-webkit-scrollbar {
-    display: none;
-  }
-}
-
-div[scrollx="true"] {
-  overflow-x: auto;
-}
-
-div[scrolly="true"] {
-  overflow-y: auto;
-}
-ion-toolbar {
-  min-height: 40px;
-  height: 40px;
-  --min-height: 40px;
-  box-shadow: 0px 0px 1px 1px #cbcbcb;
-  ion-title {
-    height: 14px;
-    font-size: 13px;
-    font-weight: bold;
-  }
-
-  ion-button {
-    font-size: 12px;
-    letter-spacing: 0px;
-  }
-}
-
-ion-item-divider {
-  --background: rgba(var(--ion-color-light-rgb), 1);
-  color: #666;
-}
-
-// .right-gradient {
-//   @apply bg-gradient-to-r from-cyan-50 to-cyan-100 h-10px w-full;
-// }
-// .left-gradient {
-//   @apply bg-gradient-to-l from-cyan-50 to-cyan-100 h-10px w-full;
-// }