Skip to content

feat: Implemented InlineCode handling in Bold, Italic and Strike #31349

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ggazzo merged 10 commits into from
Jan 24, 2024
Merged

feat: Implemented InlineCode handling in Bold, Italic and Strike #31349

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
0eb3053
Implemented InlineCode handling in Bold, Italic and Strike
sdey09 Jan 1, 2024
bae280f
Merge branch 'develop' into ISSUE-1213
hugocostadev Jan 8, 2024
ee6c8a5
Merge branch 'develop' into ISSUE-1213
sdey09 Jan 10, 2024
707cb3e
Merge branch 'develop' into ISSUE-1213
hugocostadev Jan 12, 2024
eeb3804
update message-parser package version
hugocostadev Jan 17, 2024
bf502b2
Merge remote-tracking branch 'origin/develop' into ISSUE-1213
hugocostadev Jan 18, 2024
c1510a7
fix: including InlineCode to missing places
hugocostadev Jan 18, 2024
fe99668
fix: gazzodown lint
hugocostadev Jan 18, 2024
047eb98
Create calm-carrots-judge.md
ggazzo Jan 24, 2024
ffce14b
Merge branch 'develop' into ISSUE-1213
ggazzo Jan 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 9 additions & 2 deletions packages/gazzodown/src/elements/BoldSpan.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import type * as MessageParser from '@rocket.chat/message-parser';
import type { ReactElement } from 'react';
import { lazy } from 'react';

import EmojiElement from '../emoji/EmojiElement';
import ChannelMentionElement from '../mentions/ChannelMentionElement';
Expand All @@ -9,12 +10,15 @@ import LinkSpan from './LinkSpan';
import PlainSpan from './PlainSpan';
import StrikeSpan from './StrikeSpan';

const CodeElement = lazy(() => import('../code/CodeElement'));

type MessageBlock =
| MessageParser.Emoji
| MessageParser.ChannelMention
| MessageParser.UserMention
| MessageParser.Link
| MessageParser.MarkupExcluding<MessageParser.Bold>;
| MessageParser.MarkupExcluding<MessageParser.Bold>
| MessageParser.InlineCode;

type BoldSpanProps = {
children: MessageBlock[];
Expand All @@ -23,7 +27,7 @@ type BoldSpanProps = {
const BoldSpan = ({ children }: BoldSpanProps): ReactElement => (
<>
{children.map((block, index) => {
if (block.type === 'LINK' || block.type === 'PLAIN_TEXT' || block.type === 'STRIKE' || block.type === 'ITALIC') {
if (block.type === 'LINK' || block.type === 'PLAIN_TEXT' || block.type === 'STRIKE' || block.type === 'ITALIC' || block.type === 'INLINE_CODE' ) {
return <strong key={index}>{renderBlockComponent(block, index)}</strong>;
}
return renderBlockComponent(block, index);
Expand Down Expand Up @@ -54,6 +58,9 @@ const renderBlockComponent = (block: MessageBlock, index: number): ReactElement
case 'ITALIC':
return <ItalicSpan key={index} children={block.value} />;

case 'INLINE_CODE':
return <CodeElement key={index} code={block.value.value} />;

default:
return null;
}
Expand Down
11 changes: 9 additions & 2 deletions packages/gazzodown/src/elements/ItalicSpan.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import type * as MessageParser from '@rocket.chat/message-parser';
import type { ReactElement } from 'react';
import { lazy } from 'react';

import EmojiElement from '../emoji/EmojiElement';
import ChannelMentionElement from '../mentions/ChannelMentionElement';
Expand All @@ -9,12 +10,15 @@ import LinkSpan from './LinkSpan';
import PlainSpan from './PlainSpan';
import StrikeSpan from './StrikeSpan';

const CodeElement = lazy(() => import('../code/CodeElement'));

type MessageBlock =
| MessageParser.Emoji
| MessageParser.ChannelMention
| MessageParser.UserMention
| MessageParser.Link
| MessageParser.MarkupExcluding<MessageParser.Italic>;
| MessageParser.MarkupExcluding<MessageParser.Italic>
| MessageParser.InlineCode;

type ItalicSpanProps = {
children: MessageBlock[];
Expand All @@ -23,7 +27,7 @@ type ItalicSpanProps = {
const ItalicSpan = ({ children }: ItalicSpanProps): ReactElement => (
<>
{children.map((block, index) => {
if (block.type === 'LINK' || block.type === 'PLAIN_TEXT' || block.type === 'STRIKE' || block.type === 'BOLD') {
if (block.type === 'LINK' || block.type === 'PLAIN_TEXT' || block.type === 'STRIKE' || block.type === 'BOLD' || block.type === 'INLINE_CODE') {
return <em key={index}>{renderBlockComponent(block, index)}</em>;
}
return renderBlockComponent(block, index);
Expand Down Expand Up @@ -54,6 +58,9 @@ const renderBlockComponent = (block: MessageBlock, index: number): ReactElement
case 'BOLD':
return <BoldSpan key={index} children={block.value} />;

case 'INLINE_CODE':
return <CodeElement key={index} code={block.value.value} />;

default:
return null;
}
Expand Down
11 changes: 9 additions & 2 deletions packages/gazzodown/src/elements/StrikeSpan.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import type * as MessageParser from '@rocket.chat/message-parser';
import type { ReactElement } from 'react';
import { lazy } from 'react';

import EmojiElement from '../emoji/EmojiElement';
import ChannelMentionElement from '../mentions/ChannelMentionElement';
Expand All @@ -9,12 +10,15 @@ import ItalicSpan from './ItalicSpan';
import LinkSpan from './LinkSpan';
import PlainSpan from './PlainSpan';

const CodeElement = lazy(() => import('../code/CodeElement'));

type MessageBlock =
| MessageParser.Emoji
| MessageParser.ChannelMention
| MessageParser.UserMention
| MessageParser.Link
| MessageParser.MarkupExcluding<MessageParser.Strike>;
| MessageParser.MarkupExcluding<MessageParser.Strike>
| MessageParser.InlineCode;

type StrikeSpanProps = {
children: MessageBlock[];
Expand All @@ -23,7 +27,7 @@ type StrikeSpanProps = {
const StrikeSpan = ({ children }: StrikeSpanProps): ReactElement => (
<>
{children.map((block, index) => {
if (block.type === 'LINK' || block.type === 'PLAIN_TEXT' || block.type === 'ITALIC' || block.type === 'BOLD') {
if (block.type === 'LINK' || block.type === 'PLAIN_TEXT' || block.type === 'ITALIC' || block.type === 'BOLD' || block.type === 'INLINE_CODE') {
return <del key={index}>{renderBlockComponent(block, index)}</del>;
}
return renderBlockComponent(block, index);
Expand Down Expand Up @@ -54,6 +58,9 @@ const renderBlockComponent = (block: MessageBlock, index: number): ReactElement
case 'BOLD':
return <BoldSpan key={index} children={block.value} />;

case 'INLINE_CODE':
return <CodeElement key={index} code={block.value.value} />;

default:
return null;
}
Expand Down