From 7ebe4fe7613716c51b33c75803b1d989e5b89a48 Mon Sep 17 00:00:00 2001
From: futa-ikeda <51409893+futa-ikeda@users.noreply.github.com>
Date: Thu, 10 Aug 2023 10:21:11 -0400
Subject: [PATCH] Preprints branding update (#1922)

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

## Purpose
- Remove possible failure point by not using preprintProvider.asset
- Add special casing to address nutrixiv's navbar color https://osf.io/preprints/nutrixiv/

## Summary of Changes
- Remove use of ThemeStyles from preprint (this set the navbar logo to use the preprintProvider.asset. square_color_transparent, when we want to just use the brand. topnavLogoImage going forward)
- Add special case for nutrixiv to use a white background similar to biohackrxiv
---
 app/preprints/template.hbs                          |  1 -
 .../addon/components/branded-navbar/component.ts    |  8 ++++++++
 .../addon/components/branded-navbar/styles.scss     |  6 +++---
 .../addon/components/branded-navbar/template.hbs    |  2 +-
 mirage/fixtures/preprint-providers.ts               |  6 ++++++
 mirage/scenarios/preprints.ts                       | 13 ++++++++++++-
 6 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/app/preprints/template.hbs b/app/preprints/template.hbs
index bcf4a6af55..21847e39d8 100644
--- a/app/preprints/template.hbs
+++ b/app/preprints/template.hbs
@@ -1,6 +1,5 @@
 {{page-title this.theme.provider.providerTitle replace=true}}
 <div {{with-branding (get-model this.theme.provider.brand)}}>
-    <ThemeStyles />
     <BrandedNavbar
         @translateKey='collections.general.brand'
         @brandRoute='preprints.discover'
diff --git a/lib/app-components/addon/components/branded-navbar/component.ts b/lib/app-components/addon/components/branded-navbar/component.ts
index bde81474d2..286b82d4d4 100644
--- a/lib/app-components/addon/components/branded-navbar/component.ts
+++ b/lib/app-components/addon/components/branded-navbar/component.ts
@@ -56,6 +56,14 @@ export default class BrandedNavbar extends Component {
     @alias('theme.provider.id') providerId!: string;
     @alias('theme.provider.brand.primaryColor') brandPrimaryColor!: BrandModel;
 
+    get useWhiteBackground(): boolean {
+        const { provider } = this.theme;
+        if (provider) {
+            return this.theme.providerType === 'preprint' && ['biohackrxiv', 'nutrixiv'].includes(provider.id);
+        }
+        return false;
+    }
+
     @computed('intl.locale', 'theme.{providerType,provider.providerTitle}', 'translateKey')
     get brandTitle(): string {
         if (this.theme.providerType === 'collection') {
diff --git a/lib/app-components/addon/components/branded-navbar/styles.scss b/lib/app-components/addon/components/branded-navbar/styles.scss
index b18993fe43..53ae324269 100644
--- a/lib/app-components/addon/components/branded-navbar/styles.scss
+++ b/lib/app-components/addon/components/branded-navbar/styles.scss
@@ -63,8 +63,8 @@
     background-position-y: center;
     background-size: contain;
     background-repeat: no-repeat;
-    // This is overwritten by theme-styles component,
-    // but if there is no provider.asset.square_color_transparent, we fallback to use the logo off the brand
+    // Preprints uses the brand's navbar logo
+    // Collections uses the theme-styles component and will overwrite this
     background-image: var(--navbar-logo-img-url);
 }
 
@@ -133,7 +133,7 @@
     }
 }
 
-.biohackrxiv-branded-navbar.biohackrxiv-branded-navbar.biohackrxiv-branded-navbar {
+.white-background-branded-navbar.white-background-branded-navbar.white-background-branded-navbar {
     background-color: #fff;
 
     a,
diff --git a/lib/app-components/addon/components/branded-navbar/template.hbs b/lib/app-components/addon/components/branded-navbar/template.hbs
index 7f7ee6c230..fcf8a480c0 100644
--- a/lib/app-components/addon/components/branded-navbar/template.hbs
+++ b/lib/app-components/addon/components/branded-navbar/template.hbs
@@ -3,7 +3,7 @@
         local-class='branded-nav
         {{if (eq this.theme.providerType 'preprint') 'preprint-branded-navbar'}}
         {{if (sufficient-contrast this.brandPrimaryColor '#fff') 'light-text' 'dark-text'}}
-        {{if (eq this.theme.id 'biohackrxiv') 'biohackrxiv-branded-navbar'}}'
+        {{if this.useWhiteBackground 'white-background-branded-navbar'}}'
         class='navbar navbar-inverse navbar-fixed-top'
         id='navbarScope'
     >
diff --git a/mirage/fixtures/preprint-providers.ts b/mirage/fixtures/preprint-providers.ts
index e8ad2f20a7..097df9fd02 100644
--- a/mirage/fixtures/preprint-providers.ts
+++ b/mirage/fixtures/preprint-providers.ts
@@ -63,6 +63,12 @@ const preprintProviders: Array<Partial<PreprintProvider>> = [
         preprintWord: 'preprint',
         assets: randomAssets(),
     },
+    {
+        id: 'nutrixiv',
+        name: 'NutriXiv',
+        preprintWord: 'preprint',
+        assets: randomAssets(),
+    },
 ];
 
 export default preprintProviders;
diff --git a/mirage/scenarios/preprints.ts b/mirage/scenarios/preprints.ts
index 6af711fe2e..12bbf7f0d1 100644
--- a/mirage/scenarios/preprints.ts
+++ b/mirage/scenarios/preprints.ts
@@ -37,10 +37,21 @@ export function preprintsScenario(
         description: '<p style="color: black">This is the description for agrixiv!</p>',
     });
 
+    const nutrixiv = server.schema.preprintProviders.find('nutrixiv') as ModelInstance<PreprintProvider>;
+    const nutrixivBrand = server.create('brand', {
+        primaryColor: '#000000',
+        secondaryColor: '#888888',
+        heroBackgroundImage: 'https://singlecolorimage.com/get/4a4a4a/1000x1000',
+    });
+    nutrixiv.update({
+        brand: nutrixivBrand,
+        description: '<p style="color: green">This is the description for nutrixiv!</p>',
+    });
+
     const biohackrxiv = server.schema.preprintProviders.find('biohackrxiv') as ModelInstance<PreprintProvider>;
     const biohackrxivBrand = server.create('brand', {
         primaryColor: '#000000',
-        secondaryColor: '#888888',
+        secondaryColor: '#ccc',
         heroBackgroundImage: 'https://singlecolorimage.com/get/ffffff/1000x1000',
     });
     biohackrxiv.update({