UIKit Component : User components are built on top of the social.plus SDK, providing ready-to-use user profile and relationship management UI with full data management handled automatically.
Feature Overview
The User feature in social.plus UIKit v4 provides a comprehensive suite of components designed to manage user profiles, relationships, and interactions within your application. It encompasses functionalities ranging from profile display and editing to managing blocked users and follow requests, ensuring a seamless and engaging user experience.
Key Features
User Profiles & Display Comprehensive user profile management
User profile page with avatar, display name, and bio
User feed components (general, image, video feeds)
User profile header with relationship controls
Post creation and interaction capabilities
Profile Management Profile editing and customization
Edit user profile details and avatar
Update display name and bio information
Profile personalization and management
Privacy settings and controls
Social Relationships Follow system and relationship management
Follow/unfollow user interactions
Followers and following lists management
Pending follow request handling
User blocking and unblocking functionality
Privacy & Safety User safety and privacy controls
Blocked users management
Follow request approval system
User reporting and safety features
Privacy-based content access control
Implementation Guide
User Profiles & Display Profile Management Social Relationships User profile pages and feed components for displaying user information and content User Profile components provide comprehensive tools for displaying user information, managing user feeds, and handling user interactions within the social platform. User Profile Page The user profile page displays user information, follow relationships, following and followers count, manages blocked users, enables profile editing, handles follow requests, shows created post feeds, and provides post creation actions. Features Feature Description User Information Display user name, description, following and follower count Follow Request User can accept or decline follow request from other users User Feed Display post, image and video feed posts created by the user Post Creation Allow user to create a post on own timeline Other User Information User can view other user profile and can follow/unfollow/block that user
Required Properties Property Type Description userId
String
The user ID for the profile to display
Customization Options Config ID Type Description user_profile_page/*/*
Page Customize page theme user_profile_page/*/back_button
Element Customize back button image user_profile_page/*/menu_button
Element Customize menu button image user_profile_page/*/user_feed_tab_button
Element Customize user feed tab image user_profile_page/*/user_image_feed_tab_button
Element Customize image feed tab image user_profile_page/*/user_video_feed_tab_button
Element Customize video feed tab image
Code Examples let page = AmityUserProfilePage ( userId : "user-id" )
let viewController = AmitySwiftUIHostingController ( rootView : page)
navigationController ? . pushViewController (viewController, animated : true )
The User Profile Header component displays user information, follow relationship, following and followers count, and handles follow request acceptance or decline. Features Feature Description User Information Display user name, description, following and follower count Follow Request User can accept or decline follow request from other users
Required Properties Property Type Description user
AmityUser
The user object for the profile header
Customization Options Config ID Type Description user_profile_page/user_profile_header/*
Component Customize component theme user_profile_page/user_profile_header/follow_user_button
Element Customize follow button text and image user_profile_page/user_profile_header/following_user_button
Element Customize following button text and image user_profile_page/user_profile_header/unblock_user_button
Element Customize unblock button text and image user_profile_page/user_profile_header/user_following
Element Customize following count text user_profile_page/user_profile_header/user_follower
Element Customize follower count text
Code Examples let component = AmityUserProfileHeaderComponent ( user : user)
let viewController = AmitySwiftUIHostingController ( rootView : component)
User Feed Components User feed components display different types of content created by users, including general posts, images, and videos. User Feed Component The User Feed Component displays a list of posts created by the user with interaction capabilities. Features:
Display a list of posts created by user
User can perform creating comment and adding reaction to post
Customization Options: Config ID Type Description user_profile_page/user_feed/*
Component Customize component theme user_profile_page/user_feed/empty_user_feed
Element Customize empty state text and image user_profile_page/user_feed/private_user_feed
Element Customize private feed text and image user_profile_page/user_feed/blocked_user_feed
Element Customize blocked user feed text and image
User Image Feed Component The User Image Feed Component displays a list of images from posts created by the user. Customization Options: Config ID Type Description user_profile_page/user_image_feed/*
Component Customize component theme user_profile_page/user_image_feed/empty_user_image_feed
Element Customize empty state text and image user_profile_page/user_image_feed/private_user_image_feed
Element Customize private feed text and image
User Video Feed Component The User Video Feed Component displays a list of videos from posts created by the user. Customization Options: Config ID Type Description user_profile_page/user_video_feed/*
Component Customize component theme user_profile_page/user_video_feed/empty_user_video_feed
Element Customize empty state text and image user_profile_page/user_video_feed/private_user_video_feed
Element Customize private feed text and image
Code Examples // User Feed Component
let userFeed = AmityUserFeedComponent ( userId : "user-id" )
// User Image Feed Component
let imageFeed = AmityUserImageFeedComponent ( userId : "user-id" )
// User Video Feed Component
let videoFeed = AmityUserVideoFeedComponent ( userId : "user-id" )
let viewController = AmitySwiftUIHostingController ( rootView : userFeed)
Navigation Behavior // User Profile Page Navigation
class CustomUserProfilePageBehavior : AmityUserProfilePageBehavior {
override init () {
super . init ()
}
override func goToEditUserPage ( context : AmityUserProfilePageBehavior.Context) {
// Navigate to edit profile page
}
override func goToBlockedUsersPage ( context : AmityUserProfilePageBehavior.Context) {
// Navigate to blocked users page
}
override func goToPostComposerPage ( context : AmityUserProfilePageBehavior.Context) {
// Navigate to post composer
}
}
// User Profile Header Navigation
class CustomUserProfileHeaderComponentBehavior : AmityUserProfileHeaderComponentBehavior {
override func goToUserRelationshipPage ( context : AmityUserProfileHeaderComponentBehavior.Context) {
// Navigate to relationship page
}
override func goToPendingFollowRequestPage ( context : AmityUserProfileHeaderComponentBehavior.Context) {
// Navigate to pending follow requests
}
}
Implementation Strategy : Start with the User Profile Page as your central user experience hub, then implement the Edit Profile functionality for user personalization. Add social relationship features (follow/unfollow, blocking) based on your application’s social interaction requirements. Consider implementing follow request workflows for private accounts and ensure smooth navigation between user profiles, relationship management, and safety features. Focus on providing clear feedback for all social actions and maintain consistent user experience across profile viewing, editing, and relationship management workflows.