Skip to main content

CommentsObject

Interfaces

CommentsObjectProps

Indexable

[p: string]: any

Other props

Properties

PropertyTypeDescription
cacheStrategy?CacheStrategiesCaching strategies Default CacheStrategies.CACHE_FIRST
className?stringOverrides or extends the styles applied to the component. Default null
CommentComponent?(inProps) => ElementCommentComponent component Usefull to override the single Comment render component Default CommentObject
CommentComponentProps?CommentObjectPropsProps to spread to single comment object Default {variant: 'outlined'}
CommentObjectSkeletonProps?anyProps to spread to single comment object skeleton Default {elevation: 0, WidgetProps: {variant: 'outlined'}},
comments?SCCommentType[]Comments to show
CommentsObjectSkeletonProps?anyProps to spread to CommentsObjectSkeleton Default {}
disablePaginationLinks?booleanAdd/remove pagination links on top/bottom of items Default false
endComments?SCCommentType[]Add/show other comments at the end of the component Useful when there is a new comment (reply feed object)
feedObject?SCFeedObjectTypeFeed object Default null
feedObjectId?numberId of feed object Default null
feedObjectType?DISCUSSION | POST | STATUSType of feed object Default SCContributionType.POST
handleNext?() => voidHandle load next comments callback
handlePrevious?() => voidHandle load previous comments callback
hidePaginationLinks?booleanShow/hide pagination links Default true
id?stringId of the CommentsObject Default comments_object_feedObjectType_feedObjectId
infiniteScrolling?booleanEnable/disable infinite scrolling If there is comments in startCommments/endComments infiniteScrolling will be disabled Default true
inPlaceLoadMoreContents?booleanLoad more contents in place rather than opening a new page
isLoadingNext?booleanIs loading next comments If exist load next button is replaced by comment skeleton
isLoadingPrevious?booleanIs loading previous comments If exist load previous button is replaced by comment skeleton
next?stringNext url If exist show load next button
nextPage?numberNext page
page?numberCurrent page
PaginationLinkProps?Record<string, any>Props to spread to the pagination Link component Default {}
paginationLinksPageQueryParam?stringPage query parameter name Default 'page'
previous?stringPrevious url If exist show load previous button
previousPage?numberPrevious page
startComments?SCCommentType[]Add/show other comments at the head of the component Useful when there is a new comment (reply feed object)
totalComments?numberTotal number of comments
totalLoadedComments?numberNumber of comments loaded

Functions

CommentsObject()

CommentsObject(inProps): Element

API documentation for the Community-JS Comments Object component. Learn about the available props and the CSS API.

Import

import {CommentsObject} from '@selfcommunity/react-ui';

Component Name

The name SCCommentsObject can be used when providing style overrides in the theme.

CSS

Rule NameGlobal classDescription
root.SCCommentsObject-rootStyles applied to the root element.
pagination.SCCommentsObject-paginationStyles applied to the pagination controls.
paginationLink.SCCommentsObject-pagination-linkStyles applied to the pagination link.
loadNextCommentsButton.SCCommentsObject-load-next-comments-buttonStyles applied to the load next comments button.
loadPreviousCommentsButton.SCCommentsObject-load-previous-comments-buttonStyles applied to the load previous comments button.
commentsCounter.SCCommentsObject-comments-counterStyles applied to the comments counter element.

Parameters

ParameterTypeDescription
inPropsCommentsObjectProps

Returns

Element


CommentsObjectSkeleton()

CommentsObjectSkeleton(props): Element

API documentation for the Community-JS Comments Object Skeleton component. Learn about the available props and the CSS API.

Import

import {CommentsObjectSkeleton} from '@selfcommunity/react-ui';

Component Name

The name SCCommentsObject-skeleton-root can be used when providing style overrides in the theme.

CSS

Rule NameGlobal classDescription
root.SCCommentsObject-skeleton-rootStyles applied to the root element.

Parameters

ParameterType
props{[p: string]: any; CommentObjectSkeletonProps: any; count: number; }
props.CommentObjectSkeletonProps?any
props.count?number

Returns

Element