@ieeesa-npm/tenants 0.4.6 → 0.5.1

package/src/lib/components/tenant-basic-details/tenant-basic-details.component.ts

@@ -1,109 +0,0 @@
-import { Component, Input, OnDestroy, ViewEncapsulation } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import * as screenText from '../../assets/constants.json';
-import { TenantApplicationsService } from '../../services/tenant-applications.service';
-import { BreakpointObserverService } from '@ieeesa-npm/utility';
-import { Subject, takeUntil } from 'rxjs';
-import {
-  FileUploadService,
-  ImagePreviewComponent,
-} from '@ieeesa-npm/presentation';
-import { SharedService } from '@ieeesa-npm/shared';
-import { TenantBasicInfo } from '../../models/tenant.model';
-
-@Component({
-  selector: 'ieeesa-tenant-basic-details',
-  standalone: true,
-  imports: [CommonModule, ImagePreviewComponent],
-  templateUrl: './tenant-basic-details.component.html',
-  styleUrls: ['./tenant-basic-details.component.scss'],
-  encapsulation: ViewEncapsulation.None,
-})
-export class TenantBasicDetailsComponent implements OnDestroy {
-  destroy$: Subject<boolean> = new Subject<boolean>();
-  isMobileView = false;
-  constants = screenText;
-  basicDetailTexts = this.constants?.viewTenants?.tenantBasicDetails?.label;
-  tenantBackgroundColor!: string;
-  selectedAppType!: string;
-  selectedAppTypeLabel!: string;
-  logo!: string;
-  basicInfo!: TenantBasicInfo;
-  imageUrl!: string;
-  @Input()
-  set tenantDetails(value: TenantBasicInfo) {
-    this.basicInfo = value;
-    this.logo = this.basicInfo?.appLogo as string;
-    this.selectedAppType = this.basicInfo?.appType as string;
-    if (this.basicInfo) {
-      this.getAppType();
-      this.getFileDownloadPresignedUrls(this.logo);
-    }
-  }
-
-  constructor(
-    // eslint-disable-next-line no-unused-vars
-    public tenantAppService: TenantApplicationsService,
-    // eslint-disable-next-line no-unused-vars
-    private breakpointObserverService: BreakpointObserverService,
-    // eslint-disable-next-line no-unused-vars
-    private fileUploadService: FileUploadService,
-    // eslint-disable-next-line no-unused-vars
-    private sharedService: SharedService
-  ) {
-    this.breakpointObserverService
-      .getBreakpoint()
-      .pipe(takeUntil(this.destroy$))
-      .subscribe((result: { matches: boolean }) => {
-        this.isMobileView = result?.matches;
-      });
-    this.tenantAppService.getApplicationType();
-    this.fileUploadService.setApiBaseUrl(this.tenantAppService?.apiBaseUrl);
-  }
-
-  /**
-   * Gets the application types.
-   * @memberof TenantBasicDetailsComponent
-   */
-  getAppType(): void {
-    const appTypes = this.tenantAppService.getApplicationType();
-    if (this.basicInfo) {
-      const selectedType = appTypes?.find(
-        ({ id }) => id === this.basicInfo?.appType
-      );
-      this.selectedAppTypeLabel = selectedType?.label as string;
-    }
-  }
-
-  /**
-   * Retrieves presigned URL for downloading files from Amazon S3 bucket.
-   * @memberof TenantBasicDetailsComponent
-   */
-  getFileDownloadPresignedUrls(fileName: string): void {
-    this.fileUploadService
-      .getFileDownloadPresignedUrls(fileName)
-      .pipe(takeUntil(this.destroy$))
-      .subscribe({
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        next: (response: any) => {
-          this.imageUrl = response?.body;
-        },
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        error: (error: any) => {
-          this.sharedService.handleErrors(
-            error,
-            this.constants?.viewTenants?.errors
-          );
-        },
-      });
-  }
-
-  /**
-   * Performs necessary cleanup tasks, such as unsubscribing from subscription when the component is being destroyed.
-   * @memberof ViewTenantDetailsComponent
-   */
-  ngOnDestroy(): void {
-    this.destroy$?.next(true);
-    this.destroy$?.unsubscribe();
-  }
-}

package/src/lib/components/view-tenant-details/view-tenant-details.component.html

@@ -1,195 +0,0 @@
-<div
-  class="ieeesa-view-tenant-info px-4 pb-4"
-  [ngClass]="
-    isMobileView
-      ? 'ieeesa-view-tenant-info--bg-white'
-      : 'ieeesa-view-tenant-info--bg-blue'
-  "
->
-  <div
-    class="d-flex justify-content-between gap-lg-4 gap-md-3 gap-sm-2 gap-3"
-    [ngClass]="isMobileView ? 'flex-column gap-2 pb-3' : 'align-item-center'"
-  >
-    <div
-      class="d-flex gap-lg-4 gap-md-3 gap-sm-3 gap-3 ps-0 align-items-md-center align-items-xl-center"
-      [ngClass]="isMobileView ? 'flex-column' : ''"
-    >
-      <p
-        class="mb-0 ieeesa-headline-lg-32 py-3"
-        [ngClass]="isMobileView ? '' : 'ieeesa-view-tenant-info--title'"
-      >
-        {{ tenantDetails?.appTitle }}
-      </p>
-      <div class="d-flex gap-lg-2 gap-md-2 gap-sm-2 gap-2">
-        <span
-          class="mb-0 ieeesa-title-sm-14 mt-1"
-          [ngClass]="isMobileView ? 'p-0' : 'ieeesa-view-tenant-info--app-id'"
-        >
-          {{ tenantLabels?.appId }}:
-        </span>
-        {{ tenantDetails?.appId }}
-        <ng-container *ngIf="tenantDetails?.appId !== tenantLabels?.saAppId">
-          <mat-divider [vertical]="true"></mat-divider>
-          <span
-            class="mb-0 mt-1 ieeesa-title-sm-14 ieeesa-view-tenant-info--app-status"
-            [ngClass]="isMobileView ? 'p-0' : ''"
-          >
-            {{ tenantLabels?.status }}:
-          </span>
-          <ieeesa-slide-toggle
-            [slideToggle]="slideToggleOption"
-            (slideToggleChange)="onSlideToggleChange($event)"
-          ></ieeesa-slide-toggle>
-        </ng-container>
-      </div>
-    </div>
-    <a
-      class="ieeesa-btn-label-lg-bold-16 text-decoration-none mt-lg-3 mt-xl-6 p-sm-0 p-md-0"
-      href="javascript:void(0)"
-      rel="noopener noreferrer"
-      [routerLink]="viewTenantsRouteUrl"
-      [ngClass]="
-        isMobileView
-          ? 'ieeesa-view-tenant-info--link-mobile'
-          : 'ieeesa-view-tenant-info--link'
-      "
-      >{{ tenantLabels?.viewAllApps }}</a
-    >
-  </div>
-  <div
-    class="ieeesa-view-tenant-info__accordion ieeesa-view-tenant-info__accordion--blue-bg"
-    [ngClass]="isMobileView ? 'ieeesa-view-tenant-info__accordion--info' : ''"
-  >
-    <ng-container
-      *ngFor="
-        let accordionInfo of accordionInfoList;
-        trackBy: trackByAccordionFn
-      "
-    >
-      <ng-container [ngSwitch]="accordionInfo.id">
-        <ng-container *ngSwitchCase="accordionDetails.BASIC_DETAILS">
-          <ieeesa-accordion
-            [accordionInfo]="accordionInfo"
-            class="ieeesa-view-tenant-info__accordion-info"
-            (accordionOpened)="showTenantDetails(accordionInfo, $event)"
-          >
-            <ieeesa-icon-button
-              *ngIf="
-                isBasicDetailsExpanded &&
-                validateAccess(permissionType.MANAGE_TENANT)
-              "
-              actions
-              class="ieeesa-button"
-              [iconButton]="editButton"
-              (iconButtonClick)="openEditTenantForm()"
-            ></ieeesa-icon-button>
-            <ng-container component *ngIf="isBasicDetailsExpanded">
-              <ieeesa-tenant-basic-details
-                [tenantDetails]="tenantDetails"
-              ></ieeesa-tenant-basic-details>
-            </ng-container>
-          </ieeesa-accordion>
-        </ng-container>
-        <ng-container *ngSwitchCase="accordionDetails.ROLES_AND_PERMISSIONS">
-          <ieeesa-accordion
-            [accordionInfo]="accordionInfo"
-            class="ieeesa-view-tenant-info__roles-and-permissions"
-            (accordionOpened)="showTenantDetails(accordionInfo, $event)"
-          >
-            <div
-              actions
-              *ngIf="isRolesAndPermissionsExpanded"
-              class="d-flex gap-3"
-              [ngClass]="
-                isMobileView ? 'mb-3 px-4' : 'ieeesa-view-tenant-info__actions'
-              "
-            >
-              <button
-                mat-button
-                class="mat-tertiary-button"
-                [ngClass]="isMobileView ? 'p-0' : 'px-2 py-2'"
-                (click)="openCreateRoleForm()"
-                *ngIf="validateAccess(permissionType.MANAGE_TENANT)"
-              >
-                {{
-                  constants.viewRolesAndPermissions.actionButtonLabels.addRole
-                }}
-              </button>
-              <button
-                mat-button
-                class="mat-tertiary-button"
-                (click)="openMapRolesAndPermissionsForm()"
-                [ngClass]="isMobileView ? 'p-0' : 'px-2 py-2'"
-              >
-                {{
-                  constants.viewRolesAndPermissions.actionButtonLabels
-                    .mapPermissionsRoles
-                }}
-              </button>
-            </div>
-            <ng-container component *ngIf="isRolesAndPermissionsExpanded">
-              <mat-divider
-                class="ieeesa-view-tenant-info__roles-and-permissions__divider"
-              ></mat-divider>
-              <ieeesa-data-table
-                *ngIf="columnSchema.length"
-                [tableDataInfo]="tableData"
-                [headerElementClassName]="headerElementClassName"
-                [columnSchemaInfo]="columnSchema"
-                [caption]="rolesAndPermissionsTableCaption"
-                [paginatorConfig]="paginatorConfig"
-                [tableActions]="tableActions"
-                [isScrollSupportMessageNeeded]="true"
-                [tableColumnActionMenuSize]="iconSize"
-                [tableColumnActions]="menuItems"
-                [customStickyHeaderNeeded]="true"
-                [tableColumnsHeaderText]="rolesAndPermissionsTableHeaderName"
-                [scrollbarSupportMessage]="
-                  rolesAndPermissionsTableSupportMessage
-                "
-                [verticalColumnHeaderNumber]="permissionsColumnClassNumber"
-                (paginationChange)="onTablePaginationChange($event)"
-                (tableColumnMenuActionClick)="onRoleMenuClick($event)"
-                (tableColumnMenuToggleButton)="selectedRoleMenuElement($event)"
-              ></ieeesa-data-table>
-            </ng-container>
-          </ieeesa-accordion>
-        </ng-container>
-        <ng-container *ngSwitchCase="accordionDetails.GROUP_TYPES">
-          <ieeesa-accordion
-            [accordionInfo]="accordionInfo"
-            class="ieeesa-view-tenant-info__group-types"
-            (accordionOpened)="showTenantDetails(accordionInfo, $event)"
-          >
-            <div
-              actions
-              *ngIf="isGroupTypesExpanded"
-              class="d-flex gap-3"
-              [ngClass]="
-                isMobileView ? 'mb-3 px-4' : 'ieeesa-view-tenant-info__actions'
-              "
-            >
-              <button
-                mat-button
-                class="mat-tertiary-button p-2"
-                *ngIf="validateAccess(permissionType.MANAGE_TENANT)"
-                (click)="openCreateGroupTypeForm()"
-              >
-                {{ constants.viewGroupTypes.actionButtonLabels.addGroupType }}
-              </button>
-            </div>
-            <ng-container component *ngIf="isGroupTypesExpanded">
-              <ieeesa-view-tenant-group-types></ieeesa-view-tenant-group-types>
-            </ng-container>
-          </ieeesa-accordion>
-        </ng-container>
-        <ng-container *ngSwitchDefault>
-          <ieeesa-accordion
-            [accordionInfo]="accordionInfo"
-            (accordionOpened)="showTenantDetails(accordionInfo, $event)"
-          ></ieeesa-accordion>
-        </ng-container>
-      </ng-container>
-    </ng-container>
-  </div>
-</div>

package/src/lib/components/view-tenant-details/view-tenant-details.component.scss

@@ -1,163 +0,0 @@
-@import "styles.scss";
-.ieeesa-view-tenant-info {
-  background-color: $ieeesa-background-color-gray;
-  &--bg-white {
-    background-color: $ieeesa-white;
-    padding: 1em 1.5em 0em 1.5em;
-  }
-  &__actions {
-    top: 15px;
-    margin-right: 20px;
-    position: absolute;
-    right: 0;
-  }
-  &--title,
-  &--action {
-    padding: 0.75em 0em;
-  }
-  &--link {
-    padding: 1em 0.75em 1.3em 0em !important;
-  }
-  &--link-mobile {
-    max-width: fit-content;
-  }
-  &--app-id,
-  &--app-status {
-    color: $ieeesa-on-surface-variant-color;
-  }
-  &__accordion {
-    background-color: $ieeesa-white;
-    box-shadow: $ieeesa-box-shadow-15;
-    padding: 1.5em 0.75em;
-    &--bg-white {
-      background-color: $ieeesa-white;
-      box-shadow: none;
-    }
-    &--info {
-      padding: 1em 1em 1.5em 1em;
-    }
-  }
-  &__accordion-info {
-    .mat-accordion {
-      .mat-expansion-panel-spacing.mat-expanded {
-        position: relative;
-      }
-      .mat-expansion-panel-body {
-        padding: 1.5em 1.5em 1.5em 2.25em;
-      }
-    }
-    .ieeesa-button {
-      position: absolute;
-      top: 1.25em;
-      right: 0;
-      svg {
-        width: 1.3em !important;
-        height: 1.3em !important;
-      }
-    }
-  }
-  .mat-divider-vertical {
-    margin: 0em;
-    height: 1.4em;
-    color: $ieeesa-outline-variant;
-    width: 0.063em;
-    border-right-color: $ieeesa-outline-variant;
-  }
-  .ieeesa-slide-toggle-field .mat-mdc-slide-toggle .mdc-label {
-    color: $ieeesa-black !important;
-  }
-  &__roles-and-permissions {
-    .ieeesa-accordion {
-      .mat-accordion {
-        .mat-expansion-panel-spacing.mat-expanded {
-          position: relative;
-        }
-      }
-    }
-    &__divider {
-      margin-top: 12px !important;
-      margin-bottom: 16px !important;
-      border-top: 1px solid $ieeesa-dark-gray !important;
-    }
-    .mat-mdc-header-cell {
-      white-space: nowrap;
-    }
-    .mat-expansion-panel-body,
-    .ieeesa-data-table {
-      padding-left: 0px;
-      padding-right: 0px;
-    }
-    .ieeesa-data-table {
-      .mat-column-permissions {
-        min-width: 12.5em;
-        padding: 16px !important;
-      }
-      &__content {
-        margin-top: 0px !important;
-      }
-      &__column-menu {
-        .mat-mdc-icon-button.mat-mdc-button-base {
-          padding: 6px;
-          width: 24px;
-          height: 24px;
-        }
-      }
-      &__columns-header-text {
-        padding: 8px 16px;
-        background: $ieeesa-data-table-columns-header;
-        box-shadow: $ieeesa-box-shadow-18;
-      }
-    }
-    .mat-mdc-paginator-container {
-      padding: 0;
-      flex-wrap: nowrap;
-    }
-    .mdc-notched-outline {
-      &__trailing,
-      &__notch,
-      &__leading {
-        border: none !important;
-      }
-    }
-    .mat-mdc-paginator-page-size,
-    .mat-mdc-paginator-page-size-label,
-    .mat-mdc-paginator-page-size-select,
-    .mat-mdc-paginator-range-label {
-      margin: 0;
-    }
-    .at-mdc-select-min-line,
-    .mat-mdc-paginator-range-label {
-      color: $ieeesa-brand-dark-grey;
-    }
-    .mat-mdc-paginator-page-size-label {
-      position: relative;
-      color: $ieeesa-dark-grey;
-      left: 2em;
-    }
-  }
-  &__group-types {
-    .ieeesa-accordion {
-      .mat-accordion {
-        .mat-expansion-panel-spacing.mat-expanded {
-          position: relative;
-        }
-      }
-    }
-    .mat-mdc-header-cell {
-      white-space: nowrap;
-    }
-    .mat-expansion-panel-body,
-    .ieeesa-data-table {
-      padding-left: 0px;
-      padding-right: 0px;
-    }
-  }
-}
-.ieeesa-menu {
-  &__item:not(:last-of-type) {
-    margin-bottom: 0px !important;
-  }
-  .mat-mdc-menu-item {
-    min-height: 35px !important;
-  }
-}