Commit f6ec2816 authored by Filipa Lacerda's avatar Filipa Lacerda

Merge branch 'new-nav-fix-contextual-breadcrumbs' into 'master'

Contextual breadcrumb title fixes

Closes #34030 and #34033

See merge request !12602
parents c6e97958 46b38e4b
/* eslint-disable func-names, space-before-function-paren, no-var, prefer-arrow-callback, wrap-iife, no-shadow, consistent-return, one-var, one-var-declaration-per-line, camelcase, default-case, no-new, quotes, no-duplicate-case, no-case-declarations, no-fallthrough, max-len */
/* global ProjectSelect */
/* global ShortcutsNavigation */
/* global IssuableIndex */
/* global ShortcutsIssuable */
......@@ -157,6 +158,9 @@ import PerformanceBar from './performance_bar';
shortcut_handler = new ShortcutsIssuable();
new ZenMode();
break;
case 'dashboard:milestones:index':
new ProjectSelect();
break;
case 'projects:milestones:show':
case 'groups:milestones:show':
case 'dashboard:milestones:show':
......@@ -166,6 +170,7 @@ import PerformanceBar from './performance_bar';
case 'groups:issues':
case 'groups:merge_requests':
new UsersSelect();
new ProjectSelect();
break;
case 'dashboard:todos:index':
new Todos();
......@@ -259,6 +264,7 @@ import PerformanceBar from './performance_bar';
break;
case 'dashboard:issues':
case 'dashboard:merge_requests':
new ProjectSelect();
new UsersSelect();
break;
case 'projects:commit:show':
......
......@@ -5,12 +5,15 @@ export default class GroupName {
constructor() {
this.titleContainer = document.querySelector('.js-title-container');
this.title = this.titleContainer.querySelector('.title');
this.titleWidth = this.title.offsetWidth;
this.groupTitle = this.titleContainer.querySelector('.group-title');
this.groups = this.titleContainer.querySelectorAll('.group-path');
this.toggle = null;
this.isHidden = false;
this.init();
if (this.title) {
this.titleWidth = this.title.offsetWidth;
this.groupTitle = this.titleContainer.querySelector('.group-title');
this.groups = this.titleContainer.querySelectorAll('.group-path');
this.toggle = null;
this.isHidden = false;
this.init();
}
}
init() {
......
......@@ -104,6 +104,14 @@ import Api from './api';
dropdownCssClass: "ajax-project-dropdown"
});
});
$('.new-project-item-select-button').on('click', function() {
$('.project-item-select', this.parentNode).select2('open');
});
$('.project-item-select').on('click', function() {
window.location = `${$(this).val()}/${this.dataset.relativePath}`;
});
}
return ProjectSelect;
......
......@@ -330,7 +330,7 @@ header.navbar-gitlab-new {
white-space: nowrap;
> a {
&:last-of-type {
&:last-of-type:not(:first-child) {
font-weight: 600;
}
}
......@@ -384,6 +384,7 @@ header.navbar-gitlab-new {
&::after {
content: "/";
margin: 0 2px 0 5px;
color: rgba($black, .65);
}
}
......@@ -396,3 +397,13 @@ header.navbar-gitlab-new {
color: $gl-text-color;
}
}
.top-area {
.nav-controls-new-nav {
.dropdown {
@media (min-width: $screen-sm-min) {
margin-right: 0;
}
}
}
}
module BreadcrumbsHelper
def add_to_breadcrumbs(text, link)
@breadcrumbs_extra_links ||= []
@breadcrumbs_extra_links.push({
text: text,
link: link
})
end
def breadcrumb_title_link
return @breadcrumb_link if @breadcrumb_link
if controller.available_action?(:index)
url_for(action: "index")
else
request.path
end
end
def breadcrumb_title(title)
return if defined?(@breadcrumb_title)
@breadcrumb_title = title
end
end
......@@ -4,6 +4,10 @@ def page_title(*titles)
@page_title.push(*titles.compact) if titles.any?
if show_new_nav? && titles.any? && !defined?(@breadcrumb_title)
@breadcrumb_title = @page_title.last
end
# Segments are seperated by middot
@page_title.join(" \u00b7 ")
end
......
- page_title "Edit", @application.name, "Applications"
%h3.page-title Edit application
- @url = admin_application_path(@application)
= render 'form', application: @application
- breadcrumb_title "Applications"
- page_title "New Application"
%h3.page-title New application
- @url = admin_applications_path
= render 'form', application: @application
- breadcrumb_title "Messages"
- page_title "Broadcast Messages"
= render 'form'
- breadcrumb_title "Messages"
- page_title "Broadcast Messages"
%h3.page-title
......
- if show_new_nav? && current_user.can_create_group?
- content_for :breadcrumbs_extra do
= link_to "New group", new_group_path, class: "btn btn-new"
.top-area
%ul.nav-links
= nav_link(page: dashboard_groups_path) do
......@@ -6,9 +10,8 @@
= nav_link(page: explore_groups_path) do
= link_to explore_groups_path, title: 'Explore public groups' do
Explore public groups
.nav-controls
.nav-controls{ class: ("nav-controls-new-nav" if show_new_nav?) }
= render 'shared/groups/search_form'
= render 'shared/groups/dropdown'
- if current_user.can_create_group?
= link_to new_group_path, class: "btn btn-new" do
New group
= link_to "New group", new_group_path, class: "btn btn-new #{("visible-xs" if show_new_nav?)}"
= content_for :flash_message do
= render 'shared/project_limit'
- if show_new_nav? && current_user.can_create_project?
- content_for :breadcrumbs_extra do
= link_to "New project", new_project_path, class: 'btn btn-new'
.top-area.scrolling-tabs-container.inner-page-scroll-tabs
.fade-left= icon('angle-left')
.fade-right= icon('angle-right')
......@@ -14,9 +19,8 @@
= link_to explore_root_path, title: 'Explore', data: {placement: 'right'} do
Explore projects
.nav-controls
.nav-controls{ class: ("nav-controls-new-nav" if show_new_nav?) }
= render 'shared/projects/search_form'
= render 'shared/projects/dropdown'
- if current_user.can_create_project?
= link_to new_project_path, class: 'btn btn-new' do
New project
= link_to "New project", new_project_path, class: "btn btn-new #{("visible-xs" if show_new_nav?)}"
- if show_new_nav? && current_user
- content_for :breadcrumbs_extra do
= link_to "New snippet", new_snippet_path, class: "btn btn-new", title: "New snippet"
.top-area
%ul.nav-links
= nav_link(page: dashboard_snippets_path, html_options: {class: 'home'}) do
......@@ -8,6 +12,5 @@
Explore Snippets
- if current_user
.nav-controls.hidden-xs
= link_to new_snippet_path, class: "btn btn-new", title: "New snippet" do
New snippet
.nav-controls.hidden-xs{ class: ("hidden-sm hidden-md hidden-lg" if show_new_nav?) }
= link_to "New snippet", new_snippet_path, class: "btn btn-new", title: "New snippet"
- @hide_top_links = true
- page_title "Issues"
- header_title "Issues", issues_dashboard_path(assignee_id: current_user.id)
= content_for :meta_tags do
= auto_discovery_link_tag(:atom, params.merge(rss_url_options), title: "#{current_user.name} issues")
- if show_new_nav?
- content_for :breadcrumbs_extra do
= link_to params.merge(rss_url_options), class: 'btn has-tooltip append-right-10', title: 'Subscribe' do
= icon('rss')
= render 'shared/new_project_item_select', path: 'issues/new', label: "New issue", with_feature_enabled: 'issues'
.top-area
= render 'shared/issuable/nav', type: :issues
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
= link_to params.merge(rss_url_options), class: 'btn has-tooltip', title: 'Subscribe' do
= icon('rss')
= render 'shared/new_project_item_select', path: 'issues/new', label: "New issue", with_feature_enabled: 'issues'
......
- @hide_top_links = true
- page_title "Merge Requests"
- header_title "Merge Requests", merge_requests_dashboard_path(assignee_id: current_user.id)
- if show_new_nav?
- content_for :breadcrumbs_extra do
= render 'shared/new_project_item_select', path: 'merge_requests/new', label: "New merge request", with_feature_enabled: 'merge_requests'
.top-area
= render 'shared/issuable/nav', type: :merge_requests
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
= render 'shared/new_project_item_select', path: 'merge_requests/new', label: "New merge request", with_feature_enabled: 'merge_requests'
= render 'shared/issuable/filter', type: :merge_requests
......
......@@ -2,10 +2,14 @@
- page_title 'Milestones'
- header_title 'Milestones', dashboard_milestones_path
- if show_new_nav?
- content_for :breadcrumbs_extra do
= render 'shared/new_project_item_select', path: 'milestones/new', label: 'New milestone', include_groups: true
.top-area
= render 'shared/milestones_filter', counts: @milestone_states
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
= render 'shared/new_project_item_select', path: 'milestones/new', label: 'New milestone', include_groups: true
.milestones
......
- @no_container = true
- @hide_top_links = true
- @breadcrumb_title = "Projects"
= content_for :meta_tags do
= auto_discovery_link_tag(:atom, dashboard_projects_url(rss_url_options), title: "All activity")
......
- @hide_top_links = true
- @no_container = true
- breadcrumb_title "Projects"
- page_title "Starred Projects"
- header_title "Projects", dashboard_projects_path
......
- @hide_top_links = true
- page_title "Todos"
- header_title "Todos", dashboard_todos_path
......
- @hide_top_links = true
- page_title "Groups"
- header_title "Groups", dashboard_groups_path
......
- @hide_top_links = true
- page_title "Projects"
- header_title "Projects", dashboard_projects_path
......
- @hide_top_links = true
- page_title "Projects"
- header_title "Projects", dashboard_projects_path
......
- @hide_top_links = true
- page_title "Projects"
- header_title "Projects", dashboard_projects_path
......
- @hide_top_links = true
- page_title "Snippets"
- header_title "Snippets", snippets_path
......
- page_title "Issues"
- group_issues_exists = group_issues(@group).exists?
= render "head_issues"
= content_for :meta_tags do
= auto_discovery_link_tag(:atom, params.merge(rss_url_options), title: "#{@group.name} issues")
- if group_issues(@group).exists?
- if show_new_nav? && group_issues_exists
- content_for :breadcrumbs_extra do
= link_to params.merge(rss_url_options), class: 'btn btn-default append-right-10' do
= icon('rss')
= render 'shared/new_project_item_select', path: 'issues/new', label: "New issue"
- if group_issues_exists
.top-area
= render 'shared/issuable/nav', type: :issues
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
= link_to params.merge(rss_url_options), class: 'btn' do
= icon('rss')
%span.icon-label
......
- page_title 'Labels'
- if show_new_nav? && can?(current_user, :admin_label, @group)
- content_for :breadcrumbs_extra do
= link_to "New label", new_group_label_path(@group), class: "btn btn-new"
= render "groups/head_issues"
.top-area.adjust
.nav-text
Labels can be applied to issues and merge requests. Group labels are available for any project within the group.
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
- if can?(current_user, :admin_label, @group)
= link_to new_group_label_path(@group), class: "btn btn-new" do
New label
= link_to "New label", new_group_label_path(@group), class: "btn btn-new"
.labels
.other-labels
......
- breadcrumb_title "Labels"
- page_title 'New Label'
- header_title group_title(@group, 'Labels', group_labels_path(@group))
......
- page_title "Merge Requests"
- if show_new_nav? && current_user
- content_for :breadcrumbs_extra do
= render 'shared/new_project_item_select', path: 'merge_requests/new', label: "New merge request"
- if @group_merge_requests.empty?
= render 'shared/empty_states/merge_requests', project_select_button: true
- else
.top-area
= render 'shared/issuable/nav', type: :merge_requests
- if current_user
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
= render 'shared/new_project_item_select', path: 'merge_requests/new', label: "New merge request"
= render 'shared/issuable/filter', type: :merge_requests
......
- page_title "Milestones"
- if show_new_nav? && can?(current_user, :admin_milestones, @group)
- content_for :breadcrumbs_extra do
= link_to "New milestone", new_group_milestone_path(@group), class: "btn btn-new"
= render "groups/head_issues"
.top-area
= render 'shared/milestones_filter', counts: @milestone_states
.nav-controls
.nav-controls{ class: ("visible-xs" if show_new_nav?) }
- if can?(current_user, :admin_milestones, @group)
= link_to new_group_milestone_path(@group), class: "btn btn-new" do
New milestone
= link_to "New milestone", new_group_milestone_path(@group), class: "btn btn-new"
.milestones
%ul.content-list
......
- breadcrumb_title "Milestones"
- page_title "Milestones"
- header_title group_title(@group, "Milestones", group_milestones_path(@group))
......
- @breadcrumb_link = dashboard_groups_path
- breadcrumb_title "Groups"
- @hide_top_links = true
- page_title 'New Group'
- header_title "Groups", dashboard_groups_path
......
- @no_container = true
- breadcrumb_title "Group"
= content_for :meta_tags do
= auto_discovery_link_tag(:atom, group_url(@group, rss_url_options), title: "#{@group.name} activity")
......
......@@ -15,7 +15,8 @@
- if show_new_nav?
- if content_for?(:new_global_flash)
= yield :new_global_flash
= render "layouts/nav/breadcrumbs"
- unless @hide_breadcrumbs
= render "layouts/nav/breadcrumbs"
= render "layouts/flash"
= yield :flash_message
%div{ class: "#{(container_class unless @no_container)} #{@content_class}" }
......
- breadcrumb_title = @breadcrumb_title || controller.controller_name.humanize
- breadcrumb_link = breadcrumb_title_link
- hide_top_links = @hide_top_links || false
%nav.breadcrumbs{ role: "navigation" }
......@@ -8,12 +8,16 @@
.title
= link_to "GitLab", root_path
\/
- if content_for?(:header_title_before)
= yield :header_title_before
\/
= header_title
%h2.breadcrumbs-sub-title
%ul.list-unstyled
- if content_for?(:sub_title_before)
= yield :sub_title_before
%li= link_to breadcrumb_title, request.path
- if @breadcrumbs_extra_links
- @breadcrumbs_extra_links.each do |extra|
%li= link_to extra[:text], extra[:link]
%li= link_to @breadcrumb_title, breadcrumb_link
- if content_for?(:breadcrumbs_extra)
.breadcrumbs-extra.hidden-xs= yield :breadcrumbs_extra
= yield :header_content
......@@ -13,7 +13,7 @@
= nav_link(controller: :dashboard, html_options: {class: 'home'}) do
= link_to admin_root_path, title: 'Overview' do
%span
Overview
Dashboard
= nav_link(controller: [:admin, :projects]) do
= link_to admin_projects_path, title: 'Projects' do
%span
......
......@@ -3,7 +3,7 @@
= link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do
Projects
= nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do
= nav_link(controller: ['dashboard/groups', 'explore/groups']) do
= link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do
Groups
......
- breadcrumb_title "Profile"
- @content_class = "limit-container-width" unless fluid_layout
= render 'profiles/head'
......
- page_title 'Two-Factor Authentication', 'Account'
- header_title "Two-Factor Authentication", profile_two_factor_auth_path
- if show_new_nav?
- add_to_breadcrumbs("Account", profile_account_path)
- else
- header_title "Two-Factor Authentication", profile_two_factor_auth_path
- @content_class = "limit-container-width" unless fluid_layout
= render 'profiles/head'
- if inject_u2f_api?
......
- @no_container = true
- if show_new_nav?
- add_to_breadcrumbs("Project", project_path(@project))
- page_title "Activity"
= render "projects/head"
......
- breadcrumb_title "Repository"
- @no_container = true
- page_title "Edit", @blob.path, @ref
- content_for :page_specific_javascripts do
......
- breadcrumb_title "Repository"
- page_title "New File", @path.presence, @ref
- content_for :page_specific_javascripts do
= page_specific_javascript_tag('lib/ace.js')
......
- breadcrumb_title "Repository"
- @no_container = true
- page_title @blob.path, @ref
......
......@@ -3,8 +3,7 @@
- page_title "Boards"
- if show_new_nav?
- content_for :sub_title_before do
%li= link_to "Issues", project_issues_path(@project)
- add_to_breadcrumbs("Issues", project_issues_path(@project))
- content_for :page_specific_javascripts do
= webpack_bundle_tag 'common_vue'
......
......@@ -2,6 +2,9 @@
- page_title "Branches"
= render "projects/commits/head"
- if show_new_nav?
- add_to_breadcrumbs("Repository", project_tree_path(@project))
%div{ class: container_class }
.top-area.adjust
.nav-text
......
- @no_container = true
- breadcrumb_title _("Commits")
- page_title _("Commits"), @ref
= content_for :meta_tags do
= auto_discovery_link_tag(:atom, project_commits_url(@project, @ref, rss_url_options), title: "#{@project.name}:#{@ref} commits")
- if show_new_nav?
- add_to_breadcrumbs("Repository", project_tree_path(@project))
= content_for :sub_nav do
= render "head"
......
- @no_container = true
- page_title "Compare"
- if show_new_nav?
- add_to_breadcrumbs("Repository", project_tree_path(@project))
= render "projects/commits/head"
%div{ class: container_class }
......
- @no_container = true
- breadcrumb_title "Compare"
- page_title "#{params[:from]}...#{params[:to]}"
- if show_new_nav?
- add_to_breadcrumbs("Repository", project_tree_path(@project))
= render "projects/commits/head"
%div{ class: container_class }
......
- @no_container = true
- page_title "Cycle Analytics"
- if show_new_nav?
- add_to_breadcrumbs("Project", project_path(@project))