compatible with thumbnail which url has no extension (#11684)

* compatible with thumbnail which url has no extension

* restore newline #11684

components/upload/UploadList.tsx

@@ -22,8 +22,12 @@ const extname = (url: string) => {
   const filenameWithoutSuffix = filename.split(/#|\?/)[0];
   return (/\.[^./\\]*$/.exec(filenameWithoutSuffix) || [''])[0];
 };
-
-const isImageUrl = (url: string): boolean => {
+const imageTypes: string[] = ['image', 'webp', 'png', 'svg', 'gif', 'jpg', 'jpeg', 'bmp'];
+const isImageUrl = (file: UploadFile): boolean => {
+  if (imageTypes.includes(file.type)) {
+    return true;
+  }
+  const url: string = (file.thumbUrl || file.url) as string;
   const extension = extname(url);
   if (/^data:image\//.test(url) || /(webp|svg|png|gif|jpg|jpeg|bmp)$/i.test(extension)) {
     return true;
@@ -99,7 +103,7 @@ export default class UploadList extends React.Component<UploadListProps, any> {
         } else if (!file.thumbUrl && !file.url) {
           icon = <Icon className={`${prefixCls}-list-item-thumbnail`} type="picture" />;
         } else {
-          let thumbnail = isImageUrl((file.thumbUrl || file.url) as string)
+          let thumbnail = isImageUrl(file)
             ? <img src={file.thumbUrl || file.url} alt={file.name} />
             : <Icon type="file" className={`${prefixCls}-list-item-icon`} />;
           icon = (

components/upload/__tests__/__snapshots__/uploadlist.test.js.snap

@@ -558,6 +558,40 @@ exports[`Upload List should non-image format file preview 1`] = `
         title="Remove file"
       />
     </div>
+    <div
+      class="ant-upload-list-item ant-upload-list-item-done"
+    >
+      <div
+        class="ant-upload-list-item-info"
+      >
+        <span>
+          <a
+            class="ant-upload-list-item-thumbnail"
+            href="https://publish-pic-cpu.baidu.com/1296beb3-50d9-4276-885f-52645cbb378e.jpeg@w_228%2ch_152"
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <img
+              alt="image"
+              src="https://publish-pic-cpu.baidu.com/1296beb3-50d9-4276-885f-52645cbb378e.jpeg@w_228%2ch_152"
+            />
+          </a>
+          <a
+            class="ant-upload-list-item-name"
+            href="https://publish-pic-cpu.baidu.com/1296beb3-50d9-4276-885f-52645cbb378e.jpeg@w_228%2ch_152"
+            rel="noopener noreferrer"
+            target="_blank"
+            title="image"
+          >
+            image
+          </a>
+        </span>
+      </div>
+      <i
+        class="anticon anticon-cross"
+        title="Remove file"
+      />
+    </div>
   </div>
 </span>
 `;

components/upload/__tests__/uploadlist.test.js

@@ -324,6 +324,13 @@ describe('Upload List', () => {
         uid: '-11',
         url: 'https://cdn.xxx.com/xx.xx/aaa.png?query=some.query.with.dot',
       },
+      {
+        name: 'image',
+        status: 'done',
+        uid: '-12',
+        url: 'https://publish-pic-cpu.baidu.com/1296beb3-50d9-4276-885f-52645cbb378e.jpeg@w_228%2ch_152',
+        type: 'image',
+      },
     ];
 
     const wrapper = mount(