diff --git a/app/controllers/support/component_previews_controller.rb b/app/controllers/support/component_previews_controller.rb
deleted file mode 100644
index 0382e9e713..0000000000
--- a/app/controllers/support/component_previews_controller.rb
+++ /dev/null
@@ -1,8 +0,0 @@
-# frozen_string_literal: true
-
-module Support
- class ComponentPreviewsController < ViewComponentsController
- include Authentication
- helper_method :current_user
- end
-end
diff --git a/app/controllers/support/view_components_controller.rb b/app/controllers/support/view_components_controller.rb
new file mode 100644
index 0000000000..3c72a3fd7f
--- /dev/null
+++ b/app/controllers/support/view_components_controller.rb
@@ -0,0 +1,58 @@
+# frozen_string_literal: true
+
+module Support
+ class ViewComponentsController < ApplicationController
+ include ViewComponent::PreviewActions
+
+ helper_method :shared_component_previews, :find_component_previews, :publish_component_previews
+
+ def index
+ @previews = case params[:namespace]
+ when 'find'
+ find_component_previews
+ when 'publish'
+ publish_component_previews
+ else
+ shared_component_previews
+ end
+
+ @previews.sort_by!(&:name)
+
+ render :index
+ end
+
+ def previews
+ find_preview
+
+ if params[:path] == @preview.preview_name
+ @page_title = "Component Previews for #{@preview.preview_name}"
+ render :previews, **determine_layout
+ else
+ prepend_application_view_paths
+ prepend_preview_examples_view_path
+ @example_name = File.basename(params[:path])
+ @render_args = @preview.render_args(@example_name, params: params.permit!)
+ layout = determine_layout(@render_args[:layout], prepend_views: false)[:layout]
+ locals = @render_args[:locals]
+ opts = {}
+ opts[:layout] = layout if layout.present? || layout == false
+ opts[:locals] = locals if locals.present?
+ render :preview, opts
+ end
+ end
+
+ private
+
+ def shared_component_previews
+ @shared_component_previews ||= ViewComponent::Preview.all.reject { |preview| preview.name.deconstantize.split('::')[0].in?(%w[Find Publish]) }
+ end
+
+ def find_component_previews
+ @find_component_previews ||= ViewComponent::Preview.all.filter { |preview| preview.name.deconstantize.split('::')[0] == 'Find' }
+ end
+
+ def publish_component_previews
+ @publish_component_previews ||= ViewComponent::Preview.all.filter { |preview| preview.name.deconstantize.split('::')[0] == 'Publish' }
+ end
+ end
+end
diff --git a/app/views/layouts/component_preview.html.erb b/app/views/layouts/component_preview.html.erb
deleted file mode 100644
index d89db313a6..0000000000
--- a/app/views/layouts/component_preview.html.erb
+++ /dev/null
@@ -1,43 +0,0 @@
-
-
-
- Component Preview
- Component Preview - Find and Publish Components - GOV.UK
-
-
-
- <%= csrf_meta_tags %>
- <%= csp_meta_tag %>
-
- <%= favicon_link_tag image_path("favicon.ico"), type: nil, sizes: "48x48" %>
- <%= favicon_link_tag image_path("favicon.svg"), type: "image/svg+xml", sizes: "any" %>
- <%= favicon_link_tag image_path("govuk-icon-mask.svg"), rel: "mask-icon", color: "#0b0c0c", type: nil %>
- <%= favicon_link_tag image_path("govuk-icon-180.png"), rel: "apple-touch-icon", type: nil %>
-
- <%= stylesheet_link_tag "accessible-autocomplete.min" %>
- <%= stylesheet_link_tag "find_application" %>
- <%= stylesheet_link_tag "publish_application" %>
- <%= javascript_include_tag "find/application", "data-turbo-track": "reload", defer: true %>
- <%= javascript_include_tag "publish/application", "data-turbo-track": "reload", defer: true %>
-
-
-
- <%= render "layouts/add_js_enabled_class_to_body" %>
-
- <%= render Find::Header::View.new(
- service_name: "Find and Publish Components"
- ) %>
-
-
-
- <% content_for :before_content do %>
- <%= govuk_back_link_to(publish_support_view_component_previews_path) unless content_for?(:before_content) %>
- <% end %>
-
- <%= content_for :before_content %>
-
- <%= yield %>
-
-
-
-
diff --git a/app/views/support/view_components/index.html.erb b/app/views/support/view_components/index.html.erb
new file mode 100644
index 0000000000..cbffc52c87
--- /dev/null
+++ b/app/views/support/view_components/index.html.erb
@@ -0,0 +1,23 @@
+
+
Find and Publish Components
+
+
+ Below are view components used in Find and Publish.
+ These act as larger building blocks used to build pages specific to the Find and Publish services leveraging the <%= govuk_link_to("GOV.UK Design System", "https://design-system.service.gov.uk/") %> and the <%= govuk_link_to("GOV.UK components gem", "https://github.com/DFE-Digital/govuk-components") %>
+
+
+ <%= render SecondaryNavigationComponent.new do |secondary_navigation| %>
+ <% secondary_navigation.with_navigation_item "Shared components", support_view_components_path, current: params[:namespace].nil? %>
+ <% secondary_navigation.with_navigation_item "Find components", support_view_components_path(namespace: "find") %>
+ <% secondary_navigation.with_navigation_item "Publish components", support_view_components_path(namespace: "publish") %>
+ <% end %>
+
+ <% @previews.each do |preview| %>
+
<%= link_to preview.preview_name.titleize, preview_view_component_path(preview.preview_name) %>
+
+ <% preview.examples.each do |preview_example| %>
+ - <%= govuk_link_to preview_example, preview_view_component_path("#{preview.preview_name}/#{preview_example}") %>
+ <% end %>
+
+ <% end %>
+
+
<%= @preview.preview_name.classify %>
+
+ <% if @render_args[:component] %>
+ <% if ViewComponent::Base.config.render_monkey_patch_enabled || Rails.version.to_f >= 6.1 %>
+ <%= render(@render_args[:component], @render_args[:args], &@render_args[:block]) %>
+ <% else %>
+ <%= render_component(@render_args[:component], &@render_args[:block]) %>
+ <% end %>
+ <% else %>
+ <%= render template: @render_args[:template], locals: @render_args[:locals] || {} %>
+ <% end %>
+
+ <% if ViewComponent::Base.config.show_previews_source %>
+ <%= preview_source %>
+ <% end %>
+
diff --git a/app/views/support/view_components/previews.html.erb b/app/views/support/view_components/previews.html.erb
new file mode 100644
index 0000000000..a525faca5d
--- /dev/null
+++ b/app/views/support/view_components/previews.html.erb
@@ -0,0 +1,11 @@
+<% content_for :page_title, params[:path] %>
+<% content_for :before_content do %>
+ <%= govuk_back_link_to(support_view_components_path) %>
+<% end %>
+
+<%= @preview.preview_name.titleize %>
+
+ <% @preview.examples.each do |example| %>
+ - <%= link_to example, preview_view_component_path("#{@preview.preview_name}/#{example}") %>
+ <% end %>
+
diff --git a/app/views/view_components/index.html.erb b/app/views/view_components/index.html.erb
deleted file mode 100644
index 10b59deda9..0000000000
--- a/app/views/view_components/index.html.erb
+++ /dev/null
@@ -1,18 +0,0 @@
-Find and Publish Components
-
-
- Below are view components used in Find and Publish.
- These act as larger building blocks used to build pages specific to the Find and Publish services leveraging the <%= govuk_link_to("GOV.UK Design System", "https://design-system.service.gov.uk/") %> and the <%= govuk_link_to("GOV.UK components gem", "https://github.com/DFE-Digital/govuk-components") %>
-
-
-<% content_for :before_content do %>
- <%= govuk_back_link_to(support_recruitment_cycles_path) %>
-<% end %>
-<% @previews.each do |preview| %>
- <%= link_to preview.preview_name.titleize, preview_view_component_path(preview.preview_name) %>
-
- <% preview.examples.each do |preview_example| %>
- - <%= govuk_link_to preview_example, preview_view_component_path("#{preview.preview_name}/#{preview_example}") %>
- <% end %>
-
-<% end %>
diff --git a/app/views/view_components/previews.html.erb b/app/views/view_components/previews.html.erb
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/config/application.rb b/config/application.rb
index 7457108324..6998b715f0 100644
--- a/config/application.rb
+++ b/config/application.rb
@@ -61,9 +61,7 @@ class Application < Rails::Application
config.view_component.preview_paths = [Rails.root.join('spec/components')]
config.view_component.preview_route = '/support/view_components'
- config.view_component.default_preview_layout = 'component_preview'
- config.view_component.preview_controller = 'Support::ComponentPreviewsController'
- config.view_component.show_previews = !Rails.env.production?
+ config.view_component.preview_controller = 'Support::ViewComponentsController'
config.analytics = config_for(:analytics)
diff --git a/config/locales/en/support/view_components.yml b/config/locales/en/support/view_components.yml
new file mode 100644
index 0000000000..2ca2de72a0
--- /dev/null
+++ b/config/locales/en/support/view_components.yml
@@ -0,0 +1,5 @@
+en:
+ support:
+ view_components:
+ index:
+ page_title: Find and Publish Components
diff --git a/config/routes.rb b/config/routes.rb
index c03e0e056f..607dc19f20 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -19,8 +19,4 @@
draw(:support)
draw(:api)
end
-
- direct :publish_support_view_component_previews, path_only: true do
- Rails.application.config.view_component.preview_route
- end
end
diff --git a/config/routes/support.rb b/config/routes/support.rb
index 94fdb3bf0a..efe3afe10f 100644
--- a/config/routes/support.rb
+++ b/config/routes/support.rb
@@ -74,4 +74,6 @@
end
resources :user_permissions, only: %i[destroy]
+
+ resources :view_components, only: %i[index]
end