[ACA-4471] - Added show preview action for files in search results (#2169)

* [ACA-4472] - added preview button on info drawer

* [ACA-4472] - added preview button on info drawer

* [ACA-4472] - added preview button on info drawer

* [ACA-4472] - fixed lint

* [ACA-4472] - fixed unit test

* [ACA-4472] - fixed wrong import

* [ACA-4472] - reverted app.config

* [ACA-4472] - added some upgrades for styling

* [ACA-4472] - added some upgrades for styling

* [ACA-4472] - start fixing e2e

* [ACA-4472] - wrong whitespace

* [ACA-4471] - readded view button and fixed bug on closing

* [ACA-4471] - readded action

* [ACA-4238] - fix e2e #2

* [ACA-4471] - readded view button for e2e

* [ACA-4471] - readded view button for e2e

projects/aca-shared/rules/src/app.rules.ts

@@ -495,3 +495,16 @@ export function canShowLogout(context: AcaRuleContext): boolean {
 export function isLibraryManager(context: RuleContext): boolean {
   return hasLibrarySelected(context) && context.selection.library.entry && context.selection.library.entry.role === 'SiteManager';
 }
+
+/**
+ * Checks if the preview button for search results can be showed
+ * JSON ref: `canInfoPreview`
+ * @param context Rule execution context
+ */
+export function canInfoPreview(context: RuleContext): boolean {
+  return navigation.isSearchResults(context) && !isMultiselection(context) && !hasFolderSelected(context) && !navigation.isPreview(context);
+}
+
+export function showInfoSelectionButton(context: RuleContext): boolean {
+  return navigation.isSearchResults(context) && !navigation.isPreview(context);
+}

projects/aca-shared/src/lib/components/info-drawer/info-drawer.component.html

@@ -9,7 +9,7 @@
   >
     <adf-toolbar class="adf-toolbar--inline" info-drawer-buttons>
       <ng-container *ngFor="let entry of actions; trackBy: trackByActionId">
-        <aca-toolbar-action [actionRef]="entry"></aca-toolbar-action>
+        <aca-toolbar-action [actionRef]="entry" [color]="entry?.color"></aca-toolbar-action>
       </ng-container>
     </adf-toolbar>
 

projects/aca-shared/src/lib/components/info-drawer/info-drawer.component.ts

@@ -27,12 +27,11 @@ import { Component, HostListener, Input, OnChanges, OnDestroy, OnInit } from '@a
 import { MinimalNodeEntity, MinimalNodeEntryEntity, SiteEntry } from '@alfresco/js-api';
 import { ContentActionRef, SidebarTabRef } from '@alfresco/adf-extensions';
 import { Store } from '@ngrx/store';
-import { getAppSelection, SetInfoDrawerStateAction, ToggleInfoDrawerAction } from '@alfresco/aca-shared/store';
+import { getAppSelection, SetInfoDrawerStateAction, ToggleInfoDrawerAction, infoDrawerPreview } from '@alfresco/aca-shared/store';
 import { AppExtensionService } from '../../services/app.extension.service';
 import { ContentApiService } from '../../services/content-api.service';
 import { takeUntil } from 'rxjs/operators';
 import { Subject } from 'rxjs';
-
 @Component({
   selector: 'aca-info-drawer',
   templateUrl: './info-drawer.component.html'
@@ -49,6 +48,7 @@ export class InfoDrawerComponent implements OnChanges, OnInit, OnDestroy {
   tabs: Array<SidebarTabRef> = [];
   actions: Array<ContentActionRef> = [];
   onDestroy$ = new Subject<boolean>();
+  preventFromClosing = false;
 
   @HostListener('keydown.escape')
   onEscapeKeyboardEvent(): void {
@@ -65,12 +65,21 @@ export class InfoDrawerComponent implements OnChanges, OnInit, OnDestroy {
       .subscribe(() => {
         this.actions = this.extensions.getAllowedSidebarActions();
       });
+
+    this.store
+      .select(infoDrawerPreview)
+      .pipe(takeUntil(this.onDestroy$))
+      .subscribe((isInfoDrawerPreviewOpened) => {
+        this.preventFromClosing = isInfoDrawerPreviewOpened;
+      });
   }
 
   ngOnDestroy() {
     this.onDestroy$.next(true);
     this.onDestroy$.complete();
-    this.store.dispatch(new SetInfoDrawerStateAction(false));
+    if (!this.preventFromClosing) {
+      this.store.dispatch(new SetInfoDrawerStateAction(false));
+    }
   }
 
   ngOnChanges() {

projects/aca-shared/store/src/actions/app.actions.ts

@@ -44,7 +44,9 @@ export enum AppActionTypes {
   SetInfoDrawerState = 'SET_INFO_DRAWER_STATE',
   SetInfoDrawerMetadataAspect = 'SET_INFO_DRAWER_METADATA_ASPECT',
   CloseModalDialogs = 'CLOSE_MODAL_DIALOGS',
-  SetFileUploadingDialog = 'SET_FILE_UPLOADING_DIALOG'
+  SetFileUploadingDialog = 'SET_FILE_UPLOADING_DIALOG',
+  ShowInfoDrawerPreview = 'SHOW_INFO_DRAWER_PREVIEW',
+  SetInfoDrawerPreviewState = 'SET_INFO_DRAWER_PREVIEW_STATE'
 }
 
 export class SetSettingsParameterAction implements Action {
@@ -134,3 +136,13 @@ export class SetFileUploadingDialogAction implements Action {
 
   constructor(public payload: boolean) {}
 }
+
+export class ShowInfoDrawerPreviewAction implements Action {
+  readonly type = AppActionTypes.ShowInfoDrawerPreview;
+}
+
+export class SetInfoDrawerPreviewStateAction implements Action {
+  readonly type = AppActionTypes.SetInfoDrawerPreviewState;
+
+  constructor(public payload: boolean) {}
+}

projects/aca-shared/store/src/selectors/app.selectors.ts

@@ -39,6 +39,7 @@ export const getAppSelection = createSelector(selectApp, (state) => state.select
 export const getSharedUrl = createSelector(selectApp, (state) => state.sharedUrl);
 export const getNavigationState = createSelector(selectApp, (state) => state.navigation);
 export const isInfoDrawerOpened = createSelector(selectApp, (state) => state.infoDrawerOpened);
+export const infoDrawerPreview = createSelector(selectApp, (state) => state.infoDrawerPreview);
 export const showFacetFilter = createSelector(selectApp, (state) => state.showFacetFilter);
 export const getDocumentDisplayMode = createSelector(selectApp, (state) => state.documentDisplayMode);
 export const getRepositoryStatus = createSelector(selectApp, (state) => state.repository);

projects/aca-shared/store/src/states/app.state.ts

@@ -37,6 +37,7 @@ export interface AppState {
   user: ProfileState;
   navigation: NavigationState;
   infoDrawerOpened: boolean;
+  infoDrawerPreview: boolean;
   infoDrawerMetadataAspect: string;
   showFacetFilter: boolean;
   documentDisplayMode: string;