kentcdodds

@remix-run/events and @remix-run/dom Documentation

NOTE: this was generated by Cursor from within the Remix demo using the following prompt:

Please use the example code in @public/ and the types definitions to write documentation for @remix-run/events and @remix-run/dom and stick it in a markdown file in the root of this repo.

This documentation covers two core Remix 3 packages: @remix-run/events for declarative event handling and @remix-run/dom for creating reactive UI components.

Table of Contents

kentcdodds

Epicshop Notifications

This gist provides notifications for the Epicshop platform. Notifications are loaded on demand and shown to users based on specific criteria.

How Notifications Work

Notifications are defined in the notifications.json5 file. Each notification is an object with the following properties:

kentcdodds

#!/usr/bin/env node

import { promises as fs } from 'fs'
import { homedir } from 'os'
import path from 'path'

const homeDir = homedir()
const dataFilePath = path.join(homeDir, '.epicshop', 'data.json')

let data

kentcdodds

import { Suspense, use, useDeferredValue, useState, useTransition } from 'react'
import * as ReactDOM from 'react-dom/client'
import { ErrorBoundary } from 'react-error-boundary'
import { useSpinDelay } from 'spin-delay'
import { getImageUrlForShip, getShip, imgSrc, searchShips } from './utils.tsx'

const shipFallbackSrc = '/img/fallback-ship.png'

function Shell() {
	return (

kentcdodds

import { Suspense, use, useDeferredValue, useState, useTransition } from 'react'
import * as ReactDOM from 'react-dom/client'
import { ErrorBoundary } from 'react-error-boundary'
import { useSpinDelay } from 'spin-delay'
import { getImageUrlForShip, getShip, imgSrc, searchShips } from './utils.tsx'

const shipFallbackSrc = '/img/fallback-ship.png'

function Shell() {
	return (

kentcdodds

import {
	Suspense,
	use,
	useDeferredValue,
	useState,
	useTransition,
	useEffect,
	useRef,
} from 'react'
import * as ReactDOM from 'react-dom/client'

kentcdodds

// ⚠️ warning: This script was written by ChatGPT, not entirely reviewed, and is completely unmodified

// This counts your lifetime contributions so you can decide
// whether to block Twitter: https://x.com/mjackson/status/1831554887706169674

const GITHUB_API_URL = 'https://api.github.com/graphql'
// scope needed: "user:read" for public contributions and "repo" for private
// https://github.com/settings/tokens/new
const GITHUB_TOKEN = process.env.GITHUB_TOKEN

kentcdodds

const { default: html2canvas } = await import(
	'https://unpkg.com/[email protected]/dist/html2canvas.esm.js'
)

async function captureElement(element, { scale = 1, backgroundColor = null } = {}) {
	const canvas = await html2canvas(element, {
		backgroundColor,
		scale,
	})
	

kentcdodds

// Name: EpicShop Update
// Description: Update the EpicShop workshop app in all the epic web workshop repos
// Author: Kent C. Dodds
// Twitter: @kentcdodds

import '@johnlindquist/kit'
import {globby} from 'globby'
import {execa} from 'execa'

const workshopDirs = [

kentcdodds

// Menu: Twimage Download
// Description: Download twitter images and set their exif info based on the tweet metadata
// Shortcut: command option control t
// Author: Kent C. Dodds
// Twitter: @kentcdodds

import '@johnlindquist/kit'
import fs from 'fs'
import {URL} from 'url'
import {getTweet} from '../lib/twitter'