Community Management - social.plus

UIKit Component: Community management components are built on top of the social.plus SDK, providing ready-to-use administrative and moderation UI with full data management handled automatically.

Feature Overview

Community Management UIKit components provide comprehensive administrative tools for community oversight, settings management, and content moderation. These components enable moderators and administrators to configure community settings, manage notifications, review pending content, and control permissions—all through ready-to-use interfaces built on top of the social.plus SDK.

Key Features

Community Settings

Comprehensive community configuration

Community profile editing and management
Member management and role assignment
Privacy and visibility controls
Community closure and leave functionality

Notification Management

Fine-grained notification controls

Community-wide notification settings
Post, comment, and story notification preferences
Individual notification type management
User notification preference controls

Content Moderation

Pending posts and content oversight

Pending post review and approval
Community post moderation tools
Join request management
Content acceptance and decline workflows

Permission Control

Post and story permission management

Post creation permission settings
Story comment permission controls
Role-based access management
Community-specific permission configurations

Implementation Guide

Community Settings
Notification Settings
Content Moderation
Permission Management

Core community settings and configurationCommunity Settings components provide comprehensive administrative controls for community management, including profile editing, member management, and core community configuration options.

Community Setting Page

The Community Settings Page is the gateway for changing various settings within the community and updating its profile information. Users can leave the community or close the entire community from this page.

Features

Feature	Description
Editing Profile	Community profile can be updated through this setting
Updating Members	Adding new members or removing existing members can be done from this setting. It also has the functionality to change role of users within the community
Notification Setting	All notification settings related to a community can be changed here
Post Permissions	Post related permissions can be changed here
Story Comments	Story comment permissions can be changed here
Leave Community	User can leave the community
Close Community	Moderator user can close the entire community

Customization Options

Config ID	Type	Description
`community_setting_page//`	Page	You can customize page theme
`community_setting_page/*/edit_profile`	Element	You can customize text
`community_setting_page/*/members`	Element	You can customize text
`community_setting_page/*/notifications`	Element	You can customize text
`community_setting_page/*/post_permission`	Element	You can customize text
`community_setting_page/*/story_setting`	Element	You can customize text
`community_setting_page/*/leave_community`	Element	You can customize text
`community_setting_page/*/close_community`	Element	You can customize text
`community_setting_page/*/close_community_description`	Element	You can customize text

Code Examples

let page = AmityCommunitySettingPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeCommunitySettingPage(community: AmityCommunity) {
    AmityCommunitySettingPage(
        community = community,
    )
}

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

const SampleAmityCommunitySettingPage = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
      pageBehavior={{
        AmityCommunitySettingPageBehavior: {
          goToEditCommunityPage: (context) => {},
          goToMembershipPage: (context) => {},
          goToPostPermissionPage: (context) => {},
          goToStorySettingPage: (context) => {},
          goToSocialHomePage: () => {},
        },
      }}
    >
      <AmityCommunitySettingPage community={{}} />
    </AmityUiKitProvider>
  );
};

Widget communitySettingPage(AmityCommunity community) {
  return AmityCommunitySettingPage(community: community);
}

Community Story Setting Page

The Community Story Setting Page is the page where users can update the setting whether new comments will be allowed in the story in a community.

Features

Feature	Description
Allow Comments	This setting will allow users to create new comments in the community stories

Customization Options

Config ID	Type	Description
`community_story_setting_page//`	Page	You can customize page theme

Code Examples

let page = AmityCommunityStorySettingPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeStorySettingPage(community: AmityCommunity) {
    AmityCommunityStorySettingPage(
        community = community,
    )
}

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

const SampleAmityCommunityStorySettingPage = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
    >
      <AmityCommunityStorySettingPage community={{}} />
    </AmityUiKitProvider>
  );
};

Widget communityStorySettingPage(AmityCommunity community) {
  return AmityCommunityStorySettingPage(community: community);
}

The Community Settings Page will navigate to each page related to the setting. You can override these behaviors to navigate to your own pages.

class CustomAmityCommunitySettingPageBehavior: AmityCommunitySettingPageBehavior {
    override init() {
        super.init()
    }
    
    override func goToEditCommunityPage(_ context: AmityCommunitySettingPageBehavior.Context) {
        // override behavior
    }
    
    override func goToMembershipPage(_ context: AmityCommunitySettingPageBehavior.Context) {
        // override behavior
    }
    
    override func goToNotificationPage(_ context: AmityCommunitySettingPageBehavior.Context) {
        // override behavior
    }
    
    override func goToPostPermissionPage(_ context: AmityCommunitySettingPageBehavior.Context) {
        // override behavior
    }
    
    override func goToStorySettingPage(_ context: AmityCommunitySettingPageBehavior.Context) {
        // override behavior
    }
}

// Call this function to setup custom behaviour class in UIKit
func setCommunitySettingPageBehavior() {
    let customBehavior = CustomAmityCommunitySettingPageBehavior()
    AmityUIKit4Manager.behaviour.communitySettingPageBehavior = customBehavior
}

class CustomCommunitySettingPageBehavior : AmityCommunitySettingPageBehavior() {
    // Override navigation methods as needed
}

// Call this function in AmityUIKit4Manager class to setup custom behaviour class in UIKit
fun setCustomBehavior() {
    val customBehaviour = CustomCommunitySettingPageBehavior()
    AmityUIKit4Manager.behavior.communitySettingPageBehavior = customBehaviour
}

const SampleCommunitySettingWithBehavior = () => {
  return (
    <AmityUiKitProvider
      pageBehavior={{
        AmityCommunitySettingPageBehavior: {
          goToEditCommunityPage: (context) => {
            // Custom edit community page navigation
          },
          goToMembershipPage: (context) => {
            // Custom membership page navigation
          },
          goToPostPermissionPage: (context) => {
            // Custom post permission page navigation
          },
        },
      }}
    >
      <AmityCommunitySettingPage community={{}} />
    </AmityUiKitProvider>
  );
};

Community notification configuration and managementNotification Settings components provide granular control over community notifications, allowing users to customize their notification preferences for posts, comments, stories, and other community activities.

The notification setting pages on this tab are not available in the Web (React) UIKit.

Community Notification Setting Page

The Community Notification Setting Page is the main page to change the notification settings within the community.

Features

Feature	Description
Allow Notification	User can turn the community notification on and off

Customization Options

Config ID	Type	Description
`community_notification_page//`	Page	You can customize page theme

Code Examples

let page = AmityCommunityNotificationSettingPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeCommunityNotificationSettingPage(community: AmityCommunity) {
    AmityCommunityNotificationSettingPage(
        community = community,
    )
}

Widget communityNotificationSettingPage(AmityCommunity community) {
  return AmityCommunityNotificationSettingPage(community: community);
}

Community Posts Notification Page

The Community Posts Notification Page is the page to change post-related notification settings in a community.

Features

Feature	Description
React Posts	Update notification setting of post reactions
New Posts	Update notification setting of post creation

Customization Options

Config ID	Type	Description
`community_posts_notification_page//`	Page	You can customize page theme

Code Examples

let page = AmityCommunityPostsNotificationSettingPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeCommunityPostsNotificationSettingPage(community: AmityCommunity) {
    AmityCommunityPostsNotificationSettingPage(
        community = community,
    )
}

Widget communityPostsNotificationSettingPage(AmityCommunity community) {
  return AmityCommunityPostsNotificationSettingPage(community: community);
}

Community Comments Notification Page

The Community Comments Notification Page is the page to change comment-related notification settings in a community.

Features

Feature	Description
React Comments	Update notification setting of comment reactions
New Comments	Update notification setting of comment creations
Replies	Update notification setting of reply comment creations

Customization Options

Config ID	Type	Description
`community_comments_notification_page//`	Page	You can customize page theme

Code Examples

let page = AmityCommunityCommentsNotificationSettingPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeCommunityCommentsNotificationSettingPage(community: AmityCommunity) {
    AmityCommunityCommentsNotificationSettingPage(
        community = community,
    )
}

Widget communityCommentsNotificationSettingPage(AmityCommunity community) {
  return AmityCommunityCommentsNotificationSettingPage(community: community);
}

Community Stories Notification Page

The Community Stories Notification Page is the page to change story-related notification settings in a community.

Features

Feature	Description
New Stories	Update notification setting of story creations
Story Reactions	Update notification setting of story reactions
Story Comments	Update notification setting of story comment creations

Customization Options

Config ID	Type	Description
`community_stories_notification_page//`	Page	You can customize page theme

Code Examples

let page = AmityCommunityStoriesNotificationSettingPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeCommunityStoriesNotificationSettingPage(community: AmityCommunity) {
    AmityCommunityStoriesNotificationSettingPage(
        community = community,
    )
}

Widget communityStoriesNotificationSettingPage(AmityCommunity community) {
  return AmityCommunityStoriesNotificationSettingPage(community: community);
}

This page will navigate to dedicated notification setting pages of posts, comments, and stories. You can override the behaviors to navigate to your own pages.

class CustomAmityCommunityNotificationSettingPageBehavior: AmityCommunityNotificationSettingPageBehavior {
    override init() {
        super.init()
    }
    
    override func goToPostsNotificationSettingPage(_ context: AmityCommunityNotificationSettingPageBehavior.Context) {
        // override behavior
    }
    
    override func goToCommentsNotificationSettingPage(_ context: AmityCommunityNotificationSettingPageBehavior.Context) {
        // override behavior
    }
    
    override func goToStoriesNotificationSettingPage(_ context: AmityCommunityNotificationSettingPageBehavior.Context) {
        // override behavior
    }
}

// Call this function to setup custom behaviour class in UIKit
func setNotificationSettingPageBehaviour() {
    let customBehavior = CustomAmityCommunityNotificationSettingPageBehavior()
    AmityUIKit4Manager.behaviour.communityNotificationSettingPageBehavior = customBehavior
}

class CustomCommunityNotificationSettingPageBehavior :
    AmityCommunityNotificationSettingPageBehavior() {
    // Override navigation methods as needed
}

// Call this function in AmityUIKit4Manager class to setup custom behaviour class in UIKit
fun setCustomBehavior() {
    val customBehaviour = CustomCommunityNotificationSettingPageBehavior()
    AmityUIKit4Manager.behavior.communityNotificationSettingPageBehavior = customBehaviour
}

Pending posts and content moderation toolsContent Moderation components provide comprehensive tools for reviewing and managing pending content, including posts and join requests that require moderator approval.

Pending Request Page

The pending request page is a unified interface that handles two types of moderation: Pending Posts (content moderation) and Join Requests (membership management). This page provides a centralized location for moderators to review both content and membership requests.

Content vs Membership: While this page handles both types of pending items, the Join Request functionality is primarily a membership management feature. For detailed join request workflows and implementation, see Community Membership - Join Request Management.

Only moderators can approve or decline posts or join requests in a community. Normal users will only see their own posts that are pending approval from moderators.

Features

Feature	Type	Description
Pending Posts	Content Moderation	Moderator can review pending posts to accept or decline. Non-moderators see only their own pending posts
Join Requests	Membership Management	Moderator can review requests from users wanting to join the community. See Community Membership for detailed implementation

Customization Options

Config ID	Type	Description
`pending_request_page//`	Page	Customize overall page theme and layout
`pending_request_page/*/back_button`	Element	Customize back button appearance
`pending_request_page/*/title`	Element	Customize page title text
`pending_request_page/*/pending_posts_section`	Component	Customize pending posts section styling
`pending_request_page/*/join_requests_section`	Component	Customize join requests section styling

Code Examples

let page = AmityPendingRequestPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composePendingRequestPage(community: AmityCommunity) {
    AmityPendingRequestPage(
        community = community,
    )
}

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

const ModerationPendingRequestPage = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
    >
      <AmityPendingRequestPage 
        community={{}}
        // This page handles both pending posts (content moderation)
        // and join requests (membership management)
        onPostAction={(action, post) => {
          // Handle post moderation actions
        }}
        onJoinRequestAction={(action, request) => {
          // Handle join request actions
          // For detailed implementation, see Community Membership docs
        }}
      />
    </AmityUiKitProvider>
  );
};

Widget pendingRequestPage(AmityCommunity community) {
  return AmityPendingRequestPage(community: community);
}

Pending Post Content Component

The pending post content component will display a post needed to be reviewed. Moderator of the community can review the pending post and can accept or decline.

Features

Feature	Description
Pending Posts	Moderator can review the pending post to accept or decline. If the user is not a moderator, the list will be the user’s own posts needed to be reviewed

Customization Options

Config ID	Type	Description
`pending_posts_page/pending_post_content/*`	Component	You can customize component theme
`pending_posts_page/pending_post_content/post_accept_button`	Element	You can customize text
`pending_posts_page/pending_post_content/post_decline_button`	Element	You can customize text

Code Examples

let component = AmityPendingPostContentComponent(post: post)
let viewController = AmitySwiftUIHostingController(rootView: component)

@Composable
fun composePendingPostComponent(post: AmityPost) {
    AmityPendingPostContentComponent(
        post = post,
        onAcceptAction = {
            // Handle accept action
        },
        onDeclineAction = {
            // Handle decline action
        }
    )
}

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

const SampleAmityPendingPostContentComponent = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
    >
      <AmityPendingPostContentComponent
        post={{}}
        refresh={() => {}}
        canReviewCommunityPosts={true}
      />
    </AmityUiKitProvider>
  );
};

Widget pendingPostContentComponent(AmityPost post) {
  return AmityPendingPostContentComponent(post: post);
}

Pending Post List Component

The pending post list component will have the list of posts needed to be reviewed. Moderator of the community can review the pending posts.

Features

Feature	Description
Pending Posts	Moderator can review the pending posts to accept or decline. If the user is not a moderator, the list will be the user’s own posts needed to be reviewed

Customization Options

Config ID	Type	Description
`pending_request_page/pending_post_list/*`	Component	You can customize component theme
`pending_request_page/pending_post_list/post_accept_button`	Element	You can customize text
`pending_request_page/pending_post_list/post_decline_button`	Element	You can customize text

Code Examples

let page = AmityPendingPostListComponent(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composePendingPostListComponent(post: AmityPost) {
    AmityPendingPostContentComponent(
        post = post,
        onAcceptAction = {
            // Handle accept action
        },
        onDeclineAction = {
            // Handle decline action
        }
    )
}

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

const SampleAmityPendingPostListComponent = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
    >
      <AmityPendingPostListComponent
        pageId={'*'}
        reviewingPosts={[]}
        canReviewCommunityPosts={false}
        refresh={() => {}}
      />
    </AmityUiKitProvider>
  );
};

Widget pendingPostListComponent(AmityCommunity community) {
  return AmityPendingPostListComponent(
    community: community,
    pageId: 'pendingRequestPage',
  );
}

Join Request Management: Join request approval and management functionality is documented in the Community Membership section, as it focuses on member management workflows rather than content moderation.

Content moderation components integrate with the main community management navigation behavior for seamless moderation workflows.

// Moderation components inherit navigation behavior from Community Profile Page
// Use the Community Profile Page behavior customization for navigation control
class CustomAmityCommunityProfilePageBehavior: AmityCommunityProfilePageBehavior {
    override func goToPendingPostPage(context: AmityCommunityProfilePageBehavior.Context) {
        // Custom pending post page navigation
    }
}

// Moderation components work within the Community Profile Page context
// Navigation behavior is handled through the Community Profile Page behavior
class AmityCustomCommunityProfilePageBehavior : AmityCommunityProfilePageBehavior() {
    override fun goToPendingPostPage(context: Context) {
        // Custom pending post page navigation
    }
}

// Moderation components integrate with Community Profile Page navigation
const SampleModerationWithNavigation = () => {
  return (
    <AmityUiKitProvider
      pageBehavior={{
        AmityCommunityProfilePageBehavior: {
          goToPendingPostPage: (context) => {
            // Custom navigation for pending posts
          },
        },
      }}
    >
      <AmityPendingRequestPage community={{}} />
    </AmityUiKitProvider>
  );
};

Post and content permission controlsPermission Management components provide administrative controls for managing community permissions, including post creation permissions and content-related access controls.

Community Post Permissions Page

The Community Post Permissions Page allows administrators to configure who can create posts and manage post-related permissions within the community.

Features

Feature	Description
Post Creation Permissions	Configure which community members can create posts
Content Access Control	Manage permissions for different types of content creation
Role-Based Permissions	Set permissions based on user roles within the community

Customization Options

Config ID	Type	Description
`community_post_permission_page//`	Page	You can customize page theme
`community_post_permission_page/*/permission_settings`	Element	You can customize permission setting elements

Code Examples

let page = AmityCommunityPostPermissionPage(community: community)
let viewController = AmitySwiftUIHostingController(rootView: page)

@Composable
fun composeCommunityPostPermissionPage(community: AmityCommunity) {
    AmityCommunityPostPermissionPage(
        community = community,
    )
}

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

const SamplePostPermissionPage = () => {
  return (
    <AmityUiKitProvider
      apiKey="API_KEY"
      apiRegion="API_REGION"
      userId="userId"
      displayName="displayName"
      configs={{}}
    >
      <AmityCommunityPostPermissionPage community={{}} />
    </AmityUiKitProvider>
  );
};

Widget communityPostPermissionPage(AmityCommunity community) {
  return AmityCommunityPostPermissionPage(community: community);
}

Permission management components integrate with the community settings navigation flow for seamless administrative control.

// Permission management is typically accessed through Community Settings Page
class CustomAmityCommunitySettingPageBehavior: AmityCommunitySettingPageBehavior {
    override func goToPostPermissionPage(_ context: AmityCommunitySettingPageBehavior.Context) {
        // Custom post permission page navigation
    }
}

// Call this function to setup custom behaviour class in UIKit
func setCommunitySettingPageBehavior() {
    let customBehavior = CustomAmityCommunitySettingPageBehavior()
    AmityUIKit4Manager.behaviour.communitySettingPageBehavior = customBehavior
}

// Permission management navigation through Community Settings
class CustomCommunitySettingPageBehavior : AmityCommunitySettingPageBehavior() {
    override fun goToPostPermissionPage(context: Context) {
        // Custom post permission page navigation
    }
}

fun setCustomBehavior() {
    val customBehaviour = CustomCommunitySettingPageBehavior()
    AmityUIKit4Manager.behavior.communitySettingPageBehavior = customBehaviour
}

const SamplePermissionWithNavigation = () => {
  return (
    <AmityUiKitProvider
      pageBehavior={{
        AmityCommunitySettingPageBehavior: {
          goToPostPermissionPage: (context) => {
            // Custom post permission navigation
          },
        },
      }}
    >
      <AmityCommunityPostPermissionPage community={{}} />
    </AmityUiKitProvider>
  );
};

Communities

Core Community Features Community setup, profiles, and content feeds

Community Membership

Member Management Member administration, invitations, and join requests

Content Moderation

General Moderation Platform-wide content moderation tools

Posts & Media

Post Components Post creation and management features

Users & Profiles

User Management User profiles and administrative controls

Social Feeds

Feed Components Social feed display and management

Implementation Strategy: Start with the AmityCommunitySettingPage as the central administrative hub, then integrate specialized pages for notifications, content moderation, and permissions based on your community’s needs. Use AmityPendingRequestPage primarily for pending post moderation workflows, and leverage the Community Membership components for join request management. Configure notification settings to match your engagement strategy and implement custom navigation behaviors early to ensure smooth administrative workflows between different management interfaces.

​Feature Overview

​Key Features

Community Settings

Notification Management

Content Moderation

Permission Control

​Implementation Guide

​Community Setting Page

​Features

​Customization Options

​Code Examples

​Community Story Setting Page

​Features

​Customization Options

​Code Examples

​Navigation Behavior

​Community Notification Setting Page

​Features

​Customization Options

​Code Examples

​Community Posts Notification Page

​Features

​Customization Options

​Code Examples

​Community Comments Notification Page

​Features

​Customization Options

​Code Examples

​Community Stories Notification Page

​Features

​Customization Options

​Code Examples

​Navigation Behavior

​Pending Request Page

​Features

​Customization Options

​Code Examples

​Pending Post Content Component

​Features

​Customization Options

​Code Examples

​Pending Post List Component

​Features

​Customization Options

​Code Examples

​Navigation Behavior

​Community Post Permissions Page

​Features

​Customization Options

​Code Examples

​Navigation Behavior

​Related Components

Communities

Community Membership

Content Moderation

Posts & Media

Users & Profiles

Social Feeds

Feature Overview

Key Features

Implementation Guide

Community Setting Page

Features

Customization Options

Code Examples

Community Story Setting Page

Features

Customization Options

Code Examples

Navigation Behavior

Community Notification Setting Page

Features

Customization Options

Code Examples

Community Posts Notification Page

Features

Customization Options

Code Examples

Community Comments Notification Page

Features

Customization Options

Code Examples

Community Stories Notification Page

Features

Customization Options

Code Examples

Navigation Behavior

Pending Request Page

Features

Customization Options

Code Examples

Pending Post Content Component

Features

Customization Options

Code Examples

Pending Post List Component

Features

Customization Options

Code Examples

Navigation Behavior

Community Post Permissions Page

Features

Customization Options

Code Examples

Navigation Behavior

Related Components