fix(bugs): fixed institutions and share bugs

src/app/core/components/osf-banners/scheduled-banner/scheduled-banner.component.html

@@ -4,7 +4,7 @@
     [style.background-color]="currentBanner()?.color"
     class="flex w-full justify-content-center align-items flex-row"
   >
-    <a data-test-banner-href [href]="currentBanner()?.link" target="_blank" rel="noopener noreferrer">
+    <a data-test-banner-href class="w-full" [href]="currentBanner()?.link" target="_blank" rel="noopener noreferrer">
       <img
         data-test-banner-image
         class="block w-full"

src/app/core/components/osf-banners/scheduled-banner/scheduled-banner.component.scss

@@ -1,3 +0,0 @@
-.w-full {
-  height: 108px !important;
-}

src/app/features/institutions/pages/institutions-list/institutions-list.component.html

@@ -28,14 +28,6 @@ <h2>{{ institution.name }}</h2>
           <p class="text-center">{{ 'common.search.noResultsFound' | translate }}</p>
         }
       </div>
-
-      @if (totalInstitutionsCount() > currentPageSize()) {
-        <osf-custom-paginator
-          [first]="first()"
-          [totalCount]="totalInstitutionsCount()"
-          (pageChanged)="onPageChange($event)"
-        ></osf-custom-paginator>
-      }
     }
   </div>
 </section>

src/app/features/institutions/pages/institutions-list/institutions-list.component.ts

@@ -2,34 +2,15 @@ import { createDispatchMap, select } from '@ngxs/store';
 
 import { TranslatePipe } from '@ngx-translate/core';
 
-import { PaginatorState } from 'primeng/paginator';
-
 import { debounceTime, distinctUntilChanged } from 'rxjs';
 
 import { NgOptimizedImage } from '@angular/common';
-import {
-  ChangeDetectionStrategy,
-  Component,
-  DestroyRef,
-  effect,
-  HostBinding,
-  inject,
-  signal,
-  untracked,
-} from '@angular/core';
-import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
+import { ChangeDetectionStrategy, Component, DestroyRef, HostBinding, inject } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FormControl } from '@angular/forms';
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 
-import {
-  CustomPaginatorComponent,
-  LoadingSpinnerComponent,
-  SearchInputComponent,
-  SubHeaderComponent,
-} from '@osf/shared/components';
-import { DEFAULT_TABLE_PARAMS } from '@osf/shared/constants';
-import { parseQueryFilterParams } from '@osf/shared/helpers';
-import { QueryParams } from '@osf/shared/models';
+import { LoadingSpinnerComponent, SearchInputComponent, SubHeaderComponent } from '@osf/shared/components';
 import { FetchInstitutions, InstitutionsSelectors } from '@osf/shared/stores';
 
 @Component({
@@ -39,7 +20,6 @@ import { FetchInstitutions, InstitutionsSelectors } from '@osf/shared/stores';
     TranslatePipe,
     SearchInputComponent,
     NgOptimizedImage,
-    CustomPaginatorComponent,
     LoadingSpinnerComponent,
     RouterLink,
   ],
@@ -57,78 +37,17 @@ export class InstitutionsListComponent {
 
   searchControl = new FormControl('');
 
-  queryParams = toSignal(this.route.queryParams);
-  currentPage = signal(1);
-  currentPageSize = signal(DEFAULT_TABLE_PARAMS.rows);
-  first = signal(0);
-
   institutions = select(InstitutionsSelectors.getInstitutions);
-  totalInstitutionsCount = select(InstitutionsSelectors.getInstitutionsTotalCount);
   institutionsLoading = select(InstitutionsSelectors.isInstitutionsLoading);
 
   constructor() {
-    this.setupQueryParamsEffect();
+    this.actions.getInstitutions();
     this.setupSearchSubscription();
   }
 
-  onPageChange(event: PaginatorState): void {
-    this.currentPage.set(event.page ? this.currentPage() + 1 : 1);
-    this.first.set(event.first ?? 0);
-    this.updateQueryParams({
-      page: this.currentPage(),
-      size: event.rows,
-    });
-  }
-
-  private setupQueryParamsEffect(): void {
-    effect(() => {
-      const rawQueryParams = this.queryParams();
-      if (!rawQueryParams) return;
-
-      const parsedQueryParams = parseQueryFilterParams(rawQueryParams);
-
-      this.updateComponentState(parsedQueryParams);
-
-      this.actions.getInstitutions(parsedQueryParams.page, parsedQueryParams.size, parsedQueryParams.search);
-    });
-  }
-
-  private updateQueryParams(updates: Partial<QueryParams>): void {
-    const queryParams: Record<string, string | undefined> = {};
-
-    if ('page' in updates) {
-      queryParams['page'] = updates.page!.toString();
-    }
-    if ('size' in updates) {
-      queryParams['size'] = updates.size!.toString();
-    }
-    if ('search' in updates) {
-      queryParams['search'] = updates.search || undefined;
-    }
-
-    this.router.navigate([], {
-      relativeTo: this.route,
-      queryParams,
-      queryParamsHandling: 'merge',
-    });
-  }
-
   private setupSearchSubscription(): void {
     this.searchControl.valueChanges
       .pipe(debounceTime(300), distinctUntilChanged(), takeUntilDestroyed(this.destroyRef))
-      .subscribe((searchControl) => {
-        this.updateQueryParams({
-          search: searchControl ?? '',
-          page: 1,
-        });
-      });
-  }
-
-  private updateComponentState(params: QueryParams): void {
-    untracked(() => {
-      this.currentPage.set(params.page);
-      this.currentPageSize.set(params.size);
-      this.searchControl.setValue(params.search);
-    });
+      .subscribe((searchControl) => this.actions.getInstitutions(searchControl ?? ''));
   }
 }

src/app/features/project/contributors/contributors.component.html

@@ -11,10 +11,7 @@ <h1 class="py-5 px-3 md:px-5 xl:px-4">{{ 'navigation.contributors' | translate }
 
   <div class="filters-container flex flex-column xl:flex-row">
     <div class="xl:w-7">
-      <osf-search-input
-        [control]="searchControl"
-        [placeholder]="'project.contributors.searchPlaceholder' | translate"
-      />
+      <osf-search-input [control]="searchControl" [placeholder]="searchPlaceholder() | translate" />
     </div>
 
     <div class="contributors-filter-container flex flex-column md:flex-row xl:w-5">

src/app/features/project/contributors/contributors.component.ts

@@ -31,7 +31,7 @@ import {
   ContributorsListComponent,
 } from '@osf/shared/components/contributors';
 import { BIBLIOGRAPHY_OPTIONS, PERMISSION_OPTIONS } from '@osf/shared/constants';
-import { AddContributorType, ContributorPermission } from '@osf/shared/enums';
+import { AddContributorType, ContributorPermission, ResourceType } from '@osf/shared/enums';
 import { findChangedItems } from '@osf/shared/helpers';
 import {
   ContributorDialogAddModel,
@@ -109,6 +109,11 @@ export class ContributorsComponent implements OnInit {
   readonly currentUser = select(UserSelectors.getCurrentUser);
 
   canCreateViewLink = computed(() => !!this.resourceDetails() && !!this.resourceId());
+  searchPlaceholder = computed(() =>
+    this.resourceType() === ResourceType.Project
+      ? 'project.contributors.searchProjectPlaceholder'
+      : 'project.contributors.searchRegistrationPlaceholder'
+  );
 
   isCurrentUserAdminContributor = computed(() => {
     const currentUserId = this.currentUser()?.id;

src/app/features/project/overview/components/overview-toolbar/overview-toolbar.component.ts

@@ -70,7 +70,6 @@ export class OverviewToolbarComponent {
   isCollectionsRoute = input<boolean>(false);
   isAdmin = input.required<boolean>();
   currentResource = input.required<ToolbarResource | null>();
-  projectTitle = input<string>('');
   projectDescription = input<string>('');
   showViewOnlyLinks = input<boolean>(true);
 
@@ -84,13 +83,9 @@ export class OverviewToolbarComponent {
     return shareableContent ? this.buildSocialActionItems(shareableContent) : [];
   });
 
-  hasViewOnly = computed(() => {
-    return hasViewOnlyParam(this.router);
-  });
+  hasViewOnly = computed(() => hasViewOnlyParam(this.router));
 
-  actions = createDispatchMap({
-    clearDuplicatedProject: ClearDuplicatedProject,
-  });
+  actions = createDispatchMap({ clearDuplicatedProject: ClearDuplicatedProject });
 
   readonly forkActionItems = [
     {
@@ -250,16 +245,15 @@ export class OverviewToolbarComponent {
 
   private createShareableContent(): ShareableContent | null {
     const resource = this.currentResource();
-    const title = this.projectTitle();
     const description = this.projectDescription();
 
-    if (!resource?.isPublic || !title) {
+    if (!resource?.isPublic) {
       return null;
     }
 
     return {
       id: resource.id,
-      title,
+      title: resource.title,
       description,
       url: this.buildResourceUrl(resource),
     };

src/app/features/project/overview/components/overview-wiki/overview-wiki.component.html

@@ -4,7 +4,13 @@ <h2>{{ 'project.overview.wiki.title' | translate }}</h2>
     <p-skeleton width="100%" height="5rem" />
   } @else {
     @if (wikiContent()) {
-      <osf-truncated-text [text]="wikiContent()" [hasContent]="true">
+      <osf-truncated-text
+        [text]="wikiContent()"
+        [maxVisibleLines]="12"
+        [navigateOnReadMore]="true"
+        [link]="wikiLink()"
+        [hasOwnContent]="true"
+      >
         <osf-markdown [markdownText]="wikiContent()"></osf-markdown>
       </osf-truncated-text>
     } @else {

src/app/features/project/overview/components/overview-wiki/overview-wiki.component.ts

@@ -4,13 +4,13 @@ import { TranslatePipe } from '@ngx-translate/core';
 
 import { Skeleton } from 'primeng/skeleton';
 
-import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { ChangeDetectionStrategy, Component, input } from '@angular/core';
 
 import { MarkdownComponent, TruncatedTextComponent } from '@osf/shared/components';
 import { WikiSelectors } from '@osf/shared/stores';
 
 @Component({
-  selector: 'osf-project-wiki',
+  selector: 'osf-overview-wiki',
   imports: [Skeleton, TranslatePipe, TruncatedTextComponent, MarkdownComponent],
   templateUrl: './overview-wiki.component.html',
   styleUrl: './overview-wiki.component.scss',
@@ -19,4 +19,8 @@ import { WikiSelectors } from '@osf/shared/stores';
 export class OverviewWikiComponent {
   isWikiLoading = select(WikiSelectors.getHomeWikiLoading);
   wikiContent = select(WikiSelectors.getHomeWikiContent);
+
+  resourceId = input('');
+
+  wikiLink = () => ['/', this.resourceId(), 'wiki'];
 }

src/app/features/project/overview/project-overview.component.html

@@ -16,7 +16,6 @@
     <osf-overview-toolbar
       [isCollectionsRoute]="isCollectionsRoute()"
       [currentResource]="currentResource()"
-      [projectTitle]="project.title"
       [projectDescription]="project.description"
       [isAdmin]="isAdmin"
     />
@@ -75,7 +74,7 @@
 
     <div class="flex flex-column gap-4 left-section">
       @if (isAdmin || canWrite) {
-        <osf-project-wiki />
+        <osf-overview-wiki [resourceId]="currentProject()!.id" />
       }
       <osf-files-widget
         [rootOption]="filesRootOption()"

src/app/features/project/overview/project-overview.component.ts

@@ -206,6 +206,7 @@ export class ProjectOverviewComponent implements OnInit {
     if (project) {
       return {
         id: project.id,
+        title: project.title,
         isPublic: project.isPublic,
         storage: project.storage,
         viewOnlyLinksCount: project.viewOnlyLinksCount,

src/app/features/registry/pages/registry-overview/registry-overview.component.ts

@@ -149,6 +149,7 @@ export class RegistryOverviewComponent {
     if (this.registry()) {
       return {
         id: this.registry()!.id,
+        title: this.registry()?.title,
         isPublic: this.registry()!.isPublic,
         storage: undefined,
         viewOnlyLinksCount: 0,

src/app/shared/components/truncated-text/truncated-text.component.html

@@ -1,30 +1,13 @@
 <div class="flex flex-column gap-3">
-  @if (hasContent()) {
-    <div #textContent class="text-content" [class.expanded]="isTextExpanded()" [style.--line-clamp]="maxVisibleLines()">
+  <div #textContent class="text-content" [class.expanded]="isTextExpanded()" [style.--line-clamp]="maxVisibleLines()">
+    @if (hasOwnContent()) {
       <ng-content></ng-content>
-    </div>
-  } @else {
-    <div
-      #textContent
-      [innerHTML]="text()"
-      class="text-content"
-      [class.expanded]="isTextExpanded()"
-      [style.--line-clamp]="maxVisibleLines()"
-    ></div>
-  }
+    } @else {
+      <div [innerHTML]="text()"></div>
+    }
+  </div>
 
   @if (hasOverflowingText()) {
-    <a
-      class="read-more-link font-bold"
-      (click)="toggleTextExpansion()"
-      (keydown.enter)="toggleTextExpansion()"
-      (keydown.space)="toggleTextExpansion()"
-      role="button"
-      tabindex="0"
-      [attr.aria-expanded]="isTextExpanded()"
-      [attr.aria-controls]="'text-content'"
-    >
-      {{ isTextExpanded() ? ('truncatedText.hide' | translate) : ('truncatedText.readMore' | translate) }}
-    </a>
+    <p-button class="link-btn-no-padding" link [label]="buttonLabel() | translate" (onClick)="handleButtonClick()" />
   }
 </div>

src/app/shared/components/truncated-text/truncated-text.component.scss

@@ -17,7 +17,3 @@
     line-clamp: initial;
   }
 }
-
-.read-more-link {
-  cursor: pointer;
-}