packages/website/docs/usage/codecs.md (5)

16-16: Fix grammatical error

Change "lets maxGraph knows" to "lets maxGraph know" or "allows maxGraph to know".

---

21-21: Improve sentence clarity

Rephrase to: "To use codecs, you must register them for the classes you want to encode/decode before using a Codec."

🧰 Tools

🪛 LanguageTool

[grammar] ~21-~21: Did you mean “registering”? Or maybe you should add a pronoun? In active voice, ‘require’ + ‘to’ takes an object, usually a pronoun.
Context: ...egistration The use of codecs requires to register the codecs for the classes you want to ...

(ALLOW_TO)

---

88-88: Fix unclear sentence structure

The sentence is unclear and missing words. Suggested revision:
"maxGraph provides special support to import mxGraph models, which have a different XML structure"

🧰 Tools

🪛 LanguageTool

[uncategorized] ~88-~88: Possible missing comma found.
Context: ...s a special support to import mxGraph models which you a different XML structure (ma...

(AI_HYDRA_LEO_MISSING_COMMA)

---

[grammar] ~88-~88: A verb may be missing between “you” and “a”, or a word may be misspelled.
Context: ...upport to import mxGraph models which you a different XML structure (mainly because...

(PRP_THE)

---

129-146: Enhance troubleshooting guidance

Consider adding specific steps to diagnose which class is missing a codec registration. For example:

1. How to identify the problematic class from the stack trace
2. How to check if a codec is registered for a specific class

---

224-224: Remove or clarify incomplete question

The line ends with a question mark and seems incomplete. Consider removing the question mark or completing the thought.

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

packages/website/docs/usage/codecs.md (3)

3-3: Enhance the description to be more informative

Consider expanding the description to better reflect the content, for example: "Learn how to use codecs for serializing and deserializing maxGraph objects in XML format."

---

68-70: Improve sentence structure

The current construction "requires - to register" is grammatically awkward. Consider revising to:
"As explained above, typical usage of the Codec class requires you to:

• register the codecs for the classes you want to encode/decode, here with registerModelCodecs
• call the encode or decode method"

🧰 Tools

🪛 LanguageTool

[grammar] ~69-~69: Did you mean “registering”? Or maybe you should add a pronoun? In active voice, ‘require’ + ‘to’ takes an object, usually a pronoun.
Context: ...l usage of the Codec class requires - to register the codecs for the classes you want to ...

(ALLOW_TO)

---

126-126: Fix markdown code fence

The code block is closed with four backticks (``````) while it was opened with three (```). This inconsistency might cause rendering issues in some markdown processors. Please use three backticks consistently.

-````
+```

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

packages/website/docs/usage/codecs.md (5)

3-3: Enhance the documentation description

Consider expanding the description to better reflect the content and purpose of this page. For example:
"Guide to using codecs for serializing and deserializing maxGraph objects in XML format."

-description: How-to use codecs.
+description: Guide to using codecs for serializing and deserializing maxGraph objects in XML format.

---

69-71: Improve sentence structure for clarity

The current wording is a bit awkward. Consider restructuring the sentence for better readability.

-As explained above, the typical usage of the `Codec` class requires
-- to register the codecs for the classes you want to encode/decode, here with `registerModelCodecs`
-- to call the `encode` or `decode` method
+As explained above, the typical usage of the `Codec` class requires you to:
+- Register the codecs for the classes you want to encode/decode (using `registerModelCodecs`)
+- Call the `encode` or `decode` method

🧰 Tools

🪛 LanguageTool

[grammar] ~70-~70: Did you mean “registering”? Or maybe you should add a pronoun? In active voice, ‘require’ + ‘to’ takes an object, usually a pronoun.
Context: ...l usage of the Codec class requires - to register the codecs for the classes you want to ...

(ALLOW_TO)

---

102-123: Add explanation of mxGraph model structure

Consider adding a brief explanation of the key elements in the mxGraph model structure (e.g., what mxCell, mxGeometry, etc. represent) to help users understand the XML format they need to provide.

---

136-153: Enhance troubleshooting guidance

Consider adding more specific debugging steps to help users identify which codec is missing:

1. How to identify the unregistered class from the stack trace
2. Common classes that require registration
3. How to verify if a codec is registered

---

215-236: Organize examples by use case

Consider grouping the examples into categories for easier navigation:

• Basic Usage Examples
• Custom Data Examples
• Migration Examples
• Integration Examples

This would help users find relevant examples more quickly.

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

packages/website/docs/usage/codecs.md (3)

15-15: Fix grammar in introduction

The verb "maps" should agree with the plural subject "classes".

-The serialization/deserialization process is based on `Codec` classes that maps the maxGraph objects to XML nodes and attributes.
+The serialization/deserialization process is based on `Codec` classes that map the maxGraph objects to XML nodes and attributes.

🧰 Tools

🪛 LanguageTool

[uncategorized] ~15-~15: This verb does not appear to agree with the subject. Consider using a different form.
Context: ...rocess is based on Codec classes that maps the maxGraph objects to XML nodes and a...

(AI_EN_LECTOR_REPLACEMENT_VERB_AGREEMENT)

---

48-62: Enhance code example clarity

While the code example is functionally correct, consider these improvements for better clarity:

1. Add comments explaining what each step does
2. Add type annotations for better understanding

 import { Codec, popup, xmlUtils } from '@mxgraph/core';

 // encode/export
 const sourceObject = {}; // your object
 const encoder = new Codec();
+// Convert object to XML node
 const node = encoder.encode(sourceObject);
+// Convert XML node to pretty-printed string
 const encodedXml = xmlUtils.getPrettyXml(node);

 // decode/import
-const xml = '...'; // your XML string
+const xml: string = '...'; // your XML string
+// Object to populate with decoded data
 const targetObject = {}; // object to decode into
 const decoder = new Codec();
+// Parse XML string into DOM document
 const doc = xmlUtils.parseXml(input);
+// Decode XML into target object
 new Codec(doc).decode(doc.documentElement, targetObject);

---

74-74: Fix grammar in ModelXmlSerializer description

The verb "provide" should agree with the singular subject "It".

-It registers codecs under the hood and provide a simpler syntax.
+It registers codecs under the hood and provides a simpler syntax.

🧰 Tools

🪛 LanguageTool

[uncategorized] ~74-~74: This verb does not appear to agree with the subject. Consider using a different form.
Context: ... It registers codecs under the hood and provide a simpler syntax. The code becomes: `...

(AI_EN_LECTOR_REPLACEMENT_VERB_AGREEMENT)

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

packages/website/docs/usage/codecs.md (7)

1-17: Add version compatibility information to the introduction

Consider adding a note about which versions of maxGraph this documentation applies to, helping users understand version compatibility upfront.

---

19-40: Add a code example for codec registration

Consider adding a basic code example showing how to register codecs, particularly for users who might need to register custom codecs. This would complement the existing explanation of the registration functions.

// Example to add:
import { CodecRegistry, registerCoreCodecs } from '@mxgraph/core';

// Register all core codecs
registerCoreCodecs();

// Or register a custom codec
CodecRegistry.register('MyCustomClass', new MyCustomCodec());

---

48-62: Enhance code example with type annotations

Consider adding TypeScript type annotations to make the example more clear and type-safe.

-const sourceObject = {}; // your object
-const targetObject = {}; // object to decode into
+interface YourObject {
+  // Define your object structure
+}
+const sourceObject: YourObject = {}; // your object
+const targetObject: YourObject = {}; // object to decode into

---

102-123: Enhance mxGraph import example

The example XML could be more realistic by:

1. Adding comments explaining the structure
2. Including more common mxGraph attributes like style
3. Showing error handling

 const mxGraphModelAsXml = `<mxGraphModel>
   <root>
+    <!-- Root element required by mxGraph -->
     <mxCell id="0"/>
+    <!-- Default parent element -->
     <mxCell id="1" parent="0"/>
+    <!-- Example vertex with style -->
-    <mxCell id="2" vertex="1" parent="1" value="Vertex #2">
+    <mxCell id="2" vertex="1" parent="1" value="Vertex #2" style="rounded=1;whiteSpace=wrap;html=1;">
       <mxGeometry x="380" y="20" width="140" height="30" as="geometry"/>
     </mxCell>

---

134-154: Expand troubleshooting section

Consider adding more common troubleshooting scenarios:

1. Circular references in objects
2. Missing required attributes
3. Invalid XML structure
4. Type mismatches during decode

---

175-182: Add more complex custom object examples

Consider adding examples that demonstrate:

1. Nested custom objects
2. Custom array handling
3. Date serialization
4. Custom attribute mapping

---

215-236: Organize examples by use case

Consider organizing the examples into categories:

• Basic Usage
• Advanced Features
• Migration from mxGraph
• Custom Implementation
  This would help users find relevant examples more easily.

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro