Release Newsletter form (#6712)

Author: hasparus

packages/web/docs/package.json

@@ -16,7 +16,7 @@
     "@radix-ui/react-icons": "1.3.2",
     "@radix-ui/react-tabs": "1.1.2",
     "@radix-ui/react-tooltip": "1.1.6",
-    "@theguild/components": "9.7.0",
+    "@theguild/components": "9.7.1",
     "date-fns": "4.1.0",
     "next": "15.2.4",
     "react": "19.0.0",

packages/web/docs/src/app/blog/components/newsletter-form-card.tsx

@@ -97,6 +97,11 @@ export function NewsletterFormCard(props: React.HTMLAttributes<HTMLElement>) {
                 : undefined
           }
           message={state?.message}
+          onChange={() => {
+            if (state?.status === 'success') {
+              setState(undefined);
+            }
+          }}
         />
         {!state || state.status === 'error' ? (
           <CallToAction type="submit" variant="secondary-inverted" className="mt-2 !w-full">

packages/web/docs/src/app/blog/components/posts-by-tag/latest-posts.tsx

@@ -1,27 +1,8 @@
-'use client';
-
-// ^ todo: this "use client" is temporary until we test the newsletter card on prod
-import { useEffect, useState } from 'react';
 import { Heading } from '@theguild/components';
 import { BlogPostFile } from '../../blog-types';
 import { BlogCard } from '../blog-card';
 import { prettyPrintTag } from '../pretty-print-tag';
 
-// There's a CORS error from deploy previews and I'd rather test it before giving it to users.
-function useTemporaryFeatureFlag() {
-  const [visible, setVisible] = useState(false);
-
-  useEffect(() => {
-    const searchParams = new URLSearchParams(window.location.search);
-    const flag = searchParams.get('newsletter-form-card');
-    if (flag === '1') {
-      setVisible(true);
-    }
-  }, []);
-
-  return visible;
-}
-
 export function LatestPosts({
   posts,
   tag,
@@ -31,11 +12,6 @@ export function LatestPosts({
   tag: string | null;
   children?: React.ReactNode;
 }) {
-  // TODO: remove this once we test the newsletter card on prod
-  if (!useTemporaryFeatureFlag()) {
-    children = undefined;
-  }
-
   // it needs to be 12, because we have 2/3/4 column layouts
   const itemsInFirstSection = children ? 11 : 12;
   const firstTwelve = posts.slice(0, itemsInFirstSection);