[Content | Schema] VQA Round 2 updates for the one-to-one/many revamp (…

…#3198)
zesty-io · Feb 12, 2025 · 78cf4c8 · 78cf4c8
1 parent 1b4a85f
commit 78cf4c8
Show file tree

Hide file tree

Showing 14 changed files with 174 additions and 84 deletions.
diff --git a/src/apps/content-editor/src/app/components/Editor/Field/Field.tsx b/src/apps/content-editor/src/app/components/Editor/Field/Field.tsx
@@ -806,6 +806,7 @@ export const Field = ({
               relatedModelZUID={relatedModelZUID}
               relatedFieldZUID={relatedFieldZUID}
               onChange={onChange}
+              fieldLabel={fieldData?.label}
             />
             {/**
             <FieldTypeOneToOne
@@ -877,6 +878,7 @@ export const Field = ({
               relatedModelZUID={relatedModelZUID}
               relatedFieldZUID={relatedFieldZUID}
               onChange={onChange}
+              fieldLabel={fieldData?.label}
             />
             {/**
             <FieldTypeOneToMany

diff --git a/src/apps/content-editor/src/app/views/ItemEdit/ItemEdit.js b/src/apps/content-editor/src/app/views/ItemEdit/ItemEdit.js
@@ -57,6 +57,10 @@ import { FreestyleWrapper } from "./FreestyleWrapper";
 import { Meta } from "./Meta";
 import { FieldError } from "../../components/Editor/FieldError";
 import { AIGeneratorProvider } from "../../../../../../shell/components/withAi/AIGeneratorProvider";
+import {
+  fetchItemPublishings,
+  fetchItems,
+} from "../../../../../../shell/store/content";
 
 const selectItemHeadTags = createSelector(
   (state) => state.headTags,
@@ -416,6 +420,7 @@ export default function ItemEdit() {
     } finally {
       if (isMounted.current) {
         setSaving(false);
+        dispatch(fetchItemPublishings());
       }
     }
   }

diff --git a/...content-editor/src/app/views/ItemEdit/components/ItemEditHeader/ItemEditHeaderActions.tsx b/...content-editor/src/app/views/ItemEdit/components/ItemEditHeader/ItemEditHeaderActions.tsx
@@ -89,7 +89,7 @@ export const ItemEditHeaderActions = ({
   const [isConfirmPublishModalOpen, setIsConfirmPublishModalOpen] =
     useState(false);
   const [relatedItemsToPublish, setRelatedItemsToPublish] = useState<
-    ContentItem[]
+    ContentItemWithDirtyAndPublishing[]
   >([]);
   const [isPublishing, setIsPublishing] = useState(false);
   const item = useSelector(
@@ -184,10 +184,11 @@ export const ItemEditHeaderActions = ({
           if (!!item) {
             const draftVersion = item?.meta?.version;
             const publishedVersion = item?.publishing?.version || 0;
+            const scheduledVersion = item?.scheduling?.version || 0;
 
             if (
-              draftVersion > publishedVersion &&
-              !item?.scheduling?.isScheduled
+              draftVersion > publishedVersion ||
+              scheduledVersion > publishedVersion
             ) {
               return {
                 ...item,
@@ -225,45 +226,60 @@ export const ItemEditHeaderActions = ({
 
   const handlePublish = async () => {
     setIsPublishing(true);
-    // If item is scheduled, delete the scheduled publishing first
-    if (itemState === ITEM_STATES.scheduled) {
-      await deleteItemPublishing({
-        modelZUID,
-        itemZUID,
-        publishingZUID: item?.scheduling?.ZUID,
-      });
-    }
+    try {
+      // Delete scheduled publishings first
+      const deleteScheduledPromises = [
+        // Delete main item's scheduled publishing if it exists
+        itemState === ITEM_STATES.scheduled &&
+          deleteItemPublishing({
+            modelZUID,
+            itemZUID,
+            publishingZUID: item?.scheduling?.ZUID,
+          }),
+        // Delete related items' scheduled publishings if they exist
+        ...relatedItemsToPublish
+          .filter((item) => !!item.scheduling?.ZUID)
+          .map((item) =>
+            deleteItemPublishing({
+              modelZUID: item.meta.contentModelZUID,
+              itemZUID: item.meta.ZUID,
+              publishingZUID: item.scheduling.ZUID,
+            })
+          ),
+      ].filter((item) => !!item);
+
+      await Promise.all(deleteScheduledPromises);
 
-    Promise.allSettled([
-      createPublishing({
-        modelZUID,
-        itemZUID,
-        body: {
-          version: item?.meta.version,
-          publishAt: "now",
-          unpublishAt: "never",
-        },
-      }),
-      relatedItemsToPublish.map((item) => {
-        return createPublishing({
-          modelZUID: item.meta.contentModelZUID,
-          itemZUID: item.meta.ZUID,
+      // Proceed with publishing
+      await Promise.allSettled([
+        createPublishing({
+          modelZUID,
+          itemZUID,
           body: {
-            version: item.meta.version,
+            version: item?.meta.version,
             publishAt: "now",
             unpublishAt: "never",
           },
-        });
-      }),
-    ])
-      .then(() => {
-        // Retain non rtk-query fetch of item publishing for legacy code
-        dispatch(fetchItemPublishings());
-      })
-      .finally(() => {
-        setIsPublishing(false);
-        setIsConfirmPublishModalOpen(false);
-      });
+        }),
+        ...relatedItemsToPublish.map((item) =>
+          createPublishing({
+            modelZUID: item.meta.contentModelZUID,
+            itemZUID: item.meta.ZUID,
+            body: {
+              version: item.meta.version,
+              publishAt: "now",
+              unpublishAt: "never",
+            },
+          })
+        ),
+      ]);
+
+      // Retain non rtk-query fetch of item publishing for legacy code
+      dispatch(fetchItemPublishings());
+    } finally {
+      setIsPublishing(false);
+      setIsConfirmPublishModalOpen(false);
+    }
   };
 
   const handleUnpublish = async () => {
@@ -649,15 +665,15 @@ export const ItemEditHeaderActions = ({
               <Typography variant="body2" fontWeight={600}>
                 Also publish related items
               </Typography>
-              <Typography variant="body3">
+              <Typography variant="body3" color="text.secondary">
                 This will publish all items selected in the list below
               </Typography>
               <List disablePadding sx={{ mt: 1 }}>
                 {unpublishedRelatedItems.map((item, index) => (
                   <UnpublishedRelatedItem
                     key={item.meta.ZUID}
                     contentItem={item}
-                    divider={unpublishedRelatedItems?.length > index + 1}
+                    divider
                     selected={relatedItemsToPublish.some(
                       (i) => i.meta.ZUID === item.meta.ZUID
                     )}

diff --git a/...ontent-editor/src/app/views/ItemEdit/components/ItemEditHeader/UnpublishedRelatedItem.tsx b/...ontent-editor/src/app/views/ItemEdit/components/ItemEditHeader/UnpublishedRelatedItem.tsx
@@ -23,7 +23,7 @@ type UnpublishedRelatedItemProps = {
   contentItem: ContentItemWithRelatedZUIDs;
   onChange: (payload: {
     action: "add" | "remove";
-    contentItem: ContentItem;
+    contentItem: ContentItemWithDirtyAndPublishing;
   }) => void;
   selected: boolean;
   divider?: boolean;
@@ -79,15 +79,27 @@ export const UnpublishedRelatedItem = ({
 
   return (
     <ListItem disableGutters dense divider={divider}>
-      <ListItemIcon>
+      <ListItemIcon
+        sx={{
+          minWidth: 0,
+        }}
+      >
         <Checkbox
           checked={selected}
+          disableRipple
           onChange={(evt) =>
             onChange({
               contentItem,
               action: evt.target.checked ? "add" : "remove",
             })
           }
+          sx={{
+            pl: 0,
+            pr: 2,
+            "&:hover": {
+              bgcolor: "transparent",
+            },
+          }}
         />
       </ListItemIcon>
       {!!imageFieldName &&

diff --git a/src/apps/schema/src/app/components/AddFieldModal/DefaultValue.tsx b/src/apps/schema/src/app/components/AddFieldModal/DefaultValue.tsx
@@ -28,6 +28,7 @@ type DefaultValueProps = {
   };
   options: FieldSettingsOptions[];
   currency?: string;
+  fieldLabel: string;
 };
 
 export const DefaultValue = ({
@@ -41,6 +42,7 @@ export const DefaultValue = ({
   relationshipFields,
   options,
   currency,
+  fieldLabel,
 }: DefaultValueProps) => {
   return (
     <Box>
@@ -91,6 +93,7 @@ export const DefaultValue = ({
               relationshipFields={relationshipFields}
               options={options}
               currency={currency}
+              fieldLabel={fieldLabel}
             />
             <FormHelperText>
               <Box display="flex" justifyContent="space-between">

diff --git a/src/apps/schema/src/app/components/AddFieldModal/DefaultValueInput.tsx b/src/apps/schema/src/app/components/AddFieldModal/DefaultValueInput.tsx
@@ -56,6 +56,7 @@ type DefaultValueInputProps = {
   };
   options: FieldSettingsOptions[];
   currency?: string;
+  fieldLabel: string;
 };
 
 export const DefaultValueInput = ({
@@ -67,6 +68,7 @@ export const DefaultValueInput = ({
   relationshipFields: { relatedModelZUID, relatedFieldZUID },
   options,
   currency,
+  fieldLabel,
 }: DefaultValueInputProps) => {
   const [imageModal, setImageModal] = useState(null);
   const dispatch = useDispatch();
@@ -308,6 +310,7 @@ export const DefaultValueInput = ({
           relatedModelZUID={relatedModelZUID}
           relatedFieldZUID={relatedFieldZUID}
           onChange={(value) => onChange(value)}
+          fieldLabel={fieldLabel}
         />
       );
     case "one_to_many":
@@ -319,6 +322,7 @@ export const DefaultValueInput = ({
           relatedModelZUID={relatedModelZUID}
           relatedFieldZUID={relatedFieldZUID}
           onChange={(value) => onChange(value)}
+          fieldLabel={fieldLabel}
         />
       );
     case "link":

diff --git a/src/apps/schema/src/app/components/AddFieldModal/views/Rules.tsx b/src/apps/schema/src/app/components/AddFieldModal/views/Rules.tsx
@@ -67,6 +67,7 @@ export const Rules = ({
         }}
         options={formData["options"] as FieldSettingsOptions[]}
         currency={(formData["currency"] as string) || "USD"}
+        fieldLabel={formData["label"] as string}
       />
 
       {type === "images" && (

diff --git a/src/shell/components/ConfirmPublishModal.tsx b/src/shell/components/ConfirmPublishModal.tsx
@@ -12,7 +12,6 @@ import {
 } from "@mui/material";
 import CloudUploadRoundedIcon from "@mui/icons-material/CloudUploadRounded";
 import { LoadingButton } from "@mui/lab";
-import pluralizeWord from "../../utility/pluralizeWord";
 
 export type ConfirmPublishModal = {
   contentTitle: string;
@@ -90,10 +89,7 @@ export const ConfirmPublishModal = ({
           onClick={onConfirm}
           data-cy="ConfirmPublishButton"
         >
-          Publish{" "}
-          {!!altText
-            ? pluralizeWord(altText, relatedItemsToPublishCount)
-            : pluralizeWord("Item", relatedItemsToPublishCount)}{" "}
+          Publish {altText || !!relatedItemsToPublishCount ? "Items " : "Item "}
           {!!relatedItemsToPublishCount &&
             `(${relatedItemsToPublishCount + 1})`}
         </LoadingButton>

diff --git a/src/shell/components/NoSearchResults/index.tsx b/src/shell/components/NoSearchResults/index.tsx
@@ -18,6 +18,7 @@ type Props = {
   hideBackButton?: boolean;
   onSearchAgain?: () => void;
   imageHeight?: number;
+  isFilter?: boolean;
 };
 
 export const NoSearchResults: FC<Props> = ({
@@ -26,6 +27,7 @@ export const NoSearchResults: FC<Props> = ({
   ignoreFilters,
   hideBackButton,
   imageHeight = 200,
+  isFilter,
 }) => {
   const history = useHistory();
   const [params, setParams] = useParams();
@@ -68,7 +70,7 @@ export const NoSearchResults: FC<Props> = ({
               "No results that matched your filters could be found"
             ) : (
               <>
-                Your search
+                Your {isFilter ? "filter" : "search"}
                 <Box component="strong" fontWeight="bold">
                   {" "}
                   "{query}"{" "}

diff --git a/src/shell/components/RelationalFieldBase/ActiveItem/ActiveItemLoading.tsx b/src/shell/components/RelationalFieldBase/ActiveItem/ActiveItemLoading.tsx
@@ -10,7 +10,7 @@ export const ActiveItemLoading = ({ draggable }: ActiveItemLoadingProps) => {
       direction="row"
       sx={{
         bgcolor: "background.paper",
-        height: 64,
+        height: 62,
         width: "100%",
         border: 1,
         borderColor: "border",
@@ -20,7 +20,7 @@ export const ActiveItemLoading = ({ draggable }: ActiveItemLoadingProps) => {
     >
       <Stack direction="row" alignItems="center" flexGrow={1}>
         {draggable && (
-          <IconButton size="xsmall" sx={{ cursor: "grab", mx: 0.5 }} disabled>
+          <IconButton size="xsmall" sx={{ cursor: "grab", mx: 0.25 }} disabled>
             <DragIndicatorRounded fontSize="small" />
           </IconButton>
         )}