[#44853] renamed file-link-list to storage

- file-link-list component renamed to storage component, which is
  container of the list, the header, the info box, and the action bar
- renaming of directories and module

frontend/src/app/features/work-packages/components/wp-single-view-tabs/files-tab/op-files-tab.component.ts

@@ -41,7 +41,6 @@ import {
   map,
 } from 'rxjs/operators';
 
-import { nextcloud } from 'core-app/shared/components/file-links/file-links-constants.const';
 import { WorkPackageResource } from 'core-app/features/hal/resources/work-package-resource';
 import { I18nService } from 'core-app/core/i18n/i18n.service';
 import { HookService } from 'core-app/features/plugins/hook-service';
@@ -65,20 +64,12 @@ export class WorkPackageFilesTabComponent implements OnInit {
     attachments: {
       label: this.i18n.t('js.label_attachments'),
     },
-    storages: {
-      open: (storageType:string):string => this.i18n.t(
-        'js.storages.open_storage',
-        { storageType: this.storageTypeMap[storageType] },
-      ),
-    },
   };
 
   showAttachmentHeader$:Observable<boolean>;
 
   storages$:Observable<IStorage[]>;
 
-  private readonly storageTypeMap:Record<string, string> = {};
-
   constructor(
     private readonly i18n:I18nService,
     private readonly hook:HookService,
@@ -90,8 +81,6 @@ export class WorkPackageFilesTabComponent implements OnInit {
   ) { }
 
   ngOnInit():void {
-    this.initializeStorageTypes();
-
     const project = this.workPackage.project as HalResource;
     if (project.id === null) {
       return;
@@ -123,12 +112,4 @@ export class WorkPackageFilesTabComponent implements OnInit {
       map(([storages, viewPermission]) => storages.length > 0 && viewPermission),
     );
   }
-
-  public openStorage(href:string):void {
-    window.open(href, '_blank');
-  }
-
-  private initializeStorageTypes() {
-    this.storageTypeMap[nextcloud] = this.i18n.t('js.storages.types.nextcloud');
-  }
 }

frontend/src/app/features/work-packages/components/wp-single-view-tabs/files-tab/op-files-tab.html

@@ -24,21 +24,9 @@
     data-qa-selector="op-tab-content--tab-section"
     class="op-tab-content--tab-section"
   >
-    <div class=op-tab-content--header>
-      <span class="op-tab-content--header-icon spot-icon spot-icon_nextcloud-circle op-files-tab--icon op-files-tab--icon_nextcloud"></span>
-      <span class="op-tab-content--header-text" [textContent]="storage.name"></span>
-      <button
-        class="op-tab-content--header-action spot-link"
-        [title]="text.storages.open(storage._links.type.href)"
-        (click)="openStorage(storage._links.open.href)"
-      >
-        <span class="spot-icon spot-icon_external-link"></span>
-      </button>
-    </div>
-
-    <op-file-link-list
+    <op-storage
       [resource]="workPackage"
       [storage]="storage"
-    ></op-file-link-list>
+    ></op-storage>
   </section>
 </div>

frontend/src/app/features/work-packages/openproject-work-packages.module.ts

@@ -177,7 +177,7 @@ import { WorkPackageMarkNotificationButtonComponent } from 'core-app/features/wo
 import { WorkPackageFilesTabComponent } from 'core-app/features/work-packages/components/wp-single-view-tabs/files-tab/op-files-tab.component';
 import { WorkPackagesQueryViewService } from 'core-app/features/work-packages/components/wp-list/wp-query-view.service';
 import isNewResource from 'core-app/features/hal/helpers/is-new-resource';
-import { OpenprojectFileLinksModule } from 'core-app/shared/components/file-links/openproject-file-links.module';
+import { OpenprojectStoragesModule } from 'core-app/shared/components/storages/openproject-storages.module';
 import { FileLinksResourceService } from 'core-app/core/state/file-links/file-links.service';
 import { StoragesResourceService } from 'core-app/core/state/storages/storages.service';
 import { DatepickerBannerComponent } from 'core-app/shared/components/datepicker/banner/datepicker-banner.component';
@@ -210,7 +210,7 @@ import { StorageFilesResourceService } from 'core-app/core/state/storage-files/s
 
     EditFieldControlsModule,
     OpenprojectTabsModule,
-    OpenprojectFileLinksModule,
+    OpenprojectStoragesModule,
   ],
   providers: [
     // Notification service

frontend/src/app/shared/components/attachments/attachment-list/attachment-list-item.component.ts

@@ -48,10 +48,10 @@ import { UntilDestroyedMixin } from 'core-app/shared/helpers/angular/until-destr
 import { PrincipalsResourceService } from 'core-app/core/state/principals/principals.service';
 import { PrincipalRendererService } from 'core-app/shared/components/principal/principal-renderer.service';
 import idFromLink from 'core-app/features/hal/helpers/id-from-link';
-import { IFileIcon } from 'core-app/shared/components/file-links/file-link-icons/icon-mappings';
+import { IFileIcon } from 'core-app/shared/components/storages/file-link-icons/icon-mappings';
 import {
   getIconForMimeType,
-} from 'core-app/shared/components/file-links/file-link-icons/file-link-list-item-icon.factory';
+} from 'core-app/shared/components/storages/file-link-icons/file-link-list-item-icon.factory';
 import { ConfirmDialogService } from 'core-app/shared/components/modals/confirm-dialog/confirm-dialog.service';
 import { ConfirmDialogOptions } from 'core-app/shared/components/modals/confirm-dialog/confirm-dialog.modal';
 

frontend/src/app/shared/components/storages/file-link-icons/file-link-list-item-icon.factory.ts

@@ -29,7 +29,7 @@
 import {
   fileIconMappings,
   IFileIcon,
-} from 'core-app/shared/components/file-links/file-link-icons/icon-mappings';
+} from 'core-app/shared/components/storages/file-link-icons/icon-mappings';
 
 export function getIconForMimeType(mimeType?:string):IFileIcon {
   if (mimeType && fileIconMappings[mimeType]) {

frontend/src/app/shared/components/storages/file-link-list-item/file-link-list-item.component.ts

@@ -40,17 +40,17 @@ import {
 
 import { I18nService } from 'core-app/core/i18n/i18n.service';
 import { TimezoneService } from 'core-app/core/datetime/timezone.service';
-import { IFileIcon } from 'core-app/shared/components/file-links/file-link-icons/icon-mappings';
+import { IFileIcon } from 'core-app/shared/components/storages/file-link-icons/icon-mappings';
 import { IFileLink, IFileLinkOriginData } from 'core-app/core/state/file-links/file-link.model';
-import { fileLinkViewAllowed } from 'core-app/shared/components/file-links/file-links-constants.const';
+import { fileLinkViewAllowed } from 'core-app/shared/components/storages/storages-constants.const';
 import { PrincipalRendererService } from 'core-app/shared/components/principal/principal-renderer.service';
 import {
   getIconForMimeType,
-} from 'core-app/shared/components/file-links/file-link-icons/file-link-list-item-icon.factory';
+} from 'core-app/shared/components/storages/file-link-icons/file-link-list-item-icon.factory';
 import SpotDropAlignmentOption from 'core-app/spot/drop-alignment-options';
 import { ConfirmDialogOptions } from 'core-app/shared/components/modals/confirm-dialog/confirm-dialog.modal';
 import { ConfirmDialogService } from 'core-app/shared/components/modals/confirm-dialog/confirm-dialog.service';
-import { isDirectory } from 'core-app/shared/components/file-links/file-link-icons/file-icons.helper';
+import { isDirectory } from 'core-app/shared/components/storages/file-link-icons/file-icons.helper';
 
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector

frontend/src/app/shared/components/storages/file-link-list-item/file-link-list-item.html

@@ -16,6 +16,7 @@
       class="spot-list--item-action spot-list--item-action_link op-file-list--item-action"
       [ngClass]="{
         'spot-list--item-action_disabled': disabled,
+        'op-file-list--item-action_disabled': disabled,
         'op-file-list--item-action_view-not-allowed': !viewAllowed
       }"
       [href]="fileLink._links.staticOriginOpen.href"

frontend/src/app/shared/components/storages/file-picker-modal/file-picker-modal.component.ts

@@ -50,10 +50,10 @@ import { StorageFilesResourceService } from 'core-app/core/state/storage-files/s
 import { Breadcrumb, BreadcrumbsContent } from 'core-app/spot/components/breadcrumbs/breadcrumbs-content';
 import {
   StorageFileListItem,
-} from 'core-app/shared/components/file-links/storage-file-list-item/storage-file-list-item';
+} from 'core-app/shared/components/storages/storage-file-list-item/storage-file-list-item';
 import { FileLinksResourceService } from 'core-app/core/state/file-links/file-links.service';
-import { isDirectory } from 'core-app/shared/components/file-links/file-link-icons/file-icons.helper';
-import getIconForStorageType from 'core-app/shared/components/file-links/storage-icons/get-icon-for-storage-type';
+import { isDirectory } from 'core-app/shared/components/storages/file-link-icons/file-icons.helper';
+import getIconForStorageType from 'core-app/shared/components/storages/storage-icons/get-icon-for-storage-type';
 
 @Component({
   templateUrl: 'file-picker-modal.html',

frontend/src/app/shared/components/storages/file-picker-modal/sort-files.pipe.ts

@@ -1,5 +1,5 @@
 import { Pipe, PipeTransform } from '@angular/core';
-import { isDirectory } from 'core-app/shared/components/file-links/file-link-icons/file-icons.helper';
+import { isDirectory } from 'core-app/shared/components/storages/file-link-icons/file-icons.helper';
 
 @Pipe({
   name: 'sortFiles',

frontend/src/app/shared/components/storages/openproject-storages.module.ts

@@ -33,24 +33,24 @@ import { CookieService } from 'ngx-cookie-service';
 import { IconModule } from 'core-app/shared/components/icon/icon.module';
 import { OpSpotModule } from 'core-app/spot/spot.module';
 
-import { FileLinkListComponent } from 'core-app/shared/components/file-links/file-link-list/file-link-list.component';
+import { StorageComponent } from 'core-app/shared/components/storages/storage/storage.component';
 import {
   FileLinkListItemComponent,
-} from 'core-app/shared/components/file-links/file-link-list-item/file-link-list-item.component';
+} from 'core-app/shared/components/storages/file-link-list-item/file-link-list-item.component';
 import {
   StorageInformationComponent,
-} from 'core-app/shared/components/file-links/storage-information/storage-information.component';
+} from 'core-app/shared/components/storages/storage-information/storage-information.component';
 import {
   FilePickerModalComponent,
-} from 'core-app/shared/components/file-links/file-picker-modal/file-picker-modal.component';
+} from 'core-app/shared/components/storages/file-picker-modal/file-picker-modal.component';
 import { OPSharedModule } from 'core-app/shared/shared.module';
 import {
   StorageFileListItemComponent,
-} from 'core-app/shared/components/file-links/storage-file-list-item/storage-file-list-item.component';
-import { SortFilesPipe } from 'core-app/shared/components/file-links/file-picker-modal/sort-files.pipe';
+} from 'core-app/shared/components/storages/storage-file-list-item/storage-file-list-item.component';
+import { SortFilesPipe } from 'core-app/shared/components/storages/file-picker-modal/sort-files.pipe';
 import {
   LoadingFileListComponent,
-} from 'core-app/shared/components/file-links/loading-file-list/loading-file-list.component';
+} from 'core-app/shared/components/storages/loading-file-list/loading-file-list.component';
 
 @NgModule({
   imports: [
@@ -60,7 +60,7 @@ import {
     OPSharedModule,
   ],
   declarations: [
-    FileLinkListComponent,
+    StorageComponent,
     FileLinkListItemComponent,
     FilePickerModalComponent,
     LoadingFileListComponent,
@@ -69,10 +69,10 @@ import {
     SortFilesPipe,
   ],
   exports: [
-    FileLinkListComponent,
+    StorageComponent,
   ],
   providers: [
     CookieService,
   ],
 })
-export class OpenprojectFileLinksModule {}
+export class OpenprojectStoragesModule {}

frontend/src/app/shared/components/storages/storage-file-list-item/storage-file-list-item.component.ts

@@ -35,7 +35,7 @@ import {
 import { PrincipalLike } from 'core-app/shared/components/principal/principal-types';
 import {
   StorageFileListItem,
-} from 'core-app/shared/components/file-links/storage-file-list-item/storage-file-list-item';
+} from 'core-app/shared/components/storages/storage-file-list-item/storage-file-list-item';
 import SpotDropAlignmentOption from 'core-app/spot/drop-alignment-options';
 import { I18nService } from 'core-app/core/i18n/i18n.service';
 

frontend/src/app/shared/components/storages/storage-file-list-item/storage-file-list-item.ts

@@ -30,9 +30,9 @@ import { IStorageFile } from 'core-app/core/state/storage-files/storage-file.mod
 import { TimezoneService } from 'core-app/core/datetime/timezone.service';
 import {
   getIconForMimeType,
-} from 'core-app/shared/components/file-links/file-link-icons/file-link-list-item-icon.factory';
-import { IFileIcon } from 'core-app/shared/components/file-links/file-link-icons/icon-mappings';
-import { isDirectory } from 'core-app/shared/components/file-links/file-link-icons/file-icons.helper';
+} from 'core-app/shared/components/storages/file-link-icons/file-link-list-item-icon.factory';
+import { IFileIcon } from 'core-app/shared/components/storages/file-link-icons/icon-mappings';
+import { isDirectory } from 'core-app/shared/components/storages/file-link-icons/file-icons.helper';
 
 export class StorageFileListItem {
   get name():string {

frontend/src/app/shared/components/storages/storage-icons/get-icon-for-storage-type.ts

@@ -26,7 +26,7 @@
 // See COPYRIGHT and LICENSE files for more details.
 //++
 
-import { storageIconMappings } from 'core-app/shared/components/file-links/storage-icons/icon-mappings';
+import { storageIconMappings } from 'core-app/shared/components/storages/storage-icons/icon-mappings';
 
 export default function getIconForStorageType(storageType?:string):string {
   if (storageType && storageIconMappings[storageType]) {

frontend/src/app/shared/components/storages/storage-icons/icon-mappings.ts

@@ -26,7 +26,7 @@
 // See COPYRIGHT and LICENSE files for more details.
 //++
 
-import { nextcloud } from 'core-app/shared/components/file-links/file-links-constants.const';
+import { nextcloud } from 'core-app/shared/components/storages/storages-constants.const';
 
 export const storageIconMappings:Record<string, string> = {
   [nextcloud]: 'nextcloud-circle',

frontend/src/app/shared/components/storages/storage-information/storage-information-box.ts

@@ -26,7 +26,7 @@
 // See COPYRIGHT and LICENSE files for more details.
 //++
 
-import { StorageActionButton } from 'core-app/shared/components/file-links/storage-information/storage-action-button';
+import { StorageActionButton } from 'core-app/shared/components/storages/storage-information/storage-action-button';
 
 export class StorageInformationBox {
   constructor(

frontend/src/app/shared/components/storages/storage-information/storage-information.component.ts

@@ -31,7 +31,7 @@ import {
 } from '@angular/core';
 import {
   StorageInformationBox,
-} from 'core-app/shared/components/file-links/storage-information/storage-information-box';
+} from 'core-app/shared/components/storages/storage-information/storage-information-box';
 
 @Component({
   selector: 'op-storage-information',

frontend/src/app/shared/components/storages/storage/storage.component.html

@@ -1,6 +1,18 @@
 <ng-container
   *ngIf="resource"
 >
+  <div class=op-tab-content--header>
+    <span class="op-tab-content--header-icon spot-icon spot-icon_nextcloud-circle op-files-tab--icon op-files-tab--icon_nextcloud"></span>
+    <span class="op-tab-content--header-text" [textContent]="storage.name"></span>
+    <button
+      class="op-tab-content--header-action spot-link"
+      [title]="text.openStorage()"
+      (click)="openStorageLocation()"
+    >
+      <span class="spot-icon spot-icon_external-link"></span>
+    </button>
+  </div>
+
   <op-storage-information
     *ngFor="let infoBox of storageInformation | async"
     class="op-files-tab--storage-info-box"

frontend/src/app/shared/components/storages/storage/storage.component.ts

@@ -50,28 +50,28 @@ import {
   storageAuthorizationError,
   storageConnected,
   storageFailedAuthorization,
-} from 'core-app/shared/components/file-links/file-links-constants.const';
+} from 'core-app/shared/components/storages/storages-constants.const';
 import { CurrentUserService } from 'core-app/core/current-user/current-user.service';
 import { UntilDestroyedMixin } from 'core-app/shared/helpers/angular/until-destroyed.mixin';
 import { I18nService } from 'core-app/core/i18n/i18n.service';
 import isNewResource from 'core-app/features/hal/helpers/is-new-resource';
-import { StorageActionButton } from 'core-app/shared/components/file-links/storage-information/storage-action-button';
+import { StorageActionButton } from 'core-app/shared/components/storages/storage-information/storage-action-button';
 import {
   StorageInformationBox,
-} from 'core-app/shared/components/file-links/storage-information/storage-information-box';
+} from 'core-app/shared/components/storages/storage-information/storage-information-box';
 import { OpModalService } from 'core-app/shared/components/modal/modal.service';
 import { ConfigurationService } from 'core-app/core/config/configuration.service';
 import {
   FilePickerModalComponent,
-} from 'core-app/shared/components/file-links/file-picker-modal/file-picker-modal.component';
+} from 'core-app/shared/components/storages/file-picker-modal/file-picker-modal.component';
 import { IHalResourceLink } from 'core-app/core/state/hal-resource';
 
 @Component({
-  selector: 'op-file-link-list',
-  templateUrl: './file-link-list.html',
+  selector: 'op-storage',
+  templateUrl: './storage.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class FileLinkListComponent extends UntilDestroyedMixin implements OnInit {
+export class StorageComponent extends UntilDestroyedMixin implements OnInit {
   @Input() public resource:HalResource;
 
   @Input() public storage:IStorage;
@@ -108,6 +108,7 @@ export class FileLinkListComponent extends UntilDestroyedMixin implements OnInit
     actions: {
       linkExisting: this.i18n.t('js.storages.link_existing_files'),
     },
+    openStorage: ():string => this.i18n.t('js.storages.open_storage', { storageType: this.storageType }),
   };
 
   public get storageFileLinkingEnabled():boolean {
@@ -162,6 +163,10 @@ export class FileLinkListComponent extends UntilDestroyedMixin implements OnInit
     this.fileLinkResourceService.remove(this.collectionKey, fileLink);
   }
 
+  public openStorageLocation():void {
+    window.open(this.storageFilesLocation, '_blank');
+  }
+
   public openLinkFilesDialog():void {
     this.fileLinks$
       .pipe(take(1))
@@ -217,7 +222,7 @@ export class FileLinkListComponent extends UntilDestroyedMixin implements OnInit
           if (this.storage._links.authorize) {
             const nonce = uuidv4();
             this.setAuthorizationCallbackCookie(nonce);
-            window.location.href = FileLinkListComponent.authorizationFailureActionUrl(
+            window.location.href = StorageComponent.authorizationFailureActionUrl(
               this.storage._links.authorize.href,
               nonce,
             );

frontend/src/app/spot/styles/sass/components/list.sass

@@ -47,7 +47,7 @@
         color: $spot-color-basic-gray-3
         background-color: $spot-color-basic-gray-6
 
-      &_link
+      &_link:not(&_disabled)
         color: var(--content-link-color)
 
     &-floating-wrapper

frontend/src/global_styles/content/work_packages/shared/_file_list.sass

@@ -33,7 +33,7 @@
     &-action
       text-decoration: none
 
-      &:hover
+      &:not(&_disabled):hover
         .op-file-list--item-title
           text-decoration: underline