Mdx 2.0 migration (#223)

* moving to mdx2.0 * more mdx fixes * trim heading graphql nodes * mdx updates * remove headings * move peerjs out * updated ts * typing issue * handle empty blocks * updated yarn * tweaks * trying to fix gfm * remove custom led block * attempt at using remark-gfm 1.0
microsoft · Aug 17, 2022 · 470fc97 · 470fc97
1 parent 6f8ae48
commit 470fc97
Show file tree

Hide file tree

Showing 34 changed files with 1,100 additions and 2,171 deletions.
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -5,30 +5,30 @@
     "version": "0.2.0",
     "configurations": [
         {
-            "type": "pwa-node",
+            "type": "node",
             "request": "launch",
             "name": "jacdac cli serial",
-            "skipFiles": [
-                "<node_internals>/**"
-            ],
+            "skipFiles": ["<node_internals>/**"],
             "program": "${workspaceFolder}/jacdac-cli/dist/cli.js",
             "args": ["stream", "--serial=true", "-p"],
-            "outFiles": [
-                "${workspaceFolder}/jacdac-cli/dist/*.js"
-            ]
+            "outFiles": ["${workspaceFolder}/jacdac-cli/dist/*.js"]
         },
         {
-            "type": "pwa-node",
+            "type": "node",
             "request": "launch",
             "name": "jacdac cli usb",
-            "skipFiles": [
-                "<node_internals>/**"
-            ],
+            "skipFiles": ["<node_internals>/**"],
             "program": "${workspaceFolder}/jacdac-cli/dist/cli.js",
             "args": ["stream", "--usb", "-p"],
-            "outFiles": [
-                "${workspaceFolder}/jacdac-cli/dist/*.js"
-            ]
-        }
+            "outFiles": ["${workspaceFolder}/jacdac-cli/dist/*.js"]
+        },
+        {
+            "name": "Gatsby build",
+            "type": "node",
+            "request": "launch",
+            "program": "${workspaceRoot}/node_modules/.bin/gatsby",
+            "args": ["build"],
+            "console": "integratedTerminal"
+          }
     ]
-}
+}
diff --git a/gatsby-config.js b/gatsby-config.js
@@ -7,7 +7,7 @@ const pathPrefix = "/jacdac-docs"
 const wsl = !!process.env.WSL_DISTRO_NAME || !!process.env.CODESPACE_NAME
 const offline = !!process.env.JACDAC_OFFLINE
 
-const SITE_TITLE = `Jacdac - plug-n-play for microcontrollers`
+const SITE_TITLE = `Jacdac - Connect and code electronics. Instantly.`
 const SITE_DESCRIPTION = `Jacdac is a plug-and-play hardware and software stack for microcontrollers and their peripherals such as sensors and actuators. Jacdac is primarily designed for “modular electronics” scenarios that support rapid prototyping, creative exploration, making and learning through physical computing. Jacdac is designed to be cheap, flexible and extensible.`
 
 module.exports = {
@@ -90,19 +90,13 @@ module.exports = {
         `gatsby-plugin-react-helmet`,
         `gatsby-plugin-image`,
         `gatsby-plugin-sharp`,
-        {
-            resolve: `gatsby-remark-images`,
-            options: {
-                linkImagesToOriginal: false,
-            },
-        },
         `gatsby-transformer-sharp`,
         {
             resolve: `gatsby-plugin-mdx`,
             options: {
-                defaultLayouts: {
-                    extensions: [`.mdx`, `.md`],
-                    default: require.resolve("./src/components/Page.tsx"),
+                extensions: [`.mdx`, `.md`],
+                mdxOptions: {
+                    remarkPlugins: [require(`remark-gfm`)],
                 },
                 gatsbyRemarkPlugins: [
                     wsl || offline
@@ -126,37 +120,6 @@ module.exports = {
                         },
                     },
                     "gatsby-remark-static-images",
-                    "gatsby-remark-embed-snippet",
-                    "gatsby-remark-copy-linked-files",
-                ].filter(plugin => !!plugin),
-            },
-        },
-        {
-            resolve: `gatsby-transformer-remark`,
-            options: {
-                plugins: [
-                    wsl || offline
-                        ? undefined
-                        : {
-                              resolve: "gatsby-remark-makecode",
-                              options: {
-                                  editorUrl: "https://makecode.microbit.org/",
-                              },
-                          },
-                    "gatsby-remark-autolink-headers",
-                    "gatsby-remark-external-links",
-                    {
-                        resolve: `gatsby-remark-images`,
-                        options: {
-                            // It's important to specify the maxWidth (in pixels) of
-                            // the content container as this plugin uses this as the
-                            // base for generating different widths of each image.
-                            maxWidth: maxImageWidth,
-                            linkImagesToOriginal: false,
-                        },
-                    },
-                    "gatsby-remark-static-images",
-                    "gatsby-remark-embed-snippet",
                     "gatsby-remark-copy-linked-files",
                 ].filter(plugin => !!plugin),
             },
@@ -170,7 +133,7 @@ module.exports = {
                         title: node => node.frontmatter.title,
                         description: node =>
                             node.frontmatter.description || node.excerpt,
-                        body: node => node.rawBody,
+                        body: node => node.rawBody || node.body,
                         tags: node => node.frontmatter.tags || "",
                         url: node => node.frontmatter.path || node.fields.slug,
                     },
@@ -201,64 +164,6 @@ module.exports = {
                 }, // filter: (node, getNode) => node.frontmatter.tags !== "exempt",
             },
         },
-        /*    
-    {
-      resolve: 'gatsby-plugin-flexsearch',
-      options: {
-        // L
-        languages: ['en'],
-        type: 'Mdx', // Filter the node types you want to index
-        // Fields to index.
-        fields: [
-          {
-            name: 'title',
-            indexed: true, // If indexed === true, the field will be indexed.
-            resolver: 'frontmatter.title',
-            // Attributes for indexing logic. Check https://github.com/nextapps-de/flexsearch#presets for details.
-            attributes: {
-              encode: "extra",
-              tokenize: "full",
-              threshold: 1,
-              resolution: 3
-            },
-            store: true, // In case you want to make the field available in the search results.
-          },
-          {
-            name: 'description',
-            indexed: true,
-            resolver: 'frontmatter.description',
-            attributes: {
-              encode: 'balance',
-              tokenize: 'strict',
-              threshold: 6,
-              depth: 3,
-            },
-            store: false,
-          },
-          {
-            name: 'body',
-            indexed: true, // If indexed === true, the field will be indexed.
-            resolver: 'rawBody',
-            // Attributes for indexing logic. Check https://github.com/nextapps-de/flexsearch#presets for details.
-            attributes: {
-              encode: "casei",
-              tokenize: "forward",
-              threshold: 2,
-              resolution: 4,
-              depth: 3
-            },
-            store: false, // In case you want to make the field available in the search results.
-          },
-          {
-            name: 'url',
-            indexed: false,
-            resolver: 'fields.slug',
-            store: true,
-          },
-        ],
-      },
-    },
-    */
         "gatsby-plugin-sitemap",
         {
             resolve: `gatsby-plugin-manifest`,

diff --git a/gatsby-node.js b/gatsby-node.js
@@ -469,4 +469,4 @@ exports.onPostBuild = async ({ graphql }) => {
             )
             .join("\n")
     )
-}
+}
diff --git a/jacdac-ts b/jacdac-ts
diff --git a/package.json b/package.json
@@ -17,15 +17,14 @@
     "@gatsby-contrib/gatsby-plugin-elasticlunr-search": "^3.0.2",
     "@jscad/modeling": "^2.9.6",
     "@jscad/stl-serializer": "^2.1.11",
-    "@mdx-js/mdx": "^1.6.22",
-    "@mdx-js/react": "^1.6.22",
+    "@mdx-js/react": "^2.1.2",
     "@microsoft/applicationinsights-web": "^2.8.6",
     "@mui/icons-material": "^5.8.4",
-    "@mui/lab": "^5.0.0-alpha.94",
+    "@mui/lab": "^5.0.0-alpha.95",
     "@mui/material": "^5.10.0",
     "@octokit/core": "^4.0.5",
     "@parcel/transformer-typescript-types": "^2.7.0",
-    "@react-three/drei": "^9.22.3",
+    "@react-three/drei": "^9.22.6",
     "@react-three/fiber": "^8.3.1",
     "@tensorflow/tfjs": "3.8.0",
     "@tidyjs/tidy": "^2.5.1",
@@ -36,8 +35,8 @@
     "@types/w3c-web-usb": "^1.0.6",
     "@types/web-bluetooth": "^0.0.15",
     "@types/wicg-file-system-access": "^2020.9.5",
-    "@typescript-eslint/eslint-plugin": "^5.33.0",
-    "@typescript-eslint/parser": "^5.33.0",
+    "@typescript-eslint/eslint-plugin": "^5.33.1",
+    "@typescript-eslint/parser": "^5.33.1",
     "accessible-nprogress": "^2.1.2",
     "assert": "^2.0.0",
     "blockly": "^6.20210701.0",
@@ -50,34 +49,33 @@
     "eslint": "^8.22.0",
     "eslint-plugin-jsx-a11y": "^6.6.1",
     "eslint-plugin-react": "^7.30.1",
-    "gatsby": "^4.20.0",
-    "gatsby-plugin-catch-links": "^4.20.0",
-    "gatsby-plugin-image": "^2.20.0",
-    "gatsby-plugin-manifest": "^4.20.0",
-    "gatsby-plugin-mdx": "^3.20.0",
+    "gatsby": "^4.21.0",
+    "gatsby-plugin-catch-links": "^4.21.0",
+    "gatsby-plugin-image": "^2.21.0",
+    "gatsby-plugin-manifest": "^4.21.0",
+    "gatsby-plugin-mdx": "^4.0.0",
     "gatsby-plugin-meta-redirect": "^1.1.1",
-    "gatsby-plugin-offline": "^5.20.0",
-    "gatsby-plugin-react-helmet": "^5.20.0",
+    "gatsby-plugin-offline": "^5.21.0",
+    "gatsby-plugin-react-helmet": "^5.21.0",
     "gatsby-plugin-robots-txt": "^1.7.1",
-    "gatsby-plugin-sharp": "^4.20.0",
-    "gatsby-plugin-sitemap": "^5.20.0",
+    "gatsby-plugin-sharp": "^4.21.0",
+    "gatsby-plugin-sitemap": "^5.21.0",
     "gatsby-plugin-webpack-bundle-analyser-v2": "^1.1.27",
     "gatsby-prismjs-dracula": "^0.1.15",
-    "gatsby-remark-autolink-headers": "^5.20.0",
-    "gatsby-remark-copy-linked-files": "^5.20.0",
-    "gatsby-remark-embed-snippet": "^7.20.0",
+    "gatsby-remark-autolink-headers": "^5.21.0",
+    "gatsby-remark-copy-linked-files": "^5.21.0",
     "gatsby-remark-external-links": "0.0.4",
-    "gatsby-remark-images": "^6.20.0",
+    "gatsby-remark-images": "^6.21.0",
     "gatsby-remark-makecode": "^1.0.24",
     "gatsby-remark-static-images": "^1.2.1",
-    "gatsby-source-filesystem": "^4.20.0",
+    "gatsby-source-filesystem": "^4.21.0",
     "gatsby-theme-material-ui": "^5.3.0",
-    "gatsby-transformer-csv": "^4.20.0",
-    "gatsby-transformer-javascript-frontmatter": "^4.20.0",
-    "gatsby-transformer-json": "^4.20.0",
+    "gatsby-transformer-csv": "^4.21.0",
+    "gatsby-transformer-javascript-frontmatter": "^4.21.0",
+    "gatsby-transformer-json": "^4.21.0",
     "gatsby-transformer-plaintext": "^2.0.0",
-    "gatsby-transformer-remark": "^5.20.0",
-    "gatsby-transformer-sharp": "^4.20.0",
+    "gatsby-transformer-remark": "^5.21.0",
+    "gatsby-transformer-sharp": "^4.21.0",
     "gltfjsx": "^5.0.2",
     "howler": "^2.2.3",
     "is-svg": "^4.3.2",
@@ -89,13 +87,12 @@
     "octokit-plugin-create-pull-request": "pelikhan/octokit-plugin-create-pull-request#forkbinarydist",
     "paho-mqtt": "^1.1.0",
     "papaparse": "^5.3.2",
-    "peerjs": "^1.3.2",
     "postcss": "^8.4.16",
     "prettier": "2.7.1",
     "prism-react-renderer": "^1.3.5",
     "prismjs": "^1.28.0",
     "prop-types": "^15.8.1",
-    "puppeteer": "^16.1.0",
+    "puppeteer": "^16.1.1",
     "qrcode": "^1.5.1",
     "react": "^18.2.0",
     "react-blockly": "^7.0.1",
@@ -113,7 +110,7 @@
     "react-virtualized-auto-sizer": "^1.0.6",
     "react-window": "^1.8.7",
     "regenerator-runtime": "^0.13.9",
-    "remark-gfm": "^3.0.1",
+    "remark-gfm": "^1",
     "sanitize-html": "^2.7.1",
     "simple-statistics": "^7.7.6",
     "slug": "^5.3.0",
@@ -124,7 +121,7 @@
     "use-sync-external-store": "^1.2.0",
     "util": "^0.12.4",
     "vega": "^5.22.1",
-    "vega-lite": "^5.4.0",
+    "vega-lite": "^5.5.0",
     "ws": "^8.8.1",
     "xmlhttprequest-ssl": "^2.0.0"
   },

diff --git a/pxt-jacdac b/pxt-jacdac
diff --git a/src/components/CodeBlock.tsx b/src/components/CodeBlock.tsx
@@ -151,6 +151,9 @@ export default function CodeBlock(props: {
     copy?: boolean
 }) {
     const { children, filename, className, ...rest } = props
+
+    if (className === undefined) return <code>{children}</code>
+
     const language = className?.replace(/language-/, "") || ""
     switch (language) {
         case "trace":

diff --git a/src/components/blockly/dsl/servicesdsl.ts b/src/components/blockly/dsl/servicesdsl.ts
@@ -260,38 +260,6 @@ export class ServicesBlockDomainSpecificLanguage
                         template: "custom",
                     }
             ),
-            ...resolveService(SRV_LED).map(
-                service =>
-                    <CustomBlockDefinition>{
-                        kind: "block",
-                        type: `fade`,
-                        message0: `set %1 to %2`,
-                        args0: [
-                            roleVariable(service),
-                            {
-                                type: "input_value",
-                                name: "color",
-                                check: "Number",
-                            },
-                        ],
-                        values: {
-                            color: {
-                                kind: "block",
-                                type: LEDColorField.SHADOW.type,
-                            },
-                        },
-                        colour: this.serviceColor(service),
-                        inputsInline: true,
-                        previousStatement: CODE_STATEMENT_TYPE,
-                        nextStatement: CODE_STATEMENT_TYPE,
-                        tooltip: `Set LED color`,
-                        helpUrl: serviceHelp(service),
-                        service,
-                        expression: `$role.animate(($color >> 16) & 0xff, ($color >> 8) & 0xff, ($color >> 0) & 0xff, 0)`,
-                        template: "custom",
-                        group: "",
-                    }
-            ),
             ...resolveService(SRV_SEVEN_SEGMENT_DISPLAY).map(
                 service =>
                     <CustomBlockDefinition>{

diff --git a/src/components/blog/BlogEntries.tsx b/src/components/blog/BlogEntries.tsx
@@ -19,9 +19,6 @@ export default function BlogEntries(props: { header?: ReactNode }) {
                         description
                         date
                     }
-                    headings {
-                        value
-                    }
                 }
             }
         }

diff --git a/src/components/dotnet/DotNetProjects.tsx b/src/components/dotnet/DotNetProjects.tsx
@@ -19,9 +19,6 @@ export default function DotNetProjects() {
                         title
                         order
                     }
-                    headings {
-                        value
-                    }
                 }
             }
         }