Avatars docs #2586
Avatars docs #2586
Conversation
|
Important Review skippedReview was skipped due to path filters ⛔ Files ignored due to path filters (2)
CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including You can disable this status message by setting the WalkthroughSidebar and navigation were updated: SDKs gained Changelog and Integrations (open in new tabs); Products now exposes Avatars (href /docs/products/avatars, icon user-circle, marked new until 2026-01-01) and Network was moved to Advanced. The site gained collapsible navigation group support via a Sidebar layout update (adds Estimated code review effort🎯 3 (Moderate) | ⏱️ ~30 minutes
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
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: 1
🧹 Nitpick comments (3)
src/routes/docs/products/avatars/image-manipulation/+page.markdoc (1)
119-418: Add React Native examples for consistency.The Resizing, Cropping, and Quality/Format sections are missing React Native code examples, even though they were included in the initial example (lines 86-103). For consistency and completeness, these sections should include React Native examples as well.
src/routes/docs/products/avatars/payment-methods/+page.markdoc (1)
9-11: Consider documenting the method naming.The method name
getCreditCardis used for retrieving logos for both credit cards and non-credit-card payment methods (like PayPal shown in the examples). While this is likely intentional for API compatibility, you might want to add a note explaining this naming convention to avoid confusion for developers expecting a more generic method name likegetPaymentMethodLogo.src/routes/docs/products/avatars/qr-codes/+page.markdoc (1)
117-253: Add React Native examples for Two-factor authentication and Customization sections.The Two-factor authentication (lines 117-158) and Customization (lines 160-253) sections are missing React Native code examples, even though they were included in the initial example (lines 86-103). For consistency, these sections should include React Native examples as well.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (11)
src/routes/docs/Sidebar.svelte(2 hunks)src/routes/docs/products/avatars/+layout.svelte(1 hunks)src/routes/docs/products/avatars/+page.markdoc(1 hunks)src/routes/docs/products/avatars/browsers/+page.markdoc(1 hunks)src/routes/docs/products/avatars/favicons/+page.markdoc(1 hunks)src/routes/docs/products/avatars/flags/+page.markdoc(1 hunks)src/routes/docs/products/avatars/image-manipulation/+page.markdoc(1 hunks)src/routes/docs/products/avatars/initials/+page.markdoc(1 hunks)src/routes/docs/products/avatars/payment-methods/+page.markdoc(1 hunks)src/routes/docs/products/avatars/qr-codes/+page.markdoc(1 hunks)src/routes/docs/products/avatars/quick-start/+page.markdoc(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: assets
- GitHub Check: tests
- GitHub Check: build
🔇 Additional comments (8)
src/routes/docs/products/avatars/+page.markdoc (2)
1-42: LGTM! Well-structured documentation landing page.The front matter, product description, and capabilities overview are clear and well-organized. The card-based navigation to feature-specific pages provides an intuitive user experience.
44-50: Good security guidance.The documentation appropriately highlights that endpoints are publicly accessible and mentions the option to disable the service to prevent abuse. This is important information for developers to understand the security implications.
src/routes/docs/products/avatars/image-manipulation/+page.markdoc (2)
420-430: Excellent security guidance on proxy usage.The use cases section effectively highlights the security benefit of serving untrusted user content through Appwrite's trusted proxy, which protects against mixed content warnings and security vulnerabilities. This is valuable information for developers.
106-118: Verify parameter value ranges match API constraints.The documented ranges (width/height: 0-4000, quality: 0-100) should be verified against the actual API implementation to ensure accuracy. Consider confirming that these limits align with the backend service capabilities.
src/routes/docs/products/avatars/payment-methods/+page.markdoc (2)
13-260: LGTM! Comprehensive multi-language examples.All code examples are consistently provided across all five supported platforms (Web, Flutter, Apple, Android Kotlin, and React Native) throughout the entire document. This provides excellent coverage for developers using different SDKs.
101-110: Verify if the width/height parameter range discrepancy for payment methods is intentional.The documentation confirms different parameter ranges: payment-methods accepts
0-2000for width/height (lines 108-109), while image-manipulation and storage images both accept0-4000(image-manipulation lines 113-114, storage/images lines 25-26).This difference could be intentional if payment method logos have different constraints than general image manipulation. Please verify against the official Appwrite API specification or SDK implementation whether the lower
0-2000limit for payment method logos is correct or should align with the0-4000limit used elsewhere.src/routes/docs/products/avatars/qr-codes/+page.markdoc (2)
106-116: LGTM! Clear parameter documentation.The parameters table provides clear descriptions with appropriate value ranges and defaults. The size limit of 0-1000 pixels and margin range of 0-10 are well-suited for QR code generation use cases.
117-158: Excellent practical example for 2FA integration.The Two-factor authentication section provides a valuable real-world example showing how to integrate QR code generation with Appwrite's MFA authenticator feature. This helps developers understand the practical application beyond basic QR code generation.
…nce documentation for avatars with session information and team invitations
eldadfux
changed the title
…flags, and credit cards - Replaced hardcoded string codes with corresponding enum values in the avatars documentation for browsers, flags, and credit cards across multiple client implementations. - Enhanced clarity and consistency in the code examples by utilizing the `Browser`, `Flag`, and `CreditCard` enums from the Appwrite SDK.
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
src/routes/docs/products/avatars/browsers/+page.markdoc(1 hunks)src/routes/docs/products/avatars/flags/+page.markdoc(1 hunks)src/routes/docs/products/avatars/payment-methods/+page.markdoc(1 hunks)src/routes/docs/products/avatars/quick-start/+page.markdoc(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (3)
- src/routes/docs/products/avatars/browsers/+page.markdoc
- src/routes/docs/products/avatars/payment-methods/+page.markdoc
- src/routes/docs/products/avatars/flags/+page.markdoc
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: assets
- GitHub Check: tests
- GitHub Check: build
- Updated GitHub star count from '52K' to '53K' in constants and community components. - Modified documentation links in the sidebar and main docs page to reflect new content for Avatars and Realtime features. - Added new entries for Changelog and Integrations in the sidebar for improved navigation.
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
src/routes/cloud-ga/(components)/open-source-community.svelte (1)
18-18: LGTM: GitHub stars label updated consistently.The label update aligns with the constant update in
src/lib/constants.ts. Note that the GitHub star count is now maintained in multiple locations (SOCIAL_STATS.GITHUB.STAT= '53K' and this component's label = '53k+'), which could lead to inconsistencies if not updated together. Consider refactoring to use a single source of truth, such as importing and usingSOCIAL_STATS.GITHUB.STATdirectly.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (2)
static/images/icons/illustrated/dark/avatars.pngis excluded by!**/*.pngstatic/images/icons/illustrated/light/avatars.pngis excluded by!**/*.png
📒 Files selected for processing (4)
src/lib/constants.ts(1 hunks)src/routes/cloud-ga/(components)/open-source-community.svelte(1 hunks)src/routes/docs/+page.svelte(1 hunks)src/routes/docs/Sidebar.svelte(3 hunks)
🧰 Additional context used
🪛 ESLint
src/routes/docs/+page.svelte
[error] 283-283: Unexpected href link without resolve().
(svelte/no-navigation-without-resolve)
[error] 309-309: Unexpected href link without resolve().
(svelte/no-navigation-without-resolve)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: build
- GitHub Check: tests
🔇 Additional comments (6)
src/lib/constants.ts (1)
11-11: LGTM: GitHub star count updated.The statistics update accurately reflects the current GitHub star count and aligns with the corresponding UI change in the open-source community component.
src/routes/docs/Sidebar.svelte (3)
28-39: LGTM!The addition of Changelog and Integrations items to the top-level navigation is well-structured. Both appropriately use
openInNewTab: truefor external navigation.
158-161: LGTM!The Network navigation item in the Advanced section is properly structured and consistent with other sidebar entries.
89-94: Date format inconsistency concern is not valid.The
isNewUntilfunction uses JavaScript's nativeDateconstructor, which flexibly accepts various date string formats. Both'1 Jan 2026'and'19 Jul 2025'parse correctly without errors. The codebase already uses mixed formats throughout (single and double-digit days), and all parse successfully. No standardization is required.src/routes/docs/+page.svelte (2)
282-306: Card structure looks good; ESLint warning appears to be a pre-existing pattern.The Avatars product card is well-structured and consistent with other product cards in this file. The description clearly communicates the product's capabilities.
Note: ESLint flagged line 283 for using
hrefwithoutresolve(). However, this pattern is consistent with all other product cards in this file (e.g., lines 129, 155, 179, 205, 231, 257), suggesting this is an established pattern in the codebase rather than an issue introduced by this change.
308-330: Verify analytics event naming convention.The Realtime card structure looks good. However, there's a potential inconsistency:
- The
hrefpoints to/docs/apis/realtime(under "apis")- The
trackEventusesdocs-products_realtime-click(suggests "products")For comparison, the Realtime link in the "Explore ways to integrate" section (line 482) uses
docs-explore_realtime_apis-click.Please verify this is intentional (e.g., maintaining historical event naming) rather than an oversight.
Note: The ESLint warning about
hrefwithoutresolve()at line 309 follows the same pre-existing pattern as other cards in this file.
- Added support for collapsible navigation groups in the Sidebar component. - Introduced `collapsible` and `initiallyCollapsed` properties to NavGroup type. - Implemented toggle functionality for collapsible groups, improving navigation experience.
What does this PR do?
Adds a new docs section for the avatars product.
Test Plan
N/A
Related PRs and Issues
N/A
Have you read the Contributing Guidelines on issues?
Yes
Summary by CodeRabbit