fix: swap copilot and three steps sections in getting started page

[amankv1234]

Screenshots:

Additional Notes:

Exchanged positions of GitHub Copilot section and three steps section in the SocialShareButton landing page getting started section. Copilot section now appears above the three steps for better user flow.

Checklist

• My code follows the project's code style and conventions
• I have made corresponding changes to the documentation
• My changes generate no new warnings or errors

Summary by CodeRabbit

• Documentation
  • Reorganized the Getting Started guidance into two clearly labeled paths: AI-agent setup and manual setup.
  • Moved GitHub Copilot instructions to the beginning of the setup flow and clarified their presentation.
  • Preserved the existing manual installation steps and completion guidance.

[coderabbitai]

Walkthrough

The Getting Started section now separates GitHub Copilot instructions from manual installation steps, placing the Copilot guidance first and labeling both setup paths consistently across the documentation page and client guide.

Changes

Getting Started Documentation

Layer / File(s)	Summary
Reorder and label setup paths docs/client-guide.md, landing-page/src/app/docs/page.tsx	GitHub Copilot guidance is grouped under “1. By AI-Agent,” while the numbered installation instructions follow under “2. Manually.”

Estimated code review effort: 2 (Simple) | ~10 minutes

Suggested labels: Documentation, Typescript Lang

Poem

I’m a bunny with a tidy page,
Copilot hops onto the stage.
Manual steps follow in a row,
Clear labels tell which way to go.
Hop, hop—the guide is set!

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: swapping the Copilot and three-step sections in the Getting Started page.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

landing-page/src/app/docs/page.tsx (1)

135-167: 📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

Update upstream documentation to match the new order.

Swapping the Copilot callout to appear before the three-step installation creates an inconsistency with the upstream contract in docs/client-guide.md (lines 20-36), which still presents the three-step instructions first. Please update the markdown guide to reflect this new intended order and maintain consistency across the documentation.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@landing-page/src/app/docs/page.tsx` around lines 135 - 167, Update the
upstream documentation in docs/client-guide.md so the Copilot callout appears
before the three-step installation instructions, matching the order shown in the
page content. Preserve the existing wording and structure of both sections while
reordering only the affected documentation blocks.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Outside diff comments:
In `@landing-page/src/app/docs/page.tsx`:
- Around line 135-167: Update the upstream documentation in docs/client-guide.md
so the Copilot callout appears before the three-step installation instructions,
matching the order shown in the page content. Preserve the existing wording and
structure of both sections while reordering only the affected documentation
blocks.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 3ca94725-ab71-4100-91b2-033ee63f9c87

📥 Commits

Reviewing files that changed from the base of the PR and between 1a5de09 and 749e020.

📒 Files selected for processing (1)

• landing-page/src/app/docs/page.tsx

[coderabbitai]

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

landing-page/src/app/docs/page.tsx (1)

135-171: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Externalize the new Getting Started copy for i18n.

The added headings, Copilot instructions, and manual setup text are hardcoded directly in JSX. Move these strings into the project’s resource/translation mechanism so the new documentation remains localizable.

As per path instructions: “User-visible strings should be externalized to resource files (i18n).”

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@landing-page/src/app/docs/page.tsx` around lines 135 - 171, Externalize all
user-visible strings in the new Getting Started section, including the AI-Agent
and Manually headings, Copilot instructions, prompt URL text, completion
message, three manual setup steps, and no-configuration message. Add them to the
project’s existing translation resources and update the documentation page JSX
to retrieve them through the established i18n mechanism, preserving the current
formatting and link behavior.

Source: Path instructions

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Outside diff comments:
In `@landing-page/src/app/docs/page.tsx`:
- Around line 135-171: Externalize all user-visible strings in the new Getting
Started section, including the AI-Agent and Manually headings, Copilot
instructions, prompt URL text, completion message, three manual setup steps, and
no-configuration message. Add them to the project’s existing translation
resources and update the documentation page JSX to retrieve them through the
established i18n mechanism, preserving the current formatting and link behavior.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 167f55e9-9cd3-4923-8eb0-8b513f3877b9

📥 Commits

Reviewing files that changed from the base of the PR and between 749e020 and 9865371.

📒 Files selected for processing (2)

• docs/client-guide.md
• landing-page/src/app/docs/page.tsx

[amankv1234]

@coderabbitai
Skipping this suggestion because the project currently does not have any i18n setup or existing translation resources (like next-intl or react-i18next). Adding a complete internationalization infrastructure is out of scope for this PR. We will consider externalizing strings when i18n is officially introduced to the project.

[coderabbitai]

Tip

For best results, initiate chat on the files or code changes.

The Comment image shows the dark-themed SocialShareButton docs page at localhost:3000/docs. Its “How to Get Started” section places a yellow-bordered “Using GitHub Copilot?” callout first, followed by the manual “three steps” guidance in a green-accented code-style panel. The left navigation lists Overview, Why SocialShareButton?, Getting Started, Analytics, Use Cases, and Ready to Go?.

@amankv1234, understood. Deferring string externalization is reasonable: introducing it correctly requires a project-wide i18n strategy and translation resources, which is beyond the scope of #177. I’ll treat these strings as intentionally inline until internationalization is introduced.

Would you like me to open a follow-up GitHub issue to track i18n adoption and later externalization of UI strings?

🐇💭

---

✏️ Learnings added

Learnt from: amankv1234
URL: https://github.com/AOSSIE-Org/SocialShareButton/pull/177

Timestamp: 2026-07-18T19:30:31.551Z
Learning: The SocialShareButton project currently has no internationalization infrastructure or translation resources (such as next-intl or react-i18next). Reviews should not request externalizing UI strings unless the project formally introduces i18n; that work should be handled as a separate, project-wide effort.

Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.