feat: add Hugo and Jekyll integration guides and demo sections#151
Open
amankv1234 wants to merge 21 commits intoAOSSIE-Org:mainfrom
Open
feat: add Hugo and Jekyll integration guides and demo sections#151amankv1234 wants to merge 21 commits intoAOSSIE-Org:mainfrom
amankv1234 wants to merge 21 commits intoAOSSIE-Org:mainfrom
Conversation
- Added try-catch blocks to createButton and _getContainer to handle invalid CSS selectors. - Improved fallbackCopy error visibility by logging to _debugWarn. - Fixed HTML syntax error in index.html (removed stray closing div). - Removed duplicate CTA section in index.html for cleaner code. - Ran project-wide formatting and linting. Closes AOSSIE-Org#132
- Implemented defensive try-catch blocks for container selector resolution. - Refactored createButton() to deduplicate logic via _getContainer() helper. - Enhanced fallbackCopy() to log clipboard errors using the _debugWarn helper. - Fixed a SyntaxError in index.html and removed a redundant CTA section. - Ran project-wide formatting and linting for full code consistency. Closes AOSSIE-Org#132
- Implemented defensive try-catch blocks for container selector resolution. - Added DOM Element type safety check in _getContainer() to prevent crashes. - Refactored createButton() to deduplicate logic via _getContainer() helper. - Enhanced fallbackCopy() to log clipboard errors using the _debugWarn helper. - Fixed a SyntaxError in index.html and removed a redundant CTA section. - Ran project-wide formatting and linting for full code consistency. Closes AOSSIE-Org#132
- Added a new 'WordPress Integration' section to index.html with step-by-step instructions. - Included PHP code snippets for enqueuing assets in unctions.php via standard WordPress hooks (wp_enqueue_scripts, wp_footer). - Implemented copy-to-clipboard functionality for the new code blocks. - Updated README.md to list WordPress as a formally supported platform. Fixes AOSSIE-Org#52, Fixes AOSSIE-Org#112
- Replaced raw => characters with the HTML-escaped => equivalent in the Qwik component code block within index.html. - Resolves potential HTML linting/validation errors caused by raw greater-than signs inside <code> tags.
- Replaced incorrect npm CDN URLs with the correct jsDelivr + GitHub CDN pointing to AOSSIE-Org/SocialShareButton@v1.0.4 in both index.html and README.md. - Updated wp_footer add_action priority from default (10) to 21 so enqueued footer scripts are printed before initialization runs. - Added a note in README clarifying the package is not published to npm.
- Removed his._debugWarn logging inside the allbackCopy method's catch block within src/social-share-button.js. - The failed copy action is now completely silent internally (since old browsers gracefully failing to copy isn't an unexpected app error), but still visually updates the UI button text to
github-actions
Bot
added
planned
Contributor
|
Warning Rate limit exceeded
Your organization is not enrolled in usage-based pricing. Contact your admin to enable usage-based pricing to continue reviews beyond the rate limit, or try again in 40 minutes and 29 seconds. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (4)
WalkthroughThe PR expands framework integration support by adding Nuxt.js, WordPress, Hugo, and Jekyll documentation and examples. A new Nuxt Vue component wrapper is introduced, CDN version references are updated to v1.0.3, container resolution logic is refactored with error handling, clipboard copy behavior is modified to concatenate multiple code blocks, and extensive formatting normalizations are applied across configuration and source files. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 3 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ 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 |
github-actions
Bot
added
size/XL
Contributor
Author
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 6
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
index.html (2)
520-542:⚠️ Potential issue | 🟡 MinorCTA section is stranded in the middle of the integration docs.
cta-sectionnow appears between Preact (ends L478) and the newly added Qwik/Nuxt/Next/Vue/Angular/Hugo-Jekyll sections (L542-721). The "Ready to Get Started?" call-to-action should be the last content block before the footer; users currently scroll past it and then see more integration docs, hurting the UX.Move the
cta-sectionblock to just before</div>at line 722 (after the Hugo/Jekyll section).🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@index.html` around lines 520 - 542, The CTA block with class "cta-section" (the "Ready to Get Started?" call-to-action) is placed mid-doc between Preact and the Qwik/Nuxt/Next/Vue/Angular/Hugo-Jekyll integration sections; move the entire <div class="cta-section">...</div> block so it appears just before the closing wrapper/div that ends the integrations (i.e., after the Hugo/Jekyll section and immediately before the final </div>/footer), ensuring you preserve its child anchor elements and attributes (class="cta-button" and class="cta-button discord-btn") and keep target/rel attributes intact.
888-944:⚠️ Potential issue | 🟡 MinorClipboard handler: minor hardening.
navigator.clipboardis undefined on non-secure contexts (HTTP /file://); the.writeText()call will throwTypeErrorsynchronously before.then/.catchengages, leaving the button stuck on "Copy" with no feedback. Guard withif (!navigator.clipboard) { … fallback / status }.- On error you call
setTimeoutto reset tooriginalTextwhilebutton.textContentis alreadyoriginalText(line 928), making the delayed reset a no-op but still clearing the status span — acceptable, just note for clarity.- navigator.clipboard - .writeText(text) + if (!navigator.clipboard?.writeText) { + if (statusSpan?.classList.contains("copy-status")) { + statusSpan.textContent = "Clipboard API unavailable"; + } + return; + } + navigator.clipboard + .writeText(text)🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@index.html` around lines 888 - 944, The clipboard handler must guard against navigator.clipboard being undefined; before calling navigator.clipboard.writeText(...) in the click listener for copyButtons, check if navigator.clipboard exists and handle the fallback by setting the statusSpan (and button.textContent) to a clear failure message and scheduling/clearing button.copyResetTimer as you do on catch, so the UI never becomes stuck if writeText would throw synchronously; keep the existing success and catch flows but move the initial presence check for navigator.clipboard to the top of the listener and reuse the same reset logic (button.copyResetTimer) when the API is missing.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@index.html`:
- Around line 547-568: The copy button is concatenating multiple <code> elements
because the copy handler uses codeBlockContainer.querySelectorAll("code") and
joins them; fix by splitting the two snippets into separate .code-block
containers (each containing its own .copy-btn, .copy-status and a single <code>
node) so the existing copy button behavior remains consistent with other
sections; alternatively (if you prefer to keep one container) change the copy
logic that references codeBlockContainer.querySelectorAll("code") to only use
the first code element (e.g., querySelector("code")) — update the DOM structure
around the two snippets or the copy handler accordingly, referencing the
.code-block, .copy-btn, .copy-status elements and the
codeBlockContainer.querySelectorAll("code") usage.
In `@README.md`:
- Around line 625-640: The template-inserted description string in the
SocialShareButton init (the description property in the SocialShareButton
constructor) can break JS when page.description contains quotes, backslashes, or
newlines; change the Liquid/Jekyll insertion to emit a safe JSON string (use the
Liquid json/jsonify filter) and the Hugo insertion to use Hugo's jsonify (or
jsEscape) so the generated JS is valid JSON/JS string literal; update the same
pattern wherever SocialShareButton is initialized (the snippet that constructs
new SocialShareButton in README and in index.html).
In `@src/social-share-button-nuxt.vue`:
- Around line 1-86: Add a short header comment at the top of
src/social-share-button-nuxt.vue indicating this is a copy-paste wrapper
distributed manually (not yet on CDN) — mirror the pattern used in
social-share-button-react.jsx; place the comment above the <template> tag so
contributors see acquisition instructions immediately and mention that consumers
should copy this file into their project or use the released CDN/npm artifact
once the next release tag is cut.
- Around line 36-64: The component currently only tries to initialize inside
onMounted and silently does nothing if window.SocialShareButton isn't loaded;
add a polling fallback like in social-share-button-preact.jsx: inside onMounted
start a setInterval(100ms) that checks for window.SocialShareButton and a retry
counter (e.g., max retries), instantiate shareButton with the same options
(container, url, title, description, hashtags, via, platforms, theme,
buttonText, customClass, onShare, onCopy, buttonStyle, modalPosition,
buttonColor, buttonHoverColor, showButton, analytics, onAnalytics,
analyticsPlugins, componentId, debug) when found, then clearInterval; also save
the interval id and clear it in onBeforeUnmount (and also destroy/cleanup
shareButton if present) so the polling is bounded and cleaned up.
- Around line 74-85: Replace the direct watch(props, ...) with an explicit
getter watch(() => ({ ...props }), ...) to avoid receiving the same reactive
proxy for old/new values; inside the watcher keep the currentUrl/currentTitle
resolution and call shareButton.updateOptions({...}) as before. Also update the
updateOptions implementation (function name: updateOptions) or add
documentation: either make updateOptions trigger a full re-render when
non-reactive-affecting fields change (theme, buttonText, buttonStyle, platforms)
or clearly document that only url, buttonColor, and buttonHoverColor currently
take effect on update and other fields require re-creation of the shareButton
instance. Ensure references to shareButton and updateOptions are updated
accordingly.
In `@src/social-share-button.js`:
- Around line 694-699: The validation in _getContainer() uses "instanceof
Element" which can throw if the Element global is undefined; change the guard to
first check typeof Element !== "undefined" before using instanceof (e.g., only
evaluate container instanceof Element when Element exists), and keep the
existing fallback check container.nodeType === 1 so the function safely returns
null and warns when container is not a DOM element.
---
Outside diff comments:
In `@index.html`:
- Around line 520-542: The CTA block with class "cta-section" (the "Ready to Get
Started?" call-to-action) is placed mid-doc between Preact and the
Qwik/Nuxt/Next/Vue/Angular/Hugo-Jekyll integration sections; move the entire
<div class="cta-section">...</div> block so it appears just before the closing
wrapper/div that ends the integrations (i.e., after the Hugo/Jekyll section and
immediately before the final </div>/footer), ensuring you preserve its child
anchor elements and attributes (class="cta-button" and class="cta-button
discord-btn") and keep target/rel attributes intact.
- Around line 888-944: The clipboard handler must guard against
navigator.clipboard being undefined; before calling
navigator.clipboard.writeText(...) in the click listener for copyButtons, check
if navigator.clipboard exists and handle the fallback by setting the statusSpan
(and button.textContent) to a clear failure message and scheduling/clearing
button.copyResetTimer as you do on catch, so the UI never becomes stuck if
writeText would throw synchronously; keep the existing success and catch flows
but move the initial presence check for navigator.clipboard to the top of the
listener and reuse the same reset logic (button.copyResetTimer) when the API is
missing.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro
Run ID: 320df6ce-a9e0-4e41-928e-6021f30ff86c
📒 Files selected for processing (13)
CONTRIBUTING.mdREADME.mddocs/Roadmap.mdeslint.config.jsindex.htmllanding-page/README.mdlanding-page/src/app/globals.csssrc/social-share-analytics.jssrc/social-share-button-nuxt.vuesrc/social-share-button-preact.jsxsrc/social-share-button-react.jsxsrc/social-share-button.csssrc/social-share-button.js
Contributor
Author
|
@kpj2006 , |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Fixes #51
Adds first-class support for Hugo and Jekyll Static Site Generators (SSGs). This implementation provides a seamless "drop-in" CDN approach, which is the preferred integration pattern for static environments.
Changes
index.htmlwith functional snippets for both frameworks and copy-to-clipboard support.deferscripts andDOMContentLoadedlisteners to ensure high performance and reliability.@v1.0.3to ensure links work immediately.Verification
npm run formatSummary by CodeRabbit
Release Notes
New Features
Bug Fixes
Documentation