Val Town Code SearchReturn to Val Town

1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
3
4interface RSSItem {

1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
3import Header from "./Header.tsx";
4import Footer from "./Footer.tsx";
11import { getInitialTheme, setTheme, toggleTheme, type Theme } from "../../shared/theme.ts";
12
13const App: React.FC = () => {
14  const [currentPage, setCurrentPage] = useState('home');
15  const [theme, setThemeState] = useState<Theme>('light');

35## Tech Stack
36
37- React + TypeScript for UI
38- Hono for backend API
39- Howler.js for enhanced audio playback

26
27- **Backend**: Hono framework for HTTP handling
28- **Frontend**: React 18.2.0 with TailwindCSS
29- **RSS Parsing**: Custom regex-based XML parser (Deno/server compatible)
30- **Styling**: TailwindCSS via CDN
35├── index.ts              # Main HTTP handler with API routes
36├── frontend/
37│   └── index.html        # React frontend application
38└── README.md            # This file
39```

12    
13    <script type="module">
14        /** @jsxImportSource https://esm.sh/react@18.2.0 */
15        import React, { useState, useEffect } from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
16        import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0";
17
18        function RandomPostComponent() {
167
168        const root = createRoot(document.getElementById('root'));
169        root.render(React.createElement(RandomPostComponent));
170    </script>
171</body>

3Val that can be referenced in other vals to send notifications to a specific segment using [OneSignal's REST API](https://documentation.onesignal.com/reference/create-notification)
4
5This is really handy if you want to send push notifications to your phone without building a native app! I built a barebones React PWA that asks for a password then loads the OneSignal Web SDK that I deployed to [Netlify](https://www.netlify.com/) for free. OneSignal has [easy to follow docs](https://documentation.onesignal.com/docs/web-sdk-setup) so you can build this functionality into a React, Angular, Vue app or even Wordpress! Then [install the PWA](https://www.bitcot.com/how-to-install-a-pwa-to-your-device/) on your platform of choice and you're off to the races!
6
7## Setup

Discord-to-LinearREADME.md4 matches

@charmaine•Updated 2 days ago

1# Discord Reaction to Linear Ticket Automation
2
3**How it works:** React to any Discord message with a configured emoji (like
4`:huss:` or `🧿` - used as an example in this val) and it automatically becomes
5a Linear ticket with context from the Discord thread.
512. **Set permissions:** OAuth2 → URL Generator → selecting `bot` unfurls a Bot
52   Permissions dropdown below → Select `View Channels`, `Read Message History`,
53   `Add Reactions`
543. **Enable intents:** Bot → Privileged Gateway Intents → ✅ Message Content
55   Intent
59
60- **`main.tsx`** - Main cron job that runs every minute checking for new
61  reactions, you can also manually press `Run` to run it immediately
62- **Emoji Configuration** - Edit `backend/config.ts` to customize team member
63  emojis:

Discord-to-Linearmain.tsx12 matches

@charmaine•Updated 2 days ago

5
6/**
7 * Cron job to check for new Discord reactions and create Linear tickets
8 * Runs every minute to check for messages with the target emoji reaction
9 */
10export default async function() {
11  console.log(`🔄 Discord reaction cron job started at ${new Date().toISOString()}`);
12
13  // Get configuration directly
29  // Process each monitored channel
30  for (const channelId of monitoredChannels) {
31    console.log(`🔍 Checking channel ${channelId} for new reactions...`);
32
33    try {
34      await processChannelReactions(discord, linear, serverId, channelId, teamId);
35    } catch (error) {
36      console.error(`❌ Error processing channel ${channelId}:`, error);
38  }
39
40  console.log(`✅ Discord reaction cron job completed at ${new Date().toISOString()}`);
41}
42
43/**
44 * Process reactions for a specific channel
45 */
46async function processChannelReactions(
47  discord: DiscordAPI,
48  linear: LinearSDK,
55
56  for (const message of messages) {
57    const reactionResult = discord.findTargetReaction(message);
58    if (!reactionResult) continue;
59
60    const { reaction, createdBy } = reactionResult;
61    const emojiName = reaction.emoji.name;
62
63    // Check if already processed

Discord-to-Linearconfig.tsx1 match

@charmaine•Updated 2 days ago

10  LINEAR_PRIORITY: 3, // 1=Urgent, 2=High, 3=Medium, 4=Low; default everything created by this bot to 3 - Medium Pri
11  MAX_TITLE_LENGTH: 100,
12  MAX_MESSAGES_TO_CHECK: 50, // Check last 50 messages, you can adjust this based on server activity and how far back you want for reacts to be checked
13} as const;

1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0";
4import App from "./components/App.tsx";
5