Skip to content

Instantly share code, notes, and snippets.

View ThimoDEV's full-sized avatar

Thimo ThimoDEV

  • Netherlands, Breda
  • 18:24 (UTC +02:00)
  • X @ThimoDEV
View GitHub Profile
@shanecelis
shanecelis / DragManipulator.cs
Last active June 27, 2024 10:47
This manipulator makes a visual element draggable at runtime in Unity's UIToolkit.
/* Original code[1] Copyright (c) 2022 Shane Celis[2]
Licensed under the MIT License[3]
[1]: https://gist.github.com/shanecelis/b6fb3fe8ed5356be1a3aeeb9e7d2c145
[2]: https://twitter.com/shanecelis
[3]: https://opensource.org/licenses/MIT
*/
using UnityEngine;
using UnityEngine.UIElements;
@Atinux
Atinux / sse.ts
Last active July 16, 2024 13:45
SSE endpoint example with Nuxt 3
// ~/server/api/sse.ts
export default defineEventHandler(async (event) => {
if (!process.dev) return { disabled: true }
// Enable SSE endpoint
setHeader(event, 'cache-control', 'no-cache')
setHeader(event, 'connection', 'keep-alive')
setHeader(event, 'content-type', 'text/event-stream')
setResponseStatus(event, 200)
@gimenete
gimenete / safeParse.ts
Last active March 15, 2024 16:05
A wrapper around the fetch function that validates the response body against a Zod schema
import z from "zod";
export async function safeFetch<T>(
schema: z.Schema<T>,
input: RequestInfo,
init?: RequestInit
): Promise<T> {
const response = await fetch(input, init);
if (!response.ok) {
@KristofferEriksson
KristofferEriksson / useCookie.ts
Created January 29, 2024 09:16
A hook to easily read and update browser cookies. Plus, it auto-updates your component when cookie values change
import { useEffect, useState } from "react";
type UseCookieReturnType = {
cookie: string | undefined;
setCookie: (value: string, days?: number) => void;
};
const useCookie = (cookieName: string): UseCookieReturnType => {
const getCookie = (name: string): string | undefined => {
const value = `; ${document.cookie}`;
@KristofferEriksson
KristofferEriksson / useFetch.ts
Created January 29, 2024 21:27
A generic React fetch hook for API calls with caching, error handling, and refetch capability
import { useCallback, useEffect, useState } from "react";
type FetchState<T> = {
data: T | null;
isLoading: boolean;
error: Error | null;
isCached: boolean;
refetch: () => void;
};
@KristofferEriksson
KristofferEriksson / useUndo.ts
Created January 31, 2024 11:34
A React hook that enhances your components with powerful undo/redo functionality
import { useCallback, useEffect, useRef, useState } from "react";
interface UseUndoHook<T> {
value: T;
onChange: (newValue: T) => void;
undo: () => void;
redo: () => void;
clear: () => void;
canUndo: boolean;
canRedo: boolean;
@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
@KristofferEriksson
KristofferEriksson / useBroadcastChannel.ts
Created February 5, 2024 09:20
A React hook that allows you to send and receive messages between browser tabs or windows
import { useCallback, useEffect, useRef, useState } from "react";
interface UseBroadcastChannelOptions {
name: string;
onMessage?: (event: MessageEvent) => void;
onMessageError?: (event: MessageEvent) => void;
}
interface UseBroadcastChannelReturn<D, P> {
isSupported: boolean;
@KristofferEriksson
KristofferEriksson / useSpeechToText.ts
Last active February 20, 2024 05:33
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 / useGesture.ts
Created February 7, 2024 10:27
A custom React Typescript hook for advanced touch gestures in UI
import { useEffect, useRef } from "react";
type GestureType =
| "swipeUp"
| "swipeDown"
| "swipeLeft"
| "swipeRight"
| "tap"
| "pinch"
| "zoom";