(chore): format:write

geonetwork · Jun 23, 2023 · 3b6d345 · 3b6d345
1 parent 7ca17ed
commit 3b6d345
Show file tree

Hide file tree

Showing 3 changed files with 188 additions and 66 deletions.
diff --git a/apps/datahub/src/app/home/search/search-filters/search-filters.component.html b/apps/datahub/src/app/home/search/search-filters/search-filters.component.html
@@ -1,75 +1,151 @@
-<div class="bg-primary text-white p-5 shadow-xl rounded-lg grid grid-cols-6 gap-4 transition-[height] duration-100"
-  [ngClass]="{ 'sm:bg-white sm:text-main': !isOpen }">
-  <div class="sm:col-span-4 grid grid-cols-1 sm:grid-cols-2 gap-7 sm:gap-4 sm:grid-rows-auto" [ngClass]="
+<div
+  class="bg-primary text-white p-5 shadow-xl rounded-lg grid grid-cols-6 gap-4 transition-[height] duration-100"
+  [ngClass]="{ 'sm:bg-white sm:text-main': !isOpen }"
+>
+  <div
+    class="sm:col-span-4 grid grid-cols-1 sm:grid-cols-2 gap-7 sm:gap-4 sm:grid-rows-auto"
+    [ngClass]="
       isOpen
         ? 'col-span-6 mb-7 sm:mb-0'
         : 'col-span-4 sm:col-span-3 lg:col-span-4'
-    ">
+    "
+  >
     <div class="sm:col-span-2" [ngClass]="isOpen ? 'flex' : 'flex sm:hidden'">
       <div class="w-full flex flex-row justify-between">
-        <div class="flex flex-col sm:flex-row items-baseline justify-start gap-2">
+        <div
+          class="flex flex-col sm:flex-row items-baseline justify-start gap-2"
+        >
           <h2 class="text-xl mr-4 font-title" translate>
             search.filters.title
           </h2>
-          <button type="button" class="text-sm opacity-80 hover:opacity-100 transition-opacity clear-btn" translate=""
-            (click)="clearFilters()" data-cy="clearFilters">
+          <button
+            type="button"
+            class="text-sm opacity-80 hover:opacity-100 transition-opacity clear-btn"
+            translate=""
+            (click)="clearFilters()"
+            data-cy="clearFilters"
+          >
             search.filters.clear
           </button>
         </div>
         <span class="shrink-0 sm:hidden">
-          <button type="button" *ngIf="isOpen" class="text-white opacity-60 hover:opacity-90 border-0 bg-transparent"
-            (click)="close()">
+          <button
+            type="button"
+            *ngIf="isOpen"
+            class="text-white opacity-60 hover:opacity-90 border-0 bg-transparent"
+            (click)="close()"
+          >
             <span class="text-sm" translate>search.filters.minimize</span>
             <mat-icon class="ml-1 align-middle leading-none">remove</mat-icon>
           </button>
         </span>
       </div>
     </div>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden sm:block'" [fieldName]="'publisher'"
-      [title]="'search.filters.byOrganisation' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden sm:block'" [fieldName]="'format'"
-      [title]="'search.filters.byFormat' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden'" [fieldName]="'documentStandard'"
-      [title]="'search.filters.byStandard' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden'" [fieldName]="'inspireKeyword'"
-      [title]="'search.filters.byInspireKeyword' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden'" [fieldName]="'topic'"
-      [title]="'search.filters.byTopic' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden'" [fieldName]="'publicationYear'"
-      [title]="'search.filters.byPublicationYear' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden'" [fieldName]="'isSpatial'"
-      [title]="'search.filters.isSpatial' | translate"></gn-ui-filter-dropdown>
-    <gn-ui-filter-dropdown class="w-full" [ngClass]="isOpen ? 'block' : 'hidden'" [fieldName]="'license'"
-      [title]="'search.filters.byLicense' | translate"></gn-ui-filter-dropdown>
-    <div class="spatial-filter-toggle sm:col-span-2" *ngIf="isOpen && searchFacade.hasSpatialFilter$ | async">
-      <gn-ui-check-toggle [title]="'search.filters.useSpatialFilterHelp' | translate"
-        [label]="'search.filters.useSpatialFilter' | translate" [color]="'secondary'"
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden sm:block'"
+      [fieldName]="'publisher'"
+      [title]="'search.filters.byOrganisation' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden sm:block'"
+      [fieldName]="'format'"
+      [title]="'search.filters.byFormat' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden'"
+      [fieldName]="'documentStandard'"
+      [title]="'search.filters.byStandard' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden'"
+      [fieldName]="'inspireKeyword'"
+      [title]="'search.filters.byInspireKeyword' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden'"
+      [fieldName]="'topic'"
+      [title]="'search.filters.byTopic' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden'"
+      [fieldName]="'publicationYear'"
+      [title]="'search.filters.byPublicationYear' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden'"
+      [fieldName]="'isSpatial'"
+      [title]="'search.filters.isSpatial' | translate"
+    ></gn-ui-filter-dropdown>
+    <gn-ui-filter-dropdown
+      class="w-full"
+      [ngClass]="isOpen ? 'block' : 'hidden'"
+      [fieldName]="'license'"
+      [title]="'search.filters.byLicense' | translate"
+    ></gn-ui-filter-dropdown>
+    <div
+      class="spatial-filter-toggle sm:col-span-2"
+      *ngIf="isOpen && searchFacade.hasSpatialFilter$ | async"
+    >
+      <gn-ui-check-toggle
+        [title]="'search.filters.useSpatialFilterHelp' | translate"
+        [label]="'search.filters.useSpatialFilter' | translate"
+        [color]="'secondary'"
         [value]="searchFacade.spatialFilterEnabled$ | async"
-        (toggled)="toggleSpatialFilter($event)"></gn-ui-check-toggle>
+        (toggled)="toggleSpatialFilter($event)"
+      ></gn-ui-check-toggle>
     </div>
   </div>
-  <div class="col-span-2 flex flex-col justify-between" [ngClass]="{ 'sm:col-span-3 lg:col-span-2': !isOpen }">
-    <div class="flex flex-row" [ngClass]="
+  <div
+    class="col-span-2 flex flex-col justify-between"
+    [ngClass]="{ 'sm:col-span-3 lg:col-span-2': !isOpen }"
+  >
+    <div
+      class="flex flex-row"
+      [ngClass]="
         isOpen
           ? 'justify-start sm:justify-end'
           : 'justify-end sm:justify-between'
-      ">
-      <gn-ui-button class="hidden sm:block" *ngIf="!isOpen" (buttonClick)="open()" type="outline" extraClass="!p-[8px]">
+      "
+    >
+      <gn-ui-button
+        class="hidden sm:block"
+        *ngIf="!isOpen"
+        (buttonClick)="open()"
+        type="outline"
+        extraClass="!p-[8px]"
+      >
         <mat-icon>more_horiz</mat-icon>
       </gn-ui-button>
-      <button type="button" *ngIf="!isOpen"
-        class="text-white opacity-60 hover:opacity-90 border-0 bg-transparent sm:hidden" (click)="open()">
+      <button
+        type="button"
+        *ngIf="!isOpen"
+        class="text-white opacity-60 hover:opacity-90 border-0 bg-transparent sm:hidden"
+        (click)="open()"
+      >
         <span class="text-sm" translate>search.filters.maximize</span>
         <mat-icon class="ml-1 align-middle leading-none">add</mat-icon>
       </button>
-      <gn-ui-sort-by [ngClass]="isOpen ? 'block text-white mb-1' : 'hidden sm:block'"></gn-ui-sort-by>
+      <gn-ui-sort-by
+        [ngClass]="isOpen ? 'block text-white mb-1' : 'hidden sm:block'"
+      ></gn-ui-sort-by>
     </div>
     <div class="text-right">
-      <button type="button" *ngIf="isOpen"
-        class="text-white opacity-60 hover:opacity-90 border-0 bg-transparent hidden sm:inline" (click)="close()">
+      <button
+        type="button"
+        *ngIf="isOpen"
+        class="text-white opacity-60 hover:opacity-90 border-0 bg-transparent hidden sm:inline"
+        (click)="close()"
+      >
         <span class="text-sm" translate>search.filters.minimize</span>
         <mat-icon class="ml-1 align-middle leading-none">remove</mat-icon>
       </button>
     </div>
   </div>
-</div>
+</div>
diff --git a/libs/feature/search/src/lib/results-list/results-list.container.component.html b/libs/feature/search/src/lib/results-list/results-list.container.component.html
@@ -1,18 +1,33 @@
 <div *ngIf="(error$ | async) === null" class="search-results relative">
-  <gn-ui-results-list [records]="facade.results$ | async" [layoutConfig]="layoutConfig$ | async"
-    [favoriteTemplate]="favoriteToggle" (mdSelect)="onMetadataSelection($event)"></gn-ui-results-list>
+  <gn-ui-results-list
+    [records]="facade.results$ | async"
+    [layoutConfig]="layoutConfig$ | async"
+    [favoriteTemplate]="favoriteToggle"
+    (mdSelect)="onMetadataSelection($event)"
+  ></gn-ui-results-list>
 
-  <ng-container *ngIf="
+  <ng-container
+    *ngIf="
       (facade.isLoading$ | async) === false &&
       (facade.isEndOfResults$ | async) === false
-    ">
+    "
+  >
     <div class="show-more h-[100px] pt-[30px]" *ngIf="showMore === 'button'">
-      <gn-ui-button data-cy="addMoreBtn" type="secondary" (buttonClick)="onShowMore()" extraClass="m-auto !p-[22px]">
-        <span class="uppercase font-medium tracking-widest" translate>results.showMore</span>
+      <gn-ui-button
+        data-cy="addMoreBtn"
+        type="secondary"
+        (buttonClick)="onShowMore()"
+        extraClass="m-auto !p-[22px]"
+      >
+        <span class="uppercase font-medium tracking-widest" translate
+          >results.showMore</span
+        >
       </gn-ui-button>
     </div>
     <div class="show-more h-[100px]" *ngIf="showMore === 'auto'">
-      <gn-ui-viewport-intersector (entersViewport)="onShowMore()"></gn-ui-viewport-intersector>
+      <gn-ui-viewport-intersector
+        (entersViewport)="onShowMore()"
+      ></gn-ui-viewport-intersector>
     </div>
   </ng-container>
 
@@ -24,12 +39,18 @@
 </div>
 
 <div class="p-4 max-w-[600px] m-auto text-[13px]">
-  <gn-ui-search-results-error *ngIf="(errorCode$ | async) === 0" [type]="errorTypes.COULD_NOT_REACH_API">
+  <gn-ui-search-results-error
+    *ngIf="(errorCode$ | async) === 0"
+    [type]="errorTypes.COULD_NOT_REACH_API"
+  >
   </gn-ui-search-results-error>
-  <gn-ui-search-results-error *ngIf="(error$ | async) !== null && (errorCode$ | async) !== 0"
-    [type]="errorTypes.RECEIVED_ERROR" [error]="errorMessage$ | async"></gn-ui-search-results-error>
+  <gn-ui-search-results-error
+    *ngIf="(error$ | async) !== null && (errorCode$ | async) !== 0"
+    [type]="errorTypes.RECEIVED_ERROR"
+    [error]="errorMessage$ | async"
+  ></gn-ui-search-results-error>
 </div>
 
 <ng-template #favoriteToggle let-record>
   <gn-ui-favorite-star [record]="record"></gn-ui-favorite-star>
-</ng-template>
+</ng-template>
diff --git a/libs/ui/search/src/lib/record-preview-row/record-preview-row.component.html b/libs/ui/search/src/lib/record-preview-row/record-preview-row.component.html
@@ -1,38 +1,63 @@
-<div class="group container-lg mx-auto flex cursor-pointer flex-wrap sm:flex-nowrap" [title]="record.title">
+<div
+  class="group container-lg mx-auto flex cursor-pointer flex-wrap sm:flex-nowrap"
+  [title]="record.title"
+>
   <div class="shrink-0 w-full sm:w-52">
-    <div class="overflow-hidden bg-gray-100 rounded-lg w-full border border-gray-300 h-36">
-      <gn-ui-thumbnail class="relative h-full w-full object-cover object-left-top"
-        [thumbnailUrl]="record.thumbnailUrl"></gn-ui-thumbnail>
+    <div
+      class="overflow-hidden bg-gray-100 rounded-lg w-full border border-gray-300 h-36"
+    >
+      <gn-ui-thumbnail
+        class="relative h-full w-full object-cover object-left-top"
+        [thumbnailUrl]="record.thumbnailUrl"
+      ></gn-ui-thumbnail>
     </div>
   </div>
-  <div class="content grid grow relative sm:pl-6 sm:pr-12" style="grid-template-columns: auto 70px">
+  <div
+    class="content grid grow relative sm:pl-6 sm:pr-12"
+    style="grid-template-columns: auto 70px"
+  >
     <div class="mb-3 mt-5 sm:mt-2">
       <div
         class="font-title text-21 text-title line-clamp-2 col-start-1 col-span-2 sm:line-clamp-1 group-hover:text-primary"
-        data-cy="recordTitle">
+        data-cy="recordTitle"
+      >
         {{ record.title }}
       </div>
     </div>
     <div
       class="abstract mt-4 mb-5 h-36 line-clamp-6 col-start-1 col-span-2 row-start-3 sm:mb-2 sm:h-[4.5rem] sm:line-clamp-3 sm:row-start-2 sm:mt-0"
-      data-cy="recordAbstract">
+      data-cy="recordAbstract"
+    >
       {{ abstract }}
     </div>
     <div
       class="text-primary opacity-45 uppercase col-start-1 col-span-2 row-start-2 sm:truncate sm:row-start-3 sm:col-span-1"
-      data-cy="recordOrg">
+      data-cy="recordOrg"
+    >
       {{ contact?.organisation }}
     </div>
-    <div class="icons flex flex-row col-start-1 row-start-4 sm:col-start-2 sm:row-start-3 sm:absolute sm:right-[0.4em]">
-      <mat-icon *ngIf="isDownloadable"
-        class="material-icons-outlined text-primary opacity-45 mx-1">cloud_download</mat-icon>
-      <mat-icon *ngIf="isViewable" class="material-icons-outlined text-primary opacity-45 mx-1">map</mat-icon>
+    <div
+      class="icons flex flex-row col-start-1 row-start-4 sm:col-start-2 sm:row-start-3 sm:absolute sm:right-[0.4em]"
+    >
+      <mat-icon
+        *ngIf="isDownloadable"
+        class="material-icons-outlined text-primary opacity-45 mx-1"
+        >cloud_download</mat-icon
+      >
+      <mat-icon
+        *ngIf="isViewable"
+        class="material-icons-outlined text-primary opacity-45 mx-1"
+        >map</mat-icon
+      >
     </div>
     <div
       class="text-right col-start-2 row-start-4 sm:absolute sm:col-start-2 sm:row-start-1 sm:top-[-1.125em] sm:right-[0.4em]"
-      data-cy="recordFav">
-      <ng-container [ngTemplateOutlet]="favoriteTemplate"
-        [ngTemplateOutletContext]="{ $implicit: record }"></ng-container>
+      data-cy="recordFav"
+    >
+      <ng-container
+        [ngTemplateOutlet]="favoriteTemplate"
+        [ngTemplateOutletContext]="{ $implicit: record }"
+      ></ng-container>
     </div>
   </div>
-</div>
+</div>