Upgrade Codemirror (#1127)

* upgrade codemirror

* factor out codemirror version

components/Meta.js

@@ -5,6 +5,8 @@ import Reset from './style/Reset'
 import Font from './style/Font'
 import Typography from './style/Typography'
 
+const CODEMIRROR_VERSION = '5.58.2'
+
 const HIGHLIGHTS_ONLY = ['shades-of-purple', 'vscode', 'a11y-dark']
 const LOCAL_STYLESHEETS = ['one-light', 'one-dark', 'verminal', 'night-owl', 'nord', 'synthwave-84']
 const CDN_STYLESHEETS = THEMES.filter(
@@ -26,7 +28,7 @@ export const StylesheetLink = ({ theme }) => {
     href = `/static/themes/${theme}.min.css`
   } else {
     const themeDef = THEMES_HASH[theme]
-    href = `//cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.2/theme/${
+    href = `//cdnjs.cloudflare.com/ajax/libs/codemirror/${CODEMIRROR_VERSION}/theme/${
       themeDef && (themeDef.link || themeDef.id)
     }.min.css`
   }
@@ -35,7 +37,9 @@ export const StylesheetLink = ({ theme }) => {
 }
 
 export const CodeMirrorLink = () => (
-  <Link href="//cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.2/codemirror.min.css" />
+  <Link
+    href={`//cdnjs.cloudflare.com/ajax/libs/codemirror/${CODEMIRROR_VERSION}/codemirror.min.css`}
+  />
 )
 
 const title = 'Carbon'
@@ -66,13 +70,15 @@ export const MetaTags = React.memo(() => (
 export const MetaLinks = React.memo(() => {
   return (
     <React.Fragment>
-      <Link href="//cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.2/theme/seti.min.css" />
+      <Link
+        href={`//cdnjs.cloudflare.com/ajax/libs/codemirror/${CODEMIRROR_VERSION}/theme/seti.min.css`}
+      />
       <CodeMirrorLink />
       {LOCAL_STYLESHEETS.map(id => (
         <Link key={id} href={`/static/themes/${id}.min.css`} />
       ))}
       {CDN_STYLESHEETS.map(themeDef => {
-        const href = `//cdnjs.cloudflare.com/ajax/libs/codemirror/5.48.2/theme/${
+        const href = `//cdnjs.cloudflare.com/ajax/libs/codemirror/${CODEMIRROR_VERSION}/theme/${
           themeDef && (themeDef.link || themeDef.id)
         }.min.css`
         return <Link key={themeDef.id} href={href} />

package.json

@@ -22,7 +22,7 @@
     "actionsack": "^0.0.13",
     "axios": "^0.21.0",
     "cm-show-invisibles": "^3.1.0",
-    "codemirror": "5.51.0",
+    "codemirror": "5.58.2",
     "codemirror-graphql": "^0.12.3",
     "codemirror-mode-elixir": "^1.1.2",
     "codemirror-solidity": "^0.2.3",
@@ -48,7 +48,7 @@
     "prettier": "^2.1.2",
     "react": "^17.0.1",
     "react-click-outside": "^3.0.0",
-    "react-codemirror2": "^7.1.0",
+    "react-codemirror2": "^7.2.1",
     "react-color": "^2.18.1",
     "react-copy-to-clipboard": "^5.0.2",
     "react-dom": "^17.0.1",

yarn.lock

@@ -3502,12 +3502,7 @@ codemirror-solidity@^0.2.3:
   dependencies:
     codemirror "^5.56.0"
 
-codemirror@5.51.0:
-  version "5.51.0"
-  resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.51.0.tgz#7746caaf5223e68f5c55ea11e2f3cc82a9a3929e"
-  integrity sha512-vyuYYRv3eXL0SCuZA4spRFlKNzQAewHcipRQCOKgRy7VNAvZxTKzbItdbCl4S5AgPZ5g3WkHp+ibWQwv9TLG7Q==
-
-codemirror@^5.56.0:
+codemirror@5.58.2, codemirror@^5.56.0:
   version "5.58.2"
   resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.58.2.tgz#ed54a1796de1498688bea1cdd4e9eeb187565d1b"
   integrity sha512-K/hOh24cCwRutd1Mk3uLtjWzNISOkm4fvXiMO7LucCrqbh6aJDdtqUziim3MZUI6wOY0rvY1SlL1Ork01uMy6w==
@@ -8552,10 +8547,10 @@ react-click-outside@^3.0.0, react-click-outside@^3.0.1:
   dependencies:
     hoist-non-react-statics "^2.1.1"
 
-react-codemirror2@^7.1.0:
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/react-codemirror2/-/react-codemirror2-7.1.0.tgz#b874a275ad4f6f2ee5adb23b550c0f4b8b82776d"
-  integrity sha512-Rel0QbPnCTjHxgZYt6TkGw4icSZXNyONHb72a+1wWA+PlYJIvzFAv4pZlDPG0rpKpKmy4kSUlkoWgneH7w3A0g==
+react-codemirror2@^7.2.1:
+  version "7.2.1"
+  resolved "https://registry.yarnpkg.com/react-codemirror2/-/react-codemirror2-7.2.1.tgz#38dab492fcbe5fb8ebf5630e5bb7922db8d3a10c"
+  integrity sha512-t7YFmz1AXdlImgHXA9Ja0T6AWuopilub24jRaQdPVbzUJVNKIYuy3uCFZYa7CE5S3UW6SrSa5nAqVQvtzRF9gw==
 
 react-color@^2.18.1:
   version "2.18.1"