66 lines
1.8 KiB
TypeScript
66 lines
1.8 KiB
TypeScript
import type { FC, TeactNode } from '../../../../lib/teact/teact';
|
|
import React, { memo } from '../../../../lib/teact/teact';
|
|
|
|
import type { ApiWebDocument } from '../../../../api/types';
|
|
|
|
import { getFirstLetters } from '../../../../util/textFormat';
|
|
import renderText from '../../../common/helpers/renderText';
|
|
import useMedia from '../../../../hooks/useMedia';
|
|
import { preventMessageInputBlurWithBubbling } from '../../helpers/preventMessageInputBlur';
|
|
|
|
import ListItem from '../../../ui/ListItem';
|
|
|
|
import './BaseResult.scss';
|
|
|
|
export type OwnProps = {
|
|
focus?: boolean;
|
|
thumbnail?: ApiWebDocument;
|
|
thumbUrl?: string;
|
|
title?: string;
|
|
description?: string;
|
|
transitionClassNames?: string;
|
|
onClick: NoneToVoidFunction;
|
|
};
|
|
|
|
const BaseResult: FC<OwnProps> = ({
|
|
title,
|
|
description,
|
|
thumbnail,
|
|
thumbUrl,
|
|
focus,
|
|
transitionClassNames = '',
|
|
onClick,
|
|
}) => {
|
|
let content: TeactNode | undefined;
|
|
|
|
const thumbnailDataUrl = useMedia(thumbnail ? `webDocument:${thumbnail.url}` : undefined);
|
|
thumbUrl = thumbUrl || thumbnailDataUrl;
|
|
|
|
if (thumbUrl) {
|
|
content = (
|
|
<img src={thumbUrl} className={transitionClassNames} alt="" decoding="async" draggable={false} />
|
|
);
|
|
} else if (title) {
|
|
content = getFirstLetters(title, 1);
|
|
}
|
|
|
|
return (
|
|
<ListItem
|
|
focus={focus}
|
|
className="BaseResult chat-item-clickable"
|
|
onMouseDown={preventMessageInputBlurWithBubbling}
|
|
onClick={onClick}
|
|
>
|
|
<span className="thumb">
|
|
{typeof content === 'string' ? renderText(content) : content}
|
|
</span>
|
|
<div className="content-inner">
|
|
{title && (<div className="title">{title}</div>)}
|
|
{description && (<div className="description">{description}</div>)}
|
|
</div>
|
|
</ListItem>
|
|
);
|
|
};
|
|
|
|
export default memo(BaseResult);
|