Update 02. Send the contact a message.md #445
Conversation
Re-wrote this piece of documentation, including additional deatils like last update date.
WalkthroughReorganizes and expands the "Send the contact a message" documentation: replaces the read-time block with a summary table, adds a top-level header and stepwise Send Message workflow, introduces Attachments/Media (GCS/public URL) and Expressions/Google Sheets flows, clarifies variables and HSM usage, and updates visuals and guidance. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor Admin as Admin (Builder)
participant Glific as Glific Flow Builder
participant GCS as Google Cloud Storage
participant Sheets as Google Sheets
participant WA as WhatsApp User
rect rgba(235,245,255,0.9)
note over Admin,Glific: Configure "Send Message" node (text / HSM / Attachments)
Admin->>Glific: Create flow & add Send Message node
Admin->>Glific: Enter text / select HSM / open Attachments
end
alt Attach media from GCS
Admin->>GCS: Upload media & set permissions
GCS-->>Admin: Public URL / credentials
Admin->>Glific: Paste URL or add GCS credentials in Attachments
else Resolve media via Expressions (Sheets)
Admin->>Sheets: Store media URLs
Glific->>Sheets: Resolve expression to fetch URL at runtime
Sheets-->>Glific: Return media URL
end
rect rgba(240,255,240,0.9)
note over Glific,WA: Runtime delivery
Glific->>WA: Deliver message (text / HSM / media)
WA-->>Glific: Optional user reply (media/text)
end
note over Admin,Glific: Test flow and iterate
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✨ Finishing touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md (1)
107-109: Replace the hard tab flagged by markdownlintLine 108 is a blank line containing a tab character, triggering MD010 (
no-hard-tabs). Replace it with a plain blank line or spaces to satisfy the linter and keep the build clean. Based on static analysis hints.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md(1 hunks)
🧰 Additional context used
🪛 GitHub Actions: Build and Deploy to Netlify
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
[error] 111-111: MDX compilation failed. Expected a closing tag for (111:166-111:170).
🪛 GitHub Actions: Test deployment
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
[error] 111-170: MDX compilation failed. Expected a closing tag for (111:166-111:170). Details: {"message":"Expected a closing tag for </a> (111:166-111:170)","name":"1:1","reason":"Expected a closing tag for </a> (111:166-111:170)","ruleId":"end-tag-mismatch","source":"mdast-util-mdx-jsx"}
🪛 markdownlint-cli2 (0.18.1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
108-108: Hard tabs
Column: 1
(MD010, no-hard-tabs)
| <li>Steps to use the <code>Send Messsage</code> node</li> | ||
| <li>Working with Media Files (Sending & Receiving)</li> | ||
| </ul> | ||
|
|
||
| ## Text Formatting | ||
| ## Steps to use the <code>Send Messsage</code> node | ||
| Step 1: Log in to Glific. |
There was a problem hiding this comment.
Correct the “Send Messsage” typo
“Send Messsage” is misspelled with three “s” characters in both the bullet list and the section heading. Please change it to “Send Message” so the UI label matches the feature name.
🤖 Prompt for AI Agents
In docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a
message.md around lines 23 to 28, the phrase "Send Messsage" is misspelled with
an extra "s" in both the bullet list and the section heading; change both
occurrences to "Send Message" so the documentation matches the UI label and
feature name.
| Important Notes: | ||
|
|
||
| <ul> | ||
| <li> Stickers and audio files can only be sent as standalone messages. A sticker or audio file cannot be combined with a message body.</li> | ||
| <li>WhatsApp business API doesn't support .gif files to be sent as attachments. To read more about this, please refer to this <a href="https://developers.facebook.com/docs/whatsapp/cloud-api/reference/media/">link</a></li> | ||
| <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a></li> | ||
| <ul> | ||
| <li>Image: 5.12 MB</li> | ||
| <li>Video: 16.384 MB</li> | ||
| <li>Audio: 16.384 MB</li> | ||
| <li>Document: 102.4 MB</li> | ||
| <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> | ||
| </ul> | ||
| </ul> |
There was a problem hiding this comment.
Fix invalid nested list causing MDX failure
The nested <ul> sits outside the parent <li>, so MDX sees an unterminated <a> and the Netlify build fails (end-tag-mismatch). Please wrap the child list inside the preceding <li> (or switch to pure Markdown) so the HTML structure is valid. Example fix:
- <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a></li>
- <ul>
- <li>Image: 5.12 MB</li>
- ...
- </ul>
+ <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a>
+ <ul>
+ <li>Image: 5.12 MB</li>
+ ...
+ </ul>
+ </li>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| Important Notes: | |
| <ul> | |
| <li> Stickers and audio files can only be sent as standalone messages. A sticker or audio file cannot be combined with a message body.</li> | |
| <li>WhatsApp business API doesn't support .gif files to be sent as attachments. To read more about this, please refer to this <a href="https://developers.facebook.com/docs/whatsapp/cloud-api/reference/media/">link</a></li> | |
| <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a></li> | |
| <ul> | |
| <li>Image: 5.12 MB</li> | |
| <li>Video: 16.384 MB</li> | |
| <li>Audio: 16.384 MB</li> | |
| <li>Document: 102.4 MB</li> | |
| <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> | |
| </ul> | |
| </ul> | |
| Important Notes: | |
| <ul> | |
| <li> Stickers and audio files can only be sent as standalone messages. A sticker or audio file cannot be combined with a message body.</li> | |
| <li>WhatsApp business API doesn't support .gif files to be sent as attachments. To read more about this, please refer to this <a href="https://developers.facebook.com/docs/whatsapp/cloud-api/reference/media/">link</a></li> | |
| <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a> | |
| <ul> | |
| <li>Image: 5.12 MB</li> | |
| <li>Video: 16.384 MB</li> | |
| <li>Audio: 16.384 MB</li> | |
| <li>Document: 102.4 MB</li> | |
| <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> | |
| </ul> | |
| </li> | |
| </ul> |
🤖 Prompt for AI Agents
In docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a
message.md around lines 63-76, the nested <ul> is placed outside its parent <li>
creating invalid HTML and causing MDX to fail; fix by moving the child <ul> so
it is nested inside the preceding <li> (or convert the entire block to valid
Markdown lists), ensure all <li> and <ul> tags are properly opened/closed and
that links remain inside the correct list item, then validate the file builds
without end-tag-mismatch errors.
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (2)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md (2)
23-28: Fix repeated “Send Messsage” typo.The node name is still misspelled with three “s” characters in both the bullet list and the section heading—this was flagged earlier. Please update both instances to “Send Message” so the documentation matches the UI.
- <li>Steps to use the <code>Send Messsage</code> node</li> + <li>Steps to use the <code>Send Message</code> node</li> @@ -## Steps to use the <code>Send Messsage</code> node +## Steps to use the <code>Send Message</code> node
63-76: Repair broken HTML list to unblock MDX build.The child
<ul>is outside its parent<li>, so MDX flags an unterminated<a>and the Netlify build fails. Please wrap the nested list inside the preceding<li>(or convert to pure Markdown) so the markup remains well-formed.- <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a></li> - <ul> - <li>Image: 5.12 MB</li> - <li>Video: 16.384 MB</li> - <li>Audio: 16.384 MB</li> - <li>Document: 102.4 MB</li> - <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> - </ul> + <li> + Size limits for attachments are as follows. More details about file formats can be found + <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a> + <ul> + <li>Image: 5.12 MB</li> + <li>Video: 16.384 MB</li> + <li>Audio: 16.384 MB</li> + <li>Document: 102.4 MB</li> + <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> + </ul> + </li>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md(1 hunks)
🧰 Additional context used
🪛 GitHub Actions: Build and Deploy to Netlify
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
[error] 111-111: MDX compilation failed. Expected a closing tag for (111:166-111:170).
🪛 GitHub Actions: Test deployment
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
[error] 111-170: MDX compilation failed during build. Expected a closing tag for (111:166-111:170). Build exited with code 1.
🪛 markdownlint-cli2 (0.18.1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
108-108: Hard tabs
Column: 1
(MD010, no-hard-tabs)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
Outdated
Show resolved
Hide resolved
| Step 2: Create a Send Message node. | ||
|
|
||
| Step 3: Click on the Attachments tab. | ||
|
|
||
| 7 . Click on `ok` button to save the attachment in the node. | ||
| <br><img width="361" height="160" alt="Screenshot 2025-10-09 at 10 59 52 PM" src="https://github.com/user-attachments/assets/076defb2-6658-4aad-a1c2-853e4175e333" /><br> |
There was a problem hiding this comment.
Resolve markdownlint hard-tab violation.
Line 108 still contains a tab character, triggering MD010 (no-hard-tabs). Replace the tab with spaces so linting and CI pass.
-Step 2: Create a Send Message node.
+Step 2: Create a Send Message node.📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| Step 2: Create a Send Message node. | |
| Step 3: Click on the Attachments tab. | |
| 7 . Click on `ok` button to save the attachment in the node. | |
| <br><img width="361" height="160" alt="Screenshot 2025-10-09 at 10 59 52 PM" src="https://github.com/user-attachments/assets/076defb2-6658-4aad-a1c2-853e4175e333" /><br> | |
| Step 2: Create a Send Message node. | |
| Step 3: Click on the Attachments tab. | |
| <br><img width="361" height="160" alt="Screenshot 2025-10-09 at 10 59 52 PM" src="https://github.com/user-attachments/assets/076defb2-6658-4aad-a1c2-853e4175e333" /><br> |
🧰 Tools
🪛 GitHub Actions: Build and Deploy to Netlify
[error] 111-111: MDX compilation failed. Expected a closing tag for (111:166-111:170).
🪛 markdownlint-cli2 (0.18.1)
108-108: Hard tabs
Column: 1
(MD010, no-hard-tabs)
🤖 Prompt for AI Agents
In docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a
message.md around lines 107 to 111, there is a hard tab character on line 108
causing markdownlint MD010; replace the tab with the equivalent spaces (use
project-standard spaces, e.g., 2 or 4) so the line contains only spaces and no
\t, then save and re-run linting to confirm the MD010 violation is resolved.
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (2)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md (2)
23-28: Fix “Send Messsage” typoLine [24] and the section heading on Line [27] still spell “Send Messsage” with three “s” characters. Please update both to “Send Message” so the docs match the UI label.
- <li>Steps to use the <code>Send Messsage</code> node</li> + <li>Steps to use the <code>Send Message</code> node</li> -## Steps to use the <code>Send Messsage</code> node +## Steps to use the <code>Send Message</code> node
65-76: Fix invalid nested list structureThe child
<ul>(Lines [69]-[75]) is still a sibling of its parent<li>(Line [68]), so MDX sees malformed HTML and the Netlify build fails (end-tag-mismatch). Nest the inner list inside the<li>so the markup is valid.- <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a></li> - <ul> - <li>Image: 5.12 MB</li> - <li>Video: 16.384 MB</li> - <li>Audio: 16.384 MB</li> - <li>Document: 102.4 MB</li> - <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> - </ul> + <li>Size limits for attachments are as follows. More details about file formats can be found <a href="https://developers.facebook.com/docs/whatsapp/on-premises/reference/media">here</a> + <ul> + <li>Image: 5.12 MB</li> + <li>Video: 16.384 MB</li> + <li>Audio: 16.384 MB</li> + <li>Document: 102.4 MB</li> + <li>Sticker: 0.09 MB. Additionally, WhatsApp supports only 512×512 px dimensions.</li> + </ul> + </li>
🧹 Nitpick comments (1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md (1)
107-108: Remove the hard tabLine [108] contains a literal tab character (flagged by markdownlint MD010). Replace it with spaces or remove the blank line to keep the Markdown lint-clean.
-Step 2: Create a Send Message node. - +Step 2: Create a Send Message node. +
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md(1 hunks)
🧰 Additional context used
🪛 markdownlint-cli2 (0.18.1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
108-108: Hard tabs
Column: 1
(MD010, no-hard-tabs)
|
🚀 Deployed on https://deploy-preview-445--glific-docs.netlify.app |
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (2)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md (2)
23-28: Fix the lingering “Send Messsage” typo.Both the bullet and the section heading still spell “Send Messsage” with three “s” characters. Please change each to “Send Message” so the text matches the UI label.
67-77: Repair the invalid nested list to unblock MDX.The child
<ul>sits outside the preceding<li>, so MDX still fails with anend-tag-mismatch. Keep the sub-list inside the<li>(or rewrite in pure Markdown) and ensure every<li>properly wraps its nested list.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md(1 hunks)
🧰 Additional context used
🪛 markdownlint-cli2 (0.18.1)
docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a message.md
110-110: Hard tabs
Column: 1
(MD010, no-hard-tabs)
| Step 2: Create a Send Message node. | ||
|
|
There was a problem hiding this comment.
Remove the hard tab to satisfy markdownlint MD010.
Line 110 still contains a tab before “Step 2”. Replace it with spaces so markdownlint stops flagging the file.
🧰 Tools
🪛 markdownlint-cli2 (0.18.1)
110-110: Hard tabs
Column: 1
(MD010, no-hard-tabs)
🤖 Prompt for AI Agents
In docs/4. Product Features/03. Flows/2. Flow Actions/02. Send the contact a
message.md around lines 109 to 110 there is a hard tab character before the text
"Step 2: Create a Send Message node." which triggers markdownlint MD010; replace
the tab with equivalent spaces (e.g., two or four spaces) so the line uses
spaces only and re-run linting to confirm the MD010 warning is resolved.
Re-wrote this piece of documentation, including additional deatils like last update date.
Summary by CodeRabbit