Feed
Interfaces
FeedProps
Properties
Property | Type | Description |
---|---|---|
CustomAdvProps? | CustomAdvProps | Props to spread to single custom adv element (this props can be used only if Custom Adv are enabled) Default {} |
FeedSidebarProps? | StickyBoxProps | Props to spread to the sidebar Default {} |
FooterComponent? | ElementType <any > | Component used as footer. It will be displayed after the end messages Default <Footer> |
FooterComponentProps? | any | Props to spread to FooterComponent Default empty object |
HeaderComponent? | Element | Component used as header. It will be displayed at the beginning of the feed Default null |
ItemComponent | ElementType <any > | Component used to render single feed item retrieved by the endpoint |
ItemProps? | any | Props to spread to single feed item Default empty object |
ItemSkeleton | ElementType <any > | Skeleton used to render loading effect during fetch |
ItemSkeletonProps? | any | Props to spread to single feed item skeleton Default empty object |
PaginationLinkProps? | Record <string , any > | Props to spread to the pagination Link component Default {} |
VirtualizedScrollerProps? | VirtualizedScrollerCommonProps | Props to spread to VirtualizedScroller object. Default {} |
cacheStrategy? | CacheStrategies | Caching strategies Default CacheStrategies.CACHE_FIRST |
className? | string | Overrides or extends the styles applied to the component. Default null |
disablePaginationLinks? | boolean | Add/remove pagination links on top/bottom of items Default false |
emptyFeedPlaceholder? | ReactNode | Empty feed placeholder, rendered when no feed item can be displayed Default null |
enabledCustomAdvPositions? | SCCustomAdvPosition [] | Props to programmatically enable the custom adv position in the feed Default [SCCustomAdvPosition.POSITION_FEED_SIDEBAR, SCCustomAdvPosition.POSITION_FEED] |
endMessage? | ReactNode | End message, rendered when no more feed item can be displayed Default <FormattedMessage id="ui.feed.noOtherFeedObject" defaultMessage="ui.feed.noOtherFeedObject" /> |
endpoint | EndpointType | Feed API Endpoint |
endpointQueryParams? | Record <string , string | number > | Feed API Query Params Default [{'limit': 5}] |
hideAdvs? | boolean | Show/hide adv banners Default false |
hidePaginationLinks? | boolean | Show/hide pagination links Default true |
id? | string | Id of the feed object Default 'feed' |
itemIdGenerator | (item : any ) => any | Function used to generate an id from the single result returned by the Endpoint |
itemPropsGenerator | (scUser : SCUserType , item : any ) => any | Function used to convert the single result returned by the Endpoint into the props necessary to render the ItemComponent |
onNextData? | (page : number , offset : number , total : number , data : any []) => any | Callback invoked whenever data is loaded during paging next |
onPreviousData? | (page : number , offset : number , total : number , data : any []) => any | Callback invoked whenever data is loaded during paging previous |
paginationLinksPageQueryParam? | string | Page query parameter name Default 'page' |
prefetchedData? | SCPaginatedResponse <SCFeedUnitType > | Prefetch data. Useful for SSR. Use this to init the component (in particular useSCFetchFeed) |
refreshMessage? | ReactNode | Refresh message, rendered when no more feed item can be displayed Default <FormattedMessage id="ui.feed.refreshRelease" defaultMessage="ui.feed.refreshRelease" /> |
requireAuthentication? | boolean | Authenticated or not |
scrollableTargetId? | string | If the feed is being rendered in a "scrollable container" (for example, if one of the parent elements of the list is styled with max-height and overflow: auto), then passing the "scrollableTargetId" |
widgets? | SCFeedWidgetType [] | Widgets to insert into the feed Default empty array |
Type Aliases
FeedRef
FeedRef:
object
FeedRef props
Type declaration
Member | Type |
---|---|
addFeedData | (obj , syncPagination ?) => void |
refresh | () => void |
Source
packages/react-ui/src/components/Feed/Feed.tsx:65
FeedSidebarProps
FeedSidebarProps:
StickyBoxProps
FeedSidebarProps has the same props as StickyBoxProps type
Source
packages/react-ui/src/components/Feed/Feed.tsx:60
Functions
FeedSkeleton()
FeedSkeleton(
props
):JSX.Element
API documentation for the Community-JS Feed Skeleton component. Learn about the available props and the CSS API.
Import
import {FeedSkeleton} from '@selfcommunity/react-ui';
Component Name
The name SCFeed-skeleton-root
can be used when providing style overrides in the theme.
CSS
Rule Name | Global class | Description |
---|---|---|
root | .SCFeed-skeleton-root | Styles applied to the root element. |
left | .SCFeed-left | Styles applied to the left section. |
right | .SCFeed-right | Styles applied to the right section. |
Parameters
Parameter | Type |
---|---|
props | FeedSkeletonProps |
Returns
JSX.Element
Source
packages/react-ui/src/components/Feed/Skeleton.tsx:56
feed()
feed(
props
):ReactElement
<any
,string
|JSXElementConstructor
<any
>>
NOTE: Exotic components are not callable.
Parameters
Parameter | Type |
---|---|
props | FeedProps & RefAttributes <FeedRef > |
Returns
ReactElement
<any
, string
| JSXElementConstructor
<any
>>