Show "Open" post response if there is one (#1305)

Author: mattwoberts

public/assets/images/heroicons-lightbulb.svg

@@ -4,6 +4,7 @@ import { Icon, Markdown } from "@fider/components"
 import HeroIconDuplicate from "@fider/assets/images/heroicons-duplicate.svg"
 import HeroIconCheck from "@fider/assets/images/heroicons-check-circle.svg"
 import HeroIconSparkles from "@fider/assets/images/heroicons-sparkles-outline.svg"
+import HeroIconLightBulb from "@fider/assets/images/heroicons-lightbulb.svg"
 import HeroIconThumbsUp from "@fider/assets/images/heroicons-thumbsup.svg"
 import HeroIconThumbsDown from "@fider/assets/images/heroicons-thumbsdown.svg"
 import { HStack, VStack } from "./layout"
@@ -18,7 +19,7 @@ interface PostResponseProps {
 export const ResponseDetails = (props: PostResponseProps): JSX.Element | null => {
   const status = PostStatus.Get(props.status)
 
-  if (!props.response || status === PostStatus.Open) {
+  if (!props.response) {
     return null
   }
 
@@ -53,6 +54,8 @@ const getLozengeProps = (status: PostStatus): { icon: SpriteSymbol; bg: string;
       return { icon: HeroIconCheck, bg: "bg-green-300", color: "text-green-800", border: "border-green-500" }
     case PostStatus.Planned:
       return { icon: HeroIconThumbsUp, bg: "bg-blue-100", color: "text-blue-700", border: "border-blue-400" }
+    case PostStatus.Open:
+      return { icon: HeroIconLightBulb, bg: "bg-blue-100", color: "text-blue-700", border: "border-blue-400" }
     default:
       return { icon: HeroIconSparkles, bg: "bg-green-100", color: "text-green-700", border: "border-green-400" }
   }
@@ -62,10 +65,6 @@ export const ResponseLozenge = (props: PostResponseProps): JSX.Element | null =>
   const status = PostStatus.Get(props.status)
   const { icon, bg, color, border } = getLozengeProps(status)
 
-  if (status === PostStatus.Open) {
-    return <div />
-  }
-
   return (
     <div>
       <HStack align="start" className={`${color} ${bg} border ${border} rounded-full p-1 px-3`}>