@nexusui/components
Version:
These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.
2 lines (1 loc) • 1.93 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("react"),i=require("@mui/material/Typography"),o=require("@mui/material/Box"),r=require("@mui/material/Stack"),a=require("./NotificationItem.styles.js"),s=require("./NotificationContent.js"),n=require("./StyledAvatarGroup.js"),d=require("../../../StatusAvatar/StatusAvatar.container.js");function c(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var u=c(i),l=c(o),f=c(r);const p="NexusNotificationItem";exports.NotificationItem=i=>{const{notification:o,onItemClick:r,t:c}=i,x=e.useMemo((()=>o.nestedNotifications?.length||0),[o.nestedNotifications?.length]),m=x>0,N=x>0?x-1:0,[h,y]=e.useState(!1),j=o.nestedNotifications?o.nestedNotifications?.map((t=>t.user)).filter((t=>void 0!==t)):[],v=x>0&&!h&&t.jsxs(f.default,{"data-testid":`${p}-expand-node`,spacing:2,direction:"row",justifyContent:"flex-start",alignItems:"center",sx:{pr:6,cursor:"pointer"},onClick:t=>{t.stopPropagation(),y(!0)},children:[j.length>0&&t.jsx(n.StyledAvatarGroup,{max:2,sx:a.styles.moreAvatars,children:j.map((t=>e.createElement(d.StatusAvatar,{...t,key:t.id,status:void 0,sx:{width:40,height:40}})))}),t.jsx(u.default,{variant:"body2",color:"primary",noWrap:!0,sx:{display:"block"},children:c("showMore",{0:x})})]}),C=h&&t.jsx(u.default,{"data-testid":`${p}-read-more`,variant:"body2",color:"primary",sx:{cursor:"pointer"},onClick:t=>{t.stopPropagation(),y((t=>!t))},children:c("showLess")});return t.jsxs(l.default,{sx:a.styles.container,className:`${p}-root`,"data-testid":`${p}-root`,children:[t.jsx(s.NotificationContent,{...i,nestedNode:v,showNestedLine:h},`NexusNotificationContent-root-${o.id}`),h&&m&&o.nestedNotifications?.map(((e,i)=>t.jsx(s.NotificationContent,{notification:e,onItemClick:r,t:c,isNested:h,showNestedLine:!0,nestedNode:i===N?C:void 0},`NexusNotificationContent-nested-${e.id}`)))]})},exports.prefix=p;