Use GlAvatar in project_avatar component

- Ensures size prop of all project_avatar usage is valid
- Updates specs
- Updates project_list_item with new props

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

 <script>
-import ProjectAvatarDefault from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatarDefault from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 export default {
   components: {

app/assets/javascripts/vue_shared/components/project_avatar/default.vue → app/assets/javascripts/vue_shared/components/deprecated_project_avatar/default.vue

@@ -3,6 +3,7 @@ import Identicon from '../identicon.vue';
 import ProjectAvatarImage from './image.vue';
 
 export default {
+  name: 'DeprecatedProjectAvatar',
   components: {
     Identicon,
     ProjectAvatarImage,

app/assets/javascripts/vue_shared/components/project_selector/project_list_item.vue

@@ -4,7 +4,7 @@ import { GlButton, GlIcon } from '@gitlab/ui';
 import { isString } from 'lodash';
 import highlight from '~/lib/utils/highlight';
 import { truncateNamespace } from '~/lib/utils/text_utility';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 export default {
   name: 'ProjectListItem',

ee/app/assets/javascripts/approvals/components/approvers_list_item.vue

 <script>
 import { GlButton, GlTooltipDirective } from '@gitlab/ui';
-import Avatar from '~/vue_shared/components/project_avatar/default.vue';
+import Avatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { TYPE_USER, TYPE_GROUP, TYPE_HIDDEN_GROUPS } from '../constants';
 import HiddenGroupsItem from './hidden_groups_item.vue';
 

ee/app/assets/javascripts/environments_dashboard/components/dashboard/project_header.vue

 <script>
 import { GlDropdown, GlDropdownItem, GlTooltipDirective, GlLink, GlIcon } from '@gitlab/ui';
 import { s__ } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 export default {
   components: {

ee/app/assets/javascripts/operations/components/dashboard/project_header.vue

 <script>
 import { GlButton, GlLink, GlTooltipDirective } from '@gitlab/ui';
 import { __ } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 export default {
   components: {

ee/app/assets/javascripts/other_storage_counter/components/project.vue

@@ -3,7 +3,7 @@ import { GlLink, GlIcon } from '@gitlab/ui';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import { numberToHumanSize, isOdd } from '~/lib/utils/number_utils';
 import { s__ } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import StorageRow from './storage_row.vue';
 
 export default {

ee/app/assets/javascripts/other_storage_counter/components/project_with_excess_storage.vue

@@ -2,7 +2,7 @@
 import { GlLink, GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import { s__, sprintf } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { ALERT_THRESHOLD, ERROR_THRESHOLD, WARNING_THRESHOLD } from '../constants';
 import { formatUsageSize, usageRatioToThresholdLevel } from '../utils';
 

ee/app/assets/javascripts/related_items_tree/components/create_issue_form.vue

@@ -19,7 +19,7 @@ import { STORAGE_KEY } from '~/frequent_items/constants';
 import { getTopFrequentItems } from '~/frequent_items/utils';
 import AccessorUtilities from '~/lib/utils/accessor';
 import { __ } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { SEARCH_DEBOUNCE } from '../constants';
 
 export default {

ee/app/assets/javascripts/security_dashboard/components/instance/project_list.vue

@@ -4,7 +4,7 @@ import projectsQuery from 'ee/security_dashboard/graphql/queries/instance_projec
 import { PROJECT_LOADING_ERROR_MESSAGE } from 'ee/security_dashboard/helpers';
 import createFlash from '~/flash';
 import { s__ } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 export default {
   i18n: {

ee/app/assets/javascripts/storage_counter/components/project.vue

@@ -3,7 +3,7 @@ import { GlLink, GlIcon } from '@gitlab/ui';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import { numberToHumanSize, isOdd } from '~/lib/utils/number_utils';
 import { s__ } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import StorageRow from './storage_row.vue';
 
 export default {

ee/app/assets/javascripts/storage_counter/components/project_with_excess_storage.vue

@@ -2,7 +2,7 @@
 import { GlLink, GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import { s__, sprintf } from '~/locale';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { ALERT_THRESHOLD, ERROR_THRESHOLD, WARNING_THRESHOLD } from '../constants';
 import { formatUsageSize, usageRatioToThresholdLevel } from '../utils';
 

ee/spec/frontend/approvals/components/approvers_list_item_spec.js

@@ -3,7 +3,7 @@ import { shallowMount } from '@vue/test-utils';
 import ApproversListItem from 'ee/approvals/components/approvers_list_item.vue';
 import HiddenGroupsItem from 'ee/approvals/components/hidden_groups_item.vue';
 import { TYPE_USER, TYPE_GROUP, TYPE_HIDDEN_GROUPS } from 'ee/approvals/constants';
-import Avatar from '~/vue_shared/components/project_avatar/default.vue';
+import Avatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 const TEST_USER = {
   id: 1,

ee/spec/frontend/environments_dashboard/components/project_header_spec.js

 import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import component from 'ee/environments_dashboard/components/dashboard/project_header.vue';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 describe('Project Header', () => {
   let wrapper;

ee/spec/frontend/operations/components/dashboard/project_header_spec.js

 import { shallowMount } from '@vue/test-utils';
 import ProjectHeader from 'ee/operations/components/dashboard/project_header.vue';
 import { trimText } from 'helpers/text_helper';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { mockOneProject } from '../../mock_data';
 
 describe('project header component', () => {

ee/spec/frontend/other_storage_counter/components/project_spec.js

@@ -2,7 +2,7 @@ import { shallowMount } from '@vue/test-utils';
 import Project from 'ee/other_storage_counter/components/project.vue';
 import StorageRow from 'ee/other_storage_counter/components/storage_row.vue';
 import { numberToHumanSize } from '~/lib/utils/number_utils';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { projects } from '../mock_data';
 
 let wrapper;

ee/spec/frontend/other_storage_counter/components/project_with_excess_storage_spec.js

@@ -3,7 +3,7 @@ import { shallowMount } from '@vue/test-utils';
 import ProjectWithExcessStorage from 'ee/other_storage_counter/components/project_with_excess_storage.vue';
 import { formatUsageSize } from 'ee/other_storage_counter/utils';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { projects } from '../mock_data';
 
 let wrapper;

ee/spec/frontend/related_items_tree/components/create_issue_form_spec.js

@@ -13,7 +13,7 @@ import Vuex from 'vuex';
 
 import CreateIssueForm from 'ee/related_items_tree/components/create_issue_form.vue';
 import createDefaultStore from 'ee/related_items_tree/store';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 import {
   mockInitialConfig,

ee/spec/frontend/security_dashboard/components/instance/project_list_spec.js

@@ -5,7 +5,7 @@ import ProjectList from 'ee/security_dashboard/components/instance/project_list.
 import projectsQuery from 'ee/security_dashboard/graphql/queries/instance_projects.query.graphql';
 import createMockApollo from 'helpers/mock_apollo_helper';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 const localVue = createLocalVue();
 localVue.use(VueApollo);

ee/spec/frontend/storage_counter/components/project_spec.js

@@ -2,7 +2,7 @@ import { shallowMount } from '@vue/test-utils';
 import Project from 'ee/storage_counter/components/project.vue';
 import StorageRow from 'ee/storage_counter/components/storage_row.vue';
 import { numberToHumanSize } from '~/lib/utils/number_utils';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { projects } from '../mock_data';
 
 let wrapper;

ee/spec/frontend/storage_counter/components/project_with_excess_storage_spec.js

@@ -3,7 +3,7 @@ import { shallowMount } from '@vue/test-utils';
 import ProjectWithExcessStorage from 'ee/storage_counter/components/project_with_excess_storage.vue';
 import { formatUsageSize } from 'ee/storage_counter/utils';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
-import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import { projects } from '../mock_data';
 
 let wrapper;

spec/frontend/vue_shared/components/project_avatar/default_spec.js

@@ -3,7 +3,7 @@ import mountComponent from 'helpers/vue_mount_component_helper';
 import { projectData } from 'jest/ide/mock_data';
 import { TEST_HOST } from 'spec/test_constants';
 import { getFirstCharacterCapitalized } from '~/lib/utils/text_utility';
-import ProjectAvatarDefault from '~/vue_shared/components/project_avatar/default.vue';
+import ProjectAvatarDefault from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 
 describe('ProjectAvatarDefault component', () => {
   const Component = Vue.extend(ProjectAvatarDefault);

spec/frontend/vue_shared/components/project_selector/project_list_item_spec.js

 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import { trimText } from 'helpers/text_helper';
+import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/default.vue';
 import ProjectListItem from '~/vue_shared/components/project_selector/project_list_item.vue';
 
 const localVue = createLocalVue();
@@ -53,7 +54,7 @@ describe('ProjectListItem component', () => {
   it(`renders the project avatar`, () => {
     wrapper = shallowMount(Component, options);
 
-    expect(wrapper.find('.js-project-avatar').exists()).toBe(true);
+    expect(wrapper.findComponent(ProjectAvatar).exists()).toBe(true);
   });
 
   it(`renders a simple namespace name with a trailing slash`, () => {