Resolve "Error when uploading a few designs in a row"

changelogs/unreleased/34320-error-when-uploading-a-few-designs-in-a-row.yml

+---
+title: Resolve Error when uploading a few designs in a row
+merge_request: 18811
+author:
+type: fixed

ee/app/assets/javascripts/design_management/graphql.js

 import Vue from 'vue';
 import VueApollo from 'vue-apollo';
+import _ from 'underscore';
 import { defaultDataIdFromObject } from 'apollo-cache-inmemory';
 import createDefaultClient from '~/lib/graphql';
 import createFlash from '~/flash';
@@ -46,7 +47,7 @@ const defaultClient = createDefaultClient(
       dataIdFromObject: object => {
         // eslint-disable-next-line no-underscore-dangle, @gitlab/i18n/no-non-i18n-strings
         if (object.__typename === 'Design') {
-          return object.id && object.image ? `${object.id}-${object.image}` : null;
+          return object.id && object.image ? `${object.id}-${object.image}` : _.uniqueId();
         }
         return defaultDataIdFromObject(object);
       },

ee/spec/features/projects/issues/design_management/user_uploads_designs_spec.rb

@@ -24,7 +24,7 @@ describe 'User uploads new design', :js do
       wait_for_requests
     end
 
-    it 'uploads design' do
+    it 'uploads designs' do
       attach_file(:design_file, logo_fixture, make_visible: true)
 
       expect(page).to have_selector('.js-design-list-item', count: 1)
@@ -32,6 +32,10 @@ describe 'User uploads new design', :js do
       within first('#designs-tab .card') do
         expect(page).to have_content('dk.png')
       end
+
+      attach_file(:design_file, gif_fixture, make_visible: true)
+
+      expect(page).to have_selector('.js-design-list-item', count: 2)
     end
   end
 
@@ -48,4 +52,8 @@ describe 'User uploads new design', :js do
   def logo_fixture
     Rails.root.join('spec', 'fixtures', 'dk.png')
   end
+
+  def gif_fixture
+    Rails.root.join('spec', 'fixtures', 'banana_sample.gif')
+  end
 end