update the template and add more examples on using spin host components

Signed-off-by: karthik2804 <[email protected]>

examples/typescript/aws/s3/src/spin.ts

@@ -20,9 +20,3 @@ async function handleEvent(event: FetchEvent) {
 
     await handler(event.request, res)
 }
-
-// Keep wizer happy during pre-init. Should go away
-// oncehttps://github.com/bytecodealliance/ComponentizeJS/issues/114 is resolved
-export const incomingHandler = {
-    handle() { }
-}

examples/typescript/aws/sqs/src/spin.ts

@@ -20,9 +20,3 @@ async function handleEvent(event: FetchEvent) {
 
     await handler(event.request, res)
 }
-
-// Keep wizer happy during pre-init. Should go away
-// oncehttps://github.com/bytecodealliance/ComponentizeJS/issues/114 is resolved
-export const incomingHandler = {
-    handle() { }
-}

examples/typescript/blob-storage/backblaze/src/spin.ts

@@ -20,9 +20,3 @@ async function handleEvent(event: FetchEvent) {
 
     await handler(event.request, res)
 }
-
-// Keep wizer happy during pre-init. Should go away
-// oncehttps://github.com/bytecodealliance/ComponentizeJS/issues/114 is resolved
-export const incomingHandler = {
-    handle() { }
-}

examples/typescript/github/octokit-rest/src/spin.ts

@@ -20,9 +20,3 @@ async function handleEvent(event: FetchEvent) {
 
     await handler(event.request, res)
 }
-
-// Keep wizer happy during pre-init. Should go away
-// oncehttps://github.com/bytecodealliance/ComponentizeJS/issues/114 is resolved
-export const incomingHandler = {
-    handle() { }
-}

examples/typescript/serverless_db/neondb/src/spin.ts

@@ -20,9 +20,3 @@ async function handleEvent(event: FetchEvent) {
 
     await handler(event.request, res)
 }
-
-// Keep wizer happy during pre-init. Should go away
-// oncehttps://github.com/bytecodealliance/ComponentizeJS/issues/114 is resolved
-export const incomingHandler = {
-    handle() { }
-}

examples/typescript/serverless_db/planetscale/src/spin.ts

@@ -20,9 +20,3 @@ async function handleEvent(event: FetchEvent) {
 
     await handler(event.request, res)
 }
-
-// Keep wizer happy during pre-init. Should go away
-// oncehttps://github.com/bytecodealliance/ComponentizeJS/issues/114 is resolved
-export const incomingHandler = {
-    handle() { }
-}

examples/typescript/spin-host-apis/spin-kv/README.md

@@ -0,0 +1,46 @@
+# Using Spin KV
+
+This is a simple example showcasing using Spin key-value storage with TypeScript.
+
+###  Building and Running
+
+To build the app run the following commands:
+
+```bash
+$ npm install
+$ spin build --up
+```
+
+the mapping between the request method and KV operation is as follows:
+```bash
+GET -> kv.get(request.url)
+POST -> kv.set(request.uri, body)
+HEAD -> kv.exists(request.uri)
+DELETE -> kv.delete(request.uri)
+```
+
+The application can now receive requests on http://localhost:3000:
+
+```bash
+$ curl -i -X POST -d "ok!" localhost:3000/test
+HTTP/1.1 200 OK
+content-length: 0
+date: Tue, 25 Apr 2023 14:25:43 GMT
+
+$ curl -i -X GET localhost:3000/test
+HTTP/1.1 200 OK
+content-length: 3
+date: Tue, 25 Apr 2023 14:25:54 GMT
+
+ok!
+
+$ curl -i -X DELETE localhost:3000/test
+HTTP/1.1 200 OK
+content-length: 0
+date: Tue, 25 Apr 2023 14:26:30 GMT
+
+$ curl -i -X GET localhost:3000/test
+HTTP/1.1 404 Not Found
+content-length: 0
+date: Tue, 25 Apr 2023 14:31:53 GMT
+```

examples/typescript/spin-host-apis/spin-kv/package.json

@@ -0,0 +1,23 @@
+{
+    "name": "spin-kv",
+    "version": "1.0.0",
+    "description": "",
+    "main": "index.js",
+    "scripts": {
+        "build": "npx webpack --mode=production && npx mkdirp target && npx j2w -i dist.js -n spin-http -o target/spin-kv.wasm",
+        "test": "echo \"Error: no test specified\" && exit 1"
+    },
+    "keywords": [],
+    "author": "",
+    "license": "ISC",
+    "devDependencies": {
+        "mkdirp": "^3.0.1",
+        "ts-loader": "^9.4.1",
+        "typescript": "^4.8.4",
+        "webpack": "^5.74.0",
+        "webpack-cli": "^4.10.0"
+    },
+    "dependencies": {
+        "@fermyon/spin-sdk": "^2.0.0-alpha.2"
+    }
+}

examples/typescript/spin-host-apis/spin-kv/spin.toml

@@ -0,0 +1,19 @@
+spin_manifest_version = 2
+
+[application]
+authors = ["karthik2804 <[email protected]>"]
+description = ""
+name = "spin-kv"
+version = "0.1.0"
+
+[[trigger.http]]
+route = "/..."
+component = "spin-kv"
+
+[component.spin-kv]
+source = "target/spin-kv.wasm"
+exclude_files = ["**/node_modules"]
+key_value_stores = ["default"]
+[component.spin-kv.build]
+command = "npm run build"
+watch = ["src/**/*.ts", "package.json"]

examples/typescript/spin-host-apis/spin-kv/src/index.ts

@@ -0,0 +1,36 @@
+import { Kv, ResponseBuilder } from "@fermyon/spin-sdk";
+
+const decoder = new TextDecoder()
+
+export async function handler(req: Request, res: ResponseBuilder) {
+    let store = Kv.openDefault()
+    let status = 200
+    let body
+
+    switch (req.method) {
+        case "POST":
+            store.set(req.url, req.body || (new Uint8Array()).buffer)
+            break;
+        case "GET":
+            let val
+            val = store.get(req.url)
+            if (!val) {
+                status = 404
+            } else {
+                body = decoder.decode(val)
+            }
+            break;
+        case "DELETE":
+            store.delete(req.url)
+            break;
+        case "HEAD":
+            if (!store.exists(req.url)) {
+                status = 404
+            }
+            break;
+        default:
+    }
+
+    res.status(status)
+    res.send(body)
+}

examples/typescript/spin-host-apis/spin-kv/src/spin.ts

@@ -0,0 +1,22 @@
+import { ResponseBuilder } from "@fermyon/spin-sdk";
+import { handler } from ".";
+
+//@ts-ignore
+addEventListener('fetch', (event: FetchEvent) => {
+    handleEvent(event);
+});
+
+async function handleEvent(event: FetchEvent) {
+
+    let resolve: any, reject: any;
+    let responsePromise = new Promise(async (res, rej) => {
+        resolve = res;
+        reject = rej;
+    });
+    //@ts-ignore
+    event.respondWith(responsePromise);
+
+    let res = new ResponseBuilder(resolve);
+
+    await handler(event.request, res)
+}

examples/typescript/spin-host-apis/spin-kv/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "compilerOptions": {
+        "outDir": "./dist/",
+        "noImplicitAny": true,
+        "module": "es6",
+        "target": "es2020",
+        "jsx": "react",
+        "skipLibCheck": true,
+        "lib": [
+            "ES2015",
+            "WebWorker"
+        ],
+        "allowJs": true,
+        "strict": true,
+        "noImplicitReturns": true,
+        "moduleResolution": "node"
+    }
+}

examples/typescript/spin-host-apis/spin-kv/webpack.config.js

@@ -0,0 +1,35 @@
+const path = require('path');
+const SpinSdkPlugin = require("@fermyon/spin-sdk/plugins/webpack")
+
+module.exports = {
+    entry: './src/spin.ts',
+    experiments: {
+        outputModule: true,
+    },
+    module: {
+        rules: [
+            {
+                test: /\.tsx?$/,
+                use: 'ts-loader',
+                exclude: /node_modules/,
+            },
+        ],
+    },
+    resolve: {
+        extensions: ['.tsx', '.ts', '.js'],
+    },
+    output: {
+        path: path.resolve(__dirname, './'),
+        filename: 'dist.js',
+        module: true,
+        library: {
+            type: "module",
+        }
+    },
+    plugins: [
+        new SpinSdkPlugin()
+    ],
+    optimization: {
+        minimize: false
+    },
+};

examples/typescript/spin-host-apis/spin-llm/README.md

@@ -0,0 +1,20 @@
+# Using Spin LLM
+
+This is a simple example showcasing using Spin LLM.
+
+###  Building and Running
+
+As a prerequisite, you will need to download the models and place them in a structure as described in https://developer.fermyon.com/spin/v2/serverless-ai-api-guide#file-structure
+
+To build the app run the following commands:
+
+```bash
+$ npm install
+$ spin build
+```
+
+Make a request using `curl`:
+
+```bash
+curl localhost:3000
+```

examples/typescript/spin-host-apis/spin-llm/package.json

@@ -0,0 +1,23 @@
+{
+    "name": "spin-llm",
+    "version": "1.0.0",
+    "description": "",
+    "main": "index.js",
+    "scripts": {
+        "build": "npx webpack --mode=production && npx mkdirp target && npx j2w -i dist.js -n spin-http -o target/spin-llm.wasm",
+        "test": "echo \"Error: no test specified\" && exit 1"
+    },
+    "keywords": [],
+    "author": "",
+    "license": "ISC",
+    "devDependencies": {
+        "mkdirp": "^3.0.1",
+        "ts-loader": "^9.4.1",
+        "typescript": "^4.8.4",
+        "webpack": "^5.74.0",
+        "webpack-cli": "^4.10.0"
+    },
+    "dependencies": {
+        "@fermyon/spin-sdk": "^2.0.0-alpha.2"
+    }
+}

examples/typescript/spin-host-apis/spin-llm/spin.toml

@@ -0,0 +1,19 @@
+spin_manifest_version = 2
+
+[application]
+authors = ["karthik2804 <[email protected]>"]
+description = ""
+name = "spin-llm"
+version = "0.1.0"
+
+[[trigger.http]]
+route = "/..."
+component = "spin-llm"
+
+[component.spin-llm]
+source = "target/spin-llm.wasm"
+exclude_files = ["**/node_modules"]
+allowed_models = ["llama2-chat"]
+[component.spin-llm.build]
+command = "npm run build"
+watch = ["src/**/*.ts", "package.json"]

examples/typescript/spin-host-apis/spin-llm/src/index.ts

@@ -0,0 +1,7 @@
+import { Llm, ResponseBuilder } from "@fermyon/spin-sdk";
+
+export async function handler(req: Request, res: ResponseBuilder) {
+    let result = Llm.infer(Llm.InferencingModels.Llama2Chat, "tell me a joke")
+
+    res.send(JSON.stringify(result));
+}

examples/typescript/spin-host-apis/spin-llm/src/spin.ts

@@ -0,0 +1,22 @@
+import { ResponseBuilder } from "@fermyon/spin-sdk";
+import { handler } from ".";
+
+//@ts-ignore
+addEventListener('fetch', (event: FetchEvent) => {
+    handleEvent(event);
+});
+
+async function handleEvent(event: FetchEvent) {
+
+    let resolve: any, reject: any;
+    let responsePromise = new Promise(async (res, rej) => {
+        resolve = res;
+        reject = rej;
+    });
+    //@ts-ignore
+    event.respondWith(responsePromise);
+
+    let res = new ResponseBuilder(resolve);
+
+    await handler(event.request, res)
+}

examples/typescript/spin-host-apis/spin-llm/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "compilerOptions": {
+        "outDir": "./dist/",
+        "noImplicitAny": true,
+        "module": "es6",
+        "target": "es2020",
+        "jsx": "react",
+        "skipLibCheck": true,
+        "lib": [
+            "ES2015",
+            "WebWorker"
+        ],
+        "allowJs": true,
+        "strict": true,
+        "noImplicitReturns": true,
+        "moduleResolution": "node"
+    }
+}