diff --git a/app/views/projects/_new.html.erb b/app/views/projects/_new.html.erb
deleted file mode 100644
index 454204020..000000000
--- a/app/views/projects/_new.html.erb
+++ /dev/null
@@ -1,8 +0,0 @@
-<div class="row">
-  <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
-    <%= form.text_field :name, label: t("projects.index.modal_new_project.name"), autofocus: true, placeholder: t("projects.index.modal_new_project.name_placeholder") %>
-    <%= hidden_field :project, :team_id, value: current_team.id if current_team %>
-  </div>
-</div>
-
-<%= form.enum_btn_group :visibility, label: t("projects.index.modal_new_project.visibility"), btn_names: { hidden: t("projects.index.modal_new_project.visibility_hidden"), visible: t("projects.index.modal_new_project.visibility_visible") } %>
diff --git a/app/views/projects/index.html.erb b/app/views/projects/index.html.erb
index 5532da142..2ce4123f2 100644
--- a/app/views/projects/index.html.erb
+++ b/app/views/projects/index.html.erb
@@ -1,154 +1,35 @@
-
 <% provide(:head_title, t("projects.index.head_title")) %>
 
 <% if current_team %>
-  <%= render partial: "shared/sidebar", locals: { page: 'project' } %>
+  <%= render partial: "shared/sidebar", locals: {page: 'project'} %>
   <%= render partial: "shared/secondary_navigation" %>
 
   <span style="display: none;" data-hook="projects-index-html"></span>
 
-  <% if can_create_projects?(current_team) %>
-    <!-- New project modal -->
-    <div class="modal" id="new-project-modal" tabindex="-1" role="dialog" aria-labelledby="new-project-modal-label">
-      <%= bootstrap_form_for @project, remote: true do |f| %>
-        <div class="modal-dialog" role="document">
-          <div class="modal-content">
-            <div class="modal-header">
-              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-              <h4 class="modal-title" id="new-project-modal-label"><%= t("projects.index.modal_new_project.modal_title") %></h4>
-            </div>
-            <div class="modal-body">
-              <%= render partial: "new.html.erb", locals: { form: f, teams: @teams } %>
-            </div>
-            <div class="modal-footer">
-              <button type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
-              <%= f.button t("projects.index.modal_new_project.create"), class: "btn btn-primary" %>
-            </div>
-          </div>
-        </div>
-      <% end %>
-    </div>
-  <% end %>
-
-  <!-- Edit project modal -->
-  <div class="modal" id="edit-project-modal" tabindex="-1" role="dialog" aria-labelledby="edit-project-modal-label">
-    <div class="modal-dialog" role="document">
-      <div class="modal-content">
-        <div class="modal-header">
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-          <h4 class="modal-title" id="edit-project-modal-label"></h4>
-        </div>
-        <div class="modal-body">
-        </div>
-        <div class="modal-footer">
-          <button type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
-          <button type="button" class="btn btn-primary" data-action="submit"><%=t "projects.index.modal_edit_project.submit" %></button>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Manage users modal -->
-  <div class="modal" id="project-actions-modal" tabindex="-1" role="dialog" aria-labelledby="project-actions-modal-label">
-    <div class="modal-dialog" role="document">
-      <div class="modal-content">
-        <div class="modal-header">
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-          <h4 class="modal-title" id="project-actions-modal-label"></h4>
-        </div>
-        <div class="modal-body"></div>
-        <div class="modal-footer"></div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Export projects modal -->
-  <div class="modal" id="export-projects-modal" tabindex="-1" role="dialog" aria-labelledby="export-projects-modal-label">
-    <div class="modal-dialog" role="document">
-      <div class="modal-content">
-        <div class="modal-header">
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-          <h4 class="modal-title" id="export-projects-modal-label"></h4>
-        </div>
-        <div class="modal-body">
-        </div>
-        <div class="modal-footer">
-          <button id="export-projects-modal-close" type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.close" %></button>
-          <button id="export-projects-modal-cancel" type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
-          <button id="export-projects-modal-submit"
-                  type="button"
-                  class="btn btn-primary"
-                  data-export-projects-submit-url="<%= export_projects_team_path(current_team) %>">
-            <%=t "projects.export_projects.modal_submit" %>
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
+  <%= render partial: 'projects/index/modals/new' %>
+  <%= render partial: 'projects/index/modals/edit' %>
+  <%= render partial: 'projects/index/modals/manage_users' %>
+  <%= render partial: 'projects/index/modals/export_projects' %>
 
   <div class="content-pane" id="projects-index">
-
     <div id="projects-absent" style="display:none">
       <div class="jumbotron text-center" style="margin-top:12%">
-        <strong><%=t 'projects.index.no_projects.text' %></strong>
-        <% if @teams.exists? && can_create_projects?(current_team) %>
-          <h2><strong><%=t 'projects.index.no_projects.title' %></strong></h2>
-          <br />
+        <strong><%= t 'projects.index.no_projects.text' %></strong>
+        <% if can_create_projects?(current_team) %>
+          <h2><strong><%= t 'projects.index.no_projects.title' %></strong></h2>
+          <br/>
           <a class="btn btn-primary new-project-btn">
             <span class="fas fa-plus"></span>
             <span class="hidden-xs"><%= t('projects.index.no_projects.create_new_button') %></span>
           </a>
         <% else %>
-          <p><strong><%=t 'projects.index.no_projects.no_permission_title' %></strong></p>
+          <p><strong><%= t 'projects.index.no_projects.no_permission_title' %></strong></p>
         <% end %>
       </div>
     </div>
+
     <div id="projects-present" style="display:none">
-      <div id="projects-toolbar">
-
-        <form class="form-inline" action="<%= projects_path %>">
-
-          <div class="form-group">
-
-            <% if @teams.exists? && can_create_projects?(current_team) %>
-            <!-- new project button -->
-              <a class="btn btn-primary new-project-btn">
-                <span class="fas fa-plus" aria-hidden="true"></span>
-                <span class="hidden-xs"><%=t "projects.index.new" %></span>
-              </a>
-            <% end %>
-
-            <!-- project sort -->
-            <div class="dropdown">
-              <button class="btn btn-light dropdown-toggle" type="button" id="sortMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-                <span><%= t("general.sort.#{@current_sort}_html") %></span>
-                <span class="caret"></span>
-              </button>
-              <ul id="sortMenuDropdown" class="dropdown-menu" aria-labelledby="sortMenu">
-              <% ["new", "old", "atoz", "ztoa"].each do |sort| %>
-                <li>
-                  <% if @current_sort != sort %>
-                    <a href="#" data-sort="<%= sort %>"><%= t("general.sort.#{sort}_html") %></a>
-                  <% else %>
-                    <a class="disabled" href="#" data-sort="<%= sort %>"><%= t("general.sort.#{sort}_html") %></a>
-                  <% end %>
-                </li>
-              <% end %>
-              </ul>
-            </div>
-
-            <!-- export projects button -->
-            <button type="button" class="btn btn-secondary pull-right"
-                                  id="export-projects-button"
-                                  data-export-projects-modal-url="<%= export_projects_modal_team_path(current_team) %>"
-                                  disabled>
-            <span class="fas fa-file-export"></span>
-            <span class="hidden-xs-custom"><%= t("projects.export_projects.export_button") %></span>
-          </button>
-
-          </div>
-        </form>
-      </div>
+      <%= render partial: 'projects/index/toolbar' %>
 
       <div class="tab-content">
         <div class="tab-pane active"
@@ -156,14 +37,13 @@
              data-projects-url="<%= projects_path %>"
              data-projects-sidebar-url="<%= projects_sidebar_path %>">
         </div>
+
         <div class="tab-pane" id="projects-table-view">
           <%= render partial: "projects/index/team_projects_table" %>
         </div>
       </div>
     </div>
-
   </div>
-
 <% end %>
 
 <%= javascript_include_tag "projects/index" %>
diff --git a/app/views/projects/index/_toolbar.html.erb b/app/views/projects/index/_toolbar.html.erb
new file mode 100644
index 000000000..8ed1b6fa1
--- /dev/null
+++ b/app/views/projects/index/_toolbar.html.erb
@@ -0,0 +1,41 @@
+<div id="projects-toolbar">
+  <form class="form-inline" action="<%= projects_path %>">
+    <div class="form-group">
+      <% if can_create_projects?(current_team) %>
+        <!-- new project button -->
+        <a class="btn btn-primary new-project-btn">
+          <span class="fas fa-plus" aria-hidden="true"></span>
+          <span class="hidden-xs"><%= t "projects.index.new" %></span>
+        </a>
+      <% end %>
+
+      <!-- project sort -->
+      <div class="dropdown">
+        <button class="btn btn-light dropdown-toggle" type="button" id="sortMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+          <span><%= t("general.sort.#{@current_sort}_html") %></span>
+          <span class="caret"></span>
+        </button>
+        <ul id="sortMenuDropdown" class="dropdown-menu" aria-labelledby="sortMenu">
+          <% ["new", "old", "atoz", "ztoa"].each do |sort| %>
+            <li>
+              <% if @current_sort != sort %>
+                <a href="#" data-sort="<%= sort %>"><%= t("general.sort.#{sort}_html") %></a>
+              <% else %>
+                <a class="disabled" href="#" data-sort="<%= sort %>"><%= t("general.sort.#{sort}_html") %></a>
+              <% end %>
+            </li>
+          <% end %>
+        </ul>
+      </div>
+
+      <!-- export projects button -->
+      <button type="button" class="btn btn-secondary pull-right"
+              id="export-projects-button"
+              data-export-projects-modal-url="<%= export_projects_modal_team_path(current_team) %>"
+              disabled>
+        <span class="fas fa-file-export"></span>
+        <span class="hidden-xs-custom"><%= t("projects.export_projects.export_button") %></span>
+      </button>
+    </div>
+  </form>
+</div>
diff --git a/app/views/projects/index/modals/_edit.html.erb b/app/views/projects/index/modals/_edit.html.erb
new file mode 100644
index 000000000..d81ae7d1a
--- /dev/null
+++ b/app/views/projects/index/modals/_edit.html.erb
@@ -0,0 +1,16 @@
+<div class="modal" id="edit-project-modal" tabindex="-1" role="dialog" aria-labelledby="edit-project-modal-label">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <h4 class="modal-title" id="edit-project-modal-label"></h4>
+      </div>
+      <div class="modal-body">
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
+        <button type="button" class="btn btn-primary" data-action="submit"><%=t "projects.index.modal_edit_project.submit" %></button>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/app/views/projects/index/modals/_export_projects.html.erb b/app/views/projects/index/modals/_export_projects.html.erb
new file mode 100644
index 000000000..525b9278a
--- /dev/null
+++ b/app/views/projects/index/modals/_export_projects.html.erb
@@ -0,0 +1,22 @@
+<div class="modal" id="export-projects-modal" tabindex="-1" role="dialog" aria-labelledby="export-projects-modal-label">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <h4 class="modal-title" id="export-projects-modal-label"></h4>
+      </div>
+      <div class="modal-body">
+      </div>
+      <div class="modal-footer">
+        <button id="export-projects-modal-close" type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.close" %></button>
+        <button id="export-projects-modal-cancel" type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
+        <button id="export-projects-modal-submit"
+                type="button"
+                class="btn btn-primary"
+                data-export-projects-submit-url="<%= export_projects_team_path(current_team) %>">
+          <%=t "projects.export_projects.modal_submit" %>
+        </button>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/app/views/projects/index/modals/_manage_users.html.erb b/app/views/projects/index/modals/_manage_users.html.erb
new file mode 100644
index 000000000..ab6547910
--- /dev/null
+++ b/app/views/projects/index/modals/_manage_users.html.erb
@@ -0,0 +1,12 @@
+<div class="modal" id="project-actions-modal" tabindex="-1" role="dialog" aria-labelledby="project-actions-modal-label">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <h4 class="modal-title" id="project-actions-modal-label"></h4>
+      </div>
+      <div class="modal-body"></div>
+      <div class="modal-footer"></div>
+    </div>
+  </div>
+</div>
diff --git a/app/views/projects/index/modals/_new.html.erb b/app/views/projects/index/modals/_new.html.erb
new file mode 100644
index 000000000..a4ebe3f9d
--- /dev/null
+++ b/app/views/projects/index/modals/_new.html.erb
@@ -0,0 +1,30 @@
+
+
+<% if can_create_projects?(current_team) %>
+  <div class="modal" id="new-project-modal" tabindex="-1" role="dialog" aria-labelledby="new-project-modal-label">
+    <%= bootstrap_form_for Project.new, remote: true do |f| %>
+      <div class="modal-dialog" role="document">
+        <div class="modal-content">
+          <div class="modal-header">
+            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+            <h4 class="modal-title" id="new-project-modal-label"><%= t("projects.index.modal_new_project.modal_title") %></h4>
+          </div>
+          <div class="modal-body">
+            <div class="row">
+              <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+                <%= f.text_field :name, label: t("projects.index.modal_new_project.name"), autofocus: true, placeholder: t("projects.index.modal_new_project.name_placeholder") %>
+                <%= hidden_field :project, :team_id, value: current_team.id if current_team %>
+              </div>
+            </div>
+
+            <%= f.enum_btn_group :visibility, label: t("projects.index.modal_new_project.visibility"), btn_names: { hidden: t("projects.index.modal_new_project.visibility_hidden"), visible: t("projects.index.modal_new_project.visibility_visible") } %>
+          </div>
+          <div class="modal-footer">
+            <button type="button" class="btn btn-secondary" data-dismiss="modal"><%=t "general.cancel" %></button>
+            <%= f.button t("projects.index.modal_new_project.create"), class: "btn btn-primary" %>
+          </div>
+        </div>
+      </div>
+    <% end %>
+  </div>
+<% end %>