Search results for "react client side"

whiteXerinae

@stevekrouse

SQLite Explorer View and interact with your Val Town SQLite data. It's based off Steve's excellent SQLite Admin val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by LibSQL Studio by invisal . This is now more an SPA, with tables, queries and results showing up on the same page. Install Install the latest stable version (v66) by forking this val: Authentication Login to your SQLite Explorer with password authentication with your Val Town API Token as the password. Todos / Plans [ ] improve error handling [ ] improve table formatting [ ] sticky table headers [ ] add codemirror [ ] add loading indication to the run button (initial version shipped) [ ] add ability to favorite queries [ ] add saving of last query run for a table (started) [ ] add visible output for non-query statements [ ] add schema viewing [ ] add refresh to table list sidebar after CREATE/DROP/ALTER statements [ ] add automatic execution of initial select query on double click [ ] add views to the sidebar [ ] add triggers to sidebar [ ] add upload from SQL, CSV and JSON [ ] add ability to connect to a non-val town Turso database [x] fix wonky sidebar separator height problem (thanks to @stevekrouse) [x] make result tables scrollable [x] add export to CSV, and JSON (CSV and JSON helper functions written in this val . Thanks to @pomdtr for merging the initial version!) [x] add listener for cmd+enter to submit query

0

HTTP (deprecated)

- [ ] add schema viewing

- [ ] add refresh to table list sidebar after `CREATE/DROP/ALTER` statements

- [ ] add automatic execution of initial select query on double click

- [ ] add views to the sidebar

- [ ] add triggers to sidebar

- [ ] add upload from SQL, CSV and JSON

- [ ] add ability to connect to a non-val town Turso database

- [x] fix wonky sidebar separator height problem (thanks to @stevekrouse)

- [x] make result tables scrollable

return c.render(

causalCyanFlea

@stevekrouse

Big Weather Display Displays the current day's weather information BIG so you can see it from far away. Currently it's hardcoded for: prospect heights, brooklyn charts of the temp and % change of precipitation Probably easiest for you to fork it and change it to suit your needs vs making it customizable

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import React from "https://esm.sh/react";

import { renderToString } from "https://esm.sh/react-dom/server";

import { DateTime } from "https://esm.sh/luxon";

return (

<React.Fragment key={i}>

</text>

</React.Fragment>

</svg>

dateme_faq

@stevekrouse

@jsxImportSource npm:hono@3/jsx

1 8

0

Script

/** @jsxImportSource npm:hono@3/jsx */

import { handler } from "https://esm.town/v/pomdtr/ssr";

import date_me_faq from "https://esm.town/v/stevekrouse/dateme_faq_react";

import Layout from "https://esm.town/v/stevekrouse/dateme_layout";

let linkClass = "text-sky-600 hover:text-sky-500";

realtimeGenerateImageHandler

@iamseeley

An interactive, runnable TypeScript val by iamseeley

1

0

Script

import * as fal from "npm:@fal-ai/serverless-client";

fal.config({

credentials: Deno.env.get("FAL_KEY"),

dateme_faq

@vawogbemi

@jsxImportSource npm:hono@3/jsx

1

0

Script

/** @jsxImportSource npm:hono@3/jsx */

import { handler } from "https://esm.town/v/pomdtr/ssr";

import date_me_faq from "https://esm.town/v/stevekrouse/dateme_faq_react";

import Layout from "https://esm.town/v/vawogbemi/dateme_layout";

let linkClass = "text-sky-600 hover:text-sky-500";

linkInBioTemplate

@daisuke

@jsxImportSource https://esm.sh/react

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import { renderToString } from "npm:react-dom/server";

export default async function(req: Request) {

return new Response(

amaranthYak

@stevekrouse

SQLite Explorer View and interact with your Val Town SQLite data. It's based off Steve's excellent SQLite Admin val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by LibSQL Studio by invisal . This is now more an SPA, with tables, queries and results showing up on the same page. Install Install the latest stable version (v66) by forking this val: Authentication Login to your SQLite Explorer with password authentication with your Val Town API Token as the password. Todos / Plans [ ] improve error handling [ ] improve table formatting [ ] sticky table headers [ ] add codemirror [ ] add loading indication to the run button (initial version shipped) [ ] add ability to favorite queries [ ] add saving of last query run for a table (started) [ ] add visible output for non-query statements [ ] add schema viewing [ ] add refresh to table list sidebar after CREATE/DROP/ALTER statements [ ] add automatic execution of initial select query on double click [ ] add views to the sidebar [ ] add triggers to sidebar [ ] add upload from SQL, CSV and JSON [ ] add ability to connect to a non-val town Turso database [x] fix wonky sidebar separator height problem (thanks to @stevekrouse) [x] make result tables scrollable [x] add export to CSV, and JSON (CSV and JSON helper functions written in this val . Thanks to @pomdtr for merging the initial version!) [x] add listener for cmd+enter to submit query

1

HTTP (deprecated)

- [ ] add schema viewing

- [ ] add refresh to table list sidebar after `CREATE/DROP/ALTER` statements

- [ ] add automatic execution of initial select query on double click

- [ ] add views to the sidebar

- [ ] add triggers to sidebar

- [ ] add upload from SQL, CSV and JSON

- [ ] add ability to connect to a non-val town Turso database

- [x] fix wonky sidebar separator height problem (thanks to @stevekrouse)

- [x] make result tables scrollable

return c.render(

indirectionOGImage

@jxnblk

@jsxImportSource npm:react

1

HTTP

/** @jsxImportSource npm:react */

import { render } from "https://esm.town/v/jxnblk/reactSVG2PNG";

import wrap from "npm:word-wrap";

const MARGIN = 64;

cron_client_side_script_fork

@stevekrouse

CronGPT This is a minisite to help you create cron expressions, particularly for crons on Val Town. It was inspired by Cron Prompt , but also does the timezone conversion from wherever you are to UTC (typically the server timezone). Tech Hono for routing ( GET / and POST /compile .) Hono JSX HTML (probably overcomplicates things; should remove) @stevekrouse/openai, which is a light wrapper around @std/openai

1

0

HTTP (deprecated)

</div>

</body>

</html>,

app.post("/compile", async (c) => {

const cron = content.replace("`", "");

return c.html(<Cron cron={cron} timezone={timezone} />);

function clientScript() {

// Set the timezone input

const tz = Intl.DateTimeFormat().resolvedOptions().timeZone;

VALLErun

@tmcw

The actual code for VALL-E: https://www.val.town/v/janpaul123/VALLE

1

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import valleGetValsContextWindow from "https://esm.town/v/janpaul123/valleGetValsContextWindow";

import _ from "npm:lodash@4";

import { renderToString } from "npm:react-dom/server";

export default function(

const systemprompt = `All the above are example conversations and context you can refer to, but don't

consider it part of the current conversation. The conversation below is your recent interaction with the user.

Your entire response should only be TypeScript.

dateme_layout_react

@stevekrouse

@jsxImportSource https://esm.sh/react@18.2.0

4

0

Script

/** @jsxImportSource https://esm.sh/react@18.2.0 */

import {

NavLink,

Outlet,

useNavigation,

} from "https://esm.sh/react-router-dom@6.23.0?deps=react@18.2.0,react-dom@18.2.0";

const tabs = { "/": "Home", "/browse": "Browse", "/faq": "FAQ" };

export default function() {

mythBusterGraduationEdition

@willthereader

@jsxImportSource https://esm.sh/preact

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/preact */

import { render } from "npm:preact-render-to-string";

export default async function(req: Request) {

return new Response(

webgen

@stevekrouse

Made on Val Town livestream. This project is a kind of a mini tribute to Websim . To-dos: Spruce up styles a bit Write this README ~Add a cache!~ ~Try moving style tag to the bottom by prompting so content appears immediately and then becomes styled~ didn't work b/c CSS parsing isn't progressive Need more prompting to get the model not to generate placeholder-y content Better root URL page / index page with links to some good sample generations

0

HTTP (deprecated)

Your description should include:

- What content is on the page

- Other elements like sidebars, links, images that may be in the page

- The author and origin of the page

- The stylistic aesthetic of the page

add_to_notion_w_ai_webpage

@nerdymomocat

Example usage of the add_to_notion_w_ai val Try with the money database . Read and watch the demo run here

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/preact */

import { blob } from "https://esm.town/v/std/blob";

import Instructor from "npm:@instructor-ai/instructor";

import { Client } from "npm:@notionhq/client";

import OpenAI from "npm:openai";

import { render } from "npm:preact-render-to-string";

import { z } from "npm:zod";

const NOTION_API_KEY = process.env.NOTION_API_KEY;

const notion = new Client({

auth: NOTION_API_KEY,

apiKey: process.env.OPENAI_API_KEY ?? undefined,

const client = Instructor({

client: oai,

mode: "TOOLS",

const db_info = await get_notion_db_info(dbid);

const processed_message = await client.chat.completions.create({

messages: [{ role: "system", content: db_info["system_message"] }, { role: "user", content: text }],

roseGiraffe

@lilyjordan

@jsxImportSource https://esm.sh/react

0

HTTP (deprecated)

/** @jsxImportSource https://esm.sh/react */

import { renderToString } from "npm:react-dom/server";

export default async function(req: Request) {

return new Response(