From e8b952f4fda89b48e0c9c40891e21b305c09d4df Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 19 Apr 2023 10:53:39 +0200 Subject: [PATCH] Revert "Revert "Improve breadcrumbs implementation [SCI-8087]"" This reverts commit 78d41d10a6eeea1988c327c75de247b71ffce89c. --- .../images/icon_small/navigate_next.svg | 3 + .../stylesheets/navigation/breadcrumbs.scss | 42 ++++++++++++ app/controllers/concerns/breadcrumbs.rb | 63 ++++++++++++++++++ app/controllers/experiments_controller.rb | 2 + app/controllers/label_templates_controller.rb | 17 +++++ app/controllers/my_modules_controller.rb | 2 + app/controllers/projects_controller.rb | 2 + app/controllers/protocols_controller.rb | 18 ++++++ app/controllers/repositories_controller.rb | 18 ++++++ app/views/experiments/_show_header.html.erb | 3 - app/views/layouts/application.html.erb | 2 +- app/views/my_modules/protocols.html.erb | 2 +- app/views/projects/index/_header.html.erb | 3 - app/views/projects/show/_header.html.erb | 3 - app/views/protocols/show.html.erb | 8 --- .../shared/navigation/_breadcrumbs.html.erb | 64 +++++++++++++++++++ config/locales/en.yml | 5 ++ 17 files changed, 238 insertions(+), 19 deletions(-) create mode 100644 app/assets/images/icon_small/navigate_next.svg create mode 100644 app/assets/stylesheets/navigation/breadcrumbs.scss create mode 100644 app/controllers/concerns/breadcrumbs.rb diff --git a/app/assets/images/icon_small/navigate_next.svg b/app/assets/images/icon_small/navigate_next.svg new file mode 100644 index 000000000..ff48952b1 --- /dev/null +++ b/app/assets/images/icon_small/navigate_next.svg @@ -0,0 +1,3 @@ + + + diff --git a/app/assets/stylesheets/navigation/breadcrumbs.scss b/app/assets/stylesheets/navigation/breadcrumbs.scss new file mode 100644 index 000000000..bcdb06a08 --- /dev/null +++ b/app/assets/stylesheets/navigation/breadcrumbs.scss @@ -0,0 +1,42 @@ +.sci--layout-navigation-breadcrumbs { + --max-breadcrumbs-link-width: 11.25rem; + align-items: center; + column-gap: .875rem; + display: flex; + flex-wrap: wrap; + padding: .875rem 1.5rem .5rem; + + .breadcrumbs-link { + color: var(--sn-blue); + display: inline-block; + max-width: var(--max-breadcrumbs-link-width); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + &:last-child { + color: var(--sn-grey); + } + } + + .delimiter { + padding-bottom: .25rem; + } + + .breadcrumbs-collapsed-container { + color: var(--sn-blue); + position: relative; + + .show-breadcrumbs { + align-items: center; + cursor: pointer; + display: flex; + position: relative; + } + + a { + @include font-button; + color: var(--sn-blue); + } + } +} diff --git a/app/controllers/concerns/breadcrumbs.rb b/app/controllers/concerns/breadcrumbs.rb new file mode 100644 index 000000000..6c0473776 --- /dev/null +++ b/app/controllers/concerns/breadcrumbs.rb @@ -0,0 +1,63 @@ +# frozen_string_literal: true + +module Breadcrumbs + extend ActiveSupport::Concern + + included do + def set_breadcrumbs_items + my_module = @my_module + experiment = my_module&.experiment || @experiment + project = experiment&.project || @project + current_folder = project&.project_folder || @current_folder + @breadcrumbs_items = [] + + folders = helpers.tree_ordered_parent_folders(current_folder) + + @breadcrumbs_items.push({ + label: t('projects.index.breadcrumbs_root'), + url: projects_path + }) + + folders&.each do |project_folder| + @breadcrumbs_items.push({ + label: project_folder.name, + url: project_folder_path(project_folder) + }) + end + + include_project(project) if project + + include_experiment(experiment) if experiment + + include_my_module(my_module) if my_module + + @breadcrumbs_items + end + end + + private + + def include_project(project) + @breadcrumbs_items.push({ + label: project.name, + url: project_path(project), + archived: project.archived? + }) + end + + def include_experiment(experiment) + @breadcrumbs_items.push({ + label: experiment.name, + url: my_modules_experiment_path(experiment), + archived: experiment.archived? + }) + end + + def include_my_module(my_module) + @breadcrumbs_items.push({ + label: my_module.name, + url: my_module_path(my_module), + archived: my_module.archived? + }) + end +end diff --git a/app/controllers/experiments_controller.rb b/app/controllers/experiments_controller.rb index 5f1819ec0..912706256 100644 --- a/app/controllers/experiments_controller.rb +++ b/app/controllers/experiments_controller.rb @@ -6,6 +6,7 @@ class ExperimentsController < ApplicationController include ActionView::Helpers::TextHelper include ApplicationHelper include Rails.application.routes.url_helpers + include Breadcrumbs before_action :load_project, only: %i(new create archive_group restore_group) before_action :load_experiment, except: %i(new create archive_group restore_group) @@ -18,6 +19,7 @@ class ExperimentsController < ApplicationController before_action :check_clone_permissions, only: %i(clone_modal clone) before_action :check_move_permissions, only: %i(move_modal move) before_action :set_inline_name_editing, only: %i(canvas table module_archive) + before_action :set_breadcrumbs_items, only: %i(canvas table module_archive) layout 'fluid' diff --git a/app/controllers/label_templates_controller.rb b/app/controllers/label_templates_controller.rb index 1577219df..2525dc1af 100644 --- a/app/controllers/label_templates_controller.rb +++ b/app/controllers/label_templates_controller.rb @@ -8,6 +8,7 @@ class LabelTemplatesController < ApplicationController before_action :check_manage_permissions, only: %i(create duplicate set_default delete update) before_action :load_label_templates, only: %i(index datatable) before_action :load_label_template, only: %i(show set_default update template_tags) + before_action :set_breadcrumbs_items, only: %i(index show) layout 'fluid' @@ -186,4 +187,20 @@ class LabelTemplatesController < ApplicationController team: label_template.team, message_items: message_items) end + + def set_breadcrumbs_items + @breadcrumbs_items = [] + + @breadcrumbs_items.push({ + label: t('breadcrumbs.labels'), + url: label_templates_path + }) + + if @label_template + @breadcrumbs_items.push({ + label: @label_template.name, + url: label_template_path(@label_template) + }) + end + end end diff --git a/app/controllers/my_modules_controller.rb b/app/controllers/my_modules_controller.rb index 4549e9a13..3ddf06a91 100644 --- a/app/controllers/my_modules_controller.rb +++ b/app/controllers/my_modules_controller.rb @@ -6,6 +6,7 @@ class MyModulesController < ApplicationController include ActionView::Helpers::UrlHelper include ApplicationHelper include MyModulesHelper + include Breadcrumbs before_action :load_vars, except: %i(restore_group create new save_table_state) before_action :load_experiment, only: %i(create new) @@ -19,6 +20,7 @@ class MyModulesController < ApplicationController before_action :check_update_state_permissions, only: :update_state before_action :set_inline_name_editing, only: %i(protocols results activities archive) before_action :load_experiment_my_modules, only: %i(protocols results activities archive) + before_action :set_breadcrumbs_items, only: %i(results protocols activities) layout 'fluid'.freeze diff --git a/app/controllers/projects_controller.rb b/app/controllers/projects_controller.rb index 57c58b68b..9ba2fe90c 100644 --- a/app/controllers/projects_controller.rb +++ b/app/controllers/projects_controller.rb @@ -7,6 +7,7 @@ class ProjectsController < ApplicationController include ProjectsHelper include CardsViewHelper include ExperimentsHelper + include Breadcrumbs attr_reader :current_folder helper_method :current_folder @@ -22,6 +23,7 @@ class ProjectsController < ApplicationController before_action :load_exp_sort_var, only: :show before_action :reset_invalid_view_state, only: %i(index cards show) before_action :set_folder_inline_name_editing, only: %i(index cards) + before_action :set_breadcrumbs_items, only: %i(index show) layout 'fluid' diff --git a/app/controllers/protocols_controller.rb b/app/controllers/protocols_controller.rb index 553175c86..12a6f0d66 100644 --- a/app/controllers/protocols_controller.rb +++ b/app/controllers/protocols_controller.rb @@ -70,6 +70,7 @@ class ProtocolsController < ApplicationController before_action :set_importer, only: %i(load_from_file import) before_action :set_inline_name_editing, only: :show + before_action :set_breadcrumbs_items, only: %i(index show) layout 'fluid' @@ -1133,4 +1134,21 @@ class ProtocolsController < ApplicationController protocol: link_to(@protocol.name, protocol_url(@protocol))) ) end + + def set_breadcrumbs_items + @breadcrumbs_items = [] + + @breadcrumbs_items.push({ + label: t('breadcrumbs.protocols'), + url: protocols_path + }) + + if @protocol + @breadcrumbs_items.push({ + label: @protocol.name, + url: protocol_path(@protocol), + archived: @protocol.archived? + }) + end + end end diff --git a/app/controllers/repositories_controller.rb b/app/controllers/repositories_controller.rb index 796c4f07d..aa8a24185 100644 --- a/app/controllers/repositories_controller.rb +++ b/app/controllers/repositories_controller.rb @@ -22,6 +22,7 @@ class RepositoriesController < ApplicationController before_action :check_create_permissions, only: %i(create_modal create) before_action :check_copy_permissions, only: %i(copy_modal copy) before_action :set_inline_name_editing, only: %i(show) + before_action :set_breadcrumbs_items, only: %i(index show) layout 'fluid' @@ -525,4 +526,21 @@ class RepositoriesController < ApplicationController team: @repository.team, message_items: message_items) end + + def set_breadcrumbs_items + @breadcrumbs_items = [] + + @breadcrumbs_items.push({ + label: t('breadcrumbs.inventories'), + url: repositories_path + }) + + if @repository + @breadcrumbs_items.push({ + label: @repository.name, + url: repository_path(@repository), + archived: @repository.archived? + }) + end + end end diff --git a/app/views/experiments/_show_header.html.erb b/app/views/experiments/_show_header.html.erb index 49f41488a..4d3f7a52b 100644 --- a/app/views/experiments/_show_header.html.erb +++ b/app/views/experiments/_show_header.html.erb @@ -1,7 +1,4 @@
-

<% if @experiment.archived? %> diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index c60375c91..9a9073ab0 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -60,7 +60,7 @@
diff --git a/app/views/my_modules/protocols.html.erb b/app/views/my_modules/protocols.html.erb index 7f8ccd3f5..d36c1de7a 100644 --- a/app/views/my_modules/protocols.html.erb +++ b/app/views/my_modules/protocols.html.erb @@ -37,7 +37,7 @@ %> <% end %> <%= render partial: 'shared/drag_n_drop_overlay' %> -<%= render partial: 'shared/secondary_navigation', locals: { render_breadcrumbs: true, project: @experiment.project, experiment: @experiment } %> +<%= render partial: 'shared/secondary_navigation', locals: { render_breadcrumbs: false, project: @experiment.project, experiment: @experiment } %>
diff --git a/app/views/projects/index/_header.html.erb b/app/views/projects/index/_header.html.erb index ebd0bcbf7..965751632 100644 --- a/app/views/projects/index/_header.html.erb +++ b/app/views/projects/index/_header.html.erb @@ -1,7 +1,4 @@
-
<% if current_folder&.name && @inline_editable_title_config.present? %>

diff --git a/app/views/projects/show/_header.html.erb b/app/views/projects/show/_header.html.erb index 300aa2385..99958a725 100644 --- a/app/views/projects/show/_header.html.erb +++ b/app/views/projects/show/_header.html.erb @@ -1,7 +1,4 @@
-

<% if @project.archived? %> diff --git a/app/views/protocols/show.html.erb b/app/views/protocols/show.html.erb index 2ae8f7832..af9d84416 100644 --- a/app/views/protocols/show.html.erb +++ b/app/views/protocols/show.html.erb @@ -5,14 +5,6 @@ <% provide(:container_class, 'no-second-nav-container') %>
-

<% if @inline_editable_title_config.present? %> diff --git a/app/views/shared/navigation/_breadcrumbs.html.erb b/app/views/shared/navigation/_breadcrumbs.html.erb index e69de29bb..d71d318ed 100644 --- a/app/views/shared/navigation/_breadcrumbs.html.erb +++ b/app/views/shared/navigation/_breadcrumbs.html.erb @@ -0,0 +1,64 @@ +<% if @breadcrumbs_items&.length %> + <% @breadcrumbs_items.each { |item| item[:label] = "(A) #{item[:label]}" if item[:archived] }%> + <% shortened = @breadcrumbs_items.length > 4 %> + + <% if shortened %> + <% first_breadcrumb_item = @breadcrumbs_items.shift + last_breadcrumb_items = @breadcrumbs_items.pop(2) %> + <%= link_to(first_breadcrumb_item[:label], first_breadcrumb_item[:url], + class: "breadcrumbs-link", + title: first_breadcrumb_item[:label]) %> + + <%= image_tag "icon_small/navigate_next.svg", + alt: "navigate next", + class: "navigate_next" %> + + + + ••• + + + + + + <%= image_tag "icon_small/navigate_next.svg", + alt: "navigate next", + class: "navigate_next" %> + + <% item = last_breadcrumb_items.first %> + <%= link_to(item[:label], item[:url], + class: "breadcrumbs-link", + title: item[:label]) %> + + <%= image_tag "icon_small/navigate_next.svg", + alt: "navigate next", + class: "navigate_next" %> + + <% last_item = last_breadcrumb_items.last %> + + <%= last_item[:label] %> + + <% else %> + <% last_item = @breadcrumbs_items.pop %> + <% @breadcrumbs_items.each do |item| %> + <%= link_to(item[:label], item[:url], + class: "breadcrumbs-link", + title: item[:label]) %> + + " + alt="navigate next" + class="navigate_next"> + + + <% end %> + + <%= last_item[:label] %> + + <% end %> +<% end %> diff --git a/config/locales/en.yml b/config/locales/en.yml index 638cf9009..6f3caab7e 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -3504,6 +3504,11 @@ en: url: not_valid: "Not valid URL" + breadcrumbs: + projects: "Projects" + inventories: "Inventories" + protocols: "Protocol templates" + labels: "Label templates" Add: "Add" Asset: "File"