Skip to content

Commit eb0b42c

Browse files
authored
Merge pull request #1038 from EnterpriseDB/fix/evan/katacoda-closing-in-dev
Fix Katacoda closing on link hover in development Former-commit-id: cbbfbff
2 parents b86632d + 6a9e08b commit eb0b42c

File tree

2 files changed

+45
-45
lines changed

2 files changed

+45
-45
lines changed

src/components/code-block.js

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ const OutputPre = ({ content }) => (
130130
</div>
131131
);
132132

133-
const CodeBlock = ({ children, katacodaPanelData, ...otherProps }) => {
133+
const CodeBlock = ({ children, codeLanguages, ...otherProps }) => {
134134
const childIsComponent = !!children.props; // true in normal usage, false if raw <pre> tags are used
135135

136136
const [codeContent, outputContent] = childIsComponent
@@ -140,10 +140,8 @@ const CodeBlock = ({ children, katacodaPanelData, ...otherProps }) => {
140140
? (children.props.className || '').replace('language-', '')
141141
: 'text';
142142

143-
const execLanguages = katacodaPanelData
144-
? ['shell'].concat(
145-
katacodaPanelData.codelanguages?.split(',')?.map((l) => l.trim()),
146-
)
143+
const execLanguages = codeLanguages
144+
? ['shell'].concat(codeLanguages?.split(',')?.map((l) => l.trim()))
147145
: [];
148146

149147
if (codeContent.length > 0) {

src/components/layout.js

Lines changed: 42 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useState, useEffect } from 'react';
1+
import React, { useState, useEffect, useMemo } from 'react';
22
import { Helmet } from 'react-helmet';
33
import useSiteMetadata from '../hooks/use-sitemetadata';
44
import {
@@ -24,8 +24,6 @@ const Layout = ({
2424
const { baseUrl, imageUrl, title: siteTitle } = useSiteMetadata();
2525
const meta = pageMeta || {};
2626
const url = meta.path ? baseUrl + meta.path : baseUrl;
27-
// console.log(url);
28-
2927
const title = meta.title ? `EDB Docs - ${meta.title}` : siteTitle;
3028

3129
const [dark, setDark] = useState(false);
@@ -45,6 +43,46 @@ const Layout = ({
4543
}
4644
}, [setDark]);
4745

46+
const mdxComponents = useMemo(
47+
() => ({
48+
a: ({ href, ...rest }) => (
49+
<Link
50+
to={href}
51+
pageUrl={meta.path}
52+
pageIsIndex={meta.isIndexPage}
53+
{...rest}
54+
/>
55+
),
56+
table: (props) => (
57+
<div className="table-with-scroll">
58+
<table {...props} className="table" />
59+
</div>
60+
),
61+
pre: (props) => (
62+
<CodeBlock
63+
{...props}
64+
codeLanguages={katacodaPanelData?.codelanguages}
65+
/>
66+
),
67+
h2: (props) => <h2 {...props} className="mt-5" />, // eslint-disable-line jsx-a11y/heading-has-content
68+
h3: (props) => <h3 {...props} className="mt-4-5" />, // eslint-disable-line jsx-a11y/heading-has-content
69+
img: (props) => <img {...props} className="mw-100" />, // eslint-disable-line jsx-a11y/alt-text
70+
blockquote: (props) => (
71+
<blockquote
72+
{...props}
73+
className="pl-3 border-left border-top-0 border-bottom-0 border-right-0 border-5"
74+
></blockquote>
75+
),
76+
KatacodaPanel: () => (
77+
<KatacodaPanel katacodaPanelData={katacodaPanelData} />
78+
),
79+
KatacodaPageLink,
80+
Icon,
81+
StubCards,
82+
}),
83+
[katacodaPanelData, meta],
84+
);
85+
4886
return (
4987
<LayoutContext.Provider
5088
value={{
@@ -72,43 +110,7 @@ const Layout = ({
72110
<meta name="twitter:card" content="summary_large_image" />
73111
<body className={`bg-${background} fixed-container`} />
74112
</Helmet>
75-
<MDXProvider
76-
components={{
77-
a: ({ href, ...rest }) => (
78-
<Link
79-
to={href}
80-
pageUrl={meta.path}
81-
pageIsIndex={meta.isIndexPage}
82-
{...rest}
83-
/>
84-
),
85-
table: (props) => (
86-
<div className="table-with-scroll">
87-
<table {...props} className="table" />
88-
</div>
89-
),
90-
pre: (props) => (
91-
<CodeBlock {...props} katacodaPanelData={katacodaPanelData} />
92-
),
93-
h2: (props) => <h2 {...props} className="mt-5" />, // eslint-disable-line jsx-a11y/heading-has-content
94-
h3: (props) => <h3 {...props} className="mt-4-5" />, // eslint-disable-line jsx-a11y/heading-has-content
95-
img: (props) => <img {...props} className="mw-100" />, // eslint-disable-line jsx-a11y/alt-text
96-
blockquote: (props) => (
97-
<blockquote
98-
{...props}
99-
className="pl-3 border-left border-top-0 border-bottom-0 border-right-0 border-5"
100-
></blockquote>
101-
),
102-
KatacodaPanel: (props) => (
103-
<KatacodaPanel {...props} katacodaPanelData={katacodaPanelData} />
104-
),
105-
KatacodaPageLink,
106-
Icon,
107-
StubCards,
108-
}}
109-
>
110-
{children}
111-
</MDXProvider>
113+
<MDXProvider components={mdxComponents}>{children}</MDXProvider>
112114
<TextBalancer />
113115
</LayoutContext.Provider>
114116
);

0 commit comments

Comments
 (0)