From 262a7309ef39ce2e7c47e395383bc2ae8d5457d1 Mon Sep 17 00:00:00 2001
From: Lukas 'Eipi' Eipert <leipert@gitlab.com>
Date: Thu, 30 Nov 2023 14:27:23 +0000
Subject: [PATCH] Remove old top-bar from old Web IDE
The legacy nav has been removed. We slowly start stripping away the old
top bar as well. Removing the top bar from the legacy Web IDE will aid
us in doing so.
We add the "Your Work" sidebar to the legacy Web IDE instead.
Changelog: changed
---
app/assets/stylesheets/page_bundles/ide.scss | 9 ++++-
.../external_redirect_controller.rb | 1 -
app/controllers/ide_controller.rb | 2 +-
.../web_ide/remote_ide_controller.rb | 2 +-
app/views/ide/_show.html.haml | 8 +++++
app/views/layouts/fullscreen.html.haml | 6 ----
spec/requests/ide_controller_spec.rb | 36 +++++++++----------
.../layouts/fullscreen.html.haml_spec.rb | 20 -----------
8 files changed, 35 insertions(+), 49 deletions(-)
diff --git a/app/assets/stylesheets/page_bundles/ide.scss b/app/assets/stylesheets/page_bundles/ide.scss
index 45270ab3d3056..f7b979c2dac6b 100644
--- a/app/assets/stylesheets/page_bundles/ide.scss
+++ b/app/assets/stylesheets/page_bundles/ide.scss
@@ -9,6 +9,9 @@
@import './ide_themes/solarized-dark';
@import './ide_themes/monokai';
+// This whole file is for the legacy Web IDE
+// See: https://gitlab.com/groups/gitlab-org/-/epics/7683
+
$search-list-icon-width: 18px;
$ide-activity-bar-width: 60px;
$ide-context-header-padding: 10px;
@@ -18,6 +21,10 @@ $ide-tree-text-start: $ide-activity-bar-width + $ide-tree-padding;
$ide-commit-row-height: 32px;
$ide-commit-header-height: 48px;
+.web-ide-loader {
+ padding-top: 1rem;
+}
+
.project-refs-form,
.project-refs-target-form {
display: inline-block;
@@ -517,7 +524,6 @@ $ide-commit-header-height: 48px;
.ide-empty-state {
display: flex;
- height: 100vh;
align-items: center;
justify-content: center;
background-color: var(--ide-empty-state-background, transparent);
@@ -526,6 +532,7 @@ $ide-commit-header-height: 48px;
.ide {
overflow: hidden;
flex: 1;
+ height: calc(100vh - var(--top-bar-height))
}
.ide-commit-list-container {
diff --git a/app/controllers/external_redirect/external_redirect_controller.rb b/app/controllers/external_redirect/external_redirect_controller.rb
index 532196157b737..c90f55e2a57ee 100644
--- a/app/controllers/external_redirect/external_redirect_controller.rb
+++ b/app/controllers/external_redirect/external_redirect_controller.rb
@@ -11,7 +11,6 @@ def index
redirect_to url_param
else
render layout: 'fullscreen', locals: {
- minimal: true,
url: url_param
}
end
diff --git a/app/controllers/ide_controller.rb b/app/controllers/ide_controller.rb
index 4cc943ac25262..d9566121dcd72 100644
--- a/app/controllers/ide_controller.rb
+++ b/app/controllers/ide_controller.rb
@@ -24,7 +24,7 @@ def index
@fork_info = fork_info(project, params[:branch])
end
- render layout: 'fullscreen', locals: { minimal: helpers.use_new_web_ide? }
+ render layout: helpers.use_new_web_ide? ? 'fullscreen' : 'application'
end
private
diff --git a/app/controllers/web_ide/remote_ide_controller.rb b/app/controllers/web_ide/remote_ide_controller.rb
index 90652a1b6e262..8392e7a190cd9 100644
--- a/app/controllers/web_ide/remote_ide_controller.rb
+++ b/app/controllers/web_ide/remote_ide_controller.rb
@@ -17,7 +17,7 @@ class RemoteIdeController < ApplicationController
def index
return render_404 unless Feature.enabled?(:vscode_web_ide, current_user)
- render layout: 'fullscreen', locals: { minimal: true, data: root_element_data }
+ render layout: 'fullscreen', locals: { data: root_element_data }
end
private
diff --git a/app/views/ide/_show.html.haml b/app/views/ide/_show.html.haml
index 4b16c0199ba62..7a14c270ae669 100644
--- a/app/views/ide/_show.html.haml
+++ b/app/views/ide/_show.html.haml
@@ -1,7 +1,15 @@
- page_title _("IDE"), @project.full_name
- add_page_specific_style 'page_bundles/web_ide_loader'
+// The block below is for the Web IDE
+// See: https://gitlab.com/groups/gitlab-org/-/epics/7683
- unless use_new_web_ide?
+ - @breadcrumb_title = _("IDE")
+ - @breadcrumb_link = '#'
+ - @no_container = true
+ - @content_wrapper_class = 'pb-0'
+ - add_to_breadcrumbs(s_('Navigation|Your work'), root_path)
+ - nav 'your_work' # Couldn't get the `project` nav to work easily
- add_page_specific_style 'page_bundles/build'
- add_page_specific_style 'page_bundles/ide'
diff --git a/app/views/layouts/fullscreen.html.haml b/app/views/layouts/fullscreen.html.haml
index f168c742085c0..5063cc668334e 100644
--- a/app/views/layouts/fullscreen.html.haml
+++ b/app/views/layouts/fullscreen.html.haml
@@ -1,13 +1,9 @@
-- minimal = local_assigns.fetch(:minimal, false)
!!! 5
%html{ class: [user_application_theme, page_class], lang: I18n.locale }
= render "layouts/head"
%body{ class: "#{user_tab_width} #{@body_class} fullscreen-layout", data: { page: body_data_page } }
= render 'peek/bar'
= header_message
- - unless minimal
- = render partial: "layouts/header/default", locals: { project: @project, group: @group }
- .mobile-overlay
.hide-when-top-nav-responsive-open.gl--flex-full.gl-h-full{ class: nav ? ["layout-page", page_with_sidebar_class, "gl-mt-0!"]: '' }
- if defined?(nav) && nav
= render "layouts/nav/sidebar/#{nav}"
@@ -19,6 +15,4 @@
= render "layouts/flash", flash_container_no_margin: true
.content-wrapper{ id: "content-body", class: "d-flex flex-column align-items-stretch gl-p-0" }
= yield
- - unless minimal
- = render "layouts/nav/top_nav_responsive", class: "gl-flex-grow-1 gl-overflow-y-auto"
= footer_message
diff --git a/spec/requests/ide_controller_spec.rb b/spec/requests/ide_controller_spec.rb
index 4131f1d26ec0a..fae3d9533c505 100644
--- a/spec/requests/ide_controller_spec.rb
+++ b/spec/requests/ide_controller_spec.rb
@@ -17,8 +17,6 @@
let_it_be(:creator) { project.creator }
let_it_be(:other_user) { create(:user) }
- let_it_be(:top_nav_partial) { 'layouts/header/_default' }
-
let(:user) { creator }
before do
@@ -156,27 +154,27 @@
end
end
- # This indirectly tests that `minimal: true` was passed to the fullscreen layout
- describe 'layout' do
- where(:ff_state, :expect_top_nav) do
- false | true
- true | false
+ describe 'legacy Web IDE' do
+ before do
+ stub_feature_flags(vscode_web_ide: false)
end
- with_them do
- before do
- stub_feature_flags(vscode_web_ide: ff_state)
+ it 'uses application layout' do
+ subject
- subject
- end
+ expect(response).to render_template('layouts/application')
+ end
+ end
- it 'handles rendering top nav' do
- if expect_top_nav
- expect(response).to render_template(top_nav_partial)
- else
- expect(response).not_to render_template(top_nav_partial)
- end
- end
+ describe 'vscode IDE' do
+ before do
+ stub_feature_flags(vscode_web_ide: true)
+ end
+
+ it 'uses fullscreen layout' do
+ subject
+
+ expect(response).to render_template('layouts/fullscreen')
end
end
end
diff --git a/spec/views/layouts/fullscreen.html.haml_spec.rb b/spec/views/layouts/fullscreen.html.haml_spec.rb
index 2309e885b7545..46c3b08b9548a 100644
--- a/spec/views/layouts/fullscreen.html.haml_spec.rb
+++ b/spec/views/layouts/fullscreen.html.haml_spec.rb
@@ -4,8 +4,6 @@
RSpec.describe 'layouts/fullscreen' do
let_it_be(:template) { 'layouts/fullscreen' }
- let_it_be(:top_nav_partial) { 'layouts/header/_default' }
- let_it_be(:top_nav_responsive_partial) { 'layouts/nav/_top_nav_responsive' }
let_it_be(:user) { create(:user) }
@@ -27,13 +25,6 @@
expect(rendered).to have_selector(".flash-container.flash-container-no-margin")
end
- it 'renders top nav' do
- render
-
- expect(view).to render_template(top_nav_partial)
- expect(view).to render_template(top_nav_responsive_partial)
- end
-
it_behaves_like 'a layout which reflects the application theme setting'
it_behaves_like 'a layout which reflects the preferred language'
@@ -70,15 +61,4 @@
end
end
end
-
- context 'when minimal is set' do
- subject { render(template: template, formats: :html, locals: { minimal: true }) }
-
- it 'does not render top nav' do
- subject
-
- expect(view).not_to render_template(top_nav_partial)
- expect(view).not_to render_template(top_nav_responsive_partial)
- end
- end
end
--
GitLab