feat: replace mdxprovider

AirWalk-Digital · May 19, 2023 · 15449b6 · 15449b6
1 parent 8f63ae8
commit 15449b6
Show file tree

Hide file tree

Showing 5 changed files with 341 additions and 15 deletions.
diff --git a/components/MDXProvider.jsx → constants/mdxProvider.js b/components/MDXProvider.jsx → constants/mdxProvider.js
@@ -1,5 +1,5 @@
 import React from "react";
-import { MDXProvider } from "@mdx-js/react";
+// import { MDXProvider } from "@mdx-js/react";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import okaidia from "react-syntax-highlighter/dist/cjs/styles/prism/okaidia";
 import SlidePage from "../layouts/SlidePage";
@@ -11,9 +11,9 @@ import Image from "next/image";
 import { TitleSlide, Header, Banner, Footer, Insights, Chevrons, Nest, Roadmap, Layout, Column, Item, Slide, HeaderCard } from 'airview-mdx'
 
 // import Cover from "./Cover";
-import SpeakerNotes from "./SpeakerNotes";
-import Step from "./Step";
-import Steps from "./Steps";
+import SpeakerNotes from "../components/SpeakerNotes";
+import Step from "../components/Step";
+import Steps from "../components/Steps";
 import { motion } from "framer-motion";
 
 // MUI Components
@@ -29,7 +29,7 @@ import Alert from '@mui/material/Alert';
 // import { Insight, InsightTable, ChevronProcessTable, StatementBanner, Roadmap } from './Playback';
 // import {FaIcon, Icon} from './Images.jsx';
 import {FaIcon, Icon} from 'airview-mdx';
-import { ProgressTable } from './Tables.jsx';
+import { ProgressTable } from '../components/Tables.jsx';
 // import { HeaderCard, Nest } from './Cards';
 // import { HeaderCard } from './Cards';
 // import { Font } from './Styling';
@@ -90,6 +90,6 @@ export const mdComponents = {
   Layout, Column, Item
 };
 
-export default ({ children }) => (
-  <MDXProvider components={mdComponents}>{children}</MDXProvider>
-);
+// export default ({ children }) => (
+//   <MDXProvider components={mdComponents}>{children}</MDXProvider>
+// );
diff --git a/layouts/SlidePage.jsx b/layouts/SlidePage.jsx
@@ -228,6 +228,7 @@ function SlidePage({ children, next }) {
   const pageSize = { width:1920, height:1080}
 
   return (
+
     <Zoom maxWidth={parseInt(pageSize.width)} width={parseInt(pageSize.width)} maxHeight={parseInt(pageSize.height)} height={parseInt(pageSize.height)} sx={{maxWidth: '100vw', maxHeight: '100vh'}}>
     <Swipeable onSwipedLeft={swipeLeft} onSwipedRight={swipeRight}>
       <GlobalStyles styles={globalStyles} />
@@ -239,5 +240,6 @@ function SlidePage({ children, next }) {
       </PresentationMode>
     </Swipeable>
     </Zoom>
+
   );
 }
diff --git a/pages/_app.js b/pages/_app.js
@@ -1,19 +1,21 @@
 import Head from "next/head";
 import { siteConfig } from "../site.config.js";
-import MDXProvider from "../components/MDXProvider";
+// import MDXProvider from "../components/MDXProvider";
 import { AnimatePresence } from "framer-motion";
 import { CurrentSlideProvider } from "../context/CurrentSlideContext";
 import { ModeProvider } from "../context/ModeContext";
 import TransitionPage from "../layouts/TransitionPage";
 import Script from 'next/script';
 import ErrorBoundary from "../components/ErrorBoundary.jsx";
+import { MDXProvider } from "@mdx-js/react";
+import { mdComponents } from "../constants/mdxProvider";
 
 
 export default function App({ Component, pageProps }) {
   return (
     // <ThemeProvider theme={theme}>
     <ErrorBoundary>
-      <MDXProvider>
+      <MDXProvider components={mdComponents}>
         <CurrentSlideProvider>
           <ModeProvider>
             <AnimatePresence exitBeforeEnter>

diff --git a/pages/output/[...parms].jsx b/pages/output/[...parms].jsx
@@ -19,7 +19,7 @@ import { useRouter } from 'next/router';
 import { theme } from '../../constants/theme';
 import { ThemeProvider } from '@mui/material/styles';
 import CssBaseline from '@mui/material/CssBaseline';
-import { mdComponents } from "../../components/MDXProvider";
+import { mdComponents } from "../../constants/mdxProvider";
 import * as matter from 'gray-matter';
 import { Previewer } from 'pagedjs'
 
@@ -190,13 +190,10 @@ function Page() {
         .catch(error => {
           // console.log(error)
           return { fileData: null, error: error }
-        })
-        .finally(() => {
-          console.log('timeout: ', refreshToken);
         });
     };
 
-    console.log('effectloading file', router)
+    // console.log('effectloading file', router)
     if (source === 'file') { 
       fetchFileContent()
       setTimeout(() => setRefreshToken(Math.random()), 50000);