Skip to content

Commit 57aa611

Browse files
Merge pull request #13580 from The-Anton/OCPBUGS-25931
OCPBUGS-25931: fix for execute inline markdown syntax issue
2 parents fbca5b1 + f3e399d commit 57aa611

2 files changed

Lines changed: 49 additions & 42 deletions

File tree

frontend/packages/console-shared/src/components/markdown-extensions/inline-clipboard-extension.ts

Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { useMemo } from 'react';
22
import { useTranslation } from 'react-i18next';
33
import { MARKDOWN_COPY_BUTTON_ID, MARKDOWN_SNIPPET_ID } from './const';
4-
import { removeTemplateWhitespace } from './utils';
54

65
import './showdown-extension.scss';
76

@@ -19,20 +18,25 @@ const useInlineCopyClipboardShowdownExtension = () => {
1918
groupId: string,
2019
): string => {
2120
if (!group || !subGroup || !groupType || !groupId) return text;
22-
return removeTemplateWhitespace(
23-
`<span class="pf-v5-c-clipboard-copy pf-m-inline">
24-
<span class="pf-v5-c-clipboard-copy__text" ${MARKDOWN_SNIPPET_ID}="${groupType}">${group}</span>
25-
<span class="pf-v5-c-clipboard-copy__actions">
26-
<span class="pf-v5-c-clipboard-copy__actions-item">
27-
<button class="pf-v5-c-button pf-m-plain" aria-label="${t(
28-
'console-shared~Copy to clipboard',
29-
)}" ${MARKDOWN_COPY_BUTTON_ID}="${groupType}">
30-
<i class="fas fa-copy" />
31-
</button>
32-
</span>
33-
</span>
34-
</span>`,
35-
);
21+
return `<b><div class="pf-v5-c-code-block">
22+
<div class="pf-v5-c-code-block__header">
23+
<div class="pf-v5-c-code-block__actions">
24+
<div class="pf-v5-c-code-block__actions-item">
25+
<button class="pf-v5-c-button pf-m-plain" type="button" aria-label="${t(
26+
'console-shared~Copy to clipboard',
27+
)}" ${MARKDOWN_COPY_BUTTON_ID}="${groupType}">
28+
<i class="fas fa-copy" aria-hidden="true"></i>
29+
</button>
30+
</div>
31+
</div>
32+
</div>
33+
<div class="pf-v5-c-code-block__content">
34+
<pre class="pf-v5-c-code-block__pre ocs-code-block__pre">
35+
<code class="pf-v5-c-code-block__code"
36+
${MARKDOWN_SNIPPET_ID}="${groupType}">${group.trim()}</code>
37+
</pre>
38+
</div>
39+
</div></b>`;
3640
},
3741
}),
3842
[t],

frontend/packages/console-shared/src/components/markdown-extensions/inline-execute-extension.ts

Lines changed: 30 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { useMemo } from 'react';
22
import { useTranslation } from 'react-i18next';
33
import useCloudShellAvailable from '@console/webterminal-plugin/src/components/cloud-shell/useCloudShellAvailable';
44
import { MARKDOWN_COPY_BUTTON_ID, MARKDOWN_EXECUTE_BUTTON_ID, MARKDOWN_SNIPPET_ID } from './const';
5-
import { removeTemplateWhitespace } from './utils';
65

76
import './showdown-extension.scss';
87

@@ -21,32 +20,36 @@ const useInlineExecuteCommandShowdownExtension = () => {
2120
groupId: string,
2221
): string => {
2322
if (!group || !subGroup || !groupType || !groupId) return text;
24-
return removeTemplateWhitespace(
25-
`<span class="pf-v5-c-clipboard-copy pf-m-inline">
26-
<span class="pf-v5-c-clipboard-copy__text" ${MARKDOWN_SNIPPET_ID}="${groupId}">${group.trim()}</span>
27-
<span class="pf-v5-c-clipboard-copy__actions">
28-
<span class="pf-v5-c-clipboard-copy__actions-item">
29-
<button class="pf-v5-c-button pf-m-plain" aria-label="${t(
30-
'console-shared~Copy to clipboard',
31-
)}" ${MARKDOWN_COPY_BUTTON_ID}="${groupId}">
32-
<i class="fas fa-copy" aria-hidden="true"></i>
33-
</button>
34-
</span>
35-
${
36-
showExecuteButton
37-
? `<span class="pf-v5-c-clipboard-copy__actions-item ocs-markdown-execute-snippet__action">
38-
<button class="pf-v5-c-button pf-m-plain ocs-markdown-execute-snippet__button" aria-label="${t(
39-
'console-shared~Run in Web Terminal',
40-
)}" ${MARKDOWN_EXECUTE_BUTTON_ID}="${groupId}">
41-
<i class="fas fa-play" aria-hidden="true"></i>
42-
<i class="fas fa-check" aria-hidden="true"></i>
43-
</button>
44-
</span>`
45-
: ''
46-
}
47-
</span>
48-
</span>`,
49-
);
23+
return `<div class="pf-v5-c-code-block">
24+
<div class="pf-v5-c-code-block__header">
25+
<div class="pf-v5-c-code-block__actions">
26+
<div class="pf-v5-c-code-block__actions-item">
27+
<button class="pf-v5-c-button pf-m-plain" type="button" aria-label="${t(
28+
'console-shared~Copy to clipboard',
29+
)}" ${MARKDOWN_COPY_BUTTON_ID}="${groupType}">
30+
<i class="fas fa-copy" aria-hidden="true"></i>
31+
</button>
32+
</div>
33+
${
34+
showExecuteButton
35+
? `<div class="pf-v5-c-code-block__actions-item ocs-markdown-execute-snippet__action">
36+
<button class="pf-v5-c-button pf-m-plain ocs-markdown-execute-snippet__button" type="button" aria-label="${t(
37+
'console-shared~Run in Web Terminal',
38+
)}" ${MARKDOWN_EXECUTE_BUTTON_ID}="${groupType}">
39+
<i class="fas fa-play" aria-hidden="true"></i>
40+
<i class="fas fa-check" aria-hidden="true"></i>
41+
</button>
42+
</div>`
43+
: ''
44+
}
45+
</div>
46+
</div>
47+
<div class="pf-v5-c-code-block__content">
48+
<pre class="pf-v5-c-code-block__pre pfext-code-block__pre">
49+
<code class="pf-v5-c-code-block__code" ${MARKDOWN_SNIPPET_ID}="${groupType}">${group.trim()}</code>
50+
</pre>
51+
</div>
52+
</div>`;
5053
},
5154
}),
5255
[showExecuteButton, t],

0 commit comments

Comments
 (0)