fix: RT-263 transformation of assets between html and json and vice-versa

Author: Jayesh2812

src/fromRedactor.tsx

@@ -497,6 +497,9 @@ export const fromRedactor = (el: any, options?:IHtmlToJsonOptions) : IAnyObject
         ]
       )
     }
+    if(el.parentNode?.nodeName === 'FIGURE'){
+      return children
+    }
   }
 
   if (ELEMENT_TAGS[nodeName]) {
@@ -874,7 +877,7 @@ const getImageAttributes = (elementAttrs: any, childAttrs: any, extraAttrs: any)
         ...extraAttrs
       },
       "asset-caption": extraAttrs["asset-caption"],
-      "link": extraAttrs.link
+      "link": extraAttrs.link ?? extraAttrs.anchorLink
     }
   }
   if (elementAttrs?.attrs?.["redactor-attributes"]?.link) {
@@ -891,11 +894,16 @@ const getImageAttributes = (elementAttrs: any, childAttrs: any, extraAttrs: any)
 
 const getReferenceAttributes = ({elementAttrs, newChildren, extraAttrs, sizeAttrs} : any) => {
 
-  let { style } = elementAttrs.attrs;
-  
   extraAttrs['asset-caption'] = extraAttrs['caption'];
+  if(newChildren[0].attrs.width){
+    delete sizeAttrs.width
+  }
+  const style  = {}
+  if (elementAttrs?.attrs?.style?.['text-align']) {
+    style['text-align'] = elementAttrs?.attrs?.style?.['text-align']
+  }
 
-  const childAttrs = { ...newChildren[0].attrs, ...sizeAttrs, style: { 'text-align': style['text-align'] }, position: extraAttrs.position }
+  const childAttrs = { ...newChildren[0].attrs, ...sizeAttrs, style , position: extraAttrs.position }
   extraAttrs = { ...extraAttrs, ...sizeAttrs }
 
   if (!childAttrs.position) {
@@ -905,7 +913,7 @@ const getReferenceAttributes = ({elementAttrs, newChildren, extraAttrs, sizeAttr
   const referenceAttrs = getImageAttributes(elementAttrs, childAttrs, extraAttrs);
 
   referenceAttrs.type = "reference";
-
+  delete referenceAttrs?.attrs?.['redactor-attributes']?.['anchorlink'];
   return referenceAttrs
 }
 

src/toRedactor.tsx

@@ -125,7 +125,7 @@ const ELEMENT_TYPES: IJsonToHtmlElementTags = {
     }
 
     else if (extraAttrs?.displayType === "display") {
-      const anchor = jsonBlock?.["attrs"]?.["link"];
+      const anchor = jsonBlock?.["attrs"]?.["link"] ?? jsonBlock?.["attrs"]?.["anchorLink"];
 
       const caption = jsonBlock?.["attrs"]?.["asset-caption"];
       const position = jsonBlock?.["attrs"]?.["position"];
@@ -134,7 +134,9 @@ const ELEMENT_TYPES: IJsonToHtmlElementTags = {
       const figureStyles = {
         margin: "0",
       };
-      attrs = ` src="${jsonBlock?.["attrs"]?.["asset-link"]}"` + attrs;
+      if(!attrs.includes(`src="${jsonBlock?.["attrs"]?.["asset-link"]}`)){
+        attrs = ` src="${jsonBlock?.["attrs"]?.["asset-link"]}"` + attrs;
+      }
       let img = `<img${attrs}/>`;
 
       if (anchor) {