Skip to content

Instantly share code, notes, and snippets.

View isocroft's full-sized avatar
😜
Seriously fooling around!

Ifeora Okechukwu Patrick isocroft

😜
Seriously fooling around!
View GitHub Profile
@isocroft
isocroft / useResumableFileUploader.tsx
Last active July 29, 2025 15:08
A ReactJS hook for setting up a resumable file upload using a tus client + a tus server
import { useEffect, useCallback, useRef, useState, useMemo } from "react";
import { Upload } from "tus-js-client";
enum UploadStatus {
IDLE = "idle",
UPLOADING = "uploading",
PAUSED = "paused",
RESUMED = "resumed",
COMPLETED = "completed",
ERROR = "error",
@isocroft
isocroft / race.js
Last active May 24, 2025 12:42
A basic (yet slightly coupled) setup for cancelling either of 2 concurrent tasks racing each other to completion (i.e. to a promise settlement)
class HttpResponseError extends Error {
constructor (message, response) {
super(message);
this.response = response
}
}
async function simpleFetch(
url /* @type( string | RequestInfo | URL ) */,
options /* @type( Omit<RequestInit, "signal"> && { controller: AbortController } ) */
@isocroft
isocroft / useInfiniteScrollForQueries.tsx
Last active November 5, 2025 14:48
React Infinite Scroll Hook using react-query and react-busser
import { useEffect, useRef } from "react";
import { useIsDOMElementVisibleOnScreen } from "react-busser";
import type { InfiniteQueryResult, InfiniteQueryKey, InfiniteQueryFunction, InfiniteQueryOptions } from "react-query";
import { useInfiniteQuery } from "react-query";
export type InfiniteScrollQueryOptions<TK, TR, TMV, TE> = {
queryKey: InfiniteQueryKey<TK>;
queryFn?: InfiniteQueryFunction<TR, TK, TMV>;
config?: InfiniteQueryOptions<TR, TMV, TE>;
};
@isocroft
isocroft / GoogleTagManager.tsx
Created April 6, 2025 21:30
Google tag manager component for ReactJS in NextJS RSC
"use client"
import { useEffect } from "react";
import TagManager from "react-gtm-module";
export default function GoogleTagManager () {
useEffect(() => {
const gtmId = process.env.NEXT_PUBLIC_GTM_ID;
if (gtmId) {
TagManager.initialize({ gtmId });
@isocroft
isocroft / flexibleAPIEndpoints.py
Last active November 17, 2025 19:19
A python script that makes any API endpoints wrapper very easy to create and modify
import requests
import json
import re
import urllib.parse
from datetime import datetime, date
__all__ = [
"PayStacky"
]
@isocroft
isocroft / useInuptValueUpdate.ts
Last active April 15, 2026 19:12
A ReactJS hook that is used to track changes to the characters in the text of an input text box.
import React, { useRef, useEffect } from "react":
import { useIsFirstRender } from "react-busser";
import type { Ref } from "react";
const use = <D extends unknown>(promise: Promise<D>) => {
};
export const useInuptValueUpdate = ({ value, defaultedValue = "" }) => {
@isocroft
isocroft / useCurrentTime.js
Last active November 12, 2025 19:37
A simple hook that updates the current time in ReactJS
import moment from 'moment'
import { useState, useEffect } from 'react'
export const useCurrentTime = (formatting = 'hh:mm A', intervalDuration = (1000 * 60)) => {
const [currentTime, setCurrentTime] = useState(() => moment().format(formatting))
useEffect(() => {
const updateTime = () => {
setCurrentTime(moment().format(formatting))
}
@isocroft
isocroft / scrollMarginTopPolyfill.js
Last active March 11, 2025 01:59
A very simple script that polyfills support for CSS property `scroll-margin-top` in older browsers.
const browserDoesSupportCSS_ScrollMarginTop = window.CSS.supports("scroll-margin-top", "10px");
const browserDoesSupportCSS_ScrollBehavior = window.CSS.supports("scroll-behavior", "smooth");
/* @NOTE: Simple helper to report if a DOM elements' bounding rectangle is partially within the viewport */
function isElementPartiallyOrWhollyWithinViewport_YAxis (element) {
const rect = element.getBoundingClientRect();
const minimumYFrame = 0;
const minimumXFrame = 0;
const maximumYFrame = (window.innerHeight || document.documentElement.clientHeight);
@isocroft
isocroft / crawler.go
Created January 10, 2025 13:44 — forked from hacktivist123/crawler.go
A simple web crawler
package main
import (
"bytes"
"crypto/tls"
"fmt"
"log"
@isocroft
isocroft / useNextJSAppRouteRefresh.ts
Last active March 3, 2025 18:39
A hook for auto/manual refresh of a route in NextJS v13+ (React v17.0.x - v19.0.x) app router software
import { useRouter } from "next/navigation";
import { useEffect, useTransition } from "react";
const useNextJSAppRouteRefresh = (
{ intervalDurationInMilliseconds = 0, autoRefreshOnMount = false }: {
intervalDurationInMilliseconds: number,
autoRefreshOnMount: boolean
}
) => {
const [isPending, startTransition] = useTransition();