HomeFeed Item

Overview

The HomeFeedItem component is responsible for rendering individual feed items within the chat screen. It displays information such as the chatroom title, description, participants, and messages, and provides interaction options like joining a chatroom or viewing messages. The component also manages dynamic states like whether the user has joined a chatroom or if the chatroom is pinned.

GitHub File:

• HomeFeedItem

Styling Customisation

These styling customisations can be applied through the setHomeFeedStyle method on the

Property	Type	Description
avatar	Avatar	Represents the styling for the avatar
title	Title	Represents the styling for the title text
lastConversation	LastConversation	Represents the styling for the last conversation text
unreadCount	UnreadCount	Represents the styling for the unread message count
lastConversationTime	LastConversationTime	Represents the styling for the last conversation time

Avatar

Property	Type	Description
borderRadius	string	Defines the border radius of avatar

Title

Property	Type	Description
color	string	Defines the color of title text
fontSize	number	Defines the font size of title text
fontFamily	string	Defines the font family of title text

LastConversation

Property	Type	Description
color	string	Defines the color of the last conversation text
fontSize	number	Defines the font size of the last conversation text
fontFamily	string	Defines the font family of the last conversation text

UnreadCount

Property	Type	Description
color	string	Defines the color of unread count text
fontSize	number	Defines the font size of unread count
fontFamily	string	Defines the font family of unread count
borderRadius	string	Defines the border radius of unread count badge
backgroundColor	string	Defines the background color of unread count badge

LastConversationTime

Property	Type	Description
color	string	Defines the color of the last conversation time
fontSize	number	Defines the font size of the last conversation time
fontFamily	string	Defines the font family of the last conversation time

Usage Example

• Call the setHomeFeedStyle method on the STYLES class to set styling customisations.

import {STYLES} from "@likeminds.community/chat-rn-core"

STYLES.setHomeFeedStyle({
  avatar: {
    borderRadius: 10,
  },
  title: {
    color: 'blue',
    fontSize: 20
  },
  lastConversation: {
    fontSize: 20
  },
  lastConversationTime: {
    fontSize: 16
  }
})