Skip to content

Instantly share code, notes, and snippets.

View composite's full-sized avatar
🤡
This is the face. 이것은 면상이다.

Ukjin Yang composite

🤡
This is the face. 이것은 면상이다.
View GitHub Profile
@composite
composite / use-data-array.ts
Last active March 27, 2025 02:30
AI Generated react hooks
'use client';
import { useState, useCallback, useMemo, Dispatch, SetStateAction } from 'react';
export interface DataArray<R> {
data: R[] & { added: R[]; updated: R[]; removed: R[]; initial: R[] };
length: number;
isMutated: boolean;
isInsert: boolean;
isUpdate: boolean;
@composite
composite / plotly-lazy.ts
Created March 5, 2025 05:21
Plotly.js for React: Modern style instead of react-plotly.js, typescript and SSR friendly.
import { lazy, forwardRef, useEffect } from 'react';
export interface PlotlyProps extends HTMLAttributes<HTMLDivElement> {
data: Partial<Data>[];
layout?: Partial<Layout>;
config?: Partial<Config>;
}
export const Plotly = lazy(
() =>
@composite
composite / request-single-frame.ts
Created March 4, 2025 08:09
AI Generated utility functions - Typescript friendly, tested.
/**
* Definition of the animation frame callback function type
*/
type AnimationFrameCallback = (time: number) => void;
/**
* Definition of the cancel function type
*/
type CancelFunction = () => void;
@composite
composite / grok3.sh
Created February 27, 2025 13:44
Grok3 API request with curl - UNOFFICIAL! Use at your own risk.
curl --location --request POST 'https://grok.com/rest/app-chat/conversations/new' \
--header 'accept: */*' \
--header 'accept-language: en-GB,en;q=0.9' \
--header 'content-type: application/json' \
--header 'origin: https://grok.com' \
--header 'priority: u=1, i' \
--header 'referer: https://grok.com/' \
--header 'sec-ch-ua: "Not/A)Brand";v="8", "Chromium";v="126", "Brave";v="126"' \
--header 'sec-ch-ua-mobile: ?0' \
--header 'sec-ch-ua-platform: "macOS"' \
@composite
composite / example.ts
Last active March 18, 2025 05:41
zod Utility: Between FormData and plain object!
import { z } from 'zod';
import { formDataToObject, createFormDataPaths } from './zod-util';
const schema = z.object({
username: z.string(),
location: z.object({
latitude: z.number(),
longitude: z.number(),
}),
strings: z.array(z.object({ value: z.string() })),
@composite
composite / fail2ban-for-host.sh
Created November 8, 2024 10:05
fail2ban: BAN docker services for security (for Docker Host that installed fail2ban)
# INSERT fail2ban FORWARD for Docker host
sudo iptables -I FORWARD -j f2b-postgres
# DELETE fail2ban FORWARD for Docker host
sudo iptables -D FORWARD -j f2b-postgres
# Save
sudo iptables-save
@composite
composite / docker-compose-backup.sh
Last active September 1, 2024 04:25
My docker compose and data backup and refresh container up to date solution.
#!/bin/bash
SHDIR=$(dirname $0)
NOWDA=$(date '+%Y%m%d')
NOWDT=$(date '+%Y%m%d%H%M%S')
BUDIR="/data/backup/docker/compose/$NOWDA"
mkdir -p "$BUDIR"
find "$SHDIR" -maxdepth 3 -type d 2>/dev/null | while read COMPOSE_DIR
@composite
composite / OneDialog.tsx
Last active November 21, 2024 08:35 — forked from alexanderson1993/AlertDialogProvider.tsx
A multi-purpose alert/confirm/prompt replacement built with shadcn/ui AlertDialog components. No Context, SSR friendly, Also works on Next.js and Remix, but requires React 18 or later due to useSyncExternalStore.
'use client';
import {
AlertDialog,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
} from '@/components/ui/alert-dialog';
@composite
composite / openai.js
Created May 9, 2024 13:19
Next.js Server Sent Event Example (Next.js 13+ App Router)
// app/api/route.ts
import { Configuration, OpenAIApi } from 'openai';
export const runtime = 'nodejs';
// This is required to enable streaming
export const dynamic = 'force-dynamic';
export async function GET() {
const configuration = new Configuration({
apiKey: process.env.OPENAI_API_KEY,
@composite
composite / pass.ts
Created March 16, 2024 08:03
Generate and verify password based on PBKDF2 with SHA-256 using Web Standards. works on modern browser, node(20 or later), and any cloud's edge environment.
const encoder = new TextEncoder();
const ITERATIONS = 65535;
const LENGTH = 64;
const ALGORITHM = 'PBKDF2';
const DIGEST = 'SHA-256';
const DERIVED_KEY = {
name: 'AES-CBC',
length: 256,
} as const;
const USAGES = {