diff --git a/web/src/App.js b/web/src/App.js
index 1fa4180..837b87a 100644
--- a/web/src/App.js
+++ b/web/src/App.js
@@ -16,6 +16,7 @@ import JsOrgCard from './components/cards/JsOrgCard'
import PypiCard from './components/cards/PypiCard'
import S3Card from './components/cards/S3Card'
import CratesioCard from './components/cards/CratesioCard'
+import { EventReporter } from './components/Analytics'
export default function App() {
const [query, setQuery] = useDeferredState(1000)
@@ -47,6 +48,7 @@ export default function App() {
+
) : null}
@@ -80,7 +82,7 @@ const Input = styled.input.attrs({
spellcheck: 'false',
})`
width: 100%;
- margin-top: 20px;
+ margin-top: 30px;
padding: 20px;
outline: none;
text-align: center;
@@ -88,11 +90,7 @@ const Input = styled.input.attrs({
font-family: monospace;
border: none;
- transition: box-shadow 0.5s ease-out;
-
- &:hover {
- box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
- }
+ box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
${mobile} {
font-size: 2rem;
diff --git a/web/src/components/Analytics.js b/web/src/components/Analytics.js
new file mode 100644
index 0000000..e26b4d4
--- /dev/null
+++ b/web/src/components/Analytics.js
@@ -0,0 +1,13 @@
+import { useEffect } from 'react'
+import ReactGA from 'react-ga'
+
+export function EventReporter({ query }) {
+ useEffect(() => {
+ ReactGA.event({
+ category: 'Navigation',
+ action: 'Send a request',
+ })
+ }, [query])
+
+ return null
+}
diff --git a/web/src/index.js b/web/src/index.js
index 2ec256c..f1bae16 100644
--- a/web/src/index.js
+++ b/web/src/index.js
@@ -5,9 +5,9 @@ import './index.css'
import App from './App'
import * as serviceWorker from './serviceWorker'
+ReactDOM.render(, document.getElementById('root'))
+
ReactGA.initialize('UA-28919359-15')
ReactGA.pageview(window.location.pathname + window.location.search)
-ReactDOM.render(, document.getElementById('root'))
-
serviceWorker.unregister()