Refactor Markdown component to include paragraph after image (#2798)

web/app/components/base/markdown.tsx

@@ -162,14 +162,17 @@ export function Markdown(props: { content: string; className?: string }) {
               const image = node.children[0]
 
               return (
-                // eslint-disable-next-line @next/next/no-img-element
-                <img
-                  src={image.properties.src}
-                  width={250}
-                  height={250}
-                  className="max-w-full h-auto align-middle border-none rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 ease-in-out mt-2 mb-2"
-                  alt={image.properties.alt}
-                />
+                <>
+                  {/* eslint-disable-next-line @next/next/no-img-element */}
+                  <img
+                    src={image.properties.src}
+                    width={250}
+                    height={250}
+                    className="max-w-full h-auto align-middle border-none rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 ease-in-out mt-2 mb-2"
+                    alt={image.properties.alt}
+                  />
+                  <p>{paragraph.children.slice(1)}</p>
+                </>
               )
             }
             return <p>{paragraph.children}</p>