Merge pull request #2333 from NCCE/2989-strapi-component---testimonial-with-text

Creating new text with testimonial component

Author: msquance-stem

app/components/cms/testimonial_component/testimonial_component.scss

@@ -54,3 +54,11 @@
     }
   }
 }
+
+.purple-bg {
+  .cms-testimonial__bio-content {
+    .job-title {
+      color: $white;
+    }
+  }
+}

app/components/cms/text_with_testimonial_component.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+class Cms::TextWithTestimonialComponent < ViewComponent::Base
+  def initialize(text_content:, buttons:, testimonial_side:, testimonial:, background_color:)
+    @text_content = text_content
+    @buttons = buttons
+    @testimonial_side = testimonial_side
+    @testimonial = testimonial
+    @background_color = background_color
+  end
+
+  def row_classes
+    classes = ["tc-row"]
+    classes << "testimonial-#{@testimonial_side}"
+    classes
+  end
+end

app/components/cms/text_with_testimonial_component/text_with_testimonial_component.html.erb

@@ -0,0 +1,18 @@
+<%= render GovGridRowComponent.new(background_color: @background_color, additional_classes: "cms-text-with-testimonial") do |row|  %>
+  <%= row.with_column("full") do %>
+    <%= content_tag :div, class: row_classes do %>
+      <div class="tc-row-half">
+        <%= render @text_content.render %>
+        <div class="cms-button-container">
+          <% @buttons.each do |button| %>
+            <%= render button.render %>
+          <% end %>
+        </div>
+      </div>
+      <div class="tc-row-half">
+        <%= render @testimonial.render %>
+      </div>
+    <% end %>
+  <% end %>
+<% end %>
+

app/components/cms/text_with_testimonial_component/text_with_testimonial_component.scss

@@ -0,0 +1,24 @@
+.cms-text-with-testimonial {
+  .cms-button-container {
+    width: 80%;
+    @include govuk-media-query($until: tablet) {
+      width: 100%;
+    }
+  }
+
+  .tc-row {
+    &.testimonial-left {
+      flex-direction: row-reverse;
+      @include govuk-media-query($until: tablet) {
+        flex-direction: column-reverse;
+      }
+    }
+
+    &.testimonial-right {
+      flex-direction: row;
+      @include govuk-media-query($until: tablet) {
+        flex-direction: column;
+      }
+    }
+  }
+}

app/services/cms/dynamic_components/blocks/text_with_testimonial.rb

@@ -0,0 +1,21 @@
+module Cms
+  module DynamicComponents
+    module Blocks
+      class TextWithTestimonial
+        attr_accessor :text_content, :buttons, :testimonial_side, :testimonial, :background_color
+
+        def initialize(text_content:, buttons:, testimonial_side:, testimonial:, background_color:)
+          @text_content = text_content
+          @buttons = buttons
+          @testimonial_side = testimonial_side
+          @testimonial = testimonial
+          @background_color = background_color
+        end
+
+        def render
+          Cms::TextWithTestimonialComponent.new(text_content:, buttons:, testimonial_side:, testimonial:, background_color:)
+        end
+      end
+    end
+  end
+end

app/services/cms/providers/strapi/factories/blocks_factory.rb

@@ -43,11 +43,23 @@ def self.generate_component(component_name, strapi_data)
               to_icon_row(strapi_data)
             when "two-column-video-section"
               to_two_column_video_section(strapi_data)
+            when "text-with-testimonial"
+              to_text_with_testimonial(strapi_data)
             when "primary-glossary-table"
               DynamicComponents::PrimaryGlossaryTable.new(title: strapi_data[:title])
             end
           end
 
+          def self.to_text_with_testimonial(strapi_data)
+            DynamicComponents::Blocks::TextWithTestimonial.new(
+              text_content: to_content_block(strapi_data[:textContent]),
+              background_color: extract_color_name(strapi_data, :bkColor),
+              testimonial: to_testimonial(strapi_data[:testimonial]),
+              testimonial_side: strapi_data[:testimonialSide],
+              buttons: strapi_data[:buttons] ? strapi_data[:buttons].map { to_ncce_button(_1) } : []
+            )
+          end
+
           def self.to_icon_row(strapi_data)
             DynamicComponents::IconRow.new(
               icons: strapi_data[:icons].map { to_icon(_1) }

app/services/cms/providers/strapi/mocks/dynamic_components/blocks/text_with_testimonial.rb

@@ -0,0 +1,21 @@
+module Cms
+  module Providers
+    module Strapi
+      module Mocks
+        module DynamicComponents
+          module Blocks
+            class TextWithTestimonial < StrapiMock
+              strapi_component "blocks.text-with-testimonial"
+
+              attribute(:textContent) { RichBlocks.generate_data }
+              attribute(:buttons) { [] }
+              attribute(:testimonial) { Testimonial.generate_data }
+              attribute(:testimonialSide) { "left" }
+              attribute(:bkColor) { nil }
+            end
+          end
+        end
+      end
+    end
+  end
+end

app/services/cms/providers/strapi/mocks/icon_row.rb

@@ -0,0 +1,13 @@
+module Cms
+  module Providers
+    module Strapi
+      module Mocks
+        class IconRow < StrapiMock
+          strapi_component "blocks.icon-row"
+
+          attribute(:icons) { Array.new(2) { Icon.generate_data } }
+        end
+      end
+    end
+  end
+end

app/services/cms/providers/strapi/queries/components/blocks/text_with_testimonial.rb

@@ -0,0 +1,25 @@
+module Cms
+  module Providers
+    module Strapi
+      module Queries
+        module Components
+          module Blocks
+            class TextWithTestimonial < BaseComponentQuery
+              def self.name = "ComponentBlocksTextWithTestimonial"
+
+              def self.base_fields
+                <<~GRAPHQL.freeze
+                  textContent
+                  testimonialSide
+                  #{Buttons::NcceButton.embed(:buttons)}
+                  #{ContentBlocks::Testimonial.embed(:testimonial)}
+                  #{SharedFields.color_theme(:bkColor)}
+                GRAPHQL
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

app/services/cms/providers/strapi/queries/dynamic_zone.rb

@@ -22,6 +22,7 @@ class DynamicZone
             Components::Blocks::StickyDashboardBar,
             Components::Blocks::TestimonialRow,
             Components::Blocks::TextWithAsides,
+            Components::Blocks::TextWithTestimonial,
             Components::Blocks::TwoColumnVideoSection
           ]