fix: intervention layout, empty tags

tolocar-project · Sep 21, 2023 · 6b1bf96 · 6b1bf96
1 parent 722573c
commit 6b1bf96
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 5 deletions.
diff --git a/src/components/InterventionsListItem.tsx b/src/components/InterventionsListItem.tsx
@@ -28,7 +28,7 @@ const InterventionsListItem: React.FC<Props> = ({
       </div>
       <a
         href={href}
-        className="group hover:translate-x-4 transition-transform mt-20"
+        className="group w-full hover:translate-x-4 transition-transform mt-20"
       >
         <div className="flex flex-col lg:flex-row overflow-hidden z-10 gap-8">
           {image && (

diff --git a/src/components/Tag.tsx b/src/components/Tag.tsx
@@ -1,11 +1,15 @@
 import React from "react";
 
-const Tag = ({ title }: { title: string }) => {
-  return (
+interface Props {
+  title: string;
+}
+
+const Tag: React.FC<Props> = ({ title }) => {
+  return title ? (
     <span className="inline-block bg-tolo-green rounded-full px-4 py-1 text-lg leading-6 font-medium text-white mr-2 mb-2">
       {title}
     </span>
-  );
+  ) : null;
 };
 
 export default Tag;
diff --git a/src/util/ContentTransformer.ts b/src/util/ContentTransformer.ts
@@ -84,7 +84,7 @@ export function trimAndSortInterventions(
     ? rawSortedInterventionsContentWithoutIndex.slice(0, count)
     : rawSortedInterventionsContentWithoutIndex;
 
-  return trimmedInterventions;
+  return trimmedInterventions.filter(Boolean);
 }
 
 export function transformInterventionsToPoiData(