social.plus

https://learn.social.plus
Admin
social.plus provides SDKs, UIKits, and APIs for integrating pre-built and custom social, chat, feed,...
Tokens:956,607
Snippets:10,492
Trust Score:9.5
Update:1 month ago
Show doc for...
Tokens:
Raw
### Setup Sample App Dependencies

Source: https://learn.social.plus/uikit/getting-started/installation

Navigate to the example directory and install required dependencies using yarn.

```bash
cd example
yarn install
```

--------------------------------

### Get User Information by Platform

Source: https://learn.social.plus/social-plus-sdk/core-concepts/user-management/user-operations/get-user-information

Examples for retrieving user details using the SDK on various platforms.

```typescript
import { UserRepository } from '@amityco/ts-sdk';

const unsubscribe = UserRepository.getUser('user_123', ({ data: user, loading, error }) => {
  if (loading) return;

  if (error || !user) {
    console.error('Failed to get user', error);
    return;
  }

  console.log(user.userId, user.displayName);
});

// Call unsubscribe() when the screen no longer needs user updates.
```

```swift
var token: AmityNotificationToken?

func observeUser() {
    let liveObject = userRepository.getUser("user_123")
    token = liveObject.observe { liveObject, error in
        guard let user = liveObject.snapshot else {
            print("error: \(String(describing: error))")
            return
        }

        print("userId: \(user.userId), displayName: \(String(describing: user.displayName))")
    }
}
```

```kotlin
fun getUser(userRepository: AmityUserRepository) {
    userRepository.getUser(userId = "user_123")
        .doOnNext { user: AmityUser ->
            val displayName = user.getDisplayName()
            val userId = user.getUserId()
            Log.d("UserRepo", "User: $displayName ($userId)")
        }
        .doOnError { error ->
            Log.e("UserRepo", "Failed to get user", error)
        }
        .subscribe()
}
```

```dart
Future<void> getUser() async {
  try {
    final user = await AmityCoreClient.newUserRepository().getUser('user_123');
    print('User: ${user.displayName}');
  } on AmityException catch (error) {
    print('Failed to get user: $error');
  }
}
```

--------------------------------

### Install Web UIKit Package

Source: https://learn.social.plus/uikit/getting-started/installation

Install the package using pnpm.

```bash
pnpm i @amityco/ui-kit
```

--------------------------------

### Install iOS Dependencies

Source: https://learn.social.plus/uikit/getting-started/installation

Run the pod installation command for iOS projects.

```bash
npx pod-install
```

--------------------------------

### Install Vise CLI

Source: https://learn.social.plus/ai-mcp/vise/overview

Global installation of the Vise CLI tool via npm.

```sh
npm install -g @amityco/social-plus-vise
```

--------------------------------

### Full Configuration Example

Source: https://learn.social.plus/uikit/customization/component-styling

A comprehensive example demonstrating global themes, multiple page overrides, and specific element styling.

```json
{
  "preferred_theme": "default",
  "theme": {
    "light": {
      "primary_color": "#1054DE",
      "secondary_color": "#292B32",
      "base_color": "#292b32",
      "base_shade1_color": "#636878",
      "base_shade2_color": "#898e9e",
      "base_shade3_color": "#a5a9b5",
      "base_shade4_color": "#ebecef",
      "alert_color": "#FA4D30",
      "background_color": "#FFFFFF",
    },
    "dark": {
      "primary_color": "#1054DE",
      "secondary_color": "#292B32",
      "base_color": "#ebecef",
      "base_shade1_color": "#a5a9b5",
      "base_shade2_color": "#6e7487",
      "base_shade3_color": "#40434e",
      "base_shade4_color": "#292b32",
      "alert_color": "#FA4D30",
      "background_color": "#191919",
    }
  },
  "excludes": [
  ],
  "customizations": {
    "select_target_page/*/*": {
      "page_theme": {
        "light_theme": {
          "primary_color": "#1D1234",
          "secondary_color": "#AB1234"
        }
      },
      "title": "Share to"
    },
    "select_target_page/*/back_button": {
      "back_icon": "back.png"
    },
    "camera_page/*/*": {
      "resolution": "720p",
      "theme": {
        "light": {
          "primary_color": "#1054DE",
          "secondary_color": "#292B32",
          "base_color": "#292b32",
          "base_shade1_color": "#636878",
          "base_shade2_color": "#898e9e",
          "base_shade3_color": "#a5a9b5",
          "base_shade4_color": "#ebecef",
          "alert_color": "#FA4D30",
          "background_color": "#FFFFFF",
        },
        "dark": {
          "primary_color": "#1054DE",
          "secondary_color": "#292B32",
          "base_color": "#ebecef",
          "base_shade1_color": "#a5a9b5",
          "base_shade2_color": "#6e7487",
          "base_shade3_color": "#40434e",
          "base_shade4_color": "#292b32",
          "alert_color": "#FA4D30",
          "background_color": "#191919",
        }
      }
    },
    "camera_page/*/close_button": {
      "close_icon": "close.png",
      "background_color": "#80000000"
    },
    "create_story_page/*/*": {},
    "create_story_page/*/back_button": {
      "back_icon": "back.png",
      "background_color": "#80000000"
    },
    "create_story_page/*/aspect_ratio_button": {
      "aspect_ratio_icon": "aspect_ratio.png",
      "background_color": "#80000000"
    },
    "create_story_page/*/story_hyperlink_button": {
      "hyperlink_button_icon": "hyperlink_button.png",
      "background_color": "#80000000"
    },
    "create_story_page/*/hyper_link": {
      "hyper_link_icon": "hyper_link.png",
      "background_color": "#80000000"
    },
    "create_story_page/*/share_story_button": {
      "share_icon": "share_story_button.png",
      "background_color": "#FFFFFF",
      "hide_avatar": false
    },
    "story_page/*/*": {},
    "story_page/*/progress_bar": {
      "progress_color": "#FFFFFF",
      "background_color": "#50FFFFFF"
    },
    "story_page/*/overflow_menu": {
      "overflow_menu_icon": "threeDot.png"
    },
    "story_page/*/close_button": {
      "close_icon": "close.png"
    },
    "story_page/*/story_impression_button": {
      "impression_icon": "impressionIcon.png"
    },
    "story_page/*/story_comment_button": {
      "comment_icon": "comment.png",
      "background_color": "#1234DD"
    },
    "story_page/*/story_reaction_button": {
      "reaction_icon": "like.png",
      "background_color": "#1243EE"
    },
    "story_page/*/create_new_story_button": {}
  }
}
```

--------------------------------

### GET /webhook/push-notification/video-streaming.started

Source: https://learn.social.plus/api-reference/webhook-event/video-streaming-started-webhook-event

This endpoint is called when video-streaming is started.

```APIDOC
## GET /webhook/push-notification/video-streaming.started

### Description
This is called when video-streaming is started.

### Method
GET

### Endpoint
/webhook/push-notification/video-streaming.started

### Response
#### Success Response (200)
- **eventType** (string) - The type of event, which is 'push-notification.created'.
- **id** (string) - The unique identifier for the event.
- **networkId** (string) - The identifier for the network.
```

--------------------------------

### Example Implementation Prompts

Source: https://learn.social.plus/ai-mcp/overview

Sample queries to use with an AI assistant connected to the MCP server for SDK-related tasks.

```text
How do I initialize the TypeScript SDK for the EU region?
```

```text
Show me the docs for creating a text post in a community.
```

```text
What should I check before implementing push notification registration?
```

```text
How should I clean up a Live Collection subscription in React?
```

--------------------------------

### GET /webhook/video-streaming.didStart

Source: https://learn.social.plus/api-reference/webhook-event/video-streaming-didstart-webhook-event

This endpoint is called when video streaming starts.

```APIDOC
## GET /webhook/video-streaming.didStart

### Description
This is called when video streaming start.

### Method
GET

### Endpoint
/webhook/video-streaming.didStart

### Response
#### Success Response (200)
- **event** (string) - The event name
- **data** (object) - The event data containing video streamings information
```

--------------------------------

### AmityCoreClient.setup

Source: https://learn.social.plus/social-plus-sdk/getting-started/platform-setup/mobile/android-quick-start

Initializes the SDK client with the provided API key. This should be performed in the application class.

```APIDOC
## AmityCoreClient.setup

### Description
Initializes the SDK client with the required API key. This method is the entry point for SDK configuration and should be called in the application class.

### Parameters
- **apiKey** (String) - Required - Application API key from the social.plus Console.
- **endpoint** (AmityEndpoint) - Optional - Region endpoint such as AmityEndpoint.US, EU, or SG; SG is the default when omitted.
- **dbEncryption** (Enum) - Optional - Database encryption mode: NONE, AUTH, or ALL.
- **encryptionKey** (ByteArray) - Required when encryption is enabled - Stable key bytes supplied to the selected database encryption mode.

### Request Example
```kotlin
AmityCoreClient.setup(apiKey = "YOUR_API_KEY")
```
```

--------------------------------

### GET /realtime/room.startBroadcasting

Source: https://learn.social.plus/api-reference/realtime-event/room-started-broadcasting

Retrieves the realtime event data for when a room starts broadcasting.

```APIDOC
## GET /realtime/room.startBroadcasting

### Description
This event is triggered when a room starts broadcasting. It provides the room ID associated with the broadcast event.

### Method
GET

### Endpoint
/realtime/room.startBroadcasting

### Response
#### Success Response (200)
- **id** (string) - The room ID

#### Response Example
{
  "id": "690c6a641b055f909ff1c8e1",
  "data": {}
}
```

--------------------------------

### Run Sample App on Mobile

Source: https://learn.social.plus/uikit/getting-started/installation

Install root dependencies and launch the application on iOS or Android simulators/devices.

```bash
# From root directory
yarn install

# Run iOS
yarn example ios

# Run Android
yarn example android
```

--------------------------------

### OpenAPI Specification for Public Users Configuration

Source: https://learn.social.plus/api-reference/network-setting/get-public-users-configuration

The OpenAPI definition for the GET /api/v3/network-settings/public-users endpoint, including server regions and error response examples.

```yaml
version: 4.118.0
servers:
  - url: https://apix.us.amity.co
    description: API Endpoint for US Region
  - url: https://apix.eu.amity.co
    description: API Endpoint for EU Region
  - url: https://apix.sg.amity.co
    description: API Endpoint for SG Region
security: []
paths:
  /api/v3/network-settings/public-users:
    get:
      tags:
        - Network Setting
      summary: Get public users configuration.
      description: Get public users configuration.
      responses:
        '200':
          description: Public users configuration
          content:
            application/json:
              schema:
                type: object
                properties:
                  visitorEnabled:
                    type: boolean
                    description: >-
                      Enable or disable visitor users (users without
                      authentication)
                  botEnabled:
                    type: boolean
                    description: Enable or disable bot users
                  secure:
                    type: boolean
                    description: Enable or disable secure mode for public users
        '403':
          description: Permission denied.
          content:
            application/json:
              schema:
                type: object
                properties:
                  status:
                    type: string
                  code:
                    type: number
                  message:
                    type: string
                  data:
                    type: object
                    properties:
                      detail:
                        oneOf:
                          - type: array
                            items:
                              type: string
                          - type: object
              example:
                status: error
                code: 400301
                message: User is not a member of a channel
        '500':
          description: Unexpected error.
          content:
            application/json:
              schema:
                type: object
                properties:
                  status:
                    type: string
                  code:
                    type: number
                  message:
                    type: string
                  data:
                    type: object
                    properties:
                      detail:
                        oneOf:
                          - type: array
                            items:
                              type: string
                          - type: object
              example:
                status: error
                code: 500000
                message: Unexpected error
      security:
        - BearerAuth: []
components:
  securitySchemes:
    BearerAuth:
      type: http
      scheme: bearer
```

--------------------------------

### Implement Event Setup Page

Source: https://learn.social.plus/uikit/components/social/event

Initialize the event setup page for creating or editing events.

```swift
// Create
let page = AmityEventSetupPage(mode: .create("<targetId>", "<targetName>"))
let viewController = AmitySwiftUIHostingController(rootView: page)
navigationController?.pushViewController(viewController, animated: true)

// Edit
// When you already have an AmityEvent object
let editPage = AmityEventSetupPage(mode: .edit(event))
```

```kotlin
@Composable
fun composeCreateEventSetupPage(targetId: String, targetName: String) {
    AmityEventSetupPage(mode = AmityEventSetupPageMode.Create(targetId, targetName))
}

@Composable
fun composeEditEventSetupPage(event: AmityEvent) {
    AmityEventSetupPage(mode = AmityEventSetupPageMode.Edit(event))
}
```

--------------------------------

### Start Co-Host Broadcast with External Media Client

Source: https://learn.social.plus/social-plus-sdk/video-new/broadcasting/start-broadcasting

Examples of retrieving broadcaster data and connecting to an external media client across different platforms.

```typescript
import { RoomRepository } from "@amityco/ts-sdk";

type ExternalMediaClient = {
  connect: (url: string, token: string) => Promise<void>;
  publishCamera: () => Promise<void>;
};

async function startCoHostBroadcast(
  roomId: string,
  mediaClient: ExternalMediaClient,
) {
  const data = await RoomRepository.getBroadcasterData(roomId);

  if (!data.coHostUrl || !data.coHostToken) {
    throw new Error("This room did not return co-host broadcaster credentials.");
  }

  await mediaClient.connect(data.coHostUrl, data.coHostToken);
  await mediaClient.publishCamera();
}
```

```kotlin
import com.amity.socialcloud.sdk.api.video.AmityVideoClient
import com.amity.socialcloud.sdk.model.video.room.AmityRoomBroadcastData
import io.reactivex.rxjava3.core.Completable

fun connectExternalMedia(url: String, token: String): Completable {
    showSuccessMessage(url)
    showSuccessMessage(token)
    return Completable.complete()
}

fun publishExternalCamera(): Completable = Completable.complete()

val disposable = AmityVideoClient.newRoomRepository()
    .getBroadcasterData(roomId)
    .flatMapCompletable { broadcastData ->
        when (broadcastData) {
            is AmityRoomBroadcastData.CoHosts -> {
                connectExternalMedia(
                    url = broadcastData.getCoHostUrl(),
                    token = broadcastData.getCoHostToken()
                ).andThen(publishExternalCamera())
            }
            is AmityRoomBroadcastData.DirectStreaming -> {
                Completable.error(
                    IllegalStateException("Use directStreamUrl with your RTMP publisher.")
                )
            }
        }
    }
    .subscribe(
        { showSuccessMessage(roomId) },
        { error -> handleGeneralError(error) }
    )
```

```swift
func connectExternalMedia(url: String, token: String) async throws {
    showSuccessMessage(url)
    showSuccessMessage(token)
}

func publishExternalCamera() async throws {
    showSuccessMessage("camera")
}

let tokenPayload = try await AmityRoomRepository()
    .generateRoomToken(withId: roomId)

guard let coHostUrl = tokenPayload?["coHostUrl"] as? String,
      let coHostToken = tokenPayload?["coHostToken"] as? String else {
    throw NSError(domain: "Broadcast", code: 0)
}

try await connectExternalMedia(url: coHostUrl, token: coHostToken)
try await publishExternalCamera()
```

--------------------------------

### Implement Community Setup Page

Source: https://learn.social.plus/uikit/components/social/communities

Initialize the community setup component in either creation or editing mode across different platforms.

```swift
// AmityCommunitySetupPage can be used in 2 modes:
// Creation mode - .create
// Editing mode - .edit(AmityCommunity)
let page = AmityCommunitySetupPage(mode: .create)
let viewController = AmitySwiftUIHostingController(rootView: page)
```

```kotlin
@Composable
fun composeCommunitySetupPage(community: AmityCommunity) {
    AmityCommunitySetupPage(
        mode = AmityCommunitySetupPageMode.Create,
    )

    AmityCommunitySetupPage(
        mode = AmityCommunitySetupPageMode.Edit(community),
    )
}
```

```typescript
import React from 'react';
import {
  AmityUiKitProvider,
  AmityCommunitySetupPage,
  AmityCommunitySetupPageMode,
} from '@amityco/ui-kit';

const SampleCommunitySetup = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
      pageBehavior={{
        AmityCommunitySetupPageBehavior: {
          goToAddCategoryPage: (context) => {},
          goToAddMemberPage: (context) => {},
        },
      }}
    >
      <AmityCommunitySetupPage
        mode={AmityCommunitySetupPageMode.EDIT}
        community={community}
      />
    </AmityUiKitProvider>
  );
};
```

```dart
Widget communitySetupPage() {
  // This page can be used to create a new community or edit an existing community.
  // CreateMode() is used to create a new community.
  // EditMode(AmityCommunity community) is used to edit an existing community.
  return AmityCommunitySetupPage(mode: const CreateMode());
}
```

--------------------------------

### OpenAPI Specification for Get Online Users

Source: https://learn.social.plus/api-reference/presence/get-online-users-in-a-network

The OpenAPI definition for the presence network users endpoint, including request parameters and error response examples.

```yaml
version: 4.118.0
servers:
  - url: https://apix.us.amity.co
    description: API Endpoint for US Region
  - url: https://apix.eu.amity.co
    description: API Endpoint for EU Region
  - url: https://apix.sg.amity.co
    description: API Endpoint for SG Region
security: []
paths:
  /api/v1/presence/network/users:
    get:
      tags:
        - Presence
      summary: Get online users in a network
      description: |
        Get online users in a network
         - Automatically sortedBy heartbeat time)
         - Return max 1000 users
      parameters:
        - name: orderBy
          in: query
          schema:
            type: string
            enum:
              - asc
              - desc
      responses:
        '200':
          description: Get online users presence response
          content:
            application/json:
              schema:
                description: List of user presence
                type: object
                properties:
                  presences:
                    type: array
                    items:
                      description: Presence Object
                      type: object
                      properties:
                        userId:
                          type: string
                        lastHeartbeat:
                          type: string
                          format: date-time
                      required:
                        - userId
        '403':
          description: No permission to access this resource.
          content:
            application/json:
              schema:
                type: object
                properties:
                  status:
                    type: string
                  code:
                    type: number
                  message:
                    type: string
                  data:
                    type: object
                    properties:
                      detail:
                        oneOf:
                          - type: array
                            items:
                              type: string
                          - type: object
              example:
                status: error
                code: 400300
                message: Forbidden error.
        '500':
          description: Unexpected error.
          content:
            application/json:
              schema:
                type: object
                properties:
                  status:
                    type: string
                  code:
                    type: number
                  message:
                    type: string
                  data:
                    type: object
                    properties:
                      detail:
                        oneOf:
                          - type: array
                            items:
                              type: string
                          - type: object
              example:
                status: error
                code: 500000
                message: Unexpected error
      security:
        - BearerAuth: []
components:
  securitySchemes:
    BearerAuth:
      type: http
      scheme: bearer
```

--------------------------------

### Run Storybook

Source: https://learn.social.plus/uikit/getting-started/installation

Start the Storybook development server.

```bash
pnpm run storybook
```

--------------------------------

### Install the SDK

Source: https://learn.social.plus/social-plus-sdk/getting-started/platform-setup/web/web-quick-start

Use your preferred package manager to add the SDK to your project dependencies.

```bash
npm install @amityco/ts-sdk --save
```

```bash
yarn add @amityco/ts-sdk
```

```bash
pnpm add @amityco/ts-sdk
```

--------------------------------

### OpenAPI Specification for Push Notification Configuration

Source: https://learn.social.plus/api-reference/network-setting/get-push-notification-configuration

The OpenAPI definition for the GET request to retrieve push notification settings, including error response examples.

```yaml
version: 4.118.0
servers:
  - url: https://apix.us.amity.co
    description: API Endpoint for US Region
  - url: https://apix.eu.amity.co
    description: API Endpoint for EU Region
  - url: https://apix.sg.amity.co
    description: API Endpoint for SG Region
security: []
paths:
  /api/v3/network-settings/push-notification:
    get:
      tags:
        - Network Setting
      summary: Get push notification configuration
      description: >
        Get push notification settings for iOS mutable content and live
        streaming notifications.
      responses:
        '200':
          description: Push notification configuration
          content:
            application/json:
              schema:
                type: object
                properties:
                  iOSMutableContent:
                    type: boolean
                    description: >-
                      Enable or disable iOS mutable content for push
                      notifications
                  notifyWhenLiveStart:
                    type: boolean
                    description: >-
                      Whether to immedieatly sent a push notification when the
                      stream is started (true), or sent a push notificaiton when
                      the stream is attached to a post (false)
        '400':
          description: Bad Request error.
          content:
            application/json:
              schema:
                type: object
                properties:
                  status:
                    type: string
                  code:
                    type: number
                  message:
                    type: string
                  data:
                    type: object
                    properties:
                      detail:
                        oneOf:
                          - type: array
                            items:
                              type: string
                          - type: object
              example:
                status: error
                code: 400000
                message: Bad Request.
        '500':
          description: Unexpected error.
          content:
            application/json:
              schema:
                type: object
                properties:
                  status:
                    type: string
                  code:
                    type: number
                  message:
                    type: string
                  data:
                    type: object
                    properties:
                      detail:
                        oneOf:
                          - type: array
                            items:
                              type: string
                          - type: object
              example:
                status: error
                code: 500000
                message: Unexpected error
      security:
        - BearerAuth: []
components:
  securitySchemes:
    BearerAuth:
      type: http
      scheme: bearer
```

--------------------------------

### vise placements add

Source: https://learn.social.plus/ai-mcp/vise/cli-reference

Installs or previews the installation of a pre-launch private host from a local source.

```APIDOC
## vise placements add [path] --placement <id> --package-source <local-path> [--dry-run|--apply]

### Description
Preview by default, or explicitly install the pre-launch private host from a local/file source.

### Parameters
- **path** (string) - Optional - The target path.
- **--placement** (string) - Required - The placement ID.
- **--package-source** (string) - Required - The local path to the package source.
- **--dry-run** (flag) - Optional - Preview the installation.
- **--apply** (flag) - Optional - Apply the installation.
```

--------------------------------

### Get Blocking Users via Live Collection

Source: https://learn.social.plus/social-plus-sdk/social/user-relationship/blocking/manage-blocking-users

Observe users who have blocked the current user. These examples demonstrate the live collection pattern for TypeScript, iOS, and Android.

```typescript
import { UserRepository } from '@amityco/ts-sdk';

let loadMoreBlockingUsers: (() => void) | undefined;

const unsubscribe = UserRepository.getBlockingUsers(
  ({ data: users, onNextPage, hasNextPage, loading, error }) => {
    if (error) {
      handleError(error);
      return;
    }

    if (!loading && users) {
      renderResults(users);
    }

    loadMoreBlockingUsers = hasNextPage ? onNextPage : undefined;
  },
);

// Stop observing when the screen is destroyed.
unsubscribe();
```

```swift
let repository = AmityUserRepository()
let blockingUsers = repository.getBlockingUsers()

_ = blockingUsers.observe { collection, error in
    if let error {
        handleError(error)
        return
    }

    let users = collection.snapshots
    _ = users.first?.userId
}

blockingUsers.nextPage()
```

```kotlin
val disposable = AmityCoreClient.newUserRepository()
    .getBlockingUsers()
    .subscribe(
        { pagingData: PagingData<AmityUser> ->
            showSuccessMessage(pagingData)
        },
        { error ->
            handleGeneralError(error)
        },
    )
```

--------------------------------

### Story Reaction Example

Source: https://learn.social.plus/api-reference/story/get-a-story

Example of the reactions mapping object.

```yaml
reactions:
  like: 1
```

--------------------------------

### Start Vise MCP server

Source: https://learn.social.plus/ai-mcp/vise/mcp-server

Command to initiate the local stdio MCP server.

```sh
vise mcp
```

--------------------------------

### Implement Onboarding Flow in TypeScript

Source: https://learn.social.plus/use-cases/social/user-onboarding-and-visitor-mode

Demonstrates the sequence of logging in as a visitor, upgrading to an authenticated session, and updating the user profile.

```typescript
// 1. Visitor login (anonymous, read-only)
await Client.loginAsVisitor();

// 2. Upgrade to authenticated user
await Client.login({ userId: 'user-123', displayName: 'Jane' });

// 3. Update the user profile
await UserRepository.updateUser('user-123', {
  displayName: 'Jane Doe',
  description: 'Hello world!',
  avatarFileId: 'uploaded-avatar-id',
});
```

--------------------------------

### Comment Schema ReactionsCount Example

Source: https://learn.social.plus/api-reference/webhook-event/comment-didmoderate-webhook-event

Example of the reactionsCount integer value.

```json
1
```

--------------------------------

### OpenAPI My Reactions Example

Source: https://learn.social.plus/api-reference/post/create-a-post-1

Example value for the list of user reactions.

```yaml
myReactions:
  type: array
  items:
    type: string
    example: like
  description: The list of my reactions to this post.
```

--------------------------------

### Implement Clip Creation Pages

Source: https://learn.social.plus/uikit/components/social/clip

Examples for initializing and navigating to clip creation pages in iOS and Android environments.

```swift
// Create clip for community
let createClipPage = AmityCreateClipPostPage(
    targetId: "<community-id>", 
    targetType: .community
)
let viewController = AmitySwiftUIHostingController(rootView: createClipPage)
navigationController?.pushViewController(viewController, animated: true)

// Create clip for user timeline
let userClipPage = AmityCreateClipPostPage(
    targetId: "<user-id>", 
    targetType: .user
)
let userViewController = AmitySwiftUIHostingController(rootView: userClipPage)
navigationController?.pushViewController(userViewController, animated: true)
```

```kotlin
@Composable
fun composeCreateClipPage(
    community: AmityCommunity? = null, 
    targetType: AmityPostTargetType
) {
    AmityCreateClipPage(
        targetId = community?.getCommunityId() ?: "UserId",
        targetType = targetType
    )
}

// Using Activity
fun startCreateClipActivity(
    context: Context, 
    community: AmityCommunity? = null, 
    targetType: AmityPostTargetType
) {
    val intent = AmityCreateClipPageActivity.newIntent(
        context = context,
        targetId = community?.getCommunityId() ?: "UserId",
        targetType = targetType
    )
    context.startActivity(intent)
}
```

--------------------------------

### Create a Video Post across SDKs

Source: https://learn.social.plus/social-plus-sdk/social/content-management/posts/creation/video-post

Examples demonstrating how to create a video post in a community feed using various platform SDKs.

```swift
func createVideoPost(
    uploadedVideos: [AmityVideoData],
    communityId: String
) async throws -> AmityPost {
    let postRepository = AmityPostRepository()
    let builder = AmityVideoPostBuilder()
    builder.setVideos(uploadedVideos)
    builder.setText("Video from today")

    return try await postRepository.createVideoPost(
        builder,
        targetId: communityId,
        targetType: .community,
        metadata: nil,
        mentionees: nil
    )
}
```

```kotlin
fun createVideoPost(
    uploadedVideos: Set<AmityVideo>,
    communityId: String
) {
    postRepository.createVideoPost(
        targetType = AmityPost.TargetType.COMMUNITY,
        targetId = communityId,
        videos = uploadedVideos,
        text = "Video from today"
    )
        .subscribe({ post ->
            showSuccessMessage(post.getPostId())
        }, { error ->
            handleGeneralError(error)
        })
}
```

```typescript
import { PostRepository } from "@amityco/ts-sdk";

const { data: post } = await PostRepository.createPost({
  targetType: "community",
  targetId: communityId,
  data: {
    text: "Video from today",
  },
  attachments: [
    {
      type: "video",
      fileId,
    },
  ],
});
```

```dart
Future<AmityPost> createVideoPost(List<AmityVideo> uploadedVideos) {
  return AmitySocialClient.newPostRepository()
      .createPost()
      .targetCommunity(communityId)
      .video(uploadedVideos)
      .text('Video from today')
      .post();
}
```

--------------------------------

### Comment Reaction Example

Source: https://learn.social.plus/api-reference/comment/flag-a-comment

Example structure for comment reactions and counts.

```json
reactions:
  type: object
  description: The mapping of reaction with reactionCounter.
  example:
    like: 1
reactionsCount:
  type: integer
  description: The number of all reactions for this comment.
  example: 1
myReactions:
  type: array
  items:
    type: string
    example: like
  description: The list of my reactions to this comment.
```

--------------------------------

### Create a Room with SDK

Source: https://learn.social.plus/social-plus-sdk/video-new/broadcasting/create-room

Initializes a new room with specified metadata, title, and configuration settings.

```typescript
import { RoomRepository } from "@amityco/ts-sdk";

const { data: room } = await RoomRepository.createRoom({
  title: "Product Launch Event",
  description: "Join us for the unveiling of our latest features",
  liveChatEnabled: true,
  type: "coHosts",
  metadata: {
    category: "education",
  },
});

showSuccessMessage(room.roomId);
```

```kotlin
import com.amity.socialcloud.sdk.api.video.AmityVideoClient
import com.google.gson.JsonObject

val metadata = JsonObject().apply {
    addProperty("category", "education")
}

AmityVideoClient.newRoomRepository()
    .createRoom(
        title = "Product Launch Event",
        description = "Join us for the unveiling of our latest features",
        metadata = metadata,
        liveChatEnabled = true,
        participants = listOf(userId)
    )
    .subscribe(
        { room -> showSuccessMessage(room.getRoomId()) },
        { error -> handleGeneralError(error) }
    )
```

```swift
let options = AmityRoomCreateOptions(
    title: "Product Launch Event",
    description: "Join us for the unveiling of our latest features",
    metadata: ["category": "education"],
    liveChatEnabled: true,
    participants: [userId],
    type: .coHosts
)

let room = try await AmityRoomRepository().createRoom(with: options)
showSuccessMessage(room.roomId)
```

--------------------------------

### Story Reactions Count Example

Source: https://learn.social.plus/api-reference/story/get-a-story

Example of the total reactions count integer.

```yaml
reactionsCount: 1
```

--------------------------------

### Quick Start Channel Operations

Source: https://learn.social.plus/use-cases/chat/channels-and-conversations

Demonstrates basic channel creation, querying with real-time updates, and joining a channel using the TypeScript SDK.

```typescript
// Create a Community channel
  const channel = await ChannelRepository.createChannel({
    type: 'community',
    displayName: 'General',
    isPublic: true,
    tags: ['team', 'general'],
  });

  // Query channels the current user is in
  const liveCollection = ChannelRepository.getChannels({
    sortBy: 'lastActivity',
    includeDeleted: false,
  });
  liveCollection.on('dataUpdated', (channels) => renderChannelList(channels));

  // Join a channel
  await ChannelRepository.joinChannel(channelId);
```

--------------------------------

### OpenAPI Hashtags Schema Example

Source: https://learn.social.plus/api-reference/post/create-a-post-1

Example structure and values for post hashtags.

```yaml
hashtags:
  type: array
  minItems: 0
  maxItems: 30
  items:
    type: string
    maxLength: 100
    example: mobile_app
  example:
    - mobile_app
    - user_experience
    - API_v4
    - social_platform
  description: Hashtags associated with the post.
```

--------------------------------

### Create a Live Channel across platforms

Source: https://learn.social.plus/social-plus-sdk/chat/conversation-management/channels/create-channel

Use these examples to initialize a live channel with a display name, user IDs, and tags.

```typescript
import { ChannelRepository } from '@amityco/ts-sdk';

const { data: liveChannel } = await ChannelRepository.createChannel({
  type: 'live',
  displayName: 'Launch Q&A',
  userIds: ['user-id'],
  tags: ['event'],
});

renderResults(liveChannel);
```

```swift
let options = AmityLiveChannelCreateOptions()
options.setDisplayName("Launch Q&A")
options.setUserIds(["user-id"])
options.setTags(["event"])

let liveChannel = try await channelRepository.createChannel(with: options)
showSuccessMessage(liveChannel.channelId)
```

```kotlin
val disposable = channelRepository
    .createChannel(displayName = "Launch Q&A")
    .live()
    .userIds(listOf(targetUserId))
    .tags(AmityTags(listOf("event")))
    .build()
    .create()
    .subscribe(
        { channel -> showSuccessMessage(channel.getChannelId()) },
        { error -> handleGeneralError(error) },
    )
```

```dart
final liveChannel = await AmityChatClient.newChannelRepository()
    .createChannel()
    .liveType()
    .withDisplayName('Launch Q&A')
    .userIds([targetUserId])
    .tags(['event'])
    .create();

final channelId = liveChannel.channelId;
```

--------------------------------

### Forbidden Error Example

Source: https://learn.social.plus/api-reference/analytic/query-community-weekday-engagement

Example JSON response for a 403 Forbidden error.

```json
status: error
code: 400300
message: Forbidden error.
```

--------------------------------

### Initialize Join Request Components

Source: https://learn.social.plus/uikit/components/social/community-membership

Examples for rendering join request components across different platforms.

```swift
let component = AmityJoinRequestContentComponent(community: community)
let viewController = AmitySwiftUIHostingController(rootView: component)
```

```kotlin
@Composable
fun composeJoinRequestComponent(joinRequest: AmityJoinRequest) {
    AmityJoinRequestContentComponent(
        joinRequest = joinRequest,
        onAcceptAction = {
            // Handle accept action
        },
        onDeclineAction = {
            // Handle decline action
        }
    )
}
```

```typescript
import React from 'react';
import { AmityUiKitProvider, AmityJoinRequestContentComponent } from '@amityco/ui-kit';

const JoinRequestComponent = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}} // put your customized config json object
    >
      <AmityJoinRequestContentComponent
        pageId={'*'} // optional, default is '*'
        joinRequests={null} // join requests array, can be null
        isLoading={false} // loading state, default is false
      />
    </AmityUiKitProvider>
  );
};
```

```dart
// The Flutter UIKit does not expose a standalone join request content widget.
// Join request content is rendered inside AmityPendingRequestPage.
Widget joinRequestComponent(AmityCommunity community) {
  return AmityPendingRequestPage(
    community: community,
  );
}
```

--------------------------------

### Initialize User Repository

Source: https://learn.social.plus/social-plus-sdk/core-concepts/user-management/user-identity

Required setup for accessing user-related APIs across different platforms.

```typescript
import { UserRepository } from '@amityco/ts-sdk';
```

```swift
let userRepository = AmityUserRepository()
```

```kotlin
fun initUserRepository() {
    val userRepository = AmityCoreClient.newUserRepository()
}
```

```dart
void initUserRepository() {
  final userRepository = AmityCoreClient.newUserRepository();
}
```

--------------------------------

### Implement User Profile Page

Source: https://learn.social.plus/uikit/components/social/users

Examples for initializing and displaying the user profile page across different platforms.

```swift
let page = AmityUserProfilePage(userId: "user-id")
let viewController = AmitySwiftUIHostingController(rootView: page)
navigationController?.pushViewController(viewController, animated: true)
```

```kotlin
@Composable
fun composeUserProfilePage(userId: String) {
    AmityUserProfilePage(
        userId = userId
    )
}
```

```typescript
import React from 'react';
import { AmityUiKitProvider, AmityUserProfilePage } from '@amityco/ui-kit';

const UserProfile = ({ userId }) => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
      pageBehavior={{
        AmityUserProfilePageBehavior: {
          goToEditUserPage: (context) => {
            // Navigate to edit profile page
          },
          goToBlockedUsersPage: () => {
            // Navigate to blocked users page
          },
          goToPostComposerPage: (context) => {
            // Navigate to post composer
          },
        },
      }}
    >
      <AmityUserProfilePage userId={userId} />
    </AmityUiKitProvider>
  );
};
```

```dart
Widget userProfilePage(String userId) {
  return AmityUserProfilePage(userId: userId);
}
```

--------------------------------

### Reset and Clean Installation

Source: https://learn.social.plus/uikit/getting-started/installation

Commands to remove node_modules and perform a clean install.

```bash
# In UIKit directory
rm -rf node_modules package-lock.json
pnpm install
pnpm run build

# In your project
rm -rf node_modules package-lock.json
npm install
```

--------------------------------

### Initialize and Login with Flutter

Source: https://learn.social.plus/uikit/getting-started/overview

Setup the Amity UIKit and register a device using the Flutter SDK.

```dart
Future<void> main() async {
        WidgetsFlutterBinding.ensureInitialized();

        // 1. Initialize the SDK before showing any UIKit screen.
        await AmityUIKit().setup(
          apikey: 'YOUR_API_KEY',
          region: AmityEndpointRegion.sg, // .us, .eu, or .sg
        );

        runApp(const MyApp());
      }

      // 2. Register (log in) the user. registerDevice needs a BuildContext that
      // sits BELOW AmityUIKitProvider — see the next step for how AuthGate calls it.
      void login(BuildContext context) {
        AmityUIKit().registerDevice(
          context: context,
          userId: 'USER_ID',
          displayName: 'DISPLAY_NAME', // optional
          // authToken: 'AUTH_TOKEN',  // only when secure mode is enabled
          callback: (isSuccess, error) {
            if (!isSuccess) {
              debugPrint('Login failed: $error');
            }
          },
        );
      }
```

--------------------------------

### Install Peer Dependencies

Source: https://learn.social.plus/uikit/getting-started/installation

Install required React and TypeScript peer dependencies.

```bash
npm install react react-dom typescript
npm install @types/react @types/react-dom
```

--------------------------------

### Comment Schema MyReactions Example

Source: https://learn.social.plus/api-reference/webhook-event/comment-didmoderate-webhook-event

Example of the myReactions array containing reaction strings.

```json
[
  "like"
]
```

--------------------------------

### Create Story Page Implementation

Source: https://learn.social.plus/uikit/components/social/story

Platform-specific examples for initializing and navigating to the story creation page.

```swift
// Create story for community
let createStoryPage = AmityCreateStoryPage(
    targetId: "<community-id>", 
    targetType: .community
)
let viewController = AmitySwiftUIHostingController(rootView: createStoryPage)
navigationController?.pushViewController(viewController, animated: true)

// Create story for user timeline
let userStoryPage = AmityCreateStoryPage(
    targetId: "<user-id>", 
    targetType: .user
)
let userViewController = AmitySwiftUIHostingController(rootView: userStoryPage)
navigationController?.pushViewController(userViewController, animated: true)
```

```kotlin
@Composable
fun composeCreateStoryPage(
    community: AmityCommunity
) {
    AmityCreateStoryPage(
        targetId = community.getCommunityId(),
        targetType = AmityStory.TargetType.COMMUNITY
    )
}

// Using Activity
fun startCreateStoryActivity(context: Context, community: AmityCommunity) {
    val intent = AmityCreateStoryPageActivity.newIntent(
        context = context,
        targetId = community.getCommunityId(),
        targetType = AmityStory.TargetType.COMMUNITY
    )
    context.startActivity(intent)
}
```

```tsx
import {
  AmityCreateStoryPage,
  AmityUiKitProvider
} from 'amity-react-native-social-ui-kit';

const onCreateStory = () => {
    // Handle story creation completion
}

const CreateStoryScreen = ({ communityId }) => (
 <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      apiEndpoint="https://api.{API_REGION}.amity.co"
  >
       <AmityCreateStoryPage 
          targetId={communityId}
          targetType={"community" | "user" | "content"}
          onCreateStory={onCreateStory}
       />
 </AmityUiKitProvider>
);
```

```dart
void navigateToCreateStoryPage(
  BuildContext context,
  String targetId,
  AmityStoryTargetType targetType,
) {
  Navigator.of(context).push(
    MaterialPageRoute(
      builder: (context) => AmityCreateStoryPage(
        targetType: targetType,
        targetId: targetId,
      ),
    ),
  );
}
```

--------------------------------

### Initialize ProductTagListComponent

Source: https://learn.social.plus/uikit/components/social/product-tagging

Examples for implementing the product tagging list component across iOS, Android, and Web platforms.

```swift
AmityProductTagListComponent(
    pageId: .postDetailPage,
    productTags: taggedProducts,
    renderMode: .post,  // .post | .livestream | .image | .video
    onProductClick: { productTag in
        // Handle product interaction
    }
)
.environmentObject(host)
```

```kotlin
AmityProductTagListComponent(
    productTags = taggedProducts,
    renderMode = RenderModeEnum.POST,  // POST | LIVESTREAM | IMAGE | VIDEO
    displayMode = "mobile",
    onDismiss = {
        // Handle dismissal
    },
    onProductClick = { product, analyticsLocation ->
        // Handle product click
    }
)
```

```typescript
<AmityProductTagListComponent
  productTags={taggedProducts}
  renderMode="post"  // "post" | "livestream" | "image" | "video"
  displayMode="desktop"  // "desktop" | "mobile"
  onProductClick={(productTag) => {
    // Handle product interaction
  }}
/>
```
Tokens:
Raw