Prepping editor.

editor/src/App.tsx

@@ -0,0 +1,19 @@
+import { VNSceneEditor } from "./views/VNSceneEditor";
+
+export const App = () => {
+  return (
+    <>
+      <header>
+        Header
+      </header>
+
+      <main>
+        <VNSceneEditor />
+      </main>
+
+      <footer>
+        Footer
+      </footer>
+    </>
+  );
+}

editor/src/api/base.ts

@@ -0,0 +1,4 @@
+//@ts-ignore
+const wdawnapi = (globalThis['dawnapi'] as any);
+
+export const API_BASE = wdawnapi;

editor/src/api/index.ts

@@ -0,0 +1 @@
+export * from './vnscene';

editor/src/api/vnscene.ts

@@ -0,0 +1,3 @@
+import { API_BASE } from "./base";
+
+export const doVnTest = API_BASE['vnscene:test'] as (bruh1:string, bruh2:string) => Promise<string>;

editor/src/index.css

@@ -0,0 +1,4 @@
+html,body {
+  margin: 0;
+  padding: 0;
+}

editor/src/index.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import { App } from './App';
+import reportWebVitals from './reportWebVitals';
+
+const root = ReactDOM.createRoot(document.getElementById('root')!);
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(console.log))
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();

editor/src/react-app-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="react-scripts" />

editor/src/reportWebVitals.ts

@@ -0,0 +1,15 @@
+import { ReportHandler } from 'web-vitals';
+
+const reportWebVitals = (onPerfEntry?: ReportHandler) => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+      getCLS(onPerfEntry);
+      getFID(onPerfEntry);
+      getFCP(onPerfEntry);
+      getLCP(onPerfEntry);
+      getTTFB(onPerfEntry);
+    });
+  }
+};
+
+export default reportWebVitals;

editor/src/setupTests.ts

@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';

editor/src/views/VNSceneEditor.tsx

@@ -0,0 +1,16 @@
+import React, { useState } from 'react';
+import { doVnTest } from '../api';
+
+export const VNSceneEditor = () => {
+  const [ test, setTest ] = useState('');
+
+  return (
+    <div>
+      VN Scene Editor
+
+      <button onClick={() => {
+        doVnTest('bruh1', 'bruh2').then(e => console.log(e)).catch(e => console.error(e));
+      }}>Clicky</button>
+    </div>
+  );
+}