UIKit Component : Event components are built on top of the social.plus SDK, providing ready-to-use event creation and discovery UI with full data management handled automatically.
Feature Overview The Event feature in social.plus UIKit v4 enables users to create scheduled events, discover upcoming/past events, manage attendees, and navigate between event-related experiences.
Key Features
Event Creation Schedule events with rich details
Select where to create the event (community/user)
Configure details (name, description, date & time)
In-person or virtual options
Optional cover image
Event Discovery Explore and manage your events
My events feed vs explore events feed
Upcoming events page
Past events page
Community-specific event feed
Attendees & RSVP Track and manage attendance
RSVP (Going/Interested/Not going)
Attendees list
Navigate to attendee profiles
Feature iOS Android Web Flutter React Native Event Creation ✅ ✅ ✅ - - Event Detail & Attendees ✅ ✅ ✅ - - Event discovery ✅ ✅ ✅ - - Event in community profile ✅ ✅ ✅ - -
Permission Handling Spec 6 defines the visibility rules for entry points that trigger event creation:
Global feed : Only users with global permission will see the create event button
Check: client.hasPermission(AmityPermission.createEvent)
Community feed : Users with global OR community permission will see the create event button
Check: client.hasPermission(AmityPermission.createEvent, communityId)
UIKit applies these permission checks automatically. If you implement your own custom entry points, keep the same permission logic for consistent UX.
Implementation Guide Event Creation
Event Details
Event Discovery
Event Target Selection Page Use AmityEventTargetSelectionPage to choose the destination for the event (e.g., community or user). Customization Options Config ID Type Description select_event_target_page/*/*Page Customize page theme select_event_target_page/*/close_buttonElement Customize close button image select_event_target_page/*/titleElement Customize page title
Code Examples let page = AmityEventTargetSelectionPage () let viewController = AmitySwiftUIHostingController ( rootView : page) navigationController ? . pushViewController (viewController, animated : true )
Event Setup Page Use AmityEventSetupPage to create or edit an event. Public API alignment: enum AmityEventSetupPageMode { case create (targetId, targetName) case edit (AmityEvent) } AmityEventSetupPage ( mode : AmityEventSetupPageMode)
Customization Options Config ID Type Description event_setup_page/*/*Page Customize page theme event_setup_page/*/titleElement Customize title event_setup_page/*/camera_buttonElement Customize camera label/icon event_setup_page/*/image_buttonElement Customize photo label/icon event_setup_page/*/event_name_titleElement Customize “Event name” label event_setup_page/*/event_details_titleElement Customize “Event details” label event_setup_page/*/event_date_time_titleElement Customize “Date and time” label event_setup_page/*/event_location_titleElement Customize “Location” label
Code Examples // 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))
Event Detail Page Use AmityEventDetailPage to view event details and access event actions. Public API alignment: AmityEventDetailPage ( eventId : string)
Code Examples let page = AmityEventDetailPage ( eventId : "<eventId>" ) let viewController = AmitySwiftUIHostingController ( rootView : page) navigationController ? . pushViewController (viewController, animated : true )
Event Attendees Page Use AmityEventAttendeesPage to browse attendees and navigate to a user profile. Public API alignment (Spec 6): AmityEventAttendeesPage ( eventId : string)
Code Examples let page = AmityEventAttendeesPage ( eventId : "<eventId>" ) let viewController = AmitySwiftUIHostingController ( rootView : page) navigationController ? . pushViewController (viewController, animated : true )
Upcoming & Past Events Pages Use AmityUpcomingEventsPage and AmityPastEventsPage to browse events by time. Customization Options Config ID Type Description upcoming_events_page/*/*Page Customize upcoming events page past_events_page/*/*Page Customize past events page
Feed Components Event discovery surfaces embedded in existing feature pages Spec 6 aligns the Event feature with these components:
AmityExploreEventFeedComponent AmityMyEventFeedComponent AmityCommunityEventFeedComponent AmityEventInfoComponent AmityEventDiscussionFeedComponent These components are typically used inside existing UIKit pages (e.g., Social Home and Community Profile). If you’re using the standard Social Home experience, you get these feeds automatically. Customization Options Config ID Type Description social_home_page/my_event_feed_component/*Component Customize My Event feed section social_home_page/explore_event_feed_component/*Component Customize Explore Event feed section community_profile_page/*/create_event_buttonElement Customize create event button label social_home_page/create_post_menu/create_event_buttonElement Customize create-event entry in create-post menu
If you need to hook navigation (e.g., “View all upcoming”), use the corresponding Behavior class documented in the next tab.
Customization Spec 6 provides these customization keys for event entry points and pages.
{ "*/community_sidebar/events_sidebar_menu_item" : { "text" : "Events" , "icon" : "" }, "social_home_page/*/events_button" : { "text" : "Events" }, "social_home_page/create_post_menu/create_event_button" : { "text" : "Event" , "image" : "" }, "community_profile_page/*/create_event_button" : { "text" : "Event" }, "select_event_target_page/*/title" : { "text" : "Create event" }, "event_setup_page/*/title" : { "text" : "Create event" }, "upcoming_events_page/*/*" : {}, "past_events_page/*/*" : {} }
