Val Town Code SearchReturn to Val Town

15}
16
17export function HttpClient(props: {
18  bookmarks: Bookmark[];
19  history: HistoryItem[];
150}
151
152export function RequestList(props: {
153  title: string;
154  onClear?: () => void;
174}
175
176function RequestInput(props: {
177  isLoading?: boolean;
178  request: Request;
310}
311
312function RequestTab(props: {
313  selected: boolean;
314  onSelect: () => void;
334}
335
336function ResponseOutput(props: { response: Response }) {
337  return (
338    <div class="flex flex-col gap-y-2">
571};
572
573async function serializeRequest(request: Request): Promise<SerializedRequest> {
574  return {
575    url: request.url,
580}
581
582function deserializeRequest(request: SerializedRequest): Request {
583  return new Request(request.url, {
584    method: request.method,
593};
594
595function loadHistory() {
596  try {
597    return JSON.parse(localStorage.getItem("history") || "[]").map(

8  const jsonBtn = document.getElementById("download-json");
9
10  function selectStatementFromPosition(statements, pos) {
11    for (const statement of statements) {
12      if (statement.end + 1 >= pos) return statement;
15  }
16
17  function getCode(): string {
18    // @ts-expect-error
19    const code = editor.code;

33- [x] fix wonky sidebar separator height problem (thanks to @stevekrouse)
34- [x] make result tables scrollable
35- [x] add export to CSV, and JSON (CSV and JSON helper functions written in [this val](https://www.val.town/v/nbbaier/sqliteExportHelpers). Thanks to @pomdtr for merging the initial version!)
36- [x] add listener for cmd+enter to submit query
37

8  const jsonBtn = document.getElementById("download-json");
9
10  function selectStatementFromPosition(statements, pos) {
11    for (const statement of statements) {
12      if (statement.end + 1 >= pos) return statement;
15  }
16
17  function getCode(): string {
18    // @ts-expect-error
19    const code = editor.code;

1console.log("getCode() function loaded");
2import htmx from "https://esm.sh/htmx.org";
3import { identify } from "https://esm.sh/sql-query-identifier@2.7.0";
4
5if (typeof Deno === "undefined") {
6  function selectStatementFromPosition(statements, pos) {
7    for (const statement of statements) {
8      if (statement.end + 1 >= pos) return statement;
11  }
12
13  function getCode() {
14    const editor = htmx.find("#editordiv");
15    const code = editor.code;

9  const buttons = [csvBtn, jsonBtn, runBtn];
10
11  function checkForText() {
12    if (editor.view.state.doc.toString().trim() === "") {
13      buttons.forEach(btn => btn.disabled = true);
25  });
26
27  document.addEventListener("DOMContentLoaded", function() {
28    // Initial check
29    checkForText();

3const iconSize = "1.125rem";
4
5export function RunSVG() {
6  return (
7    <svg
22}
23
24export function TableSVG() {
25  return (
26    <svg
41}
42
43export function ViewSVG() {
44  return (
45    <svg

10 * @param val Define which val should open. Defaults to the root reference.
11 */
12export function modifyHtmlString(
13  bodyText: string,
14  { val, style }: { val?: ValRef; style?: string } = {},
41 * @param val Define which val should open
42 */
43export function modifyFetchHandler(
44  handler: (req: Request) => Response | Promise<Response>,
45  { val, style }: { val?: ValRef; style?: string } = {},
54
55export const honoMiddleware = (options: { val?: ValRef; style?: string } = {}): MiddlewareHandler => {
56  return async function(c, next) {
57    await next();
58    if (c.res.headers.get("Content-Type")?.startsWith("text/html")) {

49### Linking to the val
50
51These functions infer the val using the call stack or the request URL. If the inference isn't working, or if you want to ensure it links to a specific val, pass the `val` argument:
52
53- `modifyFetchHandler(handler, {val: { handle: "andre", name: "foo" }})`

5import ReactDOM from "https://esm.sh/react-dom";
6
7function Counter() {
8  const [counter, setCounter] = React.useState(0);
9
19}
20
21export function App() {
22  return (
23    <>