fullstack skeleton

apps/events/package.json

@@ -14,7 +14,7 @@
   "dependencies": {
     "@automerge/automerge": "^2.2.8",
     "@automerge/automerge-repo-react-hooks": "^1.2.1",
-    "@effect/schema": "^0.74.2",
+    "effect": "^3.10.12",
     "@noble/hashes": "^1.5.0",
     "@privy-io/react-auth": "^1.88.4",
     "@radix-ui/react-avatar": "^1.1.1",

apps/events/src/routeTree.gen.ts

@@ -1,19 +1,20 @@
-/* prettier-ignore-start */
-
 /* eslint-disable */
 
 // @ts-nocheck
 
 // noinspection JSUnusedGlobalSymbols
 
-// This file is auto-generated by TanStack Router
+// This file was automatically generated by TanStack Router.
+// You should NOT make any changes in this file as it will be overwritten.
+// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
 
 import { createFileRoute } from '@tanstack/react-router'
 
 // Import Routes
 
 import { Route as rootRoute } from './routes/__root'
 import { Route as Schema2Import } from './routes/schema2'
+import { Route as PlaygroundImport } from './routes/playground'
 import { Route as IndexImport } from './routes/index'
 import { Route as SpaceSpaceIdImport } from './routes/space/$spaceId'
 import { Route as SpaceOldSpaceIdImport } from './routes/space-old/$spaceId'
@@ -26,31 +27,43 @@ const LoginLazyImport = createFileRoute('/login')()
 // Create/Update Routes
 
 const Login2LazyRoute = Login2LazyImport.update({
+  id: '/login2',
   path: '/login2',
   getParentRoute: () => rootRoute,
 } as any).lazy(() => import('./routes/login2.lazy').then((d) => d.Route))
 
 const LoginLazyRoute = LoginLazyImport.update({
+  id: '/login',
   path: '/login',
   getParentRoute: () => rootRoute,
 } as any).lazy(() => import('./routes/login.lazy').then((d) => d.Route))
 
 const Schema2Route = Schema2Import.update({
+  id: '/schema2',
   path: '/schema2',
   getParentRoute: () => rootRoute,
 } as any)
 
+const PlaygroundRoute = PlaygroundImport.update({
+  id: '/playground',
+  path: '/playground',
+  getParentRoute: () => rootRoute,
+} as any)
+
 const IndexRoute = IndexImport.update({
+  id: '/',
   path: '/',
   getParentRoute: () => rootRoute,
 } as any)
 
 const SpaceSpaceIdRoute = SpaceSpaceIdImport.update({
+  id: '/space/$spaceId',
   path: '/space/$spaceId',
   getParentRoute: () => rootRoute,
 } as any)
 
 const SpaceOldSpaceIdRoute = SpaceOldSpaceIdImport.update({
+  id: '/space-old/$spaceId',
   path: '/space-old/$spaceId',
   getParentRoute: () => rootRoute,
 } as any)
@@ -66,6 +79,13 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof IndexImport
       parentRoute: typeof rootRoute
     }
+    '/playground': {
+      id: '/playground'
+      path: '/playground'
+      fullPath: '/playground'
+      preLoaderRoute: typeof PlaygroundImport
+      parentRoute: typeof rootRoute
+    }
     '/schema2': {
       id: '/schema2'
       path: '/schema2'
@@ -108,6 +128,7 @@ declare module '@tanstack/react-router' {
 
 export interface FileRoutesByFullPath {
   '/': typeof IndexRoute
+  '/playground': typeof PlaygroundRoute
   '/schema2': typeof Schema2Route
   '/login': typeof LoginLazyRoute
   '/login2': typeof Login2LazyRoute
@@ -117,6 +138,7 @@ export interface FileRoutesByFullPath {
 
 export interface FileRoutesByTo {
   '/': typeof IndexRoute
+  '/playground': typeof PlaygroundRoute
   '/schema2': typeof Schema2Route
   '/login': typeof LoginLazyRoute
   '/login2': typeof Login2LazyRoute
@@ -127,6 +149,7 @@ export interface FileRoutesByTo {
 export interface FileRoutesById {
   __root__: typeof rootRoute
   '/': typeof IndexRoute
+  '/playground': typeof PlaygroundRoute
   '/schema2': typeof Schema2Route
   '/login': typeof LoginLazyRoute
   '/login2': typeof Login2LazyRoute
@@ -138,6 +161,7 @@ export interface FileRouteTypes {
   fileRoutesByFullPath: FileRoutesByFullPath
   fullPaths:
     | '/'
+    | '/playground'
     | '/schema2'
     | '/login'
     | '/login2'
@@ -146,6 +170,7 @@ export interface FileRouteTypes {
   fileRoutesByTo: FileRoutesByTo
   to:
     | '/'
+    | '/playground'
     | '/schema2'
     | '/login'
     | '/login2'
@@ -154,6 +179,7 @@ export interface FileRouteTypes {
   id:
     | '__root__'
     | '/'
+    | '/playground'
     | '/schema2'
     | '/login'
     | '/login2'
@@ -164,6 +190,7 @@ export interface FileRouteTypes {
 
 export interface RootRouteChildren {
   IndexRoute: typeof IndexRoute
+  PlaygroundRoute: typeof PlaygroundRoute
   Schema2Route: typeof Schema2Route
   LoginLazyRoute: typeof LoginLazyRoute
   Login2LazyRoute: typeof Login2LazyRoute
@@ -173,6 +200,7 @@ export interface RootRouteChildren {
 
 const rootRouteChildren: RootRouteChildren = {
   IndexRoute: IndexRoute,
+  PlaygroundRoute: PlaygroundRoute,
   Schema2Route: Schema2Route,
   LoginLazyRoute: LoginLazyRoute,
   Login2LazyRoute: Login2LazyRoute,
@@ -184,15 +212,14 @@ export const routeTree = rootRoute
   ._addFileChildren(rootRouteChildren)
   ._addFileTypes<FileRouteTypes>()
 
-/* prettier-ignore-end */
-
 /* ROUTE_MANIFEST_START
 {
   "routes": {
     "__root__": {
       "filePath": "__root.tsx",
       "children": [
         "/",
+        "/playground",
         "/schema2",
         "/login",
         "/login2",
@@ -203,6 +230,9 @@ export const routeTree = rootRoute
     "/": {
       "filePath": "index.tsx"
     },
+    "/playground": {
+      "filePath": "playground.tsx"
+    },
     "/schema2": {
       "filePath": "schema2.tsx"
     },

apps/events/src/routes/__root.tsx

@@ -11,7 +11,14 @@ export const Route = createRootRoute({
             <span className="sr-only">Acme Events</span>
             <CalendarDays className="h-6 w-6" />
           </Link>
+
           <nav className="ml-auto flex gap-4 sm:gap-6">
+            <Link
+              to="/playground"
+              className="text-sm font-medium hover:underline underline-offset-4"
+            >
+              Playground
+            </Link>
             <Link
               to="/space/$spaceId"
               params={{ spaceId: "abc" }}

apps/events/src/routes/playground.tsx

@@ -0,0 +1,59 @@
+import { Button } from "@/components/ui/button";
+import { createFileRoute } from "@tanstack/react-router";
+import { createIdentity, createSpace } from "graph-framework";
+import { useEffect, useState } from "react";
+
+export const Route = createFileRoute("/playground")({
+  component: () => <Playground />,
+});
+
+const Playground = () => {
+  const [websocketConnection, setWebsocketConnection] = useState<WebSocket>();
+
+  useEffect(() => {
+    const websocketConnection = new WebSocket(`ws://localhost:3030/`);
+    setWebsocketConnection(websocketConnection);
+
+    const onMessage = (event: MessageEvent) => {
+      console.log("message received", event.data);
+    };
+    websocketConnection.addEventListener("message", onMessage);
+
+    const onOpen = () => {
+      console.log("websocket connected");
+    };
+    websocketConnection.addEventListener("open", onOpen);
+
+    const onError = (event: Event) => {
+      console.log("websocket error", event);
+    };
+    websocketConnection.addEventListener("error", onError);
+
+    const onClose = (event: CloseEvent) => {
+      console.log("websocket close", event);
+    };
+    websocketConnection.addEventListener("close", onClose);
+
+    return () => {
+      websocketConnection.removeEventListener("message", onMessage);
+      websocketConnection.removeEventListener("open", onOpen);
+      websocketConnection.removeEventListener("error", onError);
+      websocketConnection.removeEventListener("close", onClose);
+      websocketConnection.close();
+    };
+  }, []);
+
+  return (
+    <div>
+      <Button
+        onClick={() => {
+          const identity = createIdentity();
+          const spaceEvent = createSpace({ author: identity });
+          websocketConnection?.send(JSON.stringify(spaceEvent));
+        }}
+      >
+        Create space
+      </Button>
+    </div>
+  );
+};

apps/events/tsconfig.app.json

@@ -16,6 +16,7 @@
 
     /* Linting */
     "strict": true,
+    "exactOptionalPropertyTypes": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,

apps/events/tsconfig.node.json

@@ -14,6 +14,7 @@
 
     /* Linting */
     "strict": true,
+    "exactOptionalPropertyTypes": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true

apps/server/package.json

@@ -13,12 +13,14 @@
     "lint": "echo \"Lint not setup\" # eslint . --ext .ts,.tsx"
   },
   "dependencies": {
-    "@prisma/client": "5.15.0",
+    "@prisma/client": "5.22.0",
     "@trpc/server": "11.0.0-rc.417",
     "@types/libsodium-wrappers": "^0.7.14",
     "cors": "^2.8.5",
     "dotenv": "^16.4.5",
-    "express": "^4.19.2",
+    "effect": "^3.10.12",
+    "express": "^5.0.1",
+    "graph-framework-space-events": "workspace:*",
     "isomorphic-ws": "^5.0.0",
     "libsodium-wrappers": "^0.7.15",
     "secsync": "^0.5.0",
@@ -28,13 +30,13 @@
   },
   "devDependencies": {
     "@types/cors": "^2.8.17",
-    "@types/express": "^4.17.21",
-    "@types/node": "^20.14.7",
+    "@types/express": "^5.0.0",
+    "@types/node": "^22.9.0",
     "@types/pg": "^8.11.6",
-    "@types/ws": "^8.5.10",
-    "nodemon": "^3.1.4",
-    "prisma": "^5.15.1",
+    "@types/ws": "^8.5.13",
+    "nodemon": "^3.1.7",
+    "prisma": "^5.22.0",
     "ts-node": "^10.9.2",
-    "typescript": "^5.5.2"
+    "typescript": "^5.6.3"
   }
 }