Skip to content

Commit

Permalink
Transition main navigation to design system.
Browse files Browse the repository at this point in the history 
This commit includes below changes:
-Duplicated existing header partial view to legacy.
-Created new header partial with design system logic for main navigation.
-Added new method in base controller to handle toggle between legacy and new header views.
-Updated admin and design_system views with new header partial view render.
  • Loading branch information
@farahTW
farahTW committed Oct 18, 2023
1 parent c02a4ab commit f8dd84a
Show file tree
Hide file tree
Showing 5 changed files with 139 additions and 42 deletions.
5 changes: 5 additions & 0 deletions app/controllers/admin/base_controller.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,11 @@ def render_design_system(design_system_view, legacy_view)
end
end

def show_new_header?
current_user.can_preview_design_system?
end
helper_method :show_new_header?

private

def new_design_system?
Expand Down
4 changes: 4 additions & 0 deletions app/views/layouts/admin.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,11 @@
<% end %>

<% content_for :navbar do %>
<% if show_new_header? %>
<%= render "shared/header", admin_template: true %>
<% else %>
<%= render "shared/legacy_header", admin_template: true %>
<% end %>
<% if t('admin.whats_new.show_banner') %>
<div class="govuk-design-system-styling">
<div class="<%= yield(:full_width) === "true" ? "app-width-container--full-width" : "container" %>">
Expand Down
6 changes: 5 additions & 1 deletion app/views/layouts/design_system.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,11 @@

<div class="legacy-whitehall">
<div class="environment-<%= environment %> navbar-wrapper">
<%= render partial: "shared/header" %>
<% if show_new_header? %>
<%= render partial: "shared/header" %>
<% else %>
<%= render partial: "shared/legacy_header" %>
<% end %>
</div>
</div>

Expand Down
78 changes: 37 additions & 41 deletions app/views/shared/_header.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,47 +9,43 @@
navbar-default
navbar-inverse
navbar-static-top
<% if !t('admin.whats_new.show_banner') && admin_template %>add-bottom-margin<% end %>
<% if environment_style %>environment-indicator<% end %>" role="banner">
<div class="navbar-container container-fluid">
<div class="navbar-header">
<%# Bootstrap toggle for collapsed navbar content, used at smaller widths %>
<a class="navbar-toggle" data-toggle="collapse" data-target="header .navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<%= link_to "GOV.UK Whitehall", admin_root_path, :class => "navbar-brand" %>
<% if environment_label %>
<div class="environment-label">
<%= environment_label %>
</div>
<% end %>
</div>
<nav role="navigation" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><%= link_to "Dashboard", admin_root_path %></li>
<li><%= link_to "View website", Whitehall.public_root, class: "open_website" %></li>
</ul>
<div class="navbar-text pull-right remove-bottom-margin">
<ul class="list-inline">
<li>
<%= signon_link %>
</li>
<% if user_signed_in? %>
<li>
<%= link_to current_user.name, admin_user_path(current_user), id: "#user_settings" %>
</li>
<li>
<%= link_to "Logout", "/auth/gds/sign_out" %>
</li>
<% end %>
<%= admin_users_header_link %>
</ul>
</div>
</nav>
</div>
<% if !t('admin.whats_new.show_banner') && admin_template %>add-bottom-margin
<% end %>
<% if environment %>environment-indicator
<% end %>" role="banner">
<%= render "govuk_publishing_components/components/layout_header", {
product_name: "Whitehall Publisher",
environment: environment,
navigation_items: [
{
text: "Dashboard",
href: admin_root_path,
},
{
text: "View website",
href: Whitehall.public_root,
},
{
text: "Switch app",
href: Plek.external_url_for("signon"),
},
*(
if user_signed_in?
[{
text: current_user.name,
href: admin_user_path(current_user),
},
{
text: "Logout",
href: "/auth/gds/sign_out",
}]
end),
{
text: "All users",
href: admin_users_path,
},
],
} %>

<div class="container-fluid">
<ul id="global-nav" class="masthead-tabs list-unstyled">
Expand Down
88 changes: 88 additions & 0 deletions app/views/shared/_legacy_header.html.erb
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
<% environment_style = GovukAdminTemplate.environment_style %>
<% environment_label = GovukAdminTemplate.environment_label %>
<% environment = GovukPublishingComponents::AppHelpers::Environment.current_acceptance_environment %>
<% admin_template ||= false %>

<header class="
masthead
navbar
navbar-default
navbar-inverse
navbar-static-top
<% if !t('admin.whats_new.show_banner') && admin_template %>add-bottom-margin<% end %>
<% if environment_style %>environment-indicator<% end %>" role="banner">
<div class="navbar-container container-fluid">
<div class="navbar-header">
<%# Bootstrap toggle for collapsed navbar content, used at smaller widths %>
<a class="navbar-toggle" data-toggle="collapse" data-target="header .navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<%= link_to "GOV.UK Whitehall", admin_root_path, :class => "navbar-brand" %>
<% if environment_label %>
<div class="environment-label">
<%= environment_label %>
</div>
<% end %>
</div>
<nav role="navigation" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><%= link_to "Dashboard", admin_root_path %></li>
<li><%= link_to "View website", Whitehall.public_root, class: "open_website" %></li>
</ul>
<div class="navbar-text pull-right remove-bottom-margin">
<ul class="list-inline">
<li>
<%= signon_link %>
</li>
<% if user_signed_in? %>
<li>
<%= link_to current_user.name, admin_user_path(current_user), id: "#user_settings" %>
</li>
<li>
<%= link_to "Logout", "/auth/gds/sign_out" %>
</li>
<% end %>
<%= admin_users_header_link %>
</ul>
</div>
</nav>
</div>

<div class="container-fluid">
<ul id="global-nav" class="masthead-tabs list-unstyled">
<li class="masthead-tab-item js-create-new create-new" data-module="navbar-toggle">
<a href="#new-document-menu" class="toggler js-navbar-toggle__toggler" id="new-document-label">New document</a>
<%= document_creation_dropdown %>
</li>
<%= admin_documents_header_link %>
<%= admin_statistics_announcements_link %>
<%= admin_featured_header_link %>
<%= admin_user_organisation_header_link %>
<li class="js-more-nav masthead-tab-item" data-module="navbar-toggle">
<a href="#more-links-menu" id="more-links-label" class="toggler js-navbar-toggle__toggler">More</a>
<ul id="more-links-menu" class="masthead-menu masthead-menu-right js-hidden unstyled js-navbar-toggle__menu hide-before-js-module-init" role="menu" aria-labelledby="more-links-label">
<%= admin_organisations_header_menu_link %>
<%= admin_policy_groups_header_menu_link %>
<%= admin_roles_header_menu_link %>
<%= admin_people_header_menu_link %>
<%= admin_topical_events_header_menu_link %>
<%= admin_worldwide_organisations_header_menu_link %>
<%= admin_world_location_news_header_menu_link %>
<%= admin_fields_of_operation_header_menu_link %>
<%= admin_cabinet_ministers_header_menu_link %>
<%= admin_get_involved_header_menu_link %>
<%= admin_sitewide_settings_header_menu_link %>
<%= admin_governments_header_menu_link %>
</ul>
</li>
</ul>
</div>
<% if admin_template %>
<section class="notices">
<%= render partial: "shared/notices" %>
</section>
<% end %>
</header>

0 comments on commit f8dd84a

Please sign in to comment.