Merge pull request #848 from research-software-directory/841-card-wit…

…hout-image fix: support software card without image
research-software-directory · Apr 19, 2023 · 6384d30 · 6384d30
2 parents afeeb64 + a14eeaa
commit 6384d30
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 10 deletions.
diff --git a/frontend/components/admin/software-highlights/apiSoftwareHighlights.tsx b/frontend/components/admin/software-highlights/apiSoftwareHighlights.tsx
@@ -10,7 +10,6 @@ import {SoftwareListItem} from '~/types/SoftwareTypes'
 import {extractCountFromHeader} from '~/utils/extractCountFromHeader'
 import {createJsonHeaders, extractReturnMessage, getBaseUrl} from '~/utils/fetchHelpers'
 import logger from '~/utils/logger'
-import {paginationUrlParams} from '~/utils/postgrestUrl'
 import usePaginationWithSearch from '~/utils/usePaginationWithSearch'
 
 export type SoftwareHighlight = SoftwareListItem & {

diff --git a/frontend/components/software/overview/SearchInput.tsx b/frontend/components/software/overview/SearchInput.tsx
@@ -18,7 +18,7 @@ type SearchInputProps = {
 export default function SearchInput({
   placeholder,
   onSearch,
-  delay = 400,
+  delay = 700,
   defaultValue = ''
 }: SearchInputProps) {
   const [state, setState] = useState({

diff --git a/frontend/components/software/overview/SoftwareCard.tsx b/frontend/components/software/overview/SoftwareCard.tsx
@@ -21,19 +21,22 @@ export const SoftwareCard = ({item, direction}:SoftwareCardProps) => {
   const isHorizontal = !!direction
 
   return (
-    <Link href={'/software/'+item.slug} key={item.id} className="hover:text-inherit">
+    <Link href={`/software/${item.slug}`} key={item.id} className="hover:text-inherit">
       <div className={`flex-shrink-0 transition bg-white shadow-md hover:shadow-lg rounded-lg hover:cursor-pointer h-full select-none ${isHorizontal ? 'flex flex-col sm:flex-row w-[20rem] sm:w-full' : 'flex-col'}`} >
         {/* Cover image */}
-        <img
-          className={`
-            object-cover
-            ${isHorizontal
-              ? 'w-full rounded-tr-lg rounded-tl-lg   sm:rounded-bl-lg sm:rounded-tl-lg sm:rounded-tr-none sm:w-[20rem] sm:h-[20rem]'
-              : 'w-full rounded-tr-lg rounded-tl-lg'
-            }`}
+        {
+          item.image_id &&
+          <img
+            className={`
+              object-cover
+              ${isHorizontal
+                ? 'w-full rounded-tr-lg rounded-tl-lg   sm:rounded-bl-lg sm:rounded-tl-lg sm:rounded-tr-none sm:w-[20rem] sm:h-[20rem]'
+                : 'w-full rounded-tr-lg rounded-tl-lg'
+              }`}
           src={`${getImageUrl(item.image_id) ?? ''}`}
           alt={`Cover image for ${item.brand_name}`}
           />
+        }
 
         {/* Card content */}
         <div className={`flex flex-col p-4 ${isHorizontal ? 'max-w-[350px]' : ''}`}>