fix: Fix listing preview issues

Fix listing preview screenshots Fix display of screenshots on listing preview Fix license on listing preview Fix listing preview websites Fix listing preview source code section
canonical · Feb 12, 2025 · 018d45d · 018d45d
1 parent c65713e
commit 018d45d
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 19 deletions.
diff --git a/static/js/publisher/pages/Listing/ListingForm/ListingForm.tsx b/static/js/publisher/pages/Listing/ListingForm/ListingForm.tsx
@@ -179,7 +179,12 @@ function ListingForm({ data, refetch }: Props): JSX.Element {
         </Strip>
       </form>
       {snapId && (
-        <PreviewForm snapName={snapId} getValues={getValues} watch={watch} />
+        <PreviewForm
+          snapName={snapId}
+          getValues={getValues}
+          watch={watch}
+          data={data}
+        />
       )}
     </>
   );

diff --git a/static/js/publisher/pages/Listing/PreviewForm/PreviewForm.tsx b/static/js/publisher/pages/Listing/PreviewForm/PreviewForm.tsx
@@ -5,6 +5,9 @@ type Props = {
   snapName: string;
   getValues: UseFormGetValues<FieldValues>;
   watch: UseFormWatch<FieldValues>;
+  data: {
+    categories: { name: string; slug: string }[];
+  };
 };
 
 type ListingData = {
@@ -25,13 +28,15 @@ type ListingData = {
   }>;
   summary: string;
   description: string;
+  video: { type: string; status: string; url: string }[] | null;
+  license: string;
 };
 
-function PreviewForm({ snapName, getValues, watch }: Props) {
+function PreviewForm({ snapName, getValues, watch, data }: Props) {
   const watchWebsites = watch("websites");
   const watchContacts = watch("contacts");
   const watchDonations = watch("donations");
-  const watchSource = watch("source");
+  const watchSource = watch("source_code");
   const watchIssues = watch("issues");
 
   const listingData: ListingData = {
@@ -69,6 +74,8 @@ function PreviewForm({ snapName, getValues, watch }: Props) {
     ],
     summary: getValues("summary"),
     description: getValues("description"),
+    video: null,
+    license: "",
   };
 
   const screenshotUrls = getValues("screenshot_urls");
@@ -87,25 +94,36 @@ function PreviewForm({ snapName, getValues, watch }: Props) {
   const secondaryCategory = getValues("secondary_category");
 
   if (primaryCategory) {
-    listingData.categories.push({
-      name: primaryCategory,
-      slug: primaryCategory,
-    });
+    const primaryCategoryData = data.categories.find(
+      (cat) => cat.slug === primaryCategory,
+    );
+
+    if (primaryCategoryData) {
+      listingData.categories.push(primaryCategoryData);
+    }
   }
 
   if (secondaryCategory) {
-    listingData.categories.push({
-      name: secondaryCategory,
-      slug: secondaryCategory,
-    });
+    const secondaryCategoryData = data.categories.find(
+      (cat) => cat.slug === secondaryCategory,
+    );
+
+    if (secondaryCategoryData) {
+      listingData.categories.push(secondaryCategoryData);
+    }
   }
 
-  window.localStorage.setItem(
-    `${snapName}-initial`,
-    JSON.stringify(listingData),
-  );
+  const videoUrl = getValues("video_urls");
+
+  if (videoUrl) {
+    listingData.video = [{ type: "video", status: "uploaded", url: videoUrl }];
+  }
 
-  window.localStorage.setItem(snapName, JSON.stringify(listingData));
+  listingData.license = getValues("license");
+
+  if (getValues("primary_website")) {
+    listingData.links.website.unshift(getValues("primary_website"));
+  }
 
   return (
     <Form

diff --git a/templates/store/snap-details.html b/templates/store/snap-details.html
@@ -321,13 +321,11 @@ <h5 class="p-notification__title">Error</h5>
           Raven.captureException(e);
         }
 
-        {% if not is_preview %}
         try {
           snapcraft.public.storeDetails.screenshots('#js-snap-screenshots');
         } catch(e) {
           Raven.captureException(e);
         }
-        {% endif %}
 
         try {
           snapcraft.public.storeDetails.videos('.js-video-slide');

diff --git a/webapp/publisher/snaps/listing_views.py b/webapp/publisher/snaps/listing_views.py
@@ -299,7 +299,9 @@ def post_preview(snap_name):
     icon = helpers.get_icon(context["images"])
     context["screenshots"] = filter_screenshots(context["images"])
     context["icon_url"] = icon
-    context["video"] = get_video(context["images"])
+
+    if context["video"]:
+        context["video"] = get_video(context["video"])
 
     # Channel map
     context["channel_map"] = []