> ## Documentation Index
> Fetch the complete documentation index at: https://learn.social.plus/llms.txt
> Use this file to discover all available pages before exploring further.

# Community Management

> Community settings, permissions, moderation tools, and administrative features

<Info>
  **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.
</Info>

## 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

<CardGroup cols={2}>
  <Card title="Community Settings" icon="gear">
    **Comprehensive community configuration**

    * Community profile editing and management
    * Member management and role assignment
    * Privacy and visibility controls
    * Community closure and leave functionality
  </Card>

  <Card title="Notification Management" icon="bell">
    **Fine-grained notification controls**

    * Community-wide notification settings
    * Post, comment, and story notification preferences
    * Individual notification type management
    * User notification preference controls
  </Card>

  <Card title="Content Moderation" icon="shield-check">
    **Pending posts and content oversight**

    * Pending post review and approval
    * Community post moderation tools
    * Join request management
    * Content acceptance and decline workflows
  </Card>

  <Card title="Permission Control" icon="lock">
    **Post and story permission management**

    * Post creation permission settings
    * Story comment permission controls
    * Role-based access management
    * Community-specific permission configurations
  </Card>
</CardGroup>

## Implementation Guide

<Tabs>
  <Tab title="Community Settings">
    **Core community settings and configuration**

    Community 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunitySettingPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeCommunitySettingPage(community: AmityCommunity) {
          AmityCommunitySettingPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      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>
        );
      };
      ```

      ```dart Flutter theme={null}
      Widget communitySettingPage(AmityCommunity community) {
        return AmityCommunitySettingPage(community: community);
      }
      ```
    </CodeGroup>

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunityStorySettingPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeStorySettingPage(community: AmityCommunity) {
          AmityCommunityStorySettingPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      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>
        );
      };
      ```

      ```dart Flutter theme={null}
      Widget communityStorySettingPage(AmityCommunity community) {
        return AmityCommunityStorySettingPage(community: community);
      }
      ```
    </CodeGroup>

    ### Navigation Behavior

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

    <CodeGroup>
      ```swift iOS theme={null}
      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
      }
      ```

      ```kotlin Android theme={null}
      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
      }
      ```

      ```typescript React theme={null}
      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>
        );
      };
      ```
    </CodeGroup>
  </Tab>

  <Tab title="Notification Settings">
    **Community notification configuration and management**

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

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunityNotificationSettingPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeCommunityNotificationSettingPage(community: AmityCommunity) {
          AmityCommunityNotificationSettingPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      import React from 'react';
      import { AmityUiKitProvider, AmityCommunityNotificationSettingPage } from '@amityco/ui-kit';

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

      ```dart Flutter theme={null}
      Widget communityNotificationSettingPage(AmityCommunity community) {
        return AmityCommunityNotificationSettingPage(community: community);
      }
      ```
    </CodeGroup>

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunityPostsNotificationSettingPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeCommunityPostsNotificationSettingPage(community: AmityCommunity) {
          AmityCommunityPostsNotificationSettingPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      import React from 'react';
      import { AmityUiKitProvider, AmityCommunityPostsNotificationSettingPage } from '@amityco/ui-kit';

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

      ```dart Flutter theme={null}
      Widget communityPostsNotificationSettingPage(AmityCommunity community) {
        return AmityCommunityPostsNotificationSettingPage(community: community);
      }
      ```
    </CodeGroup>

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunityCommentsNotificationSettingPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeCommunityCommentsNotificationSettingPage(community: AmityCommunity) {
          AmityCommunityCommentsNotificationSettingPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      import React from 'react';
      import { AmityUiKitProvider, AmityCommunityCommentsNotificationSettingPage } from '@amityco/ui-kit';

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

      ```dart Flutter theme={null}
      Widget communityCommentsNotificationSettingPage(AmityCommunity community) {
        return AmityCommunityCommentsNotificationSettingPage(community: community);
      }
      ```
    </CodeGroup>

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunityStoriesNotificationSettingPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeCommunityStoriesNotificationSettingPage(community: AmityCommunity) {
          AmityCommunityStoriesNotificationSettingPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      import React from 'react';
      import { AmityUiKitProvider, AmityCommunityStoriesNotificationSettingPage } from '@amityco/ui-kit';

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

      ```dart Flutter theme={null}
      Widget communityStoriesNotificationSettingPage(AmityCommunity community) {
        return AmityCommunityStoriesNotificationSettingPage(community: community);
      }
      ```
    </CodeGroup>

    ### Navigation Behavior

    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.

    <CodeGroup>
      ```swift iOS theme={null}
      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
      }
      ```

      ```kotlin Android theme={null}
      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
      }
      ```

      ```typescript React theme={null}
      const SampleNotificationWithBehavior = () => {
        return (
          <AmityUiKitProvider
            pageBehavior={{
              AmityCommunityNotificationSettingPageBehavior: {
                goToPostsNotificationSettingPage: (context) => {
                  // Custom posts notification navigation
                },
                goToCommentsNotificationSettingPage: (context) => {
                  // Custom comments notification navigation
                },
                goToStoriesNotificationSettingPage: (context) => {
                  // Custom stories notification navigation
                },
              },
            }}
          >
            <AmityCommunityNotificationSettingPage community={{}} />
          </AmityUiKitProvider>
        );
      };
      ```
    </CodeGroup>
  </Tab>

  <Tab title="Content Moderation">
    **Pending posts and content moderation tools**

    Content 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.

    <Info>
      **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](/uikit/components/social/community-membership#join-request-management).
    </Info>

    <Warning>
      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.
    </Warning>

    #### 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](/uikit/components/social/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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityPendingRequestPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composePendingRequestPage(community: AmityCommunity) {
          AmityPendingRequestPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      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>
        );
      };
      ```

      ```dart Flutter theme={null}
      Widget pendingRequestPage(AmityCommunity community) {
        return AmityPendingRequestPage(community: community);
      }
      ```
    </CodeGroup>

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let component = AmityPendingPostContentComponent(post: post)
      let viewController = AmitySwiftUIHostingController(rootView: component)
      ```

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

      ```typescript React theme={null}
      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>
        );
      };
      ```

      ```dart Flutter theme={null}
      Widget pendingPostContentComponent(AmityPost post) {
        return AmityPendingPostContentComponent(post: post);
      }
      ```
    </CodeGroup>

    ### 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityPendingPostListComponent(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

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

      ```typescript React theme={null}
      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>
        );
      };
      ```

      ```dart Flutter theme={null}
      Widget pendingPostListComponent(AmityCommunity community) {
        return AmityPendingPostListComponent(
          community: community,
          pageId: 'pendingRequestPage',
        );
      }
      ```
    </CodeGroup>

    <Info>
      **Join Request Management**: Join request approval and management functionality is documented in the [Community Membership](/uikit/components/social/community-membership) section, as it focuses on member management workflows rather than content moderation.
    </Info>

    ### Navigation Behavior

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

    <CodeGroup>
      ```swift iOS theme={null}
      // 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
          }
      }
      ```

      ```kotlin Android theme={null}
      // 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
          }
      }
      ```

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

  <Tab title="Permission Management">
    **Post and content permission controls**

    Permission 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

    <CodeGroup>
      ```swift iOS theme={null}
      let page = AmityCommunityPostPermissionPage(community: community)
      let viewController = AmitySwiftUIHostingController(rootView: page)
      ```

      ```kotlin Android theme={null}
      @Composable
      fun composeCommunityPostPermissionPage(community: AmityCommunity) {
          AmityCommunityPostPermissionPage(
              community = community,
          )
      }
      ```

      ```typescript React theme={null}
      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>
        );
      };
      ```

      ```dart Flutter theme={null}
      Widget communityPostPermissionPage(AmityCommunity community) {
        return AmityCommunityPostPermissionPage(community: community);
      }
      ```
    </CodeGroup>

    ### Navigation Behavior

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

    <CodeGroup>
      ```swift iOS theme={null}
      // 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
      }
      ```

      ```kotlin Android theme={null}
      // 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
      }
      ```

      ```typescript React theme={null}
      const SamplePermissionWithNavigation = () => {
        return (
          <AmityUiKitProvider
            pageBehavior={{
              AmityCommunitySettingPageBehavior: {
                goToPostPermissionPage: (context) => {
                  // Custom post permission navigation
                },
              },
            }}
          >
            <AmityCommunityPostPermissionPage community={{}} />
          </AmityUiKitProvider>
        );
      };
      ```
    </CodeGroup>
  </Tab>
</Tabs>

## Related Components

<CardGroup cols={3}>
  <Card title="Communities" href="/uikit/components/social/communities" icon="building">
    **Core Community Features**
    Community setup, profiles, and content feeds
  </Card>

  <Card title="Community Membership" href="/uikit/components/social/community-membership" icon="users">
    **Member Management**
    Member administration, invitations, and join requests
  </Card>

  <Card title="Content Moderation" href="/uikit/components/social/moderation" icon="shield">
    **General Moderation**
    Platform-wide content moderation tools
  </Card>

  <Card title="Posts & Media" href="/uikit/components/social/posts" icon="file">
    **Post Components**
    Post creation and management features
  </Card>

  <Card title="Users & Profiles" href="/uikit/components/social/users" icon="user">
    **User Management**
    User profiles and administrative controls
  </Card>

  <Card title="Social Feeds" href="/uikit/components/social/feeds" icon="newspaper">
    **Feed Components**
    Social feed display and management
  </Card>
</CardGroup>

<Tip>
  **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](/uikit/components/social/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.
</Tip>
