Merge pull request #5 from vakila/fixes

Fixes & updates
automerge · Mar 19, 2024 · 7209210 · 7209210
2 parents 29b95ed + 4e268c3
commit 7209210
Show file tree

Hide file tree

Showing 7 changed files with 635 additions and 661 deletions.
diff --git a/index.html b/index.html
@@ -1,13 +1,16 @@
 <!doctype html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React + TS</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>
+
+<head>
+  <meta charset="UTF-8" />
+  <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Meet Automerge</title>
+</head>
+
+<body>
+  <div id="root"></div>
+  <script type="module" src="/src/main.tsx"></script>
+</body>
+
+</html>
diff --git a/package.json b/package.json
@@ -18,19 +18,17 @@
     "@automerge/automerge-wasm": "^0.9.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "vite-plugin-top-level-await": "^1.3.1",
     "vite-plugin-wasm": "^3.2.2"
   },
   "devDependencies": {
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
-    "@typescript-eslint/eslint-plugin": "^6.0.0",
-    "@typescript-eslint/parser": "^6.0.0",
     "@vitejs/plugin-react": "^4.2",
     "eslint": "^8.45.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.3",
     "typescript": "^5.2",
+    "typescript-eslint": "^7.3.1",
     "vite": "^5"
   }
-}
+}
diff --git a/public/automerge.png b/public/automerge.png
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,38 +1,34 @@
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
+import automergeLogo from '/automerge.png'
 import './App.css'
-import {default as A} from "@automerge/automerge/next"
-import {AutomergeUrl} from '@automerge/automerge-repo'
-import {useDocument} from '@automerge/automerge-repo-react-hooks'
+import { default as A } from "@automerge/automerge/next"
+import { AutomergeUrl } from '@automerge/automerge-repo'
+import { useDocument } from '@automerge/automerge-repo-react-hooks'
 
 interface CounterDoc {
-    counter: A.Counter
+  counter: A.Counter
 }
 
-function App({docUrl}: {docUrl: AutomergeUrl}) {
-  const [doc, changeDoc] = useDocument<CounterDoc>(docUrl) 
+function App({ docUrl }: { docUrl: AutomergeUrl }) {
+  const [doc, changeDoc] = useDocument<CounterDoc>(docUrl)
 
   return (
     <>
       <div>
-        <a href="https://vitejs.dev" target="_blank">
-          <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
-        <a href="https://react.dev" target="_blank">
-          <img src={reactLogo} className="logo react" alt="React logo" />
+        <a href="https://automerge.org" target="_blank">
+          <img src={automergeLogo} className="logo" alt="Vite logo" />
         </a>
       </div>
-      <h1>Vite + React</h1>
+      <h1>Meet Automerge</h1>
       <div className="card">
         <button onClick={() => changeDoc((d) => d.counter.increment(1))}>
-          count is { doc && doc.counter.value }
+          count is {doc && doc.counter.value}
         </button>
         <p>
-          Edit <code>src/App.tsx</code> and save to test HMR
+          Open this page in another tab to watch the updates synchronize
         </p>
       </div>
       <p className="read-the-docs">
-        Click on the Vite and React logos to learn more
+        Built with Automerge, Vite, React, and TypeScript
       </p>
     </>
   )

diff --git a/src/main.tsx b/src/main.tsx
@@ -15,26 +15,26 @@ const repo = new Repo({
 })
 
 declare global {
-    interface Window {
-        handle: DocHandle<unknown>
-    }
+  interface Window {
+    handle: DocHandle<unknown>
+  }
 }
 
-const rootDocUrl = `${document.location.hash.substr(1)}`
+const rootDocUrl = `${document.location.hash.substring(1)}`
 let handle
 if (isValidAutomergeUrl(rootDocUrl)) {
-    handle = repo.find(rootDocUrl)
+  handle = repo.find(rootDocUrl)
 } else {
-    handle = repo.create<{counter?: A.Counter}>()
-    handle.change(d => d.counter = new A.Counter())
+  handle = repo.create<{ counter?: A.Counter }>()
+  handle.change(d => d.counter = new A.Counter())
 }
 const docUrl = document.location.hash = handle.url
 window.handle = handle // we'll use this later for experimentation
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <RepoContext.Provider value={repo}>
-      <App docUrl={docUrl}/>
+      <App docUrl={docUrl} />
     </RepoContext.Provider>
   </React.StrictMode>,
 )
diff --git a/vite.config.ts b/vite.config.ts
@@ -2,10 +2,9 @@
 import { defineConfig } from "vite"
 import react from "@vitejs/plugin-react"
 import wasm from "vite-plugin-wasm"
-import topLevelAwait from "vite-plugin-top-level-await"
 
 export default defineConfig({
-  plugins: [topLevelAwait(), wasm(), react()],
+  plugins: [wasm(), react()],
 
   worker: {
     format: "es",