From 9e04bec80d7fec816d6123577da4f3273defc866 Mon Sep 17 00:00:00 2001
From: JenDiamond <thejendiamond@gmail.com>
Date: Fri, 4 Aug 2023 11:23:34 -0700
Subject: [PATCH] fix: APPS-2380_fix-button-banner-header (#716)

* fix buttonUrl

* finalize working button

* update component library
---
 .../ServiceOrResourceOrWorkshopDetail.gql       |  3 +--
 package-lock.json                               | 14 +++++++-------
 package.json                                    |  2 +-
 pages/help/services-resources/_slug.vue         | 17 ++++++++++-------
 4 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/gql/queries/ServiceOrResourceOrWorkshopDetail.gql b/gql/queries/ServiceOrResourceOrWorkshopDetail.gql
index 8146e709e..05fb59020 100644
--- a/gql/queries/ServiceOrResourceOrWorkshopDetail.gql
+++ b/gql/queries/ServiceOrResourceOrWorkshopDetail.gql
@@ -8,9 +8,8 @@ query ServiceOrResourceOrWorkshopDetail($slug: [String!]) {
             sectionHandle
             slug
             uri
-            button: buttonUrl {
+            buttonUrl {
                 ... on buttonUrl_button_BlockType {
-                    id
                     buttonText
                     buttonUrl
                 }
diff --git a/package-lock.json b/package-lock.json
index a864d83d0..15e48e661 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,7 +33,7 @@
                 "sass": "^1.45.2",
                 "sass-loader": "^10.1.1",
                 "ucla-library-design-tokens": "^5.4.1",
-                "ucla-library-website-components": "^2.38.0",
+                "ucla-library-website-components": "^2.38.1",
                 "vue-svg-loader": "^0.16.0",
                 "vue-template-compiler": "^2.6.12"
             },
@@ -13901,9 +13901,9 @@
             "license": "MIT"
         },
         "node_modules/ucla-library-website-components": {
-            "version": "2.38.0",
-            "resolved": "https://registry.npmjs.org/ucla-library-website-components/-/ucla-library-website-components-2.38.0.tgz",
-            "integrity": "sha512-wMk7cmVmZCcTHz08uutVgB3BoUpsR7RHOTrLH1Pw2DuDwjI/QzjcKaKetlZG8aTUGlfUzyK+olhYLnYJNvWXfg==",
+            "version": "2.38.1",
+            "resolved": "https://registry.npmjs.org/ucla-library-website-components/-/ucla-library-website-components-2.38.1.tgz",
+            "integrity": "sha512-6FoCbU2O9Y6DW40CjNKbDROEN8SZzYHQS05mmbk9axzTwLLmQ3RZIiogCCiuolWqUElu054diIGbdXGiJn0Lvg==",
             "dev": true,
             "dependencies": {
                 "date-fns": "^2.28.0",
@@ -24907,9 +24907,9 @@
             "dev": true
         },
         "ucla-library-website-components": {
-            "version": "2.38.0",
-            "resolved": "https://registry.npmjs.org/ucla-library-website-components/-/ucla-library-website-components-2.38.0.tgz",
-            "integrity": "sha512-wMk7cmVmZCcTHz08uutVgB3BoUpsR7RHOTrLH1Pw2DuDwjI/QzjcKaKetlZG8aTUGlfUzyK+olhYLnYJNvWXfg==",
+            "version": "2.38.1",
+            "resolved": "https://registry.npmjs.org/ucla-library-website-components/-/ucla-library-website-components-2.38.1.tgz",
+            "integrity": "sha512-6FoCbU2O9Y6DW40CjNKbDROEN8SZzYHQS05mmbk9axzTwLLmQ3RZIiogCCiuolWqUElu054diIGbdXGiJn0Lvg==",
             "dev": true,
             "requires": {
                 "date-fns": "^2.28.0",
diff --git a/package.json b/package.json
index 6da259a6c..3bce5a487 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,7 @@
         "sass": "^1.45.2",
         "sass-loader": "^10.1.1",
         "ucla-library-design-tokens": "^5.4.1",
-        "ucla-library-website-components": "^2.38.0",
+        "ucla-library-website-components": "^2.38.1",
         "vue-svg-loader": "^0.16.0",
         "vue-template-compiler": "^2.6.12"
     }
diff --git a/pages/help/services-resources/_slug.vue b/pages/help/services-resources/_slug.vue
index f9f36c75b..e58814ace 100644
--- a/pages/help/services-resources/_slug.vue
+++ b/pages/help/services-resources/_slug.vue
@@ -1,4 +1,4 @@
-<template lang="html">
+<template>
     <main id="main" class="page page-service-detail">
         <!-- ServiceOrResource Detail -->
         <div v-if="page.serviceOrResource">
@@ -37,13 +37,13 @@
                     :category="page.serviceOrResource.type"
                     :title="page.serviceOrResource.title"
                     :text="page.serviceOrResource.text"
-                    :to="parsedButtonTo"
                     :prompt="parsedButtonText"
+                    :to="parsedButtonTo"
                 />
+            </section-wrapper>
 
-                <section-wrapper theme="divider">
-                    <divider-way-finder color="help" />
-                </section-wrapper>
+            <section-wrapper theme="divider">
+                <divider-way-finder />
             </section-wrapper>
 
             <page-anchor
@@ -93,6 +93,7 @@
                 :title="page.workshopSeries.title"
                 parent-title="Services & Resources"
             />
+
             <banner-text
                 v-if="
                     page.workshopSeries &&
@@ -138,6 +139,7 @@
                 class="content"
                 :blocks="page.workshopSeries.blocks"
             />
+
             <section-wrapper
                 v-if="page.workshopSeries.blocks.length > 0"
                 theme="divider"
@@ -214,6 +216,7 @@ import _get from "lodash/get"
 import removeTags from "~/utils/removeTags"
 // GQL
 import SERVICE_OR_RESOURCE_OR_WORKSHOPSERIES_DETAIL from "~/gql/queries/ServiceOrResourceOrWorkshopDetail"
+
 export default {
     async asyncData({ $graphql, params, $elasticsearchplugin, error }) {
         // Do not remove testing live preview
@@ -321,10 +324,10 @@ export default {
             })
         },
         parsedButtonText() {
-            return _get(this.page.serviceOrResource, "button[0].buttonText", "")
+            return _get(this.page.serviceOrResource, "buttonUrl[0].buttonText", "")
         },
         parsedButtonTo() {
-            return _get(this.page.serviceOrResource, "button[0].buttonUrl", "")
+            return _get(this.page.serviceOrResource, "buttonUrl[0].buttonUrl", "")
         },
         associatedEvents() {
             return this.page.workshopSeries.event.map((obj) => {