From c644b0fceda70a33cf1decfb460d5bf1c2c83f71 Mon Sep 17 00:00:00 2001
From: chvmvd <chvmvd@users.noreply.github.com>
Date: Sat, 29 Oct 2022 09:50:59 +0900
Subject: [PATCH] =?UTF-8?q?=E3=82=BD=E3=83=BC=E3=82=B9=E3=82=B3=E3=83=BC?=
 =?UTF-8?q?=E3=83=89=E3=81=AF=E7=9B=B4=E6=8E=A5=E5=8F=96=E3=82=8A=E5=87=BA?=
 =?UTF-8?q?=E3=81=99=E8=A8=AD=E5=AE=9A=E3=81=AB=E3=81=97=E3=81=9F=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ViewSource/ViewSource.tsx | 19 ++++++++++++++++++-
 src/components/ViewSource/styles.css     | 15 +++++++++++++++
 2 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 src/components/ViewSource/styles.css

diff --git a/src/components/ViewSource/ViewSource.tsx b/src/components/ViewSource/ViewSource.tsx
index 5c38d66f5..bb8404772 100644
--- a/src/components/ViewSource/ViewSource.tsx
+++ b/src/components/ViewSource/ViewSource.tsx
@@ -1,8 +1,10 @@
 /* eslint-disable react/prop-types */
 import React, { useState, useEffect } from "react";
 import usePathname from "../usePathname";
+import CodeBlock from "@theme/CodeBlock";
 import JupyterViewer from "react-jupyter-notebook";
 import OpenInColab from "../OpenInColab/OpenInColab";
+import "./styles.css";
 
 /**
  * ipynbファイルからソースコードと出力、OpenInColabへのリンクを生成
@@ -13,6 +15,7 @@ import OpenInColab from "../OpenInColab/OpenInColab";
 
 export default function ViewSource({ path }) {
   const pathname = usePathname();
+  const [sources, setSources] = useState<string[]>([]);
   const [content, setContent] = useState();
   useEffect(() => {
     async function tmp() {
@@ -20,14 +23,28 @@ export default function ViewSource({ path }) {
       const json = await import(
         `/docs/${pathname.slice(6)}${path.slice(0, -6)}.json`
       );
+      setSources(
+        json.cells
+          .filter((cell) => cell.cell_type === "code")
+          .map((cell) => cell.source.join(""))
+      );
       setContent(json);
     }
     tmp();
   }, []);
   return (
     <>
+      {sources.map((source, i) => (
+        <React.Fragment key={i}>
+          <CodeBlock language="python">{source}</CodeBlock>
+        </React.Fragment>
+      ))}
       {content !== undefined && (
-        <JupyterViewer rawIpynb={content} language="python" />
+        <JupyterViewer
+          rawIpynb={content}
+          language="python"
+          displaySource="hide"
+        />
       )}
       <OpenInColab path={path} />
     </>
diff --git a/src/components/ViewSource/styles.css b/src/components/ViewSource/styles.css
new file mode 100644
index 000000000..eafa39079
--- /dev/null
+++ b/src/components/ViewSource/styles.css
@@ -0,0 +1,15 @@
+.block-light {
+  display: none;
+}
+
+.block-hidden {
+  display: none;
+}
+
+.cell-header {
+  display: none;
+}
+
+.block-light-selected {
+  display: none;
+}