Skip to content

Instantly share code, notes, and snippets.

View zeus-12's full-sized avatar
🎯
Focusing

Vishnu zeus-12

🎯
Focusing
View GitHub Profile
@perfectbase
perfectbase / await.tsx
Last active July 1, 2025 13:42
Await component for tRPC with prefetch
/* eslint-disable @typescript-eslint/no-explicit-any */
import { type TRPCQueryOptions } from '@trpc/tanstack-react-query';
import { unstable_noStore } from 'next/cache';
import { Fragment, Suspense, type ReactNode } from 'react';
import { ErrorBoundary } from 'react-error-boundary';
import { HydrateClient, prefetch as prefetchTRPC } from '@/trpc/server';
type AwaitProps<T> =
| {
promise: Promise<T>;
@KristofferEriksson
KristofferEriksson / useSpeechToText.ts
Last active June 22, 2025 11:57
An experimental React hook for real-time speech-to-text using the Web Speech API
import { useCallback, useEffect, useState } from "react";
// Define custom types for SpeechRecognition and SpeechRecognitionEvent
interface ISpeechRecognitionEvent extends Event {
results: SpeechRecognitionResultList;
resultIndex: number;
}
interface ISpeechRecognition extends EventTarget {
lang: string;
@KristofferEriksson
KristofferEriksson / useTailwindBreakpoint.ts
Created February 2, 2024 10:55
React hook for triggering effects when layout changes due to Tailwind breakpoints
import { useEffect, useState } from "react";
import resolveConfig from "tailwindcss/resolveConfig";
// Update the path to your Tailwind config file
import tailwindConfig from "tailwind.config";
const useTailwindBreakpoint = ({
onBreakpointChange,
}: {
// eslint-disable-next-line no-unused-vars
@juliusmarminge
juliusmarminge / enum-generator.ts
Last active March 19, 2025 14:57
prisma enum generator
import { generatorHandler } from "@prisma/generator-helper";
import fs from "node:fs/promises";
import path from "node:path";
const header = `// This file was generated by a custom prisma generator, do not edit manually.\n`;
generatorHandler({
onManifest() {
return {
defaultOutput: "./enums/index.ts",
@hwkr
hwkr / auto-animate.tsx
Created July 27, 2022 17:51
Auto Animate Component
import { ElementType, HTMLAttributes } from "react";
import { useAutoAnimate } from "@formkit/auto-animate/react";
interface Props extends HTMLAttributes<HTMLElement> {
as?: ElementType;
}
export const AutoAnimate: React.FC<Props> = ({
as: Tag = "div",
children,
@taskylizard
taskylizard / fmhy.md
Last active July 6, 2025 01:52
/r/freemediaheckyeah, in one single file (view raw)

System Design Cheatsheet

Step One: Framing The Problem a.k.a get the MVP

  • Identify the use cases that are in scope
  • Determine constraints based on scoped use cases

use case : the things your system needs to be do.

constraints : the things your system will have to consider to be able to do stuff