dockstore/dockstore#2445 updated to google recommendation (#786)

dockstore/dockstore#2445 updated homepage JSON LD to match google recommendations

src/app/home-page/home-page.component.html

@@ -1,4 +1,6 @@
 <ng-container *ngIf="user$ | async; then loggedInHomePage; else loggedOutHomePage"></ng-container>
+<ngx-json-ld [json]="orgSchema"></ngx-json-ld>
+<ngx-json-ld [json]="websiteSchema"></ngx-json-ld>
 <ng-template #loggedInHomePage>
   <home-logged-in *ngIf="devMode"></home-logged-in>
   <old-app-home *ngIf="!devMode"></old-app-home>

src/app/home-page/home-page.component.spec.ts

@@ -2,6 +2,7 @@
 import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { HomePageComponent } from './home-page.component';
+import { RouterTestingModule } from '@angular/router/testing';
 
 describe('HomePageComponent', () => {
   let component: HomePageComponent;
@@ -10,7 +11,8 @@ describe('HomePageComponent', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       declarations: [HomePageComponent],
-      schemas: [NO_ERRORS_SCHEMA]
+      schemas: [NO_ERRORS_SCHEMA],
+      imports: [RouterTestingModule]
     }).compileComponents();
   }));
 

src/app/home-page/home-page.component.ts

@@ -3,6 +3,7 @@ import { devMode } from 'app/shared/constants';
 import { User } from 'app/shared/swagger';
 import { UserQuery } from 'app/shared/user/user.query';
 import { Observable } from 'rxjs';
+import { HomePageService } from './home-page.service';
 
 @Component({
   selector: 'app-home-page',
@@ -12,9 +13,13 @@ import { Observable } from 'rxjs';
 export class HomePageComponent implements OnInit {
   devMode = devMode;
   public user$: Observable<User>;
-  constructor(private userQuery: UserQuery) {}
+  public orgSchema;
+  public websiteSchema;
+  constructor(private userQuery: UserQuery, private homePageService: HomePageService) {}
 
   ngOnInit() {
     this.user$ = this.userQuery.user$;
+    this.orgSchema = this.homePageService.hpOrgSchema;
+    this.websiteSchema = this.homePageService.hpWebsiteSchema;
   }
 }

src/app/home-page/home-page.module.ts

@@ -1,5 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
+import { NgxJsonLdModule } from '@ngx-lite/json-ld';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { RouterModule } from '@angular/router';
 import { HomeLoggedInComponent } from 'app/home-page/home-logged-in/home-logged-in.component';
@@ -13,8 +14,18 @@ import { HomePageComponent } from './home-page.component';
 import { OldHomePageComponent, YoutubeComponent } from './old-home-page/old-home-page.component';
 
 @NgModule({
-  imports: [CommonModule, CustomMaterialModule, FlexLayoutModule, RouterModule, ListWorkflowsModule, ListContainersModule, TabsModule],
+  imports: [
+    CommonModule,
+    CustomMaterialModule,
+    FlexLayoutModule,
+    NgxJsonLdModule,
+    RouterModule,
+    ListWorkflowsModule,
+    ListContainersModule,
+    TabsModule
+  ],
   declarations: [HomePageComponent, LoggedInBannerComponent, HomeComponent, HomeLoggedInComponent, OldHomePageComponent, YoutubeComponent],
-  entryComponents: [YoutubeComponent]
+  entryComponents: [YoutubeComponent],
+  exports: [NgxJsonLdModule]
 })
 export class HomePageModule {}

src/app/home-page/home-page.service.ts

@@ -6,6 +6,31 @@ import { Router } from '@angular/router';
 })
 export class HomePageService {
   constructor(private router: Router) {}
+  hpOrgSchema = {
+    '@context': 'http://schema.org',
+    '@type': 'Organization',
+    description:
+      'Dockstore, developed by the Cancer Genome Collaboratory, is an open platform used by the GA4GH for sharing ' +
+      'Docker-based tools described with the Common Workflow Language (CWL), the Workflow Description Language (WDL), or Nextflow (NFL)',
+    logo: '../assets/images/dockstore/dockstore.png',
+    name: 'Dockstore',
+    sameAs: 'https://github.com/dockstore',
+    url: window.location.href
+  };
+
+  hpWebsiteSchema = {
+    '@context': 'http://schema.org',
+    '@type': 'WebSite',
+    audience: 'Bioinformaticians',
+    name: 'Dockstore',
+    potentialAction: {
+      '@type': 'SearchAction',
+      target: window.location.href + 'search?search={search_term_string}',
+      'query-input': 'required name=search_term_string'
+    },
+    url: window.location.href
+  };
+
   goToSearch(searchValue: string) {
     this.router.navigate(['/search'], { queryParams: { search: searchValue } });
   }

src/index.html

@@ -9,28 +9,6 @@
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
     <link rel="manifest" href="manifest.json" />
     <meta name="theme-color" content="#21335B" />
-    <script type="application/ld+json">
-      {
-        "@context": "http://schema.org",
-        "@type": "Organization",
-        "url": "https://dockstore.org",
-        "logo": "../assets/images/dockstore/dockstore.png",
-        "sameAs": ["https://twitter.com/DockstoreOrg"]
-      }
-    </script>
-    <script type="application/ld+json">
-      {
-        "@context": "http://schema.org",
-        "@type": "WebSite",
-        "url": "https://dockstore.org",
-        "sameAs": ["https://twitter.com/DockstoreOrg"],
-        "potentialAction": {
-          "@type": "SearchAction",
-          "target": "https://dockstore.org/search?search={search_term_string}",
-          "query-input": "required name=search_term_string"
-        }
-      }
-    </script>
   </head>
 
   <body>