feat: Upgraded fsxa-api, fsxa-ui, fsxa-pattern-library and fsxa-nuxt-…

…module (#12) Update dependencies and fix errors that occured after update
e-Spirit · Mar 15, 2021 · 8a5515a · 8a5515a
1 parent 0429e06
commit 8a5515a
Show file tree

Hide file tree

Showing 8 changed files with 4,498 additions and 5,467 deletions.
diff --git a/components/fsxa/AppLayout.tsx b/components/fsxa/AppLayout.tsx
@@ -49,7 +49,7 @@ class AppLayout extends FSXABaseAppLayout {
   }
 
   get logoUrl() {
-    return this.globalSettings?.data.gs_logo.resolutions.ORIGINAL.url
+    return this.globalSettings?.data.ps_logo.resolutions.ORIGINAL.url
   }
 
   getLangNavItem(isMobile: boolean): FirstLevelNavigationItem {
@@ -178,7 +178,7 @@ class AppLayout extends FSXABaseAppLayout {
             </a>
           </div>
         </PageHeader>
-        <div class="w-full h-64 bg-gray-100 flex items-center text-xs fixed bottom-0 left-0 px-4 md:px-16 lg:px-20 xl:px-24 ">
+        <div class="w-full h-64 bg-gray-100 flex items-center text-xs fixed bottom-0 left-0 px-4 md:px-16 lg:px-20 xl:px-24">
           <div class="w-1/3 flex items-center justify-start">
             <a
               href={this.navigationData?.pages.index}
@@ -196,30 +196,34 @@ class AppLayout extends FSXABaseAppLayout {
             </a>
           </div>
           <div class="w-1/3 flex items-center justify-center">
-            © {this.globalSettings?.data.gc_copyright}
+            © {this.globalSettings?.data.ps_footer.gc_copyright}
           </div>
           <div class="w-1/3 flex items-center justify-end gap-2">
-            {this.globalSettings?.data.gc_linklist.map((link: any) => (
-              <a
-                href={this.getUrlByPageId(link.data.lt_link.referenceId) || '#'}
-                class={`text-xs hover:underline ${
-                  this.currentPage?.id === link.data.lt_link.referenceId
-                    ? 'text-gray-600'
-                    : ''
-                }`}
-                onClick={(event: MouseEvent) => {
-                  event.preventDefault()
-                  this.triggerRouteChange({
-                    pageId: link.data.lt_link.referenceId
-                  })
-                }}
-              >
-                {link.data.lt_text}
-              </a>
-            ))}
+            {this.globalSettings?.data.ps_footer.gc_linklist.map(
+              (link: any) => (
+                <a
+                  href={
+                    this.getUrlByPageId(link.data.lt_link.referenceId) || '#'
+                  }
+                  class={`text-xs hover:underline ${
+                    this.currentPage?.id === link.data.lt_link.referenceId
+                      ? 'text-gray-600'
+                      : ''
+                  }`}
+                  onClick={(event: MouseEvent) => {
+                    event.preventDefault()
+                    this.triggerRouteChange({
+                      pageId: link.data.lt_link.referenceId
+                    })
+                  }}
+                >
+                  {link.data.lt_text}
+                </a>
+              )
+            )}
           </div>
         </div>
-        {this.$slots.default}
+        <div class="bg-white relative">{this.$slots.default}</div>
       </div>
     )
   }

diff --git a/components/fsxa/richtext/Block.tsx b/components/fsxa/richtext/Block.tsx
@@ -0,0 +1,28 @@
+import { FSXABaseRichTextElement } from 'fsxa-pattern-library'
+import { Component } from 'vue-property-decorator'
+
+@Component({
+  name: 'RichTextBlock'
+})
+class Block extends FSXABaseRichTextElement {
+  render() {
+    if (
+      this.content.length === 1 &&
+      typeof this.content[0].content === 'string'
+    ) {
+      return (
+        <span
+          class={
+            this.data['data-fs-style'] === 'format.span_yellow_text'
+              ? 'text-highlight'
+              : ''
+          }
+        >
+          {this.content[0].content}
+        </span>
+      )
+    }
+    return <div>{this.renderContent()}</div>
+  }
+}
+export default Block
diff --git a/components/fsxa/richtext/Paragraph.tsx b/components/fsxa/richtext/Paragraph.tsx
@@ -6,22 +6,6 @@ import { Component } from 'vue-property-decorator'
 })
 class Paragraph extends FSXABaseRichTextElement {
   render() {
-    if (
-      this.content.length === 1 &&
-      typeof this.content[0].content === 'string'
-    ) {
-      return (
-        <span
-          class={
-            this.data['data-fs-style'] === 'format.span_yellow_text'
-              ? 'text-highlight'
-              : ''
-          }
-        >
-          {this.content[0].content}
-        </span>
-      )
-    }
     return <p>{this.renderContent()}</p>
   }
 }

diff --git a/components/fsxa/sections/DealerMap.tsx b/components/fsxa/sections/DealerMap.tsx
@@ -54,14 +54,14 @@ class DealerMap extends FSXABaseSection {
       <div class="w-full screen-height-without-header bg-white">
         <Sections.GoogleMapsSection
           language={this.locale.split('_')[0]}
-          apikey={process.env.GOOGLE_MAPS_APIKEY as string}
+          apikey={process.env.FSXA_MAPS_APIKEY as string}
           startLocation={
             this.locations && this.locations.length > 0
               ? {
                   lat: parseFloat(this.locations[0].data.tt_lat),
                   lng: parseFloat(this.locations[0].data.tt_long)
                 }
-              : undefined
+              : { lat: 51.5142273, lng: 7.4652789 } // Dortmund
           }
           locations={
             this.locations

diff --git a/components/fsxa/sections/products/Product.tsx b/components/fsxa/sections/products/Product.tsx
@@ -1,6 +1,6 @@
 import { RichTextElement } from 'fsxa-api/dist/types'
 import { FSXABaseSection, FSXARichText } from 'fsxa-pattern-library'
-import { Sections, ImageRef } from 'fsxa-ui'
+import { Sections, Accordion } from 'fsxa-ui'
 import { Component } from 'vue-property-decorator'
 import { getFallbackTranslation } from '~/utils/i18n'
 
@@ -53,8 +53,13 @@ class Product extends FSXABaseSection<Payload> {
     }
   }
 
-  // TODO: add button with text
   render() {
+    const deliveryTitle =
+      this.globalSettings?.data.pt_label_product_delivery ||
+      getFallbackTranslation([this.locale, 'product_detail', 'tt_delivery'])
+    const installationTitle =
+      this.globalSettings?.data.pt_label_product_installation ||
+      getFallbackTranslation([this.locale, 'product_detail', 'tt_installation'])
     return (
       <Sections.ProductDetailSection
         headline={this.payload.tt_name}
@@ -84,19 +89,17 @@ class Product extends FSXABaseSection<Payload> {
             this.payload.tt_compatibility
           )
         ]}
-        foldableContentList={{
-          [this.globalSettings?.data.pt_label_product_delivery ||
-          getFallbackTranslation([
-            this.locale,
-            'product_detail',
-            'tt_delivery'
-          ])]: <FSXARichText content={this.payload.tt_delivery} />,
-          [this.globalSettings?.data.pt_label_product_installation ||
-          getFallbackTranslation([
-            this.locale,
-            'product_detail',
-            'tt_installation'
-          ])]: <FSXARichText content={this.payload.tt_installation} />
+        scopedSlots={{
+          additionalContent: () => (
+            <div class="ui-w-full ui-mx-2 ui-px-6">
+              <Accordion title={deliveryTitle} dark>
+                <FSXARichText content={this.payload.tt_delivery} />
+              </Accordion>
+              <Accordion title={installationTitle} dark>
+                <FSXARichText content={this.payload.tt_installation} />
+              </Accordion>
+            </div>
+          )
         }}
         description={this.payload.tt_abstract}
         price={this.payload.tt_price}

diff --git a/fsxa.config.ts b/fsxa.config.ts
@@ -8,6 +8,5 @@ export default {
     appLayout: '~/components/fsxa/AppLayout',
     loader: '~/components/fsxa/Loader'
   },
-  customRoutes: '~/customRoutes',
-  globalSettingsKey: 'global_settings'
+  customRoutes: '~/customRoutes'
 }