diff --git a/src/components/input/Textarea/index.tsx b/src/components/input/Textarea/index.tsx index f7d5f180..f9b29915 100644 --- a/src/components/input/Textarea/index.tsx +++ b/src/components/input/Textarea/index.tsx @@ -49,7 +49,7 @@ const Textarea = memo( }) => { const [rows, setRows] = useState(minRows || 1); const [focused, setFocused] = useState(false); - const ref = useRef(); + const ref = useRef(null); const onInput = useCallback( ({ target }: ChangeEvent) => handler(target.value), @@ -64,7 +64,10 @@ const Textarea = memo( if (!target) return; autosize(target); - setRef(target); + + if (setRef) { + setRef(target); + } return () => autosize.destroy(target); }, [ref, setRef]); diff --git a/src/components/profile/Message/index.tsx b/src/components/profile/Message/index.tsx index 83b9a7be..cb947783 100644 --- a/src/components/profile/Message/index.tsx +++ b/src/components/profile/Message/index.tsx @@ -9,6 +9,7 @@ import { CommentMenu } from '~/components/comment/CommentMenu'; import { MessageForm } from '~/components/profile/MessageForm'; import { Filler } from '~/components/containers/Filler'; import { Button } from '~/components/input/Button'; +import markdown from '~/styles/common/markdown.module.scss'; interface IProps { message: IMessage; @@ -66,7 +67,10 @@ const Message: FC = ({ ) : (
{!incoming && } - +
)} diff --git a/src/components/profile/Message/styles.module.scss b/src/components/profile/Message/styles.module.scss index 4f11e976..3eea4337 100644 --- a/src/components/profile/Message/styles.module.scss +++ b/src/components/profile/Message/styles.module.scss @@ -9,6 +9,7 @@ $outgoing_color: $comment_bg; flex-direction: row; padding: 0 0 0 42px; position: relative; + word-break: break-word; .avatar { // margin: 0 0 0 10px; diff --git a/src/utils/dom.ts b/src/utils/dom.ts index d02f1af1..6d414348 100644 --- a/src/utils/dom.ts +++ b/src/utils/dom.ts @@ -80,18 +80,17 @@ export const getURLFromString = ( size?: typeof PRESETS[keyof typeof PRESETS] ): string => { if (size) { - return url - .replace('REMOTE_CURRENT://', `${process.env.REACT_APP_REMOTE_CURRENT}cache/${size}/`) - .replace('REMOTE_OLD://', process.env.REACT_APP_REMOTE_OLD); + return url.replace( + 'REMOTE_CURRENT://', + `${process.env.REACT_APP_REMOTE_CURRENT}cache/${size}/` + ); } - return url - .replace('REMOTE_CURRENT://', process.env.REACT_APP_REMOTE_CURRENT) - .replace('REMOTE_OLD://', process.env.REACT_APP_REMOTE_OLD); + return url.replace('REMOTE_CURRENT://', process.env.REACT_APP_REMOTE_CURRENT); }; export const getURL = (file: Partial, size?: typeof PRESETS[keyof typeof PRESETS]) => { - return file?.url ? getURLFromString(file.url, size) : null; + return file?.url ? getURLFromString(file.url, size) : ''; }; export const formatText = pipe( @@ -105,7 +104,7 @@ export const formatText = pipe( formatTextClickableUsernames ); -export const formatTextParagraphs = (text: string): string => (text && formatText(text)) || null; +export const formatTextParagraphs = (text: string): string => (text && formatText(text)) || ''; export const findBlockType = (line: string): ValueOf => { const match = Object.values(COMMENT_BLOCK_DETECTORS).find(detector => line.match(detector.test)); @@ -121,12 +120,16 @@ export const splitCommentByBlocks = (text: string): ICommentBlock[] => content: line, })); -export const formatCommentText = (author: string, text: string): ICommentBlock[] => - text ? splitCommentByBlocks(text) : null; +export const formatCommentText = (author?: string, text?: string): ICommentBlock[] => + author && text ? splitCommentByBlocks(text) : []; export const formatCellText = (text: string): string => formatTextParagraphs(text); -export const getPrettyDate = (date: string): string => { +export const getPrettyDate = (date?: string): string => { + if (!date) { + return ''; + } + if (differenceInMonths(new Date(), new Date(date)) >= 3) { return format(new Date(date), 'd MMMM yyyy', { locale: ru }); }