Merge branch 'deprecate-gl-skeleton-loading' into 'master'

Deprecate GlSkeletonLoading component

See merge request gitlab-org/gitlab!40994

app/assets/javascripts/clusters_list/components/clusters.vue

@@ -5,7 +5,7 @@ import {
   GlLink,
   GlLoadingIcon,
   GlPagination,
-  GlSkeletonLoading,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
   GlSprintf,
   GlTable,
 } from '@gitlab/ui';

app/assets/javascripts/ide/components/ide_side_bar.vue

 <script>
 import { mapState, mapGetters } from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import IdeTree from './ide_tree.vue';
 import ResizablePanel from './resizable_panel.vue';
 import ActivityBar from './activity_bar.vue';

app/assets/javascripts/ide/components/ide_tree_list.vue

 <script>
 import { mapActions, mapGetters, mapState } from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import FileTree from '~/vue_shared/components/file_tree.vue';
 import IdeFileRow from './ide_file_row.vue';
 import NavDropdown from './nav_dropdown.vue';

app/assets/javascripts/issuables_list/components/issuables_list_app.vue

@@ -3,7 +3,7 @@ import { toNumber, omit } from 'lodash';
 import {
   GlEmptyState,
   GlPagination,
-  GlSkeletonLoading,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
   GlSafeHtmlDirective as SafeHtml,
 } from '@gitlab/ui';
 import { deprecatedCreateFlash as flash } from '~/flash';

app/assets/javascripts/mr_popover/components/mr_popover.vue

 <script>
 /* eslint-disable @gitlab/vue-require-i18n-strings */
-import { GlPopover, GlSkeletonLoading } from '@gitlab/ui';
+import { GlPopover, GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import CiIcon from '../../vue_shared/components/ci_icon.vue';
 import timeagoMixin from '../../vue_shared/mixins/timeago';
 import query from '../queries/merge_request.query.graphql';

app/assets/javascripts/notes.js

@@ -17,7 +17,7 @@ import Autosize from 'autosize';
 import 'jquery.caret'; // required by at.js
 import '@gitlab/at.js';
 import Vue from 'vue';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import AjaxCache from '~/lib/utils/ajax_cache';
 import syntaxHighlight from '~/syntax_highlight';
 import axios from './lib/utils/axios_utils';

app/assets/javascripts/notes/components/diff_with_note.vue

 <script>
 /* eslint-disable vue/no-v-html */
 import { mapState, mapActions } from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import DiffFileHeader from '~/diffs/components/diff_file_header.vue';
 import DiffViewer from '~/vue_shared/components/diff_viewer/diff_viewer.vue';
 import ImageDiffOverlay from '~/diffs/components/image_diff_overlay.vue';

app/assets/javascripts/releases/components/app_index.vue

 <script>
 import { mapState, mapActions } from 'vuex';
-import { GlSkeletonLoading, GlEmptyState, GlLink, GlButton } from '@gitlab/ui';
+import {
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlEmptyState,
+  GlLink,
+  GlButton,
+} from '@gitlab/ui';
 import {
   getParameterByName,
   historyPushState,

app/assets/javascripts/releases/components/app_show.vue

 <script>
 import { mapState, mapActions } from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import ReleaseBlock from './release_block.vue';
 
 export default {

app/assets/javascripts/repository/components/table/index.vue

 <script>
-import { GlSkeletonLoading, GlButton } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlButton } from '@gitlab/ui';
 import { sprintf, __ } from '../../../locale';
 import getRefMixin from '../../mixins/get_ref';
 import projectPathQuery from '../../queries/project_path.query.graphql';

app/assets/javascripts/repository/components/table/row.vue

@@ -4,7 +4,7 @@ import { escapeRegExp } from 'lodash';
 import {
   GlBadge,
   GlLink,
-  GlSkeletonLoading,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
   GlTooltipDirective,
   GlLoadingIcon,
   GlIcon,

app/assets/javascripts/vue_merge_request_widget/components/terraform/mr_widget_terraform_container.vue

 <script>
-import { GlSkeletonLoading, GlSprintf } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlSprintf } from '@gitlab/ui';
 import { n__ } from '~/locale';
 import axios from '~/lib/utils/axios_utils';
 import MrWidgetExpanableSection from '../mr_widget_expandable_section.vue';

app/assets/javascripts/vue_shared/components/content_viewer/viewers/markdown_viewer.vue

@@ -3,7 +3,7 @@
 import $ from 'jquery';
 import '~/behaviors/markdown/render_gfm';
 
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { forEach, escape } from 'lodash';
 import axios from '~/lib/utils/axios_utils';
 import { __ } from '~/locale';

app/assets/javascripts/vue_shared/components/notes/skeleton_note.vue

 <script>
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import TimelineEntryItem from '~/vue_shared/components/notes/timeline_entry_item.vue';
 
 export default {

app/assets/javascripts/vue_shared/components/notes/system_note.vue

@@ -19,7 +19,12 @@
  */
 import $ from 'jquery';
 import { mapGetters, mapActions, mapState } from 'vuex';
-import { GlDeprecatedButton, GlSkeletonLoading, GlTooltipDirective, GlIcon } from '@gitlab/ui';
+import {
+  GlDeprecatedButton,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlTooltipDirective,
+  GlIcon,
+} from '@gitlab/ui';
 import descriptionVersionHistoryMixin from 'ee_else_ce/notes/mixins/description_version_history';
 import noteHeader from '~/notes/components/note_header.vue';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';

app/assets/javascripts/vue_shared/components/user_popover/user_popover.vue

 <script>
 /* eslint-disable vue/no-v-html */
-import { GlPopover, GlSkeletonLoading, GlIcon } from '@gitlab/ui';
+import { GlPopover, GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlIcon } from '@gitlab/ui';
 import UserAvatarImage from '../user_avatar/user_avatar_image.vue';
 import { glEmojiTag } from '../../../emoji';
 

ee/app/assets/javascripts/analytics/cycle_analytics/components/path_navigation.vue

 <script>
-import { GlPath, GlSkeletonLoading } from '@gitlab/ui';
+import { GlPath, GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { PATH_BACKGROUND_COLOR } from '../constants';
 
 export default {

ee/app/assets/javascripts/analytics/shared/components/metric_card.vue

 <script>
-import { GlCard, GlSkeletonLoading, GlLink, GlIcon, GlTooltipDirective } from '@gitlab/ui';
+import {
+  GlCard,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlLink,
+  GlIcon,
+  GlTooltipDirective,
+} from '@gitlab/ui';
 
 export default {
   name: 'MetricCard',

ee/app/assets/javascripts/approvals/components/license_compliance/index.vue

 <script>
 import { mapActions, mapState } from 'vuex';
-import { GlButton, GlIcon, GlLink, GlSkeletonLoading, GlSprintf } from '@gitlab/ui';
+import {
+  GlButton,
+  GlIcon,
+  GlLink,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlSprintf,
+} from '@gitlab/ui';
 import { APPROVALS, APPROVALS_MODAL } from 'ee/approvals/stores/modules/license_compliance';
 import ModalLicenseCompliance from './modal.vue';
 import { s__ } from '~/locale';

ee/app/assets/javascripts/approvals/components/security_configuration/unconfigured_security_rules.vue

 <script>
 import { camelCase } from 'lodash';
 import { mapState, mapActions } from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { LICENSE_CHECK_NAME, VULNERABILITY_CHECK_NAME, JOB_TYPES } from 'ee/approvals/constants';
 import { s__ } from '~/locale';
 import UnconfiguredSecurityRule from './unconfigured_security_rule.vue';

ee/app/assets/javascripts/dependencies/components/dependencies_table.vue

 <script>
 import { cloneDeep } from 'lodash';
-import { GlBadge, GlIcon, GlButton, GlSkeletonLoading, GlTable } from '@gitlab/ui';
+import {
+  GlBadge,
+  GlIcon,
+  GlButton,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlTable,
+} from '@gitlab/ui';
 import { s__ } from '~/locale';
 import DependencyLicenseLinks from './dependency_license_links.vue';
 import DependencyVulnerabilities from './dependency_vulnerabilities.vue';

ee/app/assets/javascripts/license_compliance/components/licenses_table_row.vue

 <script>
 import {
   GlLink,
-  GlSkeletonLoading,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
   GlDeprecatedBadge as GlBadge,
   GlIcon,
   GlFriendlyWrap,

ee/app/assets/javascripts/licenses/components/cards/skeleton_license_card.vue

 <script>
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { SkeletonCell, SkeletonHeaderCell } from '../cells';
 
 export default {

ee/app/assets/javascripts/licenses/components/cells/skeleton_cell.vue

 <script>
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import Cell from './cell.vue';
 
 export default {

ee/app/assets/javascripts/licenses/components/cells/skeleton_header_cell.vue

 <script>
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import Cell from './cell.vue';
 
 export default {

ee/app/assets/javascripts/pages/groups/saml_providers/saml_members/index.vue

 <script>
-import { GlSkeletonLoading, GlTable, GlAvatar } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlTable, GlAvatar } from '@gitlab/ui';
 import { mapState, mapActions } from 'vuex';
 import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue';
 import { __, s__ } from '~/locale';

ee/app/assets/javascripts/requirements/components/requirements_loading.vue

 <script>
-import { GlSkeletonLoading, GlLoadingIcon } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlLoadingIcon } from '@gitlab/ui';
 
 import { DEFAULT_PAGE_SIZE, FilterState } from '../constants';
 

ee/app/assets/javascripts/roadmap/components/roadmap_shell.vue

 <script>
 import { mapState } from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 
 import { isInViewport } from '~/lib/utils/common_utils';
 import { EXTEND_AS } from '../constants';

ee/app/assets/javascripts/security_dashboard/components/security_dashboard_table_row.vue

@@ -3,7 +3,7 @@ import { mapActions, mapState } from 'vuex';
 import {
   GlDeprecatedButton,
   GlFormCheckbox,
-  GlSkeletonLoading,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
   GlSprintf,
   GlIcon,
 } from '@gitlab/ui';

ee/app/assets/javascripts/security_dashboard/components/vulnerability_list.vue

 <script>
 import { difference } from 'lodash';
-import { GlFormCheckbox, GlLink, GlSkeletonLoading, GlSprintf, GlTable } from '@gitlab/ui';
+import {
+  GlFormCheckbox,
+  GlLink,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlSprintf,
+  GlTable,
+} from '@gitlab/ui';
 import RemediatedBadge from 'ee/vulnerabilities/components/remediated_badge.vue';
 import FiltersProducedNoResults from 'ee/security_dashboard/components/empty_states/filters_produced_no_results.vue';
 import DashboardHasNoVulnerabilities from 'ee/security_dashboard/components/empty_states/dashboard_has_no_vulnerabilities.vue';

ee/app/assets/javascripts/vulnerabilities/components/status_description.vue

 <script>
-import { GlLink, GlSprintf, GlSkeletonLoading, GlLoadingIcon } from '@gitlab/ui';
+import {
+  GlLink,
+  GlSprintf,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlLoadingIcon,
+} from '@gitlab/ui';
 import { s__ } from '~/locale';
 import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
 import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';

ee/spec/frontend/analytics/cycle_analytics/components/path_navigation_spec.js

-import { GlPath, GlSkeletonLoading } from '@gitlab/ui';
+import { GlPath, GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
 import Component from 'ee/analytics/cycle_analytics/components/path_navigation.vue';
 import { transformedStagePathData, issueStage } from '../mock_data';

ee/spec/frontend/analytics/shared/components/metric_card_spec.js

 import { mount } from '@vue/test-utils';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import MetricCard from 'ee/analytics/shared/components/metric_card.vue';
 

ee/spec/frontend/approvals/components/security_configuration/unconfigured_security_rules_spec.js

 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import UnconfiguredSecurityRules from 'ee/approvals/components/security_configuration/unconfigured_security_rules.vue';
 import UnconfiguredSecurityRule from 'ee/approvals/components/security_configuration/unconfigured_security_rule.vue';
 import { createStoreOptions } from 'ee/approvals/stores';

ee/spec/frontend/dependencies/components/dependencies_table_spec.js

 import { nextTick } from 'vue';
 import { mount } from '@vue/test-utils';
-import { GlBadge, GlButton, GlLink, GlSkeletonLoading } from '@gitlab/ui';
+import {
+  GlBadge,
+  GlButton,
+  GlLink,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+} from '@gitlab/ui';
 import stubChildren from 'helpers/stub_children';
 import DependenciesTable from 'ee/dependencies/components/dependencies_table.vue';
 import DependencyLicenseLinks from 'ee/dependencies/components/dependency_license_links.vue';

ee/spec/frontend/license_compliance/components/licenses_table_row_spec.js

 import { shallowMount } from '@vue/test-utils';
 import {
   GlLink,
-  GlSkeletonLoading,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
   GlDeprecatedBadge as GlBadge,
   GlFriendlyWrap,
 } from '@gitlab/ui';

ee/spec/frontend/pages/groups/saml_providers/saml_members/index_spec.js

 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
-import { GlTable, GlSkeletonLoading } from '@gitlab/ui';
+import { GlTable, GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import MembersApp from 'ee/pages/groups/saml_providers/saml_members/index.vue';
 import createInitialState from 'ee/pages/groups/saml_providers/saml_members/store/state';
 import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue';

ee/spec/frontend/requirements/components/requirements_loading_spec.js

 import { shallowMount } from '@vue/test-utils';
 
-import { GlSkeletonLoading, GlLoadingIcon } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlLoadingIcon } from '@gitlab/ui';
 import RequirementsLoading from 'ee/requirements/components/requirements_loading.vue';
 
 import { FilterState, mockRequirementsCount } from '../mock_data';

ee/spec/frontend/security_dashboard/components/vulnerability_list_spec.js

 import { mount } from '@vue/test-utils';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import { useLocalStorageSpy } from 'helpers/local_storage_helper';
 import RemediatedBadge from 'ee/vulnerabilities/components/remediated_badge.vue';
 import SecurityScannerAlert from 'ee/security_dashboard/components/security_scanner_alert.vue';

ee/spec/frontend/vulnerabilities/status_description_spec.js

 import { mount } from '@vue/test-utils';
-import { GlLink, GlSkeletonLoading, GlLoadingIcon } from '@gitlab/ui';
+import {
+  GlLink,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlLoadingIcon,
+} from '@gitlab/ui';
 import { capitalize } from 'lodash';
 import UsersMockHelper from 'helpers/user_mock_data_helper';
 import StatusText from 'ee/vulnerabilities/components/status_description.vue';

spec/frontend/clusters_list/components/clusters_spec.js

 import MockAdapter from 'axios-mock-adapter';
 import { mount } from '@vue/test-utils';
-import { GlLoadingIcon, GlPagination, GlSkeletonLoading, GlTable } from '@gitlab/ui';
+import {
+  GlLoadingIcon,
+  GlPagination,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+  GlTable,
+} from '@gitlab/ui';
 import * as Sentry from '@sentry/browser';
 import axios from '~/lib/utils/axios_utils';
 import Clusters from '~/clusters_list/components/clusters.vue';

spec/frontend/issuables_list/components/issuables_list_app_spec.js

 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
 import { shallowMount } from '@vue/test-utils';
-import { GlEmptyState, GlPagination, GlSkeletonLoading } from '@gitlab/ui';
+import {
+  GlEmptyState,
+  GlPagination,
+  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
+} from '@gitlab/ui';
 import waitForPromises from 'helpers/wait_for_promises';
 import { TEST_HOST } from 'helpers/test_constants';
 import { deprecatedCreateFlash as flash } from '~/flash';

spec/frontend/releases/components/app_show_spec.js

 import Vuex from 'vuex';
 import { shallowMount } from '@vue/test-utils';
-import { GlSkeletonLoading } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import ReleaseShowApp from '~/releases/components/app_show.vue';
 import { release as originalRelease } from '../mock_data';
 import ReleaseBlock from '~/releases/components/release_block.vue';

spec/frontend/repository/components/table/index_spec.js

 import { shallowMount } from '@vue/test-utils';
-import { GlSkeletonLoading, GlButton } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlButton } from '@gitlab/ui';
 import Table from '~/repository/components/table/index.vue';
 import TableRow from '~/repository/components/table/row.vue';
 

spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js

-import { GlSkeletonLoading, GlSprintf } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlSprintf } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import MockAdapter from 'axios-mock-adapter';
 import { invalidPlanWithName, plans, validPlanWithName } from './mock_data';

spec/frontend/vue_shared/components/user_popover/user_popover_spec.js

-import { GlSkeletonLoading, GlSprintf, GlIcon } from '@gitlab/ui';
+import { GlDeprecatedSkeletonLoading as GlSkeletonLoading, GlSprintf, GlIcon } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import UserPopover from '~/vue_shared/components/user_popover/user_popover.vue';