32
33 try {
34 const response = await fetch("/api/create-project", {
35 method: "POST",
36 headers: {
43
44 try {
45 const response = await fetch("/api/create-branch", {
46 method: "POST",
47 headers: {
8import { ChatMessages } from "./ChatMessages.tsx";
9import { ChatInput } from "./ChatInput.tsx";
10import { ApiKeyWarning } from "./ApiKeyWarning.tsx";
11import { processFiles } from "./ImageUpload.tsx";
12import { Preview } from "./Preview.tsx";
15 project,
16 bearerToken,
17 anthropicApiKey,
18 setProject,
19}: {
20 project: any;
21 bearerToken: string;
22 anthropicApiKey: string;
23 setProject: (project: any) => void;
24}) {
57 project,
58 branchId,
59 anthropicApiKey,
60 bearerToken,
61 selectedFiles,
170
171 <div className="p-6 flex flex-col h-full w-full">
172 <ApiKeyWarning show={!anthropicApiKey} />
173
174 <div className="flex flex-col lg:flex-row gap-4">
37 setIsLoadingBranches(true);
38 try {
39 const response = await fetch(`/api/project-branches?projectId=${projectId}`, {
40 headers: {
41 "Authorization": `Bearer ${bearerToken}`,
107 const fetchBranches = async () => {
108 try {
109 const response = await fetch(`/api/project-branches?projectId=${projectId}`, {
110 headers: {
111 "Authorization": `Bearer ${bearerToken}`,
3 { bearerToken, projectId, branchId }: { bearerToken: string; projectId: string; branchId?: string },
4) {
5 const url = new URL("/api/project-files", window.location.origin);
6 url.searchParams.append("projectId", projectId);
7 if (branchId) {
2import React from "https://esm.sh/react@18.2.0?dev";
3
4interface ApiKeyWarningProps {
5 show: boolean;
6}
7
8export function ApiKeyWarning({ show }: ApiKeyWarningProps) {
9 if (!show) return null;
10
11 return (
12 <div className="bg-yellow-100 border-l-4 border-yellow-500 text-yellow-700 p-4 mb-4 rounded">
13 <p className="font-bold">Anthropic API Key Missing</p>
14 <p>Please log out and add your Anthropic API key to use this app.</p>
15 </div>
16 );
70 return faviconUrl;
71 } catch (error) {
72 console.error("Error scraping favicon:", error);
73 return null;
74 }
12## How it works
13
14The old site still exists at on GitHub at [jxnblk/blog][] and includes the source markdown files, build script, and static JSON API.
15I experimented with storing JSON in Val Town storage, but for now, the site imports a static JSON file for content.
16This content is passed to the [App][JxnblkApp] React component that includes the entire HTML and handles routing.
97
98export async function sendDailyBriefing(chatId?: string, today?: DateTime) {
99 // Get API keys from environment
100 const apiKey = Deno.env.get("ANTHROPIC_API_KEY");
101 const telegramToken = Deno.env.get("TELEGRAM_TOKEN");
102
106 }
107
108 if (!apiKey) {
109 console.error("Anthropic API key is not configured.");
110 return;
111 }
122
123 // Initialize Anthropic client
124 const anthropic = new Anthropic({ apiKey });
125
126 // Initialize Telegram bot
162
163 // disabled title for now, it seemes unnecessary...
164 // await bot.api.sendMessage(chatId, `*${title}*`, { parse_mode: "Markdown" });
165
166 // Then send the main content
169
170 if (content.length <= MAX_LENGTH) {
171 await bot.api.sendMessage(chatId, content, { parse_mode: "Markdown" });
172 // Store the briefing in chat history
173 await storeChatMessage(
198 // Send each chunk as a separate message and store in chat history
199 for (const chunk of chunks) {
200 await bot.api.sendMessage(chatId, chunk, { parse_mode: "Markdown" });
201 // Store each chunk in chat history
202 await storeChatMessage(
53You'll need to set up some environment variables to make it run.
54
55- `ANTHROPIC_API_KEY` for LLM calls
56- You'll need to follow [these instructions](https://docs.val.town/integrations/telegram/) to make a telegram bot, and set `TELEGRAM_TOKEN`. You'll also need to get a `TELEGRAM_CHAT_ID` in order to have the bot remember chat contents.
57- For the Google Calendar integration you'll need `GOOGLE_CALENDAR_ACCOUNT_ID` and `GOOGLE_CALENDAR_CALENDAR_ID`. See [these instuctions](https://www.val.town/v/stevekrouse/pipedream) for details.
