diff --git a/packages/module/package.json b/packages/module/package.json
index e79fdf46..6683157f 100644
--- a/packages/module/package.json
+++ b/packages/module/package.json
@@ -66,7 +66,7 @@
     "@rollup/plugin-commonjs": "^17.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^11.1.0",
-    "@testing-library/react": "^11.2.2",
+    "@testing-library/react": "^13.4.0",
     "@types/dompurify": "^3.0.5",
     "@types/enzyme": "^3.10.7",
     "@types/enzyme-adapter-react-16": "^1.0.6",
diff --git a/packages/module/src/ConsoleInternal/components/markdown-view.tsx b/packages/module/src/ConsoleInternal/components/markdown-view.tsx
index c3fa0eb1..e7291726 100644
--- a/packages/module/src/ConsoleInternal/components/markdown-view.tsx
+++ b/packages/module/src/ConsoleInternal/components/markdown-view.tsx
@@ -25,7 +25,7 @@ export const markdownConvert = async (markdown: string, extensions?: ShowdownExt
       return node;
     }
 
-    // add PF content classes
+    // add PF content classes to standard elements (details blocks get handled separately)
     if (node.nodeType === 1) {
       const contentElements = [
         'ul',
@@ -85,7 +85,90 @@ export const markdownConvert = async (markdown: string, extensions?: ShowdownExt
   );
   const markdownWithSubstitutedCodeFences = reverseString(reverseMarkdownWithSubstitutedCodeFences);
 
-  const parsedMarkdown = await marked.parse(markdownWithSubstitutedCodeFences);
+  // Fix malformed HTML entities early in the process
+  let preprocessedMarkdown = markdownWithSubstitutedCodeFences;
+  preprocessedMarkdown = preprocessedMarkdown
+    .replace(/&nbsp([^;])/g, ' $1')
+    .replace(/ /g, ' ');
+  preprocessedMarkdown = preprocessedMarkdown.replace(/&nbsp(?![;])/g, ' ');
+
+  // Process content in segments to ensure markdown parsing continues after HTML blocks
+  const htmlBlockRegex =
+    /(<(?:details|div|section|article)[^>]*>[\s\S]*?<\/(?:details|div|section|article)>)/g;
+
+  let parsedMarkdown = '';
+
+  // Check if there are any HTML blocks
+  if (htmlBlockRegex.test(preprocessedMarkdown)) {
+    // Reset regex for actual processing
+    htmlBlockRegex.lastIndex = 0;
+
+    let lastIndex = 0;
+    let match;
+
+    while ((match = htmlBlockRegex.exec(preprocessedMarkdown)) !== null) {
+      // Process markdown before the HTML block
+      const markdownBefore = preprocessedMarkdown.slice(lastIndex, match.index).trim();
+      if (markdownBefore) {
+        const parsed = await marked.parse(markdownBefore);
+        parsedMarkdown += parsed;
+      }
+
+      // Process the HTML block: parse markdown content inside while preserving HTML structure
+      let htmlBlock = match[1];
+
+      // Find and process markdown content inside HTML tags
+      const contentRegex = />(\s*[\s\S]*?)\s*</g;
+      const contentMatches = [];
+      let contentMatch;
+
+      while ((contentMatch = contentRegex.exec(htmlBlock)) !== null) {
+        const content = contentMatch[1];
+        // Only process content that has markdown formatting but no extension syntax
+        if (
+          content.trim() &&
+          !content.includes('{{') &&
+          (content.includes('**') || content.includes('- ') || content.includes('\n'))
+        ) {
+          // This looks like markdown content without extensions - parse it as block content
+          const parsedContent = await marked.parse(content.trim());
+          // Remove wrapping <p> tags if they exist since we're inside HTML already
+          const cleanedContent = parsedContent.replace(/^<p[^>]*>([\s\S]*)<\/p>[\s]*$/g, '$1');
+          contentMatches.push({
+            original: contentMatch[0],
+            replacement: `>${cleanedContent}<`,
+          });
+        }
+      }
+
+      // Apply the content replacements
+      contentMatches.forEach(({ original, replacement }) => {
+        htmlBlock = htmlBlock.replace(original, replacement);
+      });
+
+      // Apply extensions (like admonitions) to the processed HTML block
+      if (extensions) {
+        extensions.forEach(({ regex, replace }) => {
+          if (regex) {
+            htmlBlock = htmlBlock.replace(regex, replace);
+          }
+        });
+      }
+
+      parsedMarkdown += htmlBlock;
+      lastIndex = htmlBlockRegex.lastIndex;
+    }
+
+    // Process any remaining markdown after the last HTML block
+    const markdownAfter = preprocessedMarkdown.slice(lastIndex).trim();
+    if (markdownAfter) {
+      const parsed = await marked.parse(markdownAfter);
+      parsedMarkdown += parsed;
+    }
+  } else {
+    // No HTML blocks found, process normally
+    parsedMarkdown = await marked.parse(preprocessedMarkdown);
+  }
   // Swap the temporary tokens back to code fences before we run the extensions
   let md = parsedMarkdown.replace(/@@@/g, '```');
 
@@ -93,7 +176,7 @@ export const markdownConvert = async (markdown: string, extensions?: ShowdownExt
     // Convert code spans back to md format before we run the custom extension regexes
     md = md.replace(/<code>(.*)<\/code>/g, '`$1`');
 
-    extensions.forEach(({ regex, replace }) => {
+    extensions.forEach(({ regex, replace }, _index) => {
       if (regex) {
         md = md.replace(regex, replace);
       }
@@ -102,6 +185,7 @@ export const markdownConvert = async (markdown: string, extensions?: ShowdownExt
     // Convert any remaining backticks back into code spans
     md = md.replace(/`(.*)`/g, '<code>$1</code>');
   }
+
   return DOMPurify.sanitize(md);
 };
 
@@ -210,7 +294,10 @@ const InlineMarkdownView: FC<InnerSyncMarkdownProps> = ({
   const id = useMemo(() => uniqueId('markdown'), []);
   return (
     <div className={css({ 'is-empty': isEmpty } as any, className)} id={id}>
-      <div dangerouslySetInnerHTML={{ __html: markup }} />
+      <div
+        style={{ marginBlockEnd: 'var(--pf-t-global--spacer--md)' }}
+        dangerouslySetInnerHTML={{ __html: markup }}
+      />
       {renderExtension && (
         <RenderExtension renderExtension={renderExtension} selector={`#${id}`} markup={markup} />
       )}
@@ -299,6 +386,7 @@ const IFrameMarkdownView: FC<InnerSyncMarkdownProps> = ({
   return (
     <>
       <iframe
+        title="Markdown content preview"
         sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin"
         srcDoc={contents}
         style={{ border: '0px', display: 'block', width: '100%', height: '0' }}
diff --git a/packages/module/src/ConsoleShared/src/components/markdown-extensions/__tests__/accordion-extension.spec.tsx b/packages/module/src/ConsoleShared/src/components/markdown-extensions/__tests__/accordion-extension.spec.tsx
new file mode 100644
index 00000000..34e2454b
--- /dev/null
+++ b/packages/module/src/ConsoleShared/src/components/markdown-extensions/__tests__/accordion-extension.spec.tsx
@@ -0,0 +1,105 @@
+// Generated by Cursor
+// AI-assisted implementation with human review and modifications
+import { renderHook } from '@testing-library/react';
+import useAccordionShowdownExtension from '../accordion-extension';
+import { ACCORDION_MARKDOWN_BUTTON_ID, ACCORDION_MARKDOWN_CONTENT_ID } from '../const';
+import { marked } from 'marked';
+
+// Mock marked
+jest.mock('marked', () => ({
+  marked: {
+    parseInline: jest.fn((text) => `<em>${text}</em>`),
+  },
+}));
+
+// Mock DOMPurify
+jest.mock('dompurify', () => ({
+  sanitize: jest.fn((html) => html),
+}));
+
+describe('useAccordionShowdownExtension', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should return a showdown extension with correct properties', () => {
+    const { result } = renderHook(() => useAccordionShowdownExtension());
+    const extension = result.current;
+
+    expect(extension.type).toBe('lang');
+    expect(extension.regex).toEqual(/\[(.+)]{{(accordion) (&quot;(.*?)&quot;)}}/g);
+    expect(typeof extension.replace).toBe('function');
+  });
+
+  it('should match accordion syntax with HTML-encoded quotes', () => {
+    const { result } = renderHook(() => useAccordionShowdownExtension());
+    const { regex } = result.current;
+
+    const testText = '[Some content]{{accordion &quot;My Title&quot;}}';
+    const matches = regex.exec(testText);
+
+    expect(matches).not.toBeNull();
+    if (matches) {
+      expect(matches[1]).toBe('Some content');
+      expect(matches[2]).toBe('accordion');
+      expect(matches[4]).toBe('My Title');
+    }
+  });
+
+  it('should not match accordion syntax with regular quotes', () => {
+    const { result } = renderHook(() => useAccordionShowdownExtension());
+    const { regex } = result.current;
+
+    const testText = '[Some content]{{accordion "My Title"}}';
+    expect(testText.match(regex)).toBeNull();
+  });
+
+  it('should generate correct accordion HTML structure', () => {
+    const { result } = renderHook(() => useAccordionShowdownExtension());
+    const { replace } = result.current;
+
+    const html = replace(
+      '[Test content]{{accordion &quot;Test Title&quot;}}',
+      'Test content',
+      'accordion',
+      '&quot;Test Title&quot;',
+      'Test Title',
+    );
+
+    expect(html).toContain('pf-v6-c-accordion');
+    expect(html).toContain('pf-v6-c-accordion__toggle');
+    expect(html).toContain(`${ACCORDION_MARKDOWN_BUTTON_ID}-Test-Title`);
+    expect(html).toContain(`${ACCORDION_MARKDOWN_CONTENT_ID}-Test-Title`);
+    expect(html).toContain('Test Title');
+  });
+
+  it('should process content through marked and sanitize HTML', () => {
+    const { result } = renderHook(() => useAccordionShowdownExtension());
+    const { replace } = result.current;
+
+    replace(
+      '[**Bold text**]{{accordion &quot;Title&quot;}}',
+      '**Bold text**',
+      'accordion',
+      '&quot;Title&quot;',
+      'Title',
+    );
+
+    expect(marked.parseInline).toHaveBeenCalledWith('**Bold text**');
+  });
+
+  it('should handle titles with spaces in IDs', () => {
+    const { result } = renderHook(() => useAccordionShowdownExtension());
+    const { replace } = result.current;
+
+    const html = replace(
+      '[Content]{{accordion &quot;My Test Title&quot;}}',
+      'Content',
+      'accordion',
+      '&quot;My Test Title&quot;',
+      'My Test Title',
+    );
+
+    expect(html).toContain(`${ACCORDION_MARKDOWN_BUTTON_ID}-My-Test-Title`);
+  });
+});
diff --git a/packages/module/src/ConsoleShared/src/components/markdown-extensions/__tests__/admonition-extension.spec.tsx b/packages/module/src/ConsoleShared/src/components/markdown-extensions/__tests__/admonition-extension.spec.tsx
new file mode 100644
index 00000000..69beb220
--- /dev/null
+++ b/packages/module/src/ConsoleShared/src/components/markdown-extensions/__tests__/admonition-extension.spec.tsx
@@ -0,0 +1,121 @@
+import { renderHook } from '@testing-library/react';
+import useAdmonitionShowdownExtension from '../admonition-extension';
+import { marked } from 'marked';
+
+// Mock marked
+jest.mock('marked', () => ({
+  marked: {
+    parseInline: jest.fn((text) => `<strong>${text}</strong>`),
+  },
+}));
+
+// Mock DOMPurify
+jest.mock('dompurify', () => ({
+  sanitize: jest.fn((html) => html),
+}));
+
+describe('useAdmonitionShowdownExtension', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should return a showdown extension with correct properties', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const extension = result.current;
+
+    expect(extension.type).toBe('lang');
+    expect(extension.regex).toEqual(/\[(.+)]{{(admonition) ([\w-]+)}}/g);
+    expect(typeof extension.replace).toBe('function');
+  });
+
+  it('should match different admonition types', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const { regex } = result.current;
+
+    const admonitionTypes = ['note', 'tip', 'important', 'warning', 'caution', 'custom-type'];
+
+    admonitionTypes.forEach((type) => {
+      const testText = `[Content for ${type}]{{admonition ${type}}}`;
+      // Reset regex state for global flag
+      regex.lastIndex = 0;
+      const matches = regex.exec(testText);
+
+      expect(matches).not.toBeNull();
+      if (matches) {
+        expect(matches[1]).toBe(`Content for ${type}`);
+        expect(matches[2]).toBe('admonition');
+        expect(matches[3]).toBe(type);
+      }
+    });
+  });
+
+  it('should not match malformed admonition syntax', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const { regex } = result.current;
+
+    const malformedCases = [
+      'Content]{{admonition note}}',
+      '[Content{{admonition note}}',
+      '[Content]{{admonition}}',
+      '[Content]{{notadmonition note}}',
+    ];
+
+    malformedCases.forEach((testCase) => {
+      expect(testCase.match(regex)).toBeNull();
+    });
+  });
+
+  it('should generate correct alert HTML structure', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const { replace } = result.current;
+
+    const html = replace('[Test message]{{admonition note}}', 'Test message', 'admonition', 'note');
+
+    expect(html).toContain('pf-v6-c-alert');
+    expect(html).toContain('pf-m-info'); // note maps to info variant
+    expect(html).toContain('pf-m-inline');
+    expect(html).toContain('pfext-markdown-admonition');
+    expect(html).toContain('NOTE'); // uppercase title
+  });
+
+  it('should handle different admonition types with correct variants', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const { replace } = result.current;
+
+    const testCases = [
+      { type: 'note', expectedClass: 'pf-m-info' },
+      { type: 'warning', expectedClass: 'pf-m-warning' },
+      { type: 'important', expectedClass: 'pf-m-danger' },
+    ];
+
+    testCases.forEach(({ type, expectedClass }) => {
+      const html = replace(`[Content]{{admonition ${type}}}`, 'Content', 'admonition', type);
+
+      expect(html).toContain(expectedClass);
+      expect(html).toContain(type.toUpperCase());
+    });
+  });
+
+  it('should process content through marked', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const { replace } = result.current;
+
+    replace('[**Bold text**]{{admonition note}}', '**Bold text**', 'admonition', 'note');
+
+    expect(marked.parseInline).toHaveBeenCalledWith('**Bold text**');
+  });
+
+  it('should return original text for invalid cases', () => {
+    const { result } = renderHook(() => useAdmonitionShowdownExtension());
+    const { replace } = result.current;
+
+    // Missing content
+    const originalText = '[Content]{{admonition note}}';
+    const result1 = replace(originalText, '', 'admonition', 'note');
+    expect(result1).toBe(originalText);
+
+    // Wrong command
+    const result2 = replace(originalText, 'Content', 'not-admonition', 'note');
+    expect(result2).toBe(originalText);
+  });
+});
diff --git a/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-extension.tsx b/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-extension.tsx
index 798e510e..19d3c09a 100644
--- a/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-extension.tsx
+++ b/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-extension.tsx
@@ -8,34 +8,41 @@ import {
 import { renderToStaticMarkup } from 'react-dom/server';
 import { removeTemplateWhitespace } from './utils';
 import { ACCORDION_MARKDOWN_BUTTON_ID, ACCORDION_MARKDOWN_CONTENT_ID } from './const';
+import { marked } from 'marked';
+
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+const DOMPurify = require('dompurify');
 
 const useAccordionShowdownExtension = () =>
   useMemo(
     () => ({
       type: 'lang',
-      regex: /\[(.+)]{{(accordion) ("(.*?)")}}/g,
+      regex: /\[(.+)]{{(accordion) (&quot;(.*?)&quot;)}}/g,
       replace: (
         _text: string,
         accordionContent: string,
         _command: string,
+        _quotedHeading: string,
         accordionHeading: string,
       ): string => {
         const accordionId = String(accordionHeading).replace(/\s/g, '-');
 
+        // Process accordion content with markdown
+        const processedContent = marked.parseInline(accordionContent);
+        const sanitizedContent = DOMPurify.sanitize(processedContent);
+
         return removeTemplateWhitespace(
           renderToStaticMarkup(
-            <>
-              <Accordion asDefinitionList>
-                <AccordionItem isExpanded={false}>
-                  <AccordionToggle id={`${ACCORDION_MARKDOWN_BUTTON_ID}-${accordionId}`}>
-                    {accordionHeading}
-                  </AccordionToggle>
-                  <AccordionContent id={`${ACCORDION_MARKDOWN_CONTENT_ID}-${accordionId}`}>
-                    {accordionContent}
-                  </AccordionContent>
-                </AccordionItem>
-              </Accordion>
-            </>,
+            <Accordion>
+              <AccordionItem>
+                <AccordionToggle id={`${ACCORDION_MARKDOWN_BUTTON_ID}-${accordionId}`}>
+                  {accordionHeading}
+                </AccordionToggle>
+                <AccordionContent id={`${ACCORDION_MARKDOWN_CONTENT_ID}-${accordionId}`} hidden>
+                  <div dangerouslySetInnerHTML={{ __html: sanitizedContent }} />
+                </AccordionContent>
+              </AccordionItem>
+            </Accordion>,
           ),
         );
       },
diff --git a/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-render-extension.tsx b/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-render-extension.tsx
index c0d568fe..22f3d677 100644
--- a/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-render-extension.tsx
+++ b/packages/module/src/ConsoleShared/src/components/markdown-extensions/accordion-render-extension.tsx
@@ -14,14 +14,28 @@ const AccordionShowdownHandler: FC<AccordionShowdownComponentProps> = ({
   const [expanded, setExpanded] = useState<boolean>(false);
 
   const handleClick = () => {
+    const newExpanded = !expanded;
     const expandedModifier = 'pf-m-expanded';
 
-    buttonElement.className = `pf-v6-c-accordion__toggle ${!expanded ? expandedModifier : ''}`;
-    contentElement.hidden = expanded;
-    contentElement.className = `pf-v6-c-accordion__expanded-content ${
-      !expanded ? expandedModifier : ''
+    // Find the accordion item element (parent of the button)
+    const accordionItem = buttonElement.closest('.pf-v6-c-accordion__item');
+
+    // Update button - both visual state and aria-expanded
+    buttonElement.className = `pf-v6-c-accordion__toggle ${newExpanded ? expandedModifier : ''}`;
+    buttonElement.setAttribute('aria-expanded', newExpanded.toString());
+
+    // Update content - both visual state and hidden attribute
+    contentElement.hidden = !newExpanded;
+    contentElement.className = `pf-v6-c-accordion__expandable-content ${
+      newExpanded ? expandedModifier : ''
     }`;
-    setExpanded(!expanded);
+
+    // Update accordion item
+    if (accordionItem) {
+      accordionItem.className = `pf-v6-c-accordion__item ${newExpanded ? expandedModifier : ''}`;
+    }
+
+    setExpanded(newExpanded);
   };
 
   useEventListener(buttonElement, 'click', handleClick);
diff --git a/packages/module/src/ConsoleShared/src/components/markdown-extensions/admonition-extension.tsx b/packages/module/src/ConsoleShared/src/components/markdown-extensions/admonition-extension.tsx
index f628533e..92140b68 100644
--- a/packages/module/src/ConsoleShared/src/components/markdown-extensions/admonition-extension.tsx
+++ b/packages/module/src/ConsoleShared/src/components/markdown-extensions/admonition-extension.tsx
@@ -4,7 +4,10 @@ import { renderToStaticMarkup } from 'react-dom/server';
 import { Alert } from '@patternfly/react-core';
 import LightbulbIcon from '@patternfly/react-icons/dist/js/icons/lightbulb-icon';
 import FireIcon from '@patternfly/react-icons/dist/js/icons/fire-icon';
-import QuickStartMarkdownView from '../../../../QuickStartMarkdownView';
+import { marked } from 'marked';
+
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+const DOMPurify = require('dompurify');
 
 enum AdmonitionType {
   TIP = 'TIP',
@@ -33,15 +36,23 @@ const useAdmonitionShowdownExtension = () =>
         content: string,
         admonitionLabel: string,
         admonitionType: string,
-        groupId: string,
       ): string => {
-        if (!content || !admonitionLabel || !admonitionType || !groupId) {
+        if (!content || !admonitionLabel || !admonitionType) {
+          return text;
+        }
+        if (admonitionLabel !== 'admonition') {
           return text;
         }
         admonitionType = admonitionType.toUpperCase();
 
-        const { variant, customIcon } = admonitionToAlertVariantMap[admonitionType];
-        const mdContent = <QuickStartMarkdownView content={content} />;
+        // Process markdown content directly using marked
+        const processedContent = marked.parseInline(content);
+        const sanitizedContent = DOMPurify.sanitize(processedContent);
+
+        // Handle unknown admonition types by defaulting to NOTE
+        const admonitionConfig =
+          admonitionToAlertVariantMap[admonitionType] || admonitionToAlertVariantMap.NOTE;
+        const { variant, customIcon } = admonitionConfig;
         const pfAlert = (
           <Alert
             variant={variant}
@@ -50,7 +61,7 @@ const useAdmonitionShowdownExtension = () =>
             title={admonitionType}
             className="pfext-markdown-admonition"
           >
-            {mdContent}
+            <div dangerouslySetInnerHTML={{ __html: sanitizedContent }} />
           </Alert>
         );
         return removeTemplateWhitespace(renderToStaticMarkup(pfAlert));
diff --git a/packages/module/src/QuickStartDrawerContent.tsx b/packages/module/src/QuickStartDrawerContent.tsx
index 22e18d97..cc730a5a 100644
--- a/packages/module/src/QuickStartDrawerContent.tsx
+++ b/packages/module/src/QuickStartDrawerContent.tsx
@@ -24,11 +24,8 @@ export const QuickStartDrawerContent: FC<QuickStartDrawerContentProps> = ({
     allQuickStarts = [],
     activeQuickStartState,
   } = useContext<QuickStartContextValues>(QuickStartContext);
-  const combinedQuickStarts = [
-    ...allQuickStarts,
-    ...quickStarts,
-  ].filter(
-    (qs, idx, arr) => arr.findIndex(q => q.metadata.name === qs.metadata.name) === idx
+  const combinedQuickStarts = [...allQuickStarts, ...quickStarts].filter(
+    (qs, idx, arr) => arr.findIndex((q) => q.metadata.name === qs.metadata.name) === idx,
   );
 
   const handleClose = () => {
diff --git a/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx b/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx
index fd84ec8e..18a3604d 100644
--- a/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx
+++ b/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx
@@ -72,10 +72,7 @@ export const QuickStartCatalogFilterCount = ({ quickStartsCount }) => {
   const { getResource } = useContext<QuickStartContextValues>(QuickStartContext);
   return (
     <ToolbarItem align={{ default: 'alignEnd' }}>
-      {getResource('{{count, number}} item', quickStartsCount).replace(
-        '{{count, number}}',
-        quickStartsCount,
-      )}
+      {getResource('{{count, number}} item', quickStartsCount)}
     </ToolbarItem>
   );
 };
diff --git a/packages/module/src/controller/QuickStartIntroduction.tsx b/packages/module/src/controller/QuickStartIntroduction.tsx
index 33eaf259..1d780b44 100644
--- a/packages/module/src/controller/QuickStartIntroduction.tsx
+++ b/packages/module/src/controller/QuickStartIntroduction.tsx
@@ -47,7 +47,7 @@ const QuickStartIntroduction: FC<QuickStartIntroductionProps> = ({
       <p>
         {getResource(
           'In this quick start, you will complete {{count, number}} task',
-          tasks?.length,
+          tasks?.length || 0,
         ).replace('{{count, number}}', tasks?.length || 0)}
         :
       </p>
diff --git a/yarn.lock b/yarn.lock
index 20be2c0a..b837173b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1014,15 +1014,7 @@
   resolved "https://registry.yarnpkg.com/@babel/regjsgen/-/regjsgen-0.8.0.tgz#f0ba69b075e1f05fb2825b7fad991e7adbb18310"
   integrity sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA==
 
-"@babel/runtime-corejs3@^7.10.2":
-  version "7.14.7"
-  resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.14.7.tgz#0ef292bbce40ca00f874c9724ef175a12476465c"
-  integrity sha512-Wvzcw4mBYbTagyBVZpAJWI06auSIj033T/yNE0Zn1xcup83MieCddZA7ls3kme17L4NOGBrQ09Q+nKB41RLWBA==
-  dependencies:
-    core-js-pure "^3.15.0"
-    regenerator-runtime "^0.13.4"
-
-"@babel/runtime@^7.10.2", "@babel/runtime@^7.12.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.14.5", "@babel/runtime@^7.20.7", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4":
+"@babel/runtime@^7.12.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.14.5", "@babel/runtime@^7.20.7", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4":
   version "7.23.2"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.2.tgz#062b0ac103261d68a966c4c7baf2ae3e62ec3885"
   integrity sha512-mM8eg4yl5D6i3lu2QKPuPH4FArvJ8KhTofbE7jwMUv9KX5mBvwPAqnV3MlyBNqdp9RyRKP6Yck8TrfYrPvX3bg==
@@ -1671,27 +1663,28 @@
   resolved "https://registry.yarnpkg.com/@testim/chrome-version/-/chrome-version-1.1.2.tgz#092005c5b77bd3bb6576a4677110a11485e11864"
   integrity sha512-1c4ZOETSRpI0iBfIFUqU4KqwBAB2lHUAlBjZz/YqOHqwM9dTTzjV6Km0ZkiEiSCx/tLr1BtESIKyWWMww+RUqw==
 
-"@testing-library/dom@^7.28.1":
-  version "7.31.2"
-  resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.31.2.tgz#df361db38f5212b88555068ab8119f5d841a8c4a"
-  integrity sha512-3UqjCpey6HiTZT92vODYLPxTBWlM8ZOOjr3LX5F37/VRipW2M1kX6I/Cm4VXzteZqfGfagg8yXywpcOgQBlNsQ==
+"@testing-library/dom@^8.5.0":
+  version "8.20.1"
+  resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.20.1.tgz#2e52a32e46fc88369eef7eef634ac2a192decd9f"
+  integrity sha512-/DiOQ5xBxgdYRC8LNk7U+RWat0S3qRLeIw3ZIkMQ9kkVlRmwD/Eg8k8CqIpD6GW7u20JIUOfMKbxtiLutpjQ4g==
   dependencies:
     "@babel/code-frame" "^7.10.4"
     "@babel/runtime" "^7.12.5"
-    "@types/aria-query" "^4.2.0"
-    aria-query "^4.2.2"
+    "@types/aria-query" "^5.0.1"
+    aria-query "5.1.3"
     chalk "^4.1.0"
-    dom-accessibility-api "^0.5.6"
-    lz-string "^1.4.4"
-    pretty-format "^26.6.2"
+    dom-accessibility-api "^0.5.9"
+    lz-string "^1.5.0"
+    pretty-format "^27.0.2"
 
-"@testing-library/react@^11.2.2":
-  version "11.2.7"
-  resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.7.tgz#b29e2e95c6765c815786c0bc1d5aed9cb2bf7818"
-  integrity sha512-tzRNp7pzd5QmbtXNG/mhdcl7Awfu/Iz1RaVHY75zTdOkmHCuzMhRL83gWHSgOAcjS3CCbyfwUHMZgRJb4kAfpA==
+"@testing-library/react@^13.4.0":
+  version "13.4.0"
+  resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-13.4.0.tgz#6a31e3bf5951615593ad984e96b9e5e2d9380966"
+  integrity sha512-sXOGON+WNTh3MLE9rve97ftaZukN3oNf2KjDy7YTx6hcTO2uuLHuCGynMDhFwGw/jYf4OJ2Qk0i4i79qMNNkyw==
   dependencies:
     "@babel/runtime" "^7.12.5"
-    "@testing-library/dom" "^7.28.1"
+    "@testing-library/dom" "^8.5.0"
+    "@types/react-dom" "^18.0.0"
 
 "@tootallnate/once@1":
   version "1.1.2"
@@ -1703,10 +1696,10 @@
   resolved "https://registry.yarnpkg.com/@tootallnate/quickjs-emscripten/-/quickjs-emscripten-0.23.0.tgz#db4ecfd499a9765ab24002c3b696d02e6d32a12c"
   integrity sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==
 
-"@types/aria-query@^4.2.0":
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.2.tgz#ed4e0ad92306a704f9fb132a0cfcf77486dbe2bc"
-  integrity sha512-HnYpAE1Y6kRyKM/XkEuiRQhTHvkzMBurTHnpFLYLBGPIylZNPs9jJcuOOYWxPLJCSEtmZT0Y8rHDokKN7rRTig==
+"@types/aria-query@^5.0.1":
+  version "5.0.4"
+  resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-5.0.4.tgz#1a31c3d378850d2778dabb6374d036dcba4ba708"
+  integrity sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==
 
 "@types/body-parser@*":
   version "1.19.2"
@@ -2775,6 +2768,11 @@ ansi-styles@^4.0.0, ansi-styles@^4.1.0:
   dependencies:
     color-convert "^2.0.1"
 
+ansi-styles@^5.0.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-5.2.0.tgz#07449690ad45777d1924ac2abb2fc8895dba836b"
+  integrity sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==
+
 any-promise@^1.0.0, any-promise@^1.1.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/any-promise/-/any-promise-1.3.0.tgz#abc6afeedcea52e809cdc0376aed3ce39635d17f"
@@ -2838,15 +2836,7 @@ argparse@^2.0.1:
   resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-aria-query@^4.2.2:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-4.2.2.tgz#0d2ca6c9aceb56b8977e9fed6aed7e15bbd2f83b"
-  integrity sha512-o/HelwhuKpTj/frsOsbNLNgnNGVIFsVP/SW2BSF14gVl7kAfMOJ6/8wUAUvG1R1NHKrfG+2sHZTu0yauT1qBrA==
-  dependencies:
-    "@babel/runtime" "^7.10.2"
-    "@babel/runtime-corejs3" "^7.10.2"
-
-aria-query@^5.1.3:
+aria-query@5.1.3, aria-query@^5.1.3:
   version "5.1.3"
   resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.1.3.tgz#19db27cd101152773631396f7a95a3b58c22c35e"
   integrity sha512-R5iJ5lkuHybztUfuOAznmboyjWq8O6sqNqtK7CLOqdydi54VNbORp49mb14KbWgG1QD3JFO9hJdZ+y4KutfdOQ==
@@ -4780,11 +4770,6 @@ core-js-compat@^3.31.0, core-js-compat@^3.36.1:
   dependencies:
     browserslist "^4.23.0"
 
-core-js-pure@^3.15.0:
-  version "3.15.2"
-  resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.15.2.tgz#c8e0874822705f3385d3197af9348f7c9ae2e3ce"
-  integrity sha512-D42L7RYh1J2grW8ttxoY1+17Y4wXZeKe7uyplAI3FkNQyI5OgBIAjUfFiTPfL1rs0qLpxaabITNbjKl1Sp82tA==
-
 core-js@^2.4.0, core-js@^2.5.0:
   version "2.6.12"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec"
@@ -5468,10 +5453,10 @@ doctrine@^3.0.0:
   dependencies:
     esutils "^2.0.2"
 
-dom-accessibility-api@^0.5.6:
-  version "0.5.6"
-  resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.6.tgz#3f5d43b52c7a3bd68b5fb63fa47b4e4c1fdf65a9"
-  integrity sha512-DplGLZd8L1lN64jlT27N9TVSESFR5STaEJvX+thCby7fuCHonfPpAlodYc3vuUYbDuDec5w8AMP7oCM5TWFsqw==
+dom-accessibility-api@^0.5.9:
+  version "0.5.16"
+  resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz#5a7429e6066eb3664d911e33fb0e45de8eb08453"
+  integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==
 
 dom-converter@^0.2.0:
   version "0.2.0"
@@ -10401,6 +10386,11 @@ lz-string@^1.4.4:
   resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.4.4.tgz#c0d8eaf36059f705796e1e344811cf4c498d3a26"
   integrity sha1-wNjq82BZ9wV5bh40SBHPTEmNOiY=
 
+lz-string@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941"
+  integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==
+
 magic-string@^0.25.7:
   version "0.25.7"
   resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.7.tgz#3f497d6fd34c669c6798dcb821f2ef31f5445051"
@@ -12176,6 +12166,15 @@ pretty-format@^26.0.0, pretty-format@^26.6.2:
     ansi-styles "^4.0.0"
     react-is "^17.0.1"
 
+pretty-format@^27.0.2:
+  version "27.5.1"
+  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-27.5.1.tgz#2181879fdea51a7a5851fb39d920faa63f01d88e"
+  integrity sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==
+  dependencies:
+    ansi-regex "^5.0.1"
+    ansi-styles "^5.0.0"
+    react-is "^17.0.1"
+
 private@^0.1.8:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
@@ -12796,7 +12795,7 @@ regenerator-runtime@^0.11.0:
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
   integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==
 
-regenerator-runtime@^0.13.4, regenerator-runtime@^0.13.7:
+regenerator-runtime@^0.13.7:
   version "0.13.7"
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz#cac2dacc8a1ea675feaabaeb8ae833898ae46f55"
   integrity sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==