diff options
author | Mike Greiling <mike@pixelcog.com> | 2017-04-06 16:44:15 -0500 |
---|---|---|
committer | Mike Greiling <mike@pixelcog.com> | 2017-04-09 15:22:53 -0500 |
commit | 4cc88f59534acc01ab2ec0609418f9fad1f51918 (patch) | |
tree | 70dab2a1e76a5e14cc55e20b2068042fed70a826 | |
parent | 909718414b4399497d67c86aa5f7f6ca7296ea0e (diff) | |
download | gitlab-ce-4cc88f59534acc01ab2ec0609418f9fad1f51918.tar.gz |
convert pipeline error state to vue template
5 files changed, 24 insertions, 22 deletions
diff --git a/app/assets/javascripts/commit/pipelines/pipelines_table.js b/app/assets/javascripts/commit/pipelines/pipelines_table.js index fe64122a972..1d16c64e07e 100644 --- a/app/assets/javascripts/commit/pipelines/pipelines_table.js +++ b/app/assets/javascripts/commit/pipelines/pipelines_table.js @@ -5,7 +5,7 @@ import PipelinesService from '../../vue_pipelines_index/services/pipelines_servi import PipelineStore from '../../vue_pipelines_index/stores/pipelines_store'; import eventHub from '../../vue_pipelines_index/event_hub'; import EmptyState from '../../vue_pipelines_index/components/empty_state.vue'; -import ErrorState from '../../vue_pipelines_index/components/error_state'; +import ErrorState from '../../vue_pipelines_index/components/error_state.vue'; import '../../lib/utils/common_utils'; import '../../vue_shared/vue_resource_interceptor'; import Poll from '../../lib/utils/poll'; diff --git a/app/assets/javascripts/vue_pipelines_index/components/error_state.js b/app/assets/javascripts/vue_pipelines_index/components/error_state.js deleted file mode 100644 index e5d228bddf8..00000000000 --- a/app/assets/javascripts/vue_pipelines_index/components/error_state.js +++ /dev/null @@ -1,19 +0,0 @@ -import pipelinesErrorStateSVG from 'empty_states/icons/_pipelines_failed.svg'; - -export default { - template: ` - <div class="row empty-state js-pipelines-error-state"> - <div class="col-xs-12"> - <div class="svg-content"> - ${pipelinesErrorStateSVG} - </div> - </div> - - <div class="col-xs-12 text-center"> - <div class="text-content"> - <h4>The API failed to fetch the pipelines.</h4> - </div> - </div> - </div> - `, -}; diff --git a/app/assets/javascripts/vue_pipelines_index/components/error_state.vue b/app/assets/javascripts/vue_pipelines_index/components/error_state.vue new file mode 100644 index 00000000000..90cee68163e --- /dev/null +++ b/app/assets/javascripts/vue_pipelines_index/components/error_state.vue @@ -0,0 +1,21 @@ +<script> +import pipelinesErrorStateSVG from 'empty_states/icons/_pipelines_failed.svg'; + +export default { + data: () => ({ pipelinesErrorStateSVG }), +}; +</script> + +<template> + <div class="row empty-state js-pipelines-error-state"> + <div class="col-xs-12"> + <div class="svg-content" v-html="pipelinesErrorStateSVG" /> + </div> + + <div class="col-xs-12 text-center"> + <div class="text-content"> + <h4>The API failed to fetch the pipelines.</h4> + </div> + </div> + </div> +</template> diff --git a/app/assets/javascripts/vue_pipelines_index/pipelines.js b/app/assets/javascripts/vue_pipelines_index/pipelines.js index 19fa0a888fd..6eea4812f33 100644 --- a/app/assets/javascripts/vue_pipelines_index/pipelines.js +++ b/app/assets/javascripts/vue_pipelines_index/pipelines.js @@ -5,7 +5,7 @@ import eventHub from './event_hub'; import PipelinesTableComponent from '../vue_shared/components/pipelines_table'; import TablePaginationComponent from '../vue_shared/components/table_pagination'; import EmptyState from './components/empty_state.vue'; -import ErrorState from './components/error_state'; +import ErrorState from './components/error_state.vue'; import NavigationTabs from './components/navigation_tabs'; import NavigationControls from './components/nav_controls'; import Poll from '../lib/utils/poll'; diff --git a/spec/javascripts/vue_pipelines_index/error_state_spec.js b/spec/javascripts/vue_pipelines_index/error_state_spec.js index 524e018b1fa..7999c15c18d 100644 --- a/spec/javascripts/vue_pipelines_index/error_state_spec.js +++ b/spec/javascripts/vue_pipelines_index/error_state_spec.js @@ -1,5 +1,5 @@ import Vue from 'vue'; -import errorStateComp from '~/vue_pipelines_index/components/error_state'; +import errorStateComp from '~/vue_pipelines_index/components/error_state.vue'; describe('Pipelines Error State', () => { let component; |