### Install Replyke React.js Package
Source: https://github.com/replyke/docs-v5/blob/main/pages/react-and-react-native/getting-started.mdx
This snippet provides commands to install the `@replyke/react-js` package, essential for integrating Replyke into standard React web applications. It includes options for npm, pnpm, and yarn.
```bash
npm install @replyke/react-js
```
```bash
pnpm add @replyke/react-js
```
```bash
yarn add @replyke/react-js
```
--------------------------------
### Install Replyke Expo Package
Source: https://github.com/replyke/docs-v5/blob/main/pages/react-and-react-native/getting-started.mdx
This snippet provides commands to install the `@replyke/expo` package, tailored for integrating Replyke into Expo managed projects. It includes options for npx expo, pnpm, and yarn.
```bash
npx expo install @replyke/expo
```
```bash
pnpm add @replyke/expo
```
```bash
yarn add @replyke/expo
```
--------------------------------
### Install Replyke React Native Package
Source: https://github.com/replyke/docs-v5/blob/main/pages/react-and-react-native/getting-started.mdx
This snippet provides commands to install the `@replyke/react-native` package, specifically designed for integrating Replyke into React Native mobile applications. It includes options for npm, pnpm, and yarn.
```bash
npm install @replyke/react-native
```
```bash
pnpm add @replyke/react-native
```
```bash
yarn add @replyke/react-native
```
--------------------------------
### Wrap Application with ReplykeProvider in JavaScript
Source: https://github.com/replyke/docs-v5/blob/main/pages/react-and-react-native/getting-started.mdx
This JavaScript example demonstrates how to correctly wrap your entire application with the `ReplykeProvider` component. It shows the necessary import and how to pass your unique `projectId` as a prop, enabling Replyke's features throughout your app.
```javascript
import { ReplykeProvider } from "@replyke/react-js";
{/* Rest of your app */}
;
```
--------------------------------
### Example HTTP Request for Get Root List
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/lists/fetch-root-list.mdx
An example of how to make a GET request to the root list endpoint, including the `Authorization` header with a bearer token.
```http
GET /proj1234/lists/root
Authorization: Bearer
```
--------------------------------
### Example Fetch User Request
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/users/fetch-user.mdx
A simple shell command example demonstrating how to make a GET request to the Fetch User API endpoint with a specific project and user ID.
```sh
GET /proj1234/users/67890
```
--------------------------------
### Example Request to Check Username Availability
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/users/check-username-availability.mdx
An example HTTP GET request demonstrating how to query the username availability endpoint with a sample username.
```sh
GET /proj1234/users/check-username?username=johndoe
```
--------------------------------
### Example HTTP Request to Get Single Entity
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/entities/fetch-entity.mdx
Illustrates a sample HTTP GET request to retrieve an entity, showing the typical URL structure with placeholder project and entity IDs.
```http
GET /proj1234/entities/entity_abc
```
--------------------------------
### Example Shell Request for User Suggestions
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/users/fetch-user-suggestions.mdx
Illustrates a sample GET request to the user suggestions endpoint using a shell command, demonstrating how to include the 'query' parameter.
```sh
GET /proj1234/users/suggestions?query=john
```
--------------------------------
### Example Shell Request: Fetch Followers Count
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/users/fetch-followers-count.mdx
Illustrates a sample HTTP GET request to the followers count endpoint using a shell command, showing the full URL path with example IDs.
```sh
GET /proj1234/users/67890/followers-count
```
--------------------------------
### Example JSON Success Response for Get Root List
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/lists/fetch-root-list.mdx
A sample JSON structure returned upon a successful `GET /:projectId/lists/root` request, showing the structure of a root list object.
```json
{
"id": "list_abc",
"projectId": "proj1234",
"userId": "user_xyz",
"name": "root",
"isRoot": true,
"parentId": null,
"entityIds": [],
"subLists": [],
"createdAt": "2024-01-01T00:00:00.000Z",
"updatedAt": "2024-01-01T00:00:00.000Z"
}
```
--------------------------------
### Example HTTP Request for Get Entity by Short ID
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/entities/fetch-entity-by-short-id.mdx
An example HTTP GET request demonstrating how to query the endpoint with a specific short ID.
```http
GET /proj1234/entities/by-short-id?shortId=3jh4sK
```
--------------------------------
### Example HTTP Request for Get App Notifications
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/app-notifications/fetch-notifications.mdx
Illustrates how to make a GET request to the app notifications endpoint, including the path parameters, query parameters for pagination, and the required Authorization header with a bearer token.
```http
GET /proj1234/app-notifications?page=2&limit=10
Authorization: Bearer
```
--------------------------------
### Example Request: Get or Create User by Foreign ID (Shell)
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/users/fetch-user-by-foreign-id.mdx
Illustrates how to make a GET request to the user management endpoint using a shell command, including various query parameters for user identification and data submission.
```sh
GET /proj1234/users/by-foreign-id?foreignId=abc123&name=Jane&username=janedoe&metadata={"lang":"en"}
```
--------------------------------
### Fetch Entities API Request Example
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/entities/fetch-many-entities.mdx
An example HTTP GET request to the /entities endpoint, demonstrating the use of sortBy, limit, page, and followedOnly query parameters, along with an Authorization header for authenticated access.
```http
GET /proj1234/entities?sortBy=top&limit=10&page=1&followedOnly=true
Authorization: Bearer
```
--------------------------------
### Example Shell Request for Following Count
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/users/fetch-following-count.mdx
A sample `GET` request demonstrating how to call the following count endpoint using a shell command with placeholder project and user IDs.
```sh
GET /proj1234/users/67890/following-count
```
--------------------------------
### Example HTTP Request to Get Sub-Lists
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/lists/fetch-sub-lists.mdx
Illustrates how to make an HTTP GET request to the /sub-lists endpoint, including path parameters and the required Authorization Bearer token header.
```http
GET /proj1234/lists/list_abc/sub-lists
Authorization: Bearer
```
--------------------------------
### Example Sign Up Success Response Body
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/auth/sign-up.mdx
An example JSON response body for a successful user sign-up, including access tokens and user data.
```json
{
"success": true,
"accessToken": "",
"refreshToken": "",
"user": {
"id": "user_123",
"email": "jane@example.com",
"username": "janedoe",
"name": "Jane Doe",
"avatar": "https://example.com/avatar.jpg",
"bio": "Tech enthusiast",
"location": {
"type": "Point",
"coordinates": [-73.935242, 40.73061]
},
"birthdate": "1995-01-01T00:00:00.000Z",
"metadata": { "office": "boston" },
"suspensions": [],
"reputation": 0,
"createdAt": "2024-01-01T00:00:00.000Z",
"updatedAt": "2024-01-01T00:00:00.000Z"
}
}
```
--------------------------------
### Example Sign Up Request Body
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/auth/sign-up.mdx
An example JSON payload for the user sign-up API request, demonstrating required and optional fields.
```json
{
"email": "jane@example.com",
"password": "securePassword123",
"username": "janedoe",
"name": "Jane Doe",
"avatar": "https://example.com/avatar.jpg",
"bio": "Tech enthusiast",
"location": { "longitude": -73.935242, "latitude": 40.73061 },
"metadata": { "office": "boston" },
"secureMetadata": { "internalId": "abc123" }
}
```
--------------------------------
### Example Server Error Response
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/auth/sign-up.mdx
An example JSON response for a 500 Internal Server Error during user sign-up.
```json
{
"error": "Internal server error",
"code": "auth/server-error",
"details": ""
}
```
--------------------------------
### Example Missing Fields Error Response
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/auth/sign-up.mdx
An example JSON response for a 400 Bad Request error due to missing required fields during sign-up.
```json
{
"error": "Missing required fields",
"code": "auth/missing-fields"
}
```
--------------------------------
### Basic Replyke Comment Section Setup in React Native
Source: https://github.com/replyke/docs-v5/blob/main/pages/react-and-react-native/comments/provider-and-hook.mdx
This code snippet illustrates the basic integration of the Replyke comment system into a React Native application. It demonstrates the use of `useSocialStyle` for applying optional custom styling, and `useSocialComments` to initialize the comment section, providing components like `CommentSectionProvider`, `CommentsFeed`, and `NewCommentForm`. The example also includes handling user interaction callbacks, login requirements, and optional comment sorting with `SortByButton`. It highlights how to focus the comment form and manage `highlightedCommentId` for specific comment visibility.
```tsx
import React, { useEffect, useMemo, useRef } from "react";
import { View, Text, Keyboard } from "react-native";
import {
useSocialComments,
useSocialStyle,
UseSocialStyleProps,
} from "@replyke/comments-social-react-native";
import { showMessage } from "react-native-flash-message";
const CommentsSection = ({
entityId,
navigateToAccount,
}: {
entityId: string;
navigateToAccount: (accountId: string) => void;
}) => {
// Custom styles (optional)
const customStyles = useMemo>(
() => ({
newCommentFormProps: {
verticalPadding: 24,
paddingLeft: 24,
paddingRight: 24,
},
}),
[]
);
const styleConfig = useSocialStyle(customStyles);
// Initialize comments with useSocialComments
const { CommentSectionProvider, CommentsFeed, NewCommentForm, SortByButton } =
useSocialComments({
entityId,
styleConfig,
highlightedCommentId: "some-comment-uuid", // Should be an actual UUID if used
callbacks: {
currentUserClickCallback: () => {
Keyboard.dismiss();
navigateToProfile();
},
otherUserClickCallback: (userId: string) => {
Keyboard.dismiss();
navigateToAccount(userId);
},
loginRequiredCallback: () => {
showMessage({
message: "Oops! Login Required",
description: "Please sign in or create an account to continue.",
type: "warning",
});
},
},
});
const commentFormRef = useRef<{ focus: () => void } | null>(null);
// Focus the form when entityId changes
useEffect(() => {
if (!entityId) return;
const timeout = setTimeout(() => {
commentFormRef.current?.focus();
}, 1000);
return () => clearTimeout(timeout);
}, [entityId]);
return (
Top
}
nonActiveView={
Top
}
/>
New
}
nonActiveView={
New
}
/>
);
};
export default CommentsSection;
```
--------------------------------
### Example JSON Error Response (404 Not Found)
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/entities/fetch-entity-by-short-id.mdx
A sample JSON object returned when no entity is found for the provided 'shortId'.
```json
{
"error": "Entity not found",
"code": "entity/not-found"
}
```
--------------------------------
### Example JSON Success Response for Get App Notifications
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/app-notifications/fetch-notifications.mdx
Provides a sample 200 OK JSON response for a successful retrieval of app notifications, detailing the structure and typical fields of a single notification object, including metadata and timestamps.
```json
[
{
"id": "notif123",
"userId": "user_abc",
"projectId": "proj1234",
"type": "new-follow",
"action": "open-profile",
"metadata": {
"initiatorId": "user_xyz",
"initiatorName": "Jane",
"initiatorUsername": "jane123",
"initiatorAvatar": "https://example.com/avatar.jpg"
},
"createdAt": "2024-07-10T10:00:00.000Z",
"updatedAt": "2024-07-10T10:00:00.000Z"
}
]
```
--------------------------------
### Example JSON Request Body for Create Sub-List
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/lists/create-new-list.mdx
An example of the JSON payload required for the Create Sub-List API request, showing the 'listName' field with a sample value.
```json
{
"listName": "Ideas"
}
```
--------------------------------
### Example JSON Success Response (200 OK)
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/entities/fetch-entity-by-short-id.mdx
A sample JSON object representing a successful response when an entity is found and retrieved.
```json
{
"id": "entity_xyz",
"shortId": "3jh4sK",
"title": "Example Post",
"content": "This is a sample entity.",
"createdAt": "2024-01-01T00:00:00.000Z",
...
}
```
--------------------------------
### Example Request Body for Sign Out
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/auth/sign-out.mdx
An example JSON payload demonstrating the structure for the sign-out request, specifically showing the `refreshToken` field.
```JSON
{
"refreshToken": ""
}
```
--------------------------------
### Example Request Body for Create Comment API
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/comments/create-comment.mdx
A JSON example demonstrating the structure of the request body for creating a new comment. This example includes an entity ID, text content, mentions, and custom metadata, while showing how to explicitly set GIF to null and include a parent ID for replies.
```JSON
{
"entityId": "a1b2c3d4",
"content": "Great article!",
"mentions": [{ "id": "user-123", "username": "alex" }],
"gif": null,
"parentId": "comment-456",
"attachments": [],
"metadata": { "source": "web" }
}
```
--------------------------------
### API Reference: Get Root List Endpoint
Source: https://github.com/replyke/docs-v5/blob/main/pages/api-endpoints/lists/fetch-root-list.mdx
Detailed documentation for the `GET /:projectId/lists/root` endpoint, including request parameters, headers, and response structures, and error handling.
```APIDOC
Endpoint:
URL: /:projectId/lists/root
Method: GET
Authentication Required: Yes
Request:
Headers:
Authorization:
Type: string
Required: Yes
Description: Bearer token for authentication.
Path Parameters:
projectId:
Type: string
Required: Yes
Description: The ID of the project context.
Query Parameters: None
Response:
Success Response (200 OK):
id: string
projectId: string
userId: string
name: string
isRoot: boolean
parentId: null | string
entityIds: array
subLists: array