yext · colton-demetriou · Nov 6, 2025 · Nov 5, 2025 · Nov 5, 2025 · Nov 5, 2025
diff --git a/packages/visual-editor/locales/cs/visual-editor.json b/packages/visual-editor/locales/cs/visual-editor.json
diff --git a/packages/visual-editor/locales/da/visual-editor.json b/packages/visual-editor/locales/da/visual-editor.json
diff --git a/packages/visual-editor/locales/de/visual-editor.json b/packages/visual-editor/locales/de/visual-editor.json
diff --git a/packages/visual-editor/locales/en-GB/visual-editor.json b/packages/visual-editor/locales/en-GB/visual-editor.json
diff --git a/packages/visual-editor/locales/en/visual-editor.json b/packages/visual-editor/locales/en/visual-editor.json
@@ -520,6 +520,8 @@
   "refineYourSearch": "Refine Your Search",
   "reopenDate": "Reopen Date",
   "responseFrom": "Response from {{businessName}}",
+  "reviewsEmptyStateNoReviews": "{{entityType}} has no first party reviews",
+  "reviewsEmptyStateSectionHidden": "Section hidden for this {{entityType}}",
   "saturday": "Saturday",
   "schemaMarkup": "Schema Markup",
   "search": "Search",

diff --git a/packages/visual-editor/locales/es/visual-editor.json b/packages/visual-editor/locales/es/visual-editor.json
diff --git a/packages/visual-editor/locales/et/visual-editor.json b/packages/visual-editor/locales/et/visual-editor.json
diff --git a/packages/visual-editor/locales/fi/visual-editor.json b/packages/visual-editor/locales/fi/visual-editor.json
diff --git a/packages/visual-editor/locales/fr/visual-editor.json b/packages/visual-editor/locales/fr/visual-editor.json
diff --git a/packages/visual-editor/locales/hr/visual-editor.json b/packages/visual-editor/locales/hr/visual-editor.json
diff --git a/packages/visual-editor/locales/hu/visual-editor.json b/packages/visual-editor/locales/hu/visual-editor.json
diff --git a/packages/visual-editor/locales/it/visual-editor.json b/packages/visual-editor/locales/it/visual-editor.json
diff --git a/packages/visual-editor/locales/ja/visual-editor.json b/packages/visual-editor/locales/ja/visual-editor.json
diff --git a/packages/visual-editor/locales/lt/visual-editor.json b/packages/visual-editor/locales/lt/visual-editor.json
diff --git a/packages/visual-editor/locales/lv/visual-editor.json b/packages/visual-editor/locales/lv/visual-editor.json
diff --git a/packages/visual-editor/locales/nb/visual-editor.json b/packages/visual-editor/locales/nb/visual-editor.json
diff --git a/packages/visual-editor/locales/nl/visual-editor.json b/packages/visual-editor/locales/nl/visual-editor.json
diff --git a/packages/visual-editor/locales/pl/visual-editor.json b/packages/visual-editor/locales/pl/visual-editor.json
diff --git a/packages/visual-editor/locales/pt/visual-editor.json b/packages/visual-editor/locales/pt/visual-editor.json
diff --git a/packages/visual-editor/locales/ro/visual-editor.json b/packages/visual-editor/locales/ro/visual-editor.json
diff --git a/packages/visual-editor/locales/sk/visual-editor.json b/packages/visual-editor/locales/sk/visual-editor.json
diff --git a/packages/visual-editor/locales/sv/visual-editor.json b/packages/visual-editor/locales/sv/visual-editor.json
diff --git a/packages/visual-editor/locales/tr/visual-editor.json b/packages/visual-editor/locales/tr/visual-editor.json
diff --git a/packages/visual-editor/locales/zh-TW/visual-editor.json b/packages/visual-editor/locales/zh-TW/visual-editor.json
diff --git a/packages/visual-editor/locales/zh/visual-editor.json b/packages/visual-editor/locales/zh/visual-editor.json
diff --git a/packages/visual-editor/src/components/pageSections/ReviewsSection.tsx b/packages/visual-editor/src/components/pageSections/ReviewsSection.tsx
@@ -1,7 +1,7 @@
 import { useTranslation } from "react-i18next";
 import { FaArrowLeft, FaArrowRight, FaChevronDown } from "react-icons/fa";
 import { useQuery } from "@tanstack/react-query";
-import { ComponentConfig, Fields } from "@measured/puck";
+import { ComponentConfig, Fields, PuckComponent } from "@measured/puck";
 import * as React from "react";
 import {
   backgroundColors,
@@ -20,8 +20,11 @@ import {
   useBackground,
   useDocument,
   YextField,
+  pt,
 } from "@yext/visual-editor";
+import { StarOff } from "lucide-react";
 import { AnalyticsScopeProvider, useAnalytics } from "@yext/pages-components";
+import { useTemplateMetadata } from "../../internal/hooks/useMessageReceivers";
 
 const REVIEWS_PER_PAGE = 5;
 const DATE_FORMAT: Omit<Intl.DateTimeFormatOptions, "timeZone"> = {
@@ -30,6 +33,46 @@ const DATE_FORMAT: Omit<Intl.DateTimeFormatOptions, "timeZone"> = {
   year: "numeric",
 };
 
+const ReviewsEmptyState: React.FC<{ backgroundColor: BackgroundStyle }> = ({
+  backgroundColor,
+}) => {
+  const templateMetadata = useTemplateMetadata();
+  const entityTypeDisplayName = templateMetadata?.entityTypeDisplayName;
+
+  return (
+    <PageSection background={backgroundColor}>
+      <div className="relative h-[300px] w-full bg-gray-100 rounded-lg border border-gray-200 flex flex-col items-center justify-center py-8 gap-2.5">
+        <StarOff className="w-12 h-12 text-gray-400" />
+        <div className="flex flex-col items-center gap-0">
+          <Body variant="base" className="text-gray-500 font-medium">
+            {pt(
+              "reviewsEmptyStateSectionHidden",
+              "Section hidden for this {{entityType}}",
+              {
+                entityType: entityTypeDisplayName
+                  ? entityTypeDisplayName.toLowerCase()
+                  : "page",
+              }
+            )}
+          </Body>
+          <Body variant="base" className="text-gray-500 font-normal">
+            {pt(
+              "reviewsEmptyStateNoReviews",
+              "{{entityType}} has no first party reviews",
+              {
+                entityType: entityTypeDisplayName
+                  ? entityTypeDisplayName.charAt(0).toUpperCase() +
+                    entityTypeDisplayName.slice(1)
+                  : "Entity",
+              }
+            )}
+          </Body>
+        </div>
+      </div>
+    </PageSection>
+  );
+};
+
 export type ReviewsSectionProps = {
   backgroundColor: BackgroundStyle;
   analytics: {
@@ -56,11 +99,13 @@ const reviewsFields: Fields<ReviewsSectionProps> = {
   }),
 };
 
-const ReviewsSectionInternal: React.FC<ReviewsSectionProps> = (
-  props: ReviewsSectionProps
-) => {
+const ReviewsSectionInternal: PuckComponent<ReviewsSectionProps> = ({
+  backgroundColor,
+  puck,
+}) => {
   const streamDocument = useDocument();
   const apiKey = streamDocument?._env?.YEXT_VISUAL_EDITOR_REVIEWS_APP_API_KEY;
+
   if (!apiKey) {
     console.warn(
       "Missing YEXT_VISUAL_EDITOR_REVIEWS_APP_API_KEY, unable to access reviews content endpoint."
@@ -76,11 +121,7 @@ const ReviewsSectionInternal: React.FC<ReviewsSectionProps> = (
     {}
   );
 
-  const {
-    data: reviews,
-    status: reviewsStatus,
-    isLoading,
-  } = useQuery({
+  const { data: reviews, isLoading } = useQuery({
     queryKey: [
       "reviews",
       entityId,
@@ -111,7 +152,11 @@ const ReviewsSectionInternal: React.FC<ReviewsSectionProps> = (
 
   const { averageRating, reviewCount } = getAggregateRating(streamDocument);
 
-  if (reviewsStatus !== "success" || (!isLoading && reviewCount === 0)) {
+  // Show empty state in editor mode when there are no results
+  if (!isLoading && reviewCount === 0) {
+    if (puck?.isEditing) {
+      return <ReviewsEmptyState backgroundColor={backgroundColor} />;
+    }
     return <></>;
   }
 
@@ -128,10 +173,7 @@ const ReviewsSectionInternal: React.FC<ReviewsSectionProps> = (
   };
 
   return (
-    <PageSection
-      className="flex flex-col gap-12"
-      background={props.backgroundColor}
-    >
+    <PageSection className="flex flex-col gap-12" background={backgroundColor}>
       <ReviewsHeader {...headerProps} />
       {reviews && (
         <>