[ENG-8545] Google attempting to index preprint fails with "soft 404" or 5xx responses (#739)

- Ticket: [ENG-8545]
- Feature flag: n/a

## Summary of Changes

1. Added prerender ready service.

Author: nsemets

src/@types/global.d.ts

@@ -47,5 +47,11 @@ declare global {
        */
       loggedIn: boolean;
     };
+
+    /**
+     * Flag used by prerender services to determine when a page is fully loaded.
+     * Set to false initially, then set to true once all AJAX requests and content are loaded.
+     */
+    prerenderReady?: boolean;
   }
 }

src/app/core/services/prerender-ready.service.ts

@@ -0,0 +1,22 @@
+import { inject, Injectable } from '@angular/core';
+
+import { WINDOW } from '../provider/window.provider';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class PrerenderReadyService {
+  private readonly window = inject(WINDOW);
+
+  setNotReady(): void {
+    if (this.window && 'prerenderReady' in this.window) {
+      this.window.prerenderReady = false;
+    }
+  }
+
+  setReady(): void {
+    if (this.window && 'prerenderReady' in this.window) {
+      this.window.prerenderReady = true;
+    }
+  }
+}

src/app/features/preprints/mappers/preprints.mapper.ts

@@ -80,6 +80,7 @@ export class PreprintsMapper {
       preprintDoiLink: response.links.preprint_doi,
       articleDoiLink: response.links.doi,
       embeddedLicense: null,
+      providerId: response.relationships?.provider?.data?.id,
     };
   }
 
@@ -92,6 +93,7 @@ export class PreprintsMapper {
   ): PreprintModel {
     const data = response.data;
     const links = response.data.links;
+    const relationships = response?.data?.relationships;
 
     return {
       id: data.id,
@@ -137,6 +139,7 @@ export class PreprintsMapper {
       identifiers: IdentifiersMapper.fromJsonApi(data.embeds?.identifiers),
       preprintDoiLink: links.preprint_doi,
       articleDoiLink: links.doi,
+      providerId: relationships?.provider?.data?.id,
     };
   }
 

src/app/features/preprints/models/preprint.models.ts

@@ -46,6 +46,7 @@ export interface PreprintModel {
   preprintDoiLink?: string;
   articleDoiLink?: string;
   identifiers?: IdentifierModel[];
+  providerId: string;
 }
 
 export interface PreprintFilesLinks {

src/app/features/preprints/pages/preprint-details/preprint-details.component.spec.ts

@@ -122,11 +122,11 @@ describe('PreprintDetailsComponent', () => {
               value: false,
             },
             {
-              selector: ContributorsSelectors.getContributors,
+              selector: ContributorsSelectors.getBibliographicContributors,
               value: mockContributors,
             },
             {
-              selector: ContributorsSelectors.isContributorsLoading,
+              selector: ContributorsSelectors.isBibliographicContributorsLoading,
               value: false,
             },
             {

src/app/features/preprints/pages/preprint-details/preprint-details.component.ts

@@ -25,6 +25,7 @@ import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
 import { HelpScoutService } from '@core/services/help-scout.service';
+import { PrerenderReadyService } from '@core/services/prerender-ready.service';
 import { ClearCurrentProvider } from '@core/store/provider';
 import { UserSelectors } from '@core/store/user';
 import { ResetState } from '@osf/features/files/store';
@@ -101,6 +102,7 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
   private readonly datePipe = inject(DatePipe);
   private readonly dataciteService = inject(DataciteService);
   private readonly analyticsService = inject(AnalyticsService);
+  private readonly prerenderReady = inject(PrerenderReadyService);
 
   private readonly environment = inject(ENVIRONMENT);
 
@@ -124,8 +126,8 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
   preprint = select(PreprintSelectors.getPreprint);
   preprint$ = toObservable(select(PreprintSelectors.getPreprint));
   isPreprintLoading = select(PreprintSelectors.isPreprintLoading);
-  contributors = select(ContributorsSelectors.getContributors);
-  areContributorsLoading = select(ContributorsSelectors.isContributorsLoading);
+  contributors = select(ContributorsSelectors.getBibliographicContributors);
+  areContributorsLoading = select(ContributorsSelectors.isBibliographicContributorsLoading);
   reviewActions = select(PreprintSelectors.getPreprintReviewActions);
   areReviewActionsLoading = select(PreprintSelectors.arePreprintReviewActionsLoading);
   withdrawalRequests = select(PreprintSelectors.getPreprintRequests);
@@ -138,6 +140,7 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
   areMetricsLoading = select(PreprintSelectors.arePreprintMetricsLoading);
 
   isPresentModeratorQueryParam = toSignal(this.route.queryParams.pipe(map((params) => params['mode'] === 'moderator')));
+  defaultProvider = this.environment.defaultProvider;
 
   moderationMode = computed(() => {
     const provider = this.preprintProvider();
@@ -170,6 +173,7 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
 
   constructor() {
     this.helpScoutService.setResourceType('preprint');
+    this.prerenderReady.setNotReady();
 
     effect(() => {
       const currentPreprint = this.preprint();
@@ -178,6 +182,16 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
         this.analyticsService.sendCountedUsage(currentPreprint.id, 'preprint.detail').subscribe();
       }
     });
+
+    effect(() => {
+      const preprint = this.preprint();
+      const contributors = this.contributors();
+      const isLoading = this.isPreprintLoading() || this.areContributorsLoading();
+
+      if (!isLoading && preprint && contributors.length) {
+        this.setMetaTags();
+      }
+    });
   }
 
   private preprintWithdrawableState = computed(() => {
@@ -257,7 +271,7 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
     );
   });
 
-  isOsfPreprint = computed(() => this.providerId() === 'osf');
+  isOsfPreprint = computed(() => this.providerId() === this.defaultProvider);
 
   moderationStatusBannerVisible = computed(() => {
     return (
@@ -351,6 +365,8 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
   }
 
   fetchPreprint(preprintId: string) {
+    this.prerenderReady.setNotReady();
+
     this.actions.fetchPreprintById(preprintId).subscribe({
       next: () => {
         this.checkAndSetVersionToTheUrl();
@@ -370,8 +386,6 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
             });
           }
         }
-
-        this.setMetaTags();
       },
     });
   }

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

@@ -23,6 +23,7 @@ import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
 import { FormsModule } from '@angular/forms';
 import { ActivatedRoute, NavigationEnd, Router, RouterLink } from '@angular/router';
 
+import { PrerenderReadyService } from '@core/services/prerender-ready.service';
 import { SubmissionReviewStatus } from '@osf/features/moderation/enums';
 import {
   ClearCollectionModeration,
@@ -123,6 +124,7 @@ export class ProjectOverviewComponent implements OnInit {
   private readonly dataciteService = inject(DataciteService);
   private readonly metaTags = inject(MetaTagsService);
   private readonly datePipe = inject(DatePipe);
+  private readonly prerenderReady = inject(PrerenderReadyService);
 
   submissions = select(CollectionsModerationSelectors.getCollectionSubmissions);
   collectionProvider = select(CollectionsSelectors.getCollectionProvider);
@@ -271,6 +273,8 @@ export class ProjectOverviewComponent implements OnInit {
   readonly analyticsService = inject(AnalyticsService);
 
   constructor() {
+    this.prerenderReady.setNotReady();
+
     this.setupCollectionsEffects();
     this.setupCleanup();
     this.setupProjectEffects();

src/app/features/registry/registry.component.ts

@@ -8,6 +8,7 @@ import { takeUntilDestroyed, toObservable, toSignal } from '@angular/core/rxjs-i
 import { ActivatedRoute, RouterOutlet } from '@angular/router';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
+import { PrerenderReadyService } from '@core/services/prerender-ready.service';
 import { ClearCurrentProvider } from '@core/store/provider';
 import { pathJoin } from '@osf/shared/helpers/path-join.helper';
 import { AnalyticsService } from '@osf/shared/services/analytics.service';
@@ -33,6 +34,7 @@ export class RegistryComponent implements OnDestroy {
   private readonly destroyRef = inject(DestroyRef);
   private readonly route = inject(ActivatedRoute);
   private readonly environment = inject(ENVIRONMENT);
+  private readonly prerenderReady = inject(PrerenderReadyService);
 
   private readonly actions = createDispatchMap({
     getRegistryById: GetRegistryById,
@@ -47,6 +49,8 @@ export class RegistryComponent implements OnDestroy {
   readonly analyticsService = inject(AnalyticsService);
 
   constructor() {
+    this.prerenderReady.setNotReady();
+
     effect(() => {
       if (this.registryId()) {
         this.actions.getRegistryById(this.registryId());

src/app/shared/services/meta-tags.service.ts

@@ -1,10 +1,11 @@
 import { catchError, map, Observable, of, switchMap, tap } from 'rxjs';
 
 import { DOCUMENT } from '@angular/common';
-import { DestroyRef, Inject, inject, Injectable } from '@angular/core';
+import { DestroyRef, effect, Inject, inject, Injectable, signal } from '@angular/core';
 import { Meta, MetaDefinition, Title } from '@angular/platform-browser';
 
 import { ENVIRONMENT } from '@core/provider/environment.provider';
+import { PrerenderReadyService } from '@core/services/prerender-ready.service';
 
 import { MetadataRecordFormat } from '../enums/metadata-record-format.enum';
 import { HeadTagDef } from '../models/meta-tags/head-tag-def.model';
@@ -19,6 +20,7 @@ import { MetadataRecordsService } from './metadata-records.service';
 export class MetaTagsService {
   private readonly metadataRecords: MetadataRecordsService = inject(MetadataRecordsService);
   private readonly environment = inject(ENVIRONMENT);
+  private readonly prerenderReady = inject(PrerenderReadyService);
 
   get webUrl() {
     return this.environment.webUrl;
@@ -52,11 +54,19 @@ export class MetaTagsService {
 
   private metaTagStack: { metaTagsData: MetaTagsData; componentDestroyRef: DestroyRef }[] = [];
 
+  areMetaTagsApplied = signal(false);
+
   constructor(
     private meta: Meta,
     private title: Title,
     @Inject(DOCUMENT) private document: Document
-  ) {}
+  ) {
+    effect(() => {
+      if (this.areMetaTagsApplied()) {
+        this.prerenderReady.setReady();
+      }
+    });
+  }
 
   updateMetaTags(metaTagsData: MetaTagsData, componentDestroyRef: DestroyRef): void {
     this.metaTagStack = [...this.metaTagStackWithout(componentDestroyRef), { metaTagsData, componentDestroyRef }];
@@ -71,6 +81,8 @@ export class MetaTagsService {
     const elementsToRemove = this.document.querySelectorAll(`.${this.metaTagClass}`);
 
     if (elementsToRemove.length === 0) {
+      this.areMetaTagsApplied.set(false);
+      this.prerenderReady.setNotReady();
       return;
     }
 
@@ -81,6 +93,8 @@ export class MetaTagsService {
     });
 
     this.title.setTitle(String(this.defaultMetaTags.siteName));
+    this.areMetaTagsApplied.set(false);
+    this.prerenderReady.setNotReady();
   }
 
   private metaTagStackWithout(destroyRefToRemove: DestroyRef) {
@@ -97,6 +111,8 @@ export class MetaTagsService {
   }
 
   private applyMetaTagsData(metaTagsData: MetaTagsData) {
+    this.areMetaTagsApplied.set(false);
+    this.prerenderReady.setNotReady();
     const combinedData = { ...this.defaultMetaTags, ...metaTagsData };
     const headTags = this.getHeadTags(combinedData);
     of(metaTagsData.osfGuid)
@@ -113,8 +129,11 @@ export class MetaTagsService {
               )
             : of(null)
         ),
-        tap(() => this.applyHeadTags(headTags)),
-        tap(() => this.dispatchZoteroEvent())
+        tap(() => {
+          this.applyHeadTags(headTags);
+          this.areMetaTagsApplied.set(true);
+          this.dispatchZoteroEvent();
+        })
       )
       .subscribe();
   }

src/index.html

@@ -11,6 +11,9 @@
     <script src="assets/js/newrelic/newrelic.snippet.js"></script>
   </head>
   <body>
+    <script>
+      window.prerenderReady = false;
+    </script>
     <osf-root></osf-root>
   </body>
 </html>