SSH keys settings

Closes #13860

SSH keys settings
Closes #13860
1efe1054 · Phil Hughes · Robert Speicher · ba869ae5 · 1efe1054 · 1efe1054
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -3,6 +3,7 @@
 *
 */
 .well-list {
+  position: relative;
  margin: 0;
  padding: 0;
  list-style: none;

--- a/app/assets/stylesheets/pages/profile.scss
+++ b/app/assets/stylesheets/pages/profile.scss
@@ -145,3 +145,13 @@
    width: auto;
  }
 }
+
+.key-icon {
+  color: #8F8F8F;
+  font-size: 18px;
+  line-height: 42px;
+}
+
+.key-created-at {
+  line-height: 42px;
+}
--- a/app/controllers/profiles/keys_controller.rb
+++ b/app/controllers/profiles/keys_controller.rb
@@ -3,6 +3,7 @@ class Profiles::KeysController < Profiles::ApplicationController

  def index
    @keys = current_user.keys
+    @key = flash[:key] || Key.new
  end

  def show
@@ -10,7 +11,7 @@ def show
  end

  def new
-    @key = current_user.keys.new
+    redirect_to profile_keys_path
  end

  def create
@@ -19,7 +20,7 @@ def create
    if @key.save
      redirect_to profile_key_path(@key)
    else
-      render 'new'
+      redirect_to profile_keys_path, flash: {key: @key}
    end
  end


--- a/app/views/profiles/keys/_form.html.haml
+++ b/app/views/profiles/keys/_form.html.haml
 %div
-  = form_for [:profile, @key], html: { class: 'form-horizontal js-requires-input' } do |f|
+  = form_for [:profile, @key], html: { class: 'js-requires-input' } do |f|
    - if @key.errors.any?
      .alert.alert-danger
        %ul
@@ -7,13 +7,11 @@
            %li= msg

    .form-group
-      = f.label :key, class: 'control-label'
-      .col-sm-10
-        = f.text_area :key, class: "form-control", rows: 8, autofocus: true, required: true
+      = f.label :key, class: 'label-light'
+      = f.text_area :key, class: "form-control", rows: 8, required: true
    .form-group
-      = f.label :title, class: 'control-label'
-      .col-sm-10= f.text_field :title, class: "form-control", required: true
+      = f.label :title, class: 'label-light'
+      = f.text_field :title, class: "form-control", required: true

-    .form-actions
+    .prepend-top-default
      = f.submit 'Add key', class: "btn btn-create"
-      = link_to "Cancel", profile_keys_path, class: "btn btn-cancel"
--- a/app/views/profiles/keys/_key.html.haml
+++ b/app/views/profiles/keys/_key.html.haml
-%tr
-  %td
-    = link_to path_to_key(key, is_admin) do
-      %strong= key.title
-  %td
-    %code.key-fingerprint= key.fingerprint
-  %td
-    %span.cgray
-      added #{time_ago_with_tooltip(key.created_at)}
-  %td
-    = link_to 'Remove', path_to_key(key, is_admin), data: { confirm: 'Are you sure?'}, method: :delete, class: "btn btn-sm btn-remove delete-key pull-right"
+%li.key-list-item
+  .pull-left.append-right-10
+    = icon 'key', class: "key-icon"
+  .pull-left
+    = link_to path_to_key(key, is_admin), class: "title" do
+      = key.title
+    .description
+      = key.fingerprint
+  .pull-right
+    %span.key-created-at
+      created #{time_ago_with_tooltip(key.created_at)} ago
+    = link_to path_to_key(key, is_admin), data: { confirm: 'Are you sure?'}, method: :delete, class: "btn btn-transparent prepend-left-10" do
+      %span.sr-only Remove
+      = icon('trash')
--- a/app/views/profiles/keys/_key_details.html.haml
+++ b/app/views/profiles/keys/_key_details.html.haml
 - is_admin = defined?(admin) ? true : false
-.row
+.row.prepend-top-default
  .col-md-4
    .panel.panel-default
      .panel-heading

--- a/app/views/profiles/keys/_key_table.html.haml
+++ b/app/views/profiles/keys/_key_table.html.haml
 - is_admin = defined?(admin) ? true : false
 - if @keys.any?
-  .table-holder
-    %table.table
-      %thead.panel-heading
-        %tr
-          %th Title
-          %th Fingerprint
-          %th Added at
-          %th
-      %tbody
-        - @keys.each do |key|
-          = render 'profiles/keys/key', key: key, is_admin: is_admin
- else
-  .nothing-here-block
-    - if is_admin
-      User has no ssh keys
-    - else
-      There are no SSH keys with access to your account.
+  %ul.well-list
+    - @keys.each do |key|
+      = render 'profiles/keys/key', key: key, is_admin: is_admin
--- a/app/views/profiles/keys/index.html.haml
+++ b/app/views/profiles/keys/index.html.haml
 - page_title "SSH Keys"
 - header_title page_title, profile_keys_path
+- is_admin = defined?(admin) ? true : false

-.top-area
-  .nav-text
-    Before you can add an SSH key you need to
-    = link_to "generate it.", help_page_path("ssh", "README")
-  .nav-controls
-    = link_to new_profile_key_path, class: "btn btn-new" do
-      = icon('plus')
-      Add SSH Key
-
-.prepend-top-default
-= render 'key_table'
+.row.prepend-top-default
+  .col-lg-3.profile-settings-sidebar
+    %h4.prepend-top-0
+      = page_title
+    %p
+      SSH keys allow you to establish a secure connection between your computer and GitLab.
+  .col-lg-9
+    %h5.prepend-top-0
+      Add an SSH key
+    %p
+      Before you can add an SSH key you need to
+      = link_to "generate it.", help_page_path("ssh", "README")
+    = render 'form'
+    %hr
+    %h5
+      Your SSH keys (#{@keys.count})
+    %div.append-bottom-default
+      - if @keys.any?
+        = render 'key_table'
+      - else
+        %p.profile-settings-message.text-center
+          - if is_admin
+            User has no ssh keys
+          - else
+            There are no SSH keys with access to your account.