mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-11-05 15:00:30 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

hide bubble for event content

Browse source
This commit is contained in:
Ajay Bura 2025-09-14 22:00:15 +05:30
parent 622e67d565
commit 3b89ecebf0
3 changed files with 18 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/app/components/message/content/EventContent.tsx
View file

@ -34,7 +34,11 @@ export function EventContent({ messageLayout, time, iconSrc, content }: EventCon
return <CompactLayout before={beforeJSX}>{msgContentJSX}</CompactLayout>; return <CompactLayout before={beforeJSX}>{msgContentJSX}</CompactLayout>;
} }
if (messageLayout === MessageLayout.Bubble) { if (messageLayout === MessageLayout.Bubble) {
return <BubbleLayout before={beforeJSX}>{msgContentJSX}</BubbleLayout>; return (
<BubbleLayout hideBubble before={beforeJSX}>
{msgContentJSX}
</BubbleLayout>
);
} }
return <ModernLayout before={beforeJSX}>{msgContentJSX}</ModernLayout>; return <ModernLayout before={beforeJSX}>{msgContentJSX}</ModernLayout>;
} }

19
src/app/components/message/layout/Bubble.tsx
View file

@ -5,22 +5,27 @@ import * as css from './layout.css';
type BubbleLayoutProps = { type BubbleLayoutProps = {
self?: boolean; self?: boolean;
hideBubble?: boolean;
before?: ReactNode; before?: ReactNode;
}; };
export const BubbleLayout = as<'div', BubbleLayoutProps>( export const BubbleLayout = as<'div', BubbleLayoutProps>(
({ self, before, children, ...props }, ref) => ( ({ self, hideBubble, before, children, ...props }, ref) => (
<Box direction={self ? 'RowReverse' : 'Row'} gap="300" {...props} ref={ref}> <Box direction={self ? 'RowReverse' : 'Row'} gap="300" {...props} ref={ref}>
<Box className={css.BubbleBefore} shrink="No"> <Box className={css.BubbleBefore} shrink="No">
{before} {before}
</Box> </Box>
<Box <Box
className={classNames( className={
css.BubbleContent, hideBubble
before ? css.BubbleContentArrow : undefined, ? undefined
before && self ? css.BubbleContentArrowRight : undefined, : classNames(
before && !self ? css.BubbleContentArrowLeft : undefined css.BubbleContent,
)} before ? css.BubbleContentArrow : undefined,
before && self ? css.BubbleContentArrowRight : undefined,
before && !self ? css.BubbleContentArrowLeft : undefined
)
}
direction="Column" direction="Column"
> >
{children} {children}

2
src/app/components/message/layout/layout.css.ts
View file

@ -136,7 +136,7 @@ export const ModernBefore = style({
export const BubbleBefore = style([ export const BubbleBefore = style([
ModernBefore, ModernBefore,
{ {
minWidth: toRem(22), minWidth: toRem(24),
}, },
]); ]);