✨2023#4: Exhaustive: Exhaustiveness Checking In TypeScript

📅 January 22–28, 2023, Highlights: email-helper: generate business emails in seconds | nuxt: zero-config PWA plugin for nuxt 3 | current.js: a library to access current `<meta>` element

Feb 01, 2023

exhaustive: Exhaustiveness checking in TypeScript

▶Tagged Unions
▶Type Narrowing
▶Default Fallback
▶Exhaustive Switch Statements

import { exhaustive } from "exhaustive";

enum Role {
  ADMIN = 'ADMIN',
  DEFAULT = 'DEFAULT',
  VIEWER = 'VIEWER',
}

enum Permission {
  DELETE = 'DELETE',
  EDIT = 'EDIT',
  VIEW = 'VIEW',
}

const getUserPermissions = (role: Role) =>
  exhaustive(role, {
    ADMIN: () => [Permission.DELETE, Permission.EDIT, Permission.VIEW],
    DEFAULT: () => [Permission.EDIT, Permission.VIEW],
    VIEWER: () => [Permission.VIEW],
  });

email-helper: Generate your business emails in seconds (by OpenAI)

nuxt: Zero-config PWA Plugin for Nuxt 3

current.js: A tiny 🤏 library (only 379 B) that allows you to access current `<meta>` elements

<head>
  <meta name="current-environment" content="production">
  <meta name="current-user-id" content="123">
  <meta name="current-user-time-zone-name" content="Central Time (US & Canada)">
</head>

Current.environment
// => "production"

Current.user
// => { id: "123", timeZoneName: "Central Time (US & Canada)" }

remix-auth-otp: A One-Time Password Authentication Strategy for Remix Auth.

▶Easy to Setup. The Strategy will handle the entire Authentication Flow for you.
▶Secure. The OTP code is encrypted and signed with a Secret Key.
▶Magic Link Built-In. Send a Magic Link to the user and authenticate it with a simple click.
▶One Source of Truth. The database of your choice.
▶Bulletproof. Written in strict TypeScript with a high test coverage.
▶Typed. Ships with types included.
▶Built on top of Remix Auth. An amazing authentication library for Remix.

collabuml: A collaborative UML editor; build with etherpad and plantuml

plantuml-wasm: PlantUML Web Assembly with using CheerpJ

trpc-nestjs-adapter: An adapter, allowing you to use TRPC inside of Nest.JS

nostr-indexer: An indexer library for nostr 🟣

svelisy: Svelte with daisyUI component library

obsidian-custom-classes: Custom Classes is a minimalist Obsidian plugin that allows you to add custom HTML classes to specific Markdown blocks

combine-prs: GitHub Action to combine multiple PRs into a single one

msw-trpc: tPRC support for MSW

notion-board: Monitor your modules and repositories from Notion

article-idea-generator: Generate your next article idea with ease. Powered by OpenAI.

atomic: Solve all your scheduling problems using AI for everyone

CommitAI: CommitAI is a command line interface application that automatically generates commit messages based on the output of git diff.

solid-material: Solid-js high quality components built with tailwindcss and kobalte following material you guidelines

▶A11y
▶Tailwind CSS
▶Automatic dark mode based on system settings

svhighlight: A code syntax highlighter for Svelte using highlight.js, with line blur and highligthing and focus buttons. The component can be easily customized with TailwindCSS.

▶line numbers toggle
▶highlighting lines / blur out non-highlighted lines
▶hovering over blurred area unblurs the code
▶copy button
▶focus blocks and buttons to focus your reader's attention
▶customizable

remix-compute: Remix adapter and server runtime for Netlify

morsa: Just a simple morse code translator.

const Morsa = require('morsa').default;

const morsa = new Morsa();

morsa.encode('SOS'); // ... --- ...

morsa.decode('-- --- .-. ... .-'); // MORSA

tailadmin-free-tailwind-dashboard-template: Free and Open-source Tailwind CSS Dashboard Admin Template that comes with all essential dashboard UI components, pages and elements

next-template: A Next.js 13 template for building apps with Radix UI and Tailwind CSS.

svelte-relative-time: Relative Time for Svelte

▶Action version is only 1006 bytes minified / 620 bytes gzipped
▶Component version enables SSR
▶Live updates by default (can be disabled)
▶Uses single interval timer for updating all components
▶Lightwight and GC friendly (single Intl.RelativeTimeFormat used per locale)
▶Instance updates scheduled for new visible change
▶Instance updates synchronized so all happen together

react-native-chatgpt: React Native wrapper around ChatGPT to seamlessly integrate it with your applications.

xsshunter: The fastest way to set up XSS Hunter to test and find blind cross-site scripting vulnerabilities.

cron-ai: An easy AI cron expression generator

readme-md: Simple and stylish GitHub profile description is just a copy&paste away

BirdBridge: shoving a twitter API-shaped peg into a mastodon API-shaped hole

use-valtio: Another custom hook to use Valtio proxy state

import { proxy } from 'valtio/vanilla';
import { useValtio } from 'use-valtio';

const state = proxy({ count });

const Counter = () => {
  const { count } = useValtio(state);
  const inc = () => ++state.count;
  return (
    <div>
      {count} <button onClick={inc}>+1</button>
    </div>
  );
};

json-parser: A Json parser in TypeScript

CodeblockCustomizer: Codeblock Customizer plugin for Obsidian

emoji-palette: Get color palettes from emojis

arethetypeswrong.github.io: Tool for analyzing TypeScript types of npm packages

sc-indexer: A super fast, low level events indexer for smart contracts on Ethereum.

vexillologist: An educational world flags web game inspired by Duolingo

image-to-html-css-ASCII-art: This tool converts PNG and JPG image formats into an ASCII art representation with HTML and CSS.

input-duration-element: A Custom Element for <input type="duration">.

rdf-streaming-store.js: A read-only RDF/JS store that allows parallel data lookup and insertion

pino-noel: 🐻‍❄️🌲 Pino transport that roughly matches what I like to see in my logs. Comes with a JSON and pretty-formatted output.

suppress: AI as Backend. Really, its like express.js but easier and uses AI.

JSTools Weekly

Discussion about this post