add pending marker

client/scss/_asset-preview.scss

@@ -1,3 +1,7 @@
+.asset-preview {
+  position: relative;
+}
+
 .asset-preview__image {
   width  : 100%;
   padding: 0;

client/scss/_claim-pending.scss

@@ -0,0 +1,12 @@
+.claim-pending {
+  display: inline-block;
+  position: absolute;
+  top: 10px;
+  left: 10px;
+  padding: 5px;
+  border-radius: 5px;
+  border: 2px solid red;
+  color: red;
+  font-weight: bold;
+  background-color: white;
+}

client/scss/all.scss

@@ -18,6 +18,7 @@
 @import '~scss/_button';
 @import '~scss/_button-primary';
 @import '~scss/_button-secondary';
+@import '~scss/_claim-pending';
 @import '~scss/_click-to-copy';
 @import '~scss/_form-feedback';
 @import '~scss/_horizontal-split';

client/src/components/AssetPreview/index.jsx

@@ -2,8 +2,14 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import createCanonicalLink from '../../../../utils/createCanonicalLink';
 
+const ClaimPending = () => {
+  return (
+    <div className='claim-pending'>PENDING</div>
+  );
+};
+
 const AssetPreview = ({ defaultThumbnail, claimData }) => {
-  const {name, fileExt, contentType, thumbnail, title} = claimData;
+  const {name, fileExt, contentType, thumbnail, title, pending} = claimData;
   const showUrl = createCanonicalLink({asset: {...claimData}});
   const embedUrl = `${showUrl}.${fileExt}`;
   switch (contentType) {
@@ -27,6 +33,7 @@ const AssetPreview = ({ defaultThumbnail, claimData }) => {
       return (
         <Link to={showUrl} className='asset-preview'>
           <div>
+<<<<<<< HEAD
             <div className='asset-preview__play-wrapper'>
               <img
                 className={'asset-preview__video'}
@@ -36,6 +43,15 @@ const AssetPreview = ({ defaultThumbnail, claimData }) => {
               <div className='asset-preview__play-overlay'></div>
             </div>
             <h3 className='asset-preview__title'>{title}</h3>
+=======
+            {pending && <ClaimPending/>}
+            <img
+              className={'asset-preview-video'}
+              src={thumbnail || defaultThumbnail}
+              alt={name}
+            />
+            <h3 className='list-title'>{title}</h3>
+>>>>>>> add pending marker
           </div>
         </Link>
       );