fix(admin-ui): hide categories in products behind feature flag (#3467)

.changeset/tough-panthers-listen.md

@@ -0,0 +1,5 @@
+---
+"@medusajs/admin-ui": patch
+---
+
+fix(admin-ui): hide categories in products behind feature flag

packages/admin-ui/ui/src/domain/products/components/organize-form/index.tsx

@@ -27,8 +27,11 @@ type Props = {
 
 const OrganizeForm = ({ form }: Props) => {
   const { control, path, setValue } = form
-  const { productTypeOptions, collectionOptions, categoriesOptions } =
-    useOrganizeData()
+  const {
+    productTypeOptions,
+    collectionOptions,
+    categoriesOptions = [],
+  } = useOrganizeData()
 
   const { isFeatureEnabled } = useFeatureFlag()
 
@@ -90,7 +93,7 @@ const OrganizeForm = ({ form }: Props) => {
             name={path("categories")}
             control={control}
             render={({ field: { value, onChange } }) => {
-              if (!categoriesOptions) {
+              if (categoriesOptions.length === 0) {
                 return null
               }
 

packages/admin-ui/ui/src/domain/products/components/organize-form/use-organize-data.tsx

@@ -8,17 +8,24 @@ import {
 
 import { NestedMultiselectOption } from "../../../categories/components/multiselect"
 import { transformCategoryToNestedFormOptions } from "../../../categories/utils/transform-response"
+import {
+  useFeatureFlag,
+  FeatureFlag,
+} from "../../../../providers/feature-flag-provider"
 
 const useOrganizeData = () => {
+  const { isFeatureEnabled } = useFeatureFlag()
   const { product_types } = useAdminProductTypes(undefined, {
     staleTime: 0,
     refetchOnWindowFocus: true,
   })
   const { collections } = useAdminCollections()
-  const { product_categories: categories } = useAdminProductCategories({
-    parent_category_id: "null",
-    include_descendants_tree: true,
-  })
+  const { product_categories: categories = [] } =
+    isFeatureEnabled(FeatureFlag.PRODUCT_CATEGORIES) &&
+    useAdminProductCategories({
+      parent_category_id: "null",
+      include_descendants_tree: true,
+    })
 
   const productTypeOptions = useMemo(() => {
     return (

packages/admin-ui/ui/src/domain/products/edit/sections/general/general-modal.tsx

@@ -141,7 +141,7 @@ const getDefaultValues = (product: Product): GeneralFormWrapper => {
         ? { label: product.type.value, value: product.type.id }
         : null,
       tags: product.tags ? product.tags.map((t) => t.value) : null,
-      categories: product.categories.map((c) => c.id),
+      categories: product?.categories?.map((c) => c.id),
     },
     discountable: {
       value: product.discountable,