revert: broken build
This commit is contained in:
parent
6ac181fca7
commit
d5791bf5ed
|
|
@ -1,17 +1,13 @@
|
||||||
import { StrictMode } from 'react'
|
|
||||||
import { createRoot } from 'react-dom/client'
|
import { createRoot } from 'react-dom/client'
|
||||||
import './index.css'
|
import './index.css'
|
||||||
import App from "./App.tsx";
|
import App from "./App.tsx";
|
||||||
import Root from "./Root.tsx";
|
|
||||||
import { start } from "@vlcn.io/ws-client/worker.js";
|
|
||||||
import { createDbProvider } from "@vlcn.io/ws-browserdb";
|
|
||||||
|
|
||||||
import initWasm from '@vlcn.io/crsqlite-wasm';
|
import initWasm from '@vlcn.io/crsqlite-wasm';
|
||||||
import wasmUrl from '@vlcn.io/crsqlite-wasm/crsqlite.wasm?url';
|
import wasmUrl from '@vlcn.io/crsqlite-wasm/crsqlite.wasm?url';
|
||||||
import tblrx from '@vlcn.io/rx-tbl';
|
import tblrx from '@vlcn.io/rx-tbl';
|
||||||
|
|
||||||
async function initializeDatabase() {
|
|
||||||
const sqlite = await initWasm(() => wasmUrl);
|
const sqlite = await initWasm(() => wasmUrl);
|
||||||
|
|
||||||
const db = await sqlite.open("todo.db");
|
const db = await sqlite.open("todo.db");
|
||||||
await db.exec(`
|
await db.exec(`
|
||||||
CREATE TABLE IF NOT EXISTS todos (
|
CREATE TABLE IF NOT EXISTS todos (
|
||||||
|
|
@ -27,64 +23,9 @@ async function initializeDatabase() {
|
||||||
);
|
);
|
||||||
SELECT crsql_as_crr('todos');
|
SELECT crsql_as_crr('todos');
|
||||||
`);
|
`);
|
||||||
db.onUpdate(async () => {
|
|
||||||
const changes = await db.execA(`SELECT * FROM crsql_changes WHERE db_version > 0 AND site_id = crsql_site_id()`);
|
|
||||||
|
|
||||||
sendChangesToServer(changes);
|
|
||||||
});
|
|
||||||
return db;
|
|
||||||
}
|
|
||||||
|
|
||||||
const config = {
|
|
||||||
dbProvider: createDbProvider(),
|
|
||||||
transportProvider: (dbName) => new WebSocket(`ws://localhost:8080/sync/${dbName}`),
|
|
||||||
};
|
|
||||||
|
|
||||||
start(config);
|
|
||||||
const ws = new WebSocket('ws://localhost:8080/sync');
|
|
||||||
|
|
||||||
ws.onmessage = async function(event) {
|
|
||||||
const { type, data } = JSON.parse(event.data);
|
|
||||||
if (type === 'changes') {
|
|
||||||
await applyChanges(data);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
function sendChangesToServer(changes) {
|
|
||||||
const formattedChanges = changes.map(change => ({
|
|
||||||
TableName: change[0],
|
|
||||||
PK: Array.isArray(change[1]) ? btoa(String.fromCharCode.apply(null, change[1])) : btoa(change[1]),
|
|
||||||
ColumnName: change[2],
|
|
||||||
Value: Array.isArray(change[3]) ? btoa(String.fromCharCode.apply(null, change[3])) : change[3],
|
|
||||||
ColVersion: Number(change[4]),
|
|
||||||
DBVersion: Number(change[5]),
|
|
||||||
SiteID: Array.isArray(change[6]) ? btoa(new TextDecoder('utf8').decode(change[6])) : btoa(change[6]),
|
|
||||||
CL: Number(change[7]),
|
|
||||||
Seq: Number(change[8])
|
|
||||||
}));
|
|
||||||
console.log(formattedChanges)
|
|
||||||
|
|
||||||
const message = {
|
|
||||||
type: "changes",
|
|
||||||
data: formattedChanges
|
|
||||||
};
|
|
||||||
|
|
||||||
ws.send(JSON.stringify(message));
|
|
||||||
}
|
|
||||||
|
|
||||||
async function applyChanges(changes) {
|
|
||||||
const db = initializeDatabase();
|
|
||||||
const rx = tblrx(db);
|
const rx = tblrx(db);
|
||||||
const ctx = { db, rx };
|
const ctx = { db, rx };
|
||||||
await db.tx(async (tx) => {
|
|
||||||
for (const change of changes) {
|
|
||||||
await tx.exec(
|
|
||||||
`INSERT INTO crsql_changes VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
|
|
||||||
change
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById("root")!.classList.add("dark");
|
document.getElementById("root")!.classList.add("dark");
|
||||||
|
|
||||||
|
|
@ -93,3 +34,4 @@ createRoot(document.getElementById("root") as HTMLElement).render(
|
||||||
<App ctx={ctx} />
|
<App ctx={ctx} />
|
||||||
</main>
|
</main>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue