From 91477f6dae624bcce85c0b734a73f2db07398f2a Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Fri, 5 Jan 2018 17:35:34 +0000 Subject: [PATCH] Resolve "Helpful and instructing Empty state for multi file editor" --- app/assets/images/icons.json | 2 +- app/assets/images/icons.svg | 2 +- .../illustrations/multi_file_editor_empty.svg | 1 + .../images/illustrations/wiki_login_empty.svg | 1 + .../illustrations/wiki_logout_empty.svg | 1 + app/assets/javascripts/ide/components/ide.vue | 24 +++++++++++++- .../ide/components/ide_repo_tree.vue | 29 ++++++++++------- .../ide/components/ide_side_bar.vue | 13 ++++++++ app/assets/javascripts/ide/index.js | 32 +++---------------- .../javascripts/ide/stores/actions/project.js | 2 ++ app/assets/stylesheets/pages/repo.scss | 13 ++++++++ app/views/ide/index.html.haml | 4 +-- app/views/layouts/nav/_dashboard.html.haml | 6 ++++ package.json | 2 +- .../repo/components/ide_repo_tree_spec.js | 6 ++-- spec/javascripts/repo/components/ide_spec.js | 4 ++- yarn.lock | 6 ++-- 17 files changed, 95 insertions(+), 53 deletions(-) create mode 100644 app/assets/images/illustrations/multi_file_editor_empty.svg create mode 100644 app/assets/images/illustrations/wiki_login_empty.svg create mode 100644 app/assets/images/illustrations/wiki_logout_empty.svg diff --git a/app/assets/images/icons.json b/app/assets/images/icons.json index 38c1faccbf1..296cb856734 100644 --- a/app/assets/images/icons.json +++ b/app/assets/images/icons.json @@ -1 +1 @@ -{"iconCount":186,"spriteSize":84748,"icons":["abuse","account","admin","angle-double-left","angle-double-right","angle-down","angle-left","angle-right","angle-up","appearance","applications","approval","arrow-down","arrow-right","assignee","bold","book","bookmark","branch","bullhorn","calendar","cancel","chart","chevron-down","chevron-left","chevron-right","chevron-up","clock","close","code","collapse","comment-dots","comment-next","comment","comments","commit","credit-card","cut","dashboard","disk","doc_code","doc_image","doc_text","double-headed-arrow","download","duplicate","earth","ellipsis_v","emoji_slightly_smiling_face","emoji_smile","emoji_smiley","epic","external-link","eye-slash","eye","file-addition","file-deletion","file-modified","filter","folder-o","folder-open","folder","fork","geo-nodes","git-merge","group","history","home","hook","hourglass","image-comment-dark","image-comment-light","import","issue-block","issue-child","issue-close","issue-duplicate","issue-external","issue-new","issue-open-m","issue-open","issue-parent","issues","italic","key-2","key","label","labels","leave","level-up","license","link","list-bulleted","list-numbered","location-dot","location","lock-open","lock","log","mail","menu","merge-request-close","messages","mobile-issue-close","monitor","more","notifications-off","notifications","overview","pencil-square","pencil","pipeline","play","plus-square-o","plus-square","plus","podcast","preferences","profile","project","push-rules","question-o","question","quote","redo","remove","repeat","retry","scale","screen-full","screen-normal","scroll_down","scroll_up","search","settings","shield","slight-frown","slight-smile","smile","smiley","snippet","spam","spinner","star-o","star","status_canceled_borderless","status_canceled","status_closed","status_created_borderless","status_created","status_failed_borderless","status_failed","status_manual_borderless","status_manual","status_notfound_borderless","status_open","status_pending_borderless","status_pending","status_running_borderless","status_running","status_skipped_borderless","status_skipped","status_success_borderless","status_success_solid","status_success","status_warning_borderless","status_warning","stop","task-done","template","terminal","thumb-down","thumb-up","thumbtack","timer","todo-add","todo-done","token","unapproval","unassignee","unlink","user","users","volume-up","warning","work"]} \ No newline at end of file +{"iconCount":189,"spriteSize":85766,"icons":["abuse","account","admin","angle-double-left","angle-double-right","angle-down","angle-left","angle-right","angle-up","appearance","applications","approval","arrow-down","arrow-right","assignee","bold","book","bookmark","branch","bullhorn","calendar","cancel","chart","chevron-down","chevron-left","chevron-right","chevron-up","clock","close","code","collapse","comment-dots","comment-next","comment","comments","commit","credit-card","cut","dashboard","disk","doc_code","doc_image","doc_text","double-headed-arrow","download","duplicate","earth","ellipsis_v","emoji_slightly_smiling_face","emoji_smile","emoji_smiley","epic","external-link","eye-slash","eye","file-addition","file-deletion","file-modified","filter","folder-o-open","folder-o","folder-open","folder","fork","geo-nodes","git-merge","group","history","home","hook","hourglass","image-comment-dark","image-comment-light","import","issue-block","issue-child","issue-close","issue-duplicate","issue-external","issue-new","issue-open-m","issue-open","issue-parent","issues","italic","key-2","key","label","labels","leave","level-up","license","link","list-bulleted","list-numbered","location-dot","location","lock-open","lock","log","mail","menu","merge-request-close","messages","mobile-issue-close","monitor","more","notifications-off","notifications","overview","pencil-square","pencil","pipeline","play","plus-square-o","plus-square","plus","podcast","preferences","profile","project","push-rules","question-o","question","quote","redo","remove","repeat","retry","scale","screen-full","screen-normal","scroll_down","scroll_up","search","settings","shield","slight-frown","slight-smile","smile","smiley","snippet","spam","spinner","staged","star-o","star","status_canceled_borderless","status_canceled","status_closed","status_created_borderless","status_created","status_failed_borderless","status_failed","status_manual_borderless","status_manual","status_notfound_borderless","status_open","status_pending_borderless","status_pending","status_running_borderless","status_running","status_skipped_borderless","status_skipped","status_success_borderless","status_success_solid","status_success","status_warning_borderless","status_warning","stop","task-done","template","terminal","thumb-down","thumb-up","thumbtack","timer","todo-add","todo-done","token","unapproval","unassignee","unlink","unstaged","user","users","volume-up","warning","work"]} \ No newline at end of file diff --git a/app/assets/images/icons.svg b/app/assets/images/icons.svg index 42f5377a10e..8d5426da19c 100644 --- a/app/assets/images/icons.svg +++ b/app/assets/images/icons.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/app/assets/images/illustrations/multi_file_editor_empty.svg b/app/assets/images/illustrations/multi_file_editor_empty.svg new file mode 100644 index 00000000000..bd376f0a050 --- /dev/null +++ b/app/assets/images/illustrations/multi_file_editor_empty.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/images/illustrations/wiki_login_empty.svg b/app/assets/images/illustrations/wiki_login_empty.svg new file mode 100644 index 00000000000..1cfa47220a5 --- /dev/null +++ b/app/assets/images/illustrations/wiki_login_empty.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/images/illustrations/wiki_logout_empty.svg b/app/assets/images/illustrations/wiki_logout_empty.svg new file mode 100644 index 00000000000..c71841f72e5 --- /dev/null +++ b/app/assets/images/illustrations/wiki_logout_empty.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/javascripts/ide/components/ide.vue b/app/assets/javascripts/ide/components/ide.vue index 7f29a355eca..26a70f6e748 100644 --- a/app/assets/javascripts/ide/components/ide.vue +++ b/app/assets/javascripts/ide/components/ide.vue @@ -9,6 +9,12 @@ import repoPreview from './repo_preview.vue'; import repoEditor from './repo_editor.vue'; export default { + props: { + emptyStateSvgPath: { + type: String, + required: true, + }, + }, computed: { ...mapState([ 'currentBlobView', @@ -64,7 +70,23 @@ export default { diff --git a/app/assets/javascripts/ide/components/ide_repo_tree.vue b/app/assets/javascripts/ide/components/ide_repo_tree.vue index b6b089e6b25..bd89ebe47d9 100644 --- a/app/assets/javascripts/ide/components/ide_repo_tree.vue +++ b/app/assets/javascripts/ide/components/ide_repo_tree.vue @@ -1,15 +1,15 @@