From 83974e0c95d65c72d12e7d58a287514c39f3768f Mon Sep 17 00:00:00 2001 From: Frank Date: Fri, 23 May 2025 14:17:45 -0400 Subject: Share: sync --- app/packages/web/.gitignore | 28 ++++++ app/packages/web/README.md | 32 ++++++ app/packages/web/app.config.ts | 3 + app/packages/web/package.json | 20 ++++ app/packages/web/public/favicon.ico | Bin 0 -> 664 bytes app/packages/web/src/app.css | 39 ++++++++ app/packages/web/src/app.tsx | 20 ++++ app/packages/web/src/entry-client.tsx | 4 + app/packages/web/src/entry-server.tsx | 21 ++++ app/packages/web/src/global.d.ts | 1 + app/packages/web/src/routes/[...404].tsx | 19 ++++ app/packages/web/src/routes/index.tsx | 14 +++ app/packages/web/src/routes/share/[id].tsx | 150 +++++++++++++++++++++++++++++ app/packages/web/sst-env.d.ts | 9 ++ app/packages/web/tsconfig.json | 19 ++++ 15 files changed, 379 insertions(+) create mode 100644 app/packages/web/.gitignore create mode 100644 app/packages/web/README.md create mode 100644 app/packages/web/app.config.ts create mode 100644 app/packages/web/package.json create mode 100644 app/packages/web/public/favicon.ico create mode 100644 app/packages/web/src/app.css create mode 100644 app/packages/web/src/app.tsx create mode 100644 app/packages/web/src/entry-client.tsx create mode 100644 app/packages/web/src/entry-server.tsx create mode 100644 app/packages/web/src/global.d.ts create mode 100644 app/packages/web/src/routes/[...404].tsx create mode 100644 app/packages/web/src/routes/index.tsx create mode 100644 app/packages/web/src/routes/share/[id].tsx create mode 100644 app/packages/web/sst-env.d.ts create mode 100644 app/packages/web/tsconfig.json (limited to 'app/packages/web') diff --git a/app/packages/web/.gitignore b/app/packages/web/.gitignore new file mode 100644 index 000000000..751513ce1 --- /dev/null +++ b/app/packages/web/.gitignore @@ -0,0 +1,28 @@ +dist +.wrangler +.output +.vercel +.netlify +.vinxi +app.config.timestamp_*.js + +# Environment +.env +.env*.local + +# dependencies +/node_modules + +# IDEs and editors +/.idea +.project +.classpath +*.launch +.settings/ + +# Temp +gitignore + +# System Files +.DS_Store +Thumbs.db diff --git a/app/packages/web/README.md b/app/packages/web/README.md new file mode 100644 index 000000000..a84af3943 --- /dev/null +++ b/app/packages/web/README.md @@ -0,0 +1,32 @@ +# SolidStart + +Everything you need to build a Solid project, powered by [`solid-start`](https://start.solidjs.com); + +## Creating a project + +```bash +# create a new project in the current directory +npm init solid@latest + +# create a new project in my-app +npm init solid@latest my-app +``` + +## Developing + +Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server: + +```bash +npm run dev + +# or start the server and open the app in a new browser tab +npm run dev -- --open +``` + +## Building + +Solid apps are built with _presets_, which optimise your project for deployment to different environments. + +By default, `npm run build` will generate a Node app that you can run with `npm start`. To use a different preset, add it to the `devDependencies` in `package.json` and specify in your `app.config.js`. + +## This project was created with the [Solid CLI](https://solid-cli.netlify.app) diff --git a/app/packages/web/app.config.ts b/app/packages/web/app.config.ts new file mode 100644 index 000000000..de7f83103 --- /dev/null +++ b/app/packages/web/app.config.ts @@ -0,0 +1,3 @@ +import { defineConfig } from "@solidjs/start/config"; + +export default defineConfig({}); diff --git a/app/packages/web/package.json b/app/packages/web/package.json new file mode 100644 index 000000000..19834e120 --- /dev/null +++ b/app/packages/web/package.json @@ -0,0 +1,20 @@ +{ + "name": "example-basic", + "type": "module", + "scripts": { + "dev": "vinxi dev", + "build": "vinxi build", + "start": "vinxi start", + "version": "vinxi version" + }, + "dependencies": { + "@solidjs/meta": "^0.29.4", + "@solidjs/router": "^0.15.0", + "@solidjs/start": "^1.1.0", + "solid-js": "^1.9.5", + "vinxi": "^0.5.3" + }, + "engines": { + "node": ">=22" + } +} diff --git a/app/packages/web/public/favicon.ico b/app/packages/web/public/favicon.ico new file mode 100644 index 000000000..fb282da07 Binary files /dev/null and b/app/packages/web/public/favicon.ico differ diff --git a/app/packages/web/src/app.css b/app/packages/web/src/app.css new file mode 100644 index 000000000..8596998a4 --- /dev/null +++ b/app/packages/web/src/app.css @@ -0,0 +1,39 @@ +body { + font-family: Gordita, Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; +} + +a { + margin-right: 1rem; +} + +main { + text-align: center; + padding: 1em; + margin: 0 auto; +} + +h1 { + color: #335d92; + text-transform: uppercase; + font-size: 4rem; + font-weight: 100; + line-height: 1.1; + margin: 4rem auto; + max-width: 14rem; +} + +p { + max-width: 14rem; + margin: 2rem auto; + line-height: 1.35; +} + +@media (min-width: 480px) { + h1 { + max-width: none; + } + + p { + max-width: none; + } +} diff --git a/app/packages/web/src/app.tsx b/app/packages/web/src/app.tsx new file mode 100644 index 000000000..e6ad8f9df --- /dev/null +++ b/app/packages/web/src/app.tsx @@ -0,0 +1,20 @@ +import { MetaProvider, Title } from "@solidjs/meta" +import { Router } from "@solidjs/router" +import { FileRoutes } from "@solidjs/start/router" +import { Suspense } from "solid-js" +import "./app.css" + +export default function App() { + return ( + ( + + SolidStart - Basic + {props.children} + + )} + > + + + ) +} diff --git a/app/packages/web/src/entry-client.tsx b/app/packages/web/src/entry-client.tsx new file mode 100644 index 000000000..0ca4e3c30 --- /dev/null +++ b/app/packages/web/src/entry-client.tsx @@ -0,0 +1,4 @@ +// @refresh reload +import { mount, StartClient } from "@solidjs/start/client"; + +mount(() => , document.getElementById("app")!); diff --git a/app/packages/web/src/entry-server.tsx b/app/packages/web/src/entry-server.tsx new file mode 100644 index 000000000..401eff83f --- /dev/null +++ b/app/packages/web/src/entry-server.tsx @@ -0,0 +1,21 @@ +// @refresh reload +import { createHandler, StartServer } from "@solidjs/start/server"; + +export default createHandler(() => ( + ( + + + + + + {assets} + + +
{children}
+ {scripts} + + + )} + /> +)); diff --git a/app/packages/web/src/global.d.ts b/app/packages/web/src/global.d.ts new file mode 100644 index 000000000..dc6f10c22 --- /dev/null +++ b/app/packages/web/src/global.d.ts @@ -0,0 +1 @@ +/// diff --git a/app/packages/web/src/routes/[...404].tsx b/app/packages/web/src/routes/[...404].tsx new file mode 100644 index 000000000..4ea71ec7f --- /dev/null +++ b/app/packages/web/src/routes/[...404].tsx @@ -0,0 +1,19 @@ +import { Title } from "@solidjs/meta"; +import { HttpStatusCode } from "@solidjs/start"; + +export default function NotFound() { + return ( +
+ Not Found + +

Page Not Found

+

+ Visit{" "} + + start.solidjs.com + {" "} + to learn how to build SolidStart apps. +

+
+ ); +} diff --git a/app/packages/web/src/routes/index.tsx b/app/packages/web/src/routes/index.tsx new file mode 100644 index 000000000..415b32744 --- /dev/null +++ b/app/packages/web/src/routes/index.tsx @@ -0,0 +1,14 @@ +import { Title } from "@solidjs/meta" +import { A } from "@solidjs/router" + +export default function Home() { + return ( +
+ Share Demo +

Share Demo

+

+ Go to test share +

+
+ ) +} diff --git a/app/packages/web/src/routes/share/[id].tsx b/app/packages/web/src/routes/share/[id].tsx new file mode 100644 index 000000000..d7f80e06a --- /dev/null +++ b/app/packages/web/src/routes/share/[id].tsx @@ -0,0 +1,150 @@ +import { Title } from "@solidjs/meta" +import { createSignal, onCleanup, onMount, Show, For } from "solid-js" +import { useParams } from "@solidjs/router" + +type Message = { + filename: string + content: string +} + +export default function SharePage() { + const params = useParams<{ id: string }>() + const [messages, setMessages] = createSignal([]) + const [connectionStatus, setConnectionStatus] = createSignal("Disconnected") + + onMount(() => { + // Get the API URL from environment + const apiUrl = import.meta.env.VITE_API_URL + const shareId = params.id + + console.log("Mounting Share component with ID:", shareId) + console.log("API URL:", apiUrl) + + if (!apiUrl) { + console.error("API URL not found in environment variables") + setConnectionStatus("Error: API URL not found") + return + } + + let reconnectTimer: number | undefined + let socket: WebSocket | null = null + + // Function to create and set up WebSocket with auto-reconnect + const setupWebSocket = () => { + // Close any existing connection + if (socket) { + socket.close() + } + + setConnectionStatus("Connecting...") + + // Always use secure WebSocket protocol (wss) + const wsBaseUrl = apiUrl.replace(/^https?:\/\//, 'wss://') + const wsUrl = `${wsBaseUrl}/share_poll?share_id=${shareId}` + console.log("Connecting to WebSocket URL:", wsUrl) + + // Create WebSocket connection + socket = new WebSocket(wsUrl) + + // Handle connection opening + socket.onopen = () => { + setConnectionStatus("Connected") + console.log("WebSocket connection established") + } + + // Handle incoming messages + socket.onmessage = (event) => { + console.log("WebSocket message received") + try { + const data = JSON.parse(event.data) as Message + setMessages((prev) => [...prev, data]) + } catch (error) { + console.error("Error parsing WebSocket message:", error) + } + } + + // Handle errors + socket.onerror = (error) => { + console.error("WebSocket error:", error) + setConnectionStatus("Error: Connection failed") + } + + // Handle connection close and reconnection + socket.onclose = (event) => { + console.log(`WebSocket closed: ${event.code} ${event.reason}`) + setConnectionStatus("Disconnected, reconnecting...") + + // Try to reconnect after 2 seconds + clearTimeout(reconnectTimer) + reconnectTimer = window.setTimeout( + setupWebSocket, + 2000 + ) as unknown as number + } + } + + // Initial connection + setupWebSocket() + + // Clean up on component unmount + onCleanup(() => { + console.log("Cleaning up WebSocket connection") + if (socket) { + socket.close() + } + clearTimeout(reconnectTimer) + }) + }) + + return ( +
+ Share: {params.id} +

Share: {params.id}

+ +
+

WebSocket Connection

+

+ Status: {connectionStatus()} +

+ +

Live Updates

+
+ 0} + fallback={

Waiting for messages...

} + > +
    + + {(msg) => ( +
  • +
    + Filename: {msg.filename} +
    +
    + Content: {msg.content} +
    +
    • + )} +     +
+ +
+
+
+ ) +} diff --git a/app/packages/web/sst-env.d.ts b/app/packages/web/sst-env.d.ts new file mode 100644 index 000000000..b6a7e9066 --- /dev/null +++ b/app/packages/web/sst-env.d.ts @@ -0,0 +1,9 @@ +/* This file is auto-generated by SST. Do not edit. */ +/* tslint:disable */ +/* eslint-disable */ +/* deno-fmt-ignore-file */ + +/// + +import "sst" +export {} \ No newline at end of file diff --git a/app/packages/web/tsconfig.json b/app/packages/web/tsconfig.json new file mode 100644 index 000000000..7d5871a07 --- /dev/null +++ b/app/packages/web/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "target": "ESNext", + "module": "ESNext", + "moduleResolution": "bundler", + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "jsx": "preserve", + "jsxImportSource": "solid-js", + "allowJs": true, + "strict": true, + "noEmit": true, + "types": ["vinxi/types/client"], + "isolatedModules": true, + "paths": { + "~/*": ["./src/*"] + } + } +} -- cgit v1.2.3