fix: rollback update prod d3-* dependencies

There's an error with event not being defined in d3-selection in the newest version of the app, I'm not sure how to fix it so I just use the last known version of d3-* which seems to work just fine.
mauriciopoppe · Dec 22, 2023 · 1989e62 · 1989e62
1 parent d379c55
commit 1989e62
Show file tree

Hide file tree

Showing 6 changed files with 98 additions and 192 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,16 +9,16 @@
     "test": "jest"
   },
   "dependencies": {
-    "arrify": "^3.0.0",
+    "arrify": "^2.0.1",
     "compute-lcg": "^1.0.0",
-    "d3-dispatch": "^3.0.1",
-    "d3-drag": "^3.0.0",
-    "d3-scale": "^4.0.2",
-    "d3-scale-chromatic": "^3.0.0",
-    "d3-selection": "^3.0.0",
-    "d3-shape": "^3.2.0",
-    "d3-timer": "^3.0.1",
-    "d3-transition": "^3.0.1",
+    "d3-dispatch": "^1.0.3",
+    "d3-drag": "^1.1.0",
+    "d3-scale": "^1.0.6",
+    "d3-scale-chromatic": "^2.0.0",
+    "d3-selection": "^1.1.0",
+    "d3-shape": "^1.2.0",
+    "d3-timer": "^1.0.6",
+    "d3-transition": "^1.1.0",
     "extend": "^3.0.2",
     "webcola": "^3.4.0"
   },

diff --git a/public/src/App.jsx b/public/src/App.jsx
@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 
 import { Introduction } from './pages/Introduction/Introduction.jsx'
 import { Api } from './pages/Api/Api.jsx'
@@ -10,6 +10,7 @@ import './index.scss'
 
 // eslint-ignore
 !(function (d, s, id) {
+  // eslint-ignore
   var js,
     fjs = d.getElementsByTagName(s)[0],
     p = /^http:/.test(d.location) ? 'http' : 'https'
@@ -32,6 +33,7 @@ const App = () => {
         <div className="is-flex is-justify-content-center" dangerouslySetInnerHTML={{ __html: GreulerSVG }} />
         <div className="has-text-centered">
           <iframe
+            title="foo"
             src="https://ghbtns.com/github-btn.html?user=mauriciopoppe&repo=greuler&type=star&count=true"
             height="20px"
           />
@@ -49,9 +51,9 @@ const App = () => {
       </div>
 
       <div className="container">
-        <Introduction path="/" />
+        <Introduction />
         <hr />
-        <Api path="/api" />
+        <Api />
         <hr />
       </div>
 
@@ -62,9 +64,5 @@ const App = () => {
   )
 }
 
-ReactDOM.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.querySelector('#root')
-)
+const root = createRoot(document.getElementById('root'))
+root.render(<App />)
diff --git a/public/src/pages/Examples/Examples.jsx b/public/src/pages/Examples/Examples.jsx
@@ -3,8 +3,6 @@ import React, { useEffect } from 'react'
 import ExamplesSVG from './examples.svg'
 
 export const Examples = (props) => {
-  useEffect(() => {}, [])
-
   return (
     <div className="container mx-auto">
       <div className="flex justify-center" dangerouslySetInnerHTML={{ __html: ExamplesSVG }} />