chore: add vercel deployment and readme

examples/vite/.gitignore

@@ -22,3 +22,4 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+.vercel

examples/vite/README.md

@@ -0,0 +1,27 @@
+## Deploying the Threads Demo
+
+1. Build and link `stream-chat` and `stream-chat-css` from the `feat/threads-v2` branch
+2. Build this demo app:
+
+```sh
+yarn build
+```
+
+3. Link to the demo Vercel project and pull default environment variables:
+
+```sh
+yarn vercel link --yes --scope getstreamio --project stream-threads-demo
+yarn vercel pull
+```
+
+4. Deploy:
+
+```sh
+yarn vercel deploy
+```
+
+The deployed app will use the app, user and token specified in Vercel environment variables. You can override these values in URL search params:
+
+- `key` to override app key
+- `uid` to override user id
+- `ut` to override token

examples/vite/package.json

@@ -24,6 +24,7 @@
     "eslint-plugin-react-refresh": "^0.4.6",
     "sass": "^1.75.0",
     "typescript": "^5.4.5",
+    "vercel": "^35.2.3",
     "vite": "^5.2.10"
   }
 }

examples/vite/src/App.tsx

@@ -1,4 +1,3 @@
-import React, { useMemo } from 'react';
 import { ChannelFilters, ChannelOptions, ChannelSort } from 'stream-chat';
 import {
   Channel,
@@ -20,7 +19,7 @@ const params = (new Proxy(new URLSearchParams(window.location.search), {
   get: (searchParams, property) => searchParams.get(property as string),
 }) as unknown) as Record<string, string | null>;
 
-const apiKey = import.meta.env.VITE_STREAM_KEY as string;
+const apiKey = params.key ?? (import.meta.env.VITE_STREAM_KEY as string);
 const userId = params.uid ?? (import.meta.env.VITE_USER_ID as string);
 const userToken = params.ut ?? (import.meta.env.VITE_USER_TOKEN as string);
 

examples/vite/src/main.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App.tsx';
 import './index.scss';