Skip to content

Instantly share code, notes, and snippets.

View isocroft's full-sized avatar
💯
Documenting Software...

Ifeora Okechukwu isocroft

💯
Documenting Software...
View GitHub Profile
@isocroft
isocroft / app.js
Last active November 13, 2018 11:41
This is a simple demonstration (proof-of-concept) of using state-charts to design a model for managing transient (temporary UI state) and non-transient data (permanent Data state) in an application
import { Component } from 'react'
import axios from 'axios'
import { updateAppBehavior } from './transition_factory_redux.js'
import { transitionFunction, getState, subscribe } from 'setup_transition_function.js'
const asyncFetchAction = (Component, action) => {
const CancelToken = axios.CancelToken;
return (dispatch, getState, actionGuard, actionType) => {
@isocroft
isocroft / credit-card-numbers-regex.js
Last active April 11, 2024 23:55
This JavaScript file contains regex for all popular credit/debit card numbers: both for local (Nigerian) cards and international
/*
Modified with more card regexs
See initial source: https://www.regular-expressions.info/creditcard.html
*/
let visa = /^4[0-9]{12}(?:[0-9]{3,4})?$/
let visa_local = /^4[19658][7684][0785][04278][128579](?:[0-9]{10})$/
let mastercard = /^(?:5[1-5][0-9]{2}|222[1-9]|22[3-9][0-9]|2[3-6][0-9]{2}|27[01][0-9]|2720)[0-9]{12}$/
let mastercard_local = /^(?:5[13]99|55[35][19]|514[36])(?:11|4[10]|23|83|88)(?:[0-9]{10})$/
@isocroft
isocroft / strict_type_of.js
Last active January 25, 2021 21:35
This JavaScript file implements a function that returns the actual type of a JS variable: literal or primitive
/**
* check if a literal is falsy or not
*/
const isLiteralFalsey = (variable) => {
return variable === '' || variable === false || variable === 0
}
/**
* check if a variable contains a reference type (not a literal)
*/
/** cURL - User Agent String Variations Regex in JS
*
* See: http://www.useragentstring.com/pages/useragentstring.php?name=cURL
* See: https://jonlabelle.com/snippets/view/yaml/browser-user-agent-regular-expressions
*/
; /* Headless UserAgent(s) */
const healessUAs = /\b(Windows-Update-Agent|Microsoft-CryptoAPI|SophosUpdateManager|SophosAgent|Debian APT-HTTP|Ubuntu APT-HTTP|libcurl-agent|libwww-perl|urlgrabber|curl|Wget|OpenBSD ftp|jupdate)(?:[ /](\d+)(?:\.(\d+)(?:\.(\d+))?)?)?/
; /* cURL Headless UserAgent */
const curlUA = /^curl\/((?:\d)\.(?:\d{1,2})(?:\.(?:\d|x))?) \((?:[\-_\w\.]+)\) libcurl(\/| )\1 \(?(?:(SSL|OpenSSL|NSS)\2(\d)\.(\d{1,2})\.\d([a-z]?)(\.\d)?)?\)?(?: (zlib\/(\d)\.(\d)\.(\d)|\(ipv6 enabled\)))?(?: (libidn\/(?:\d)\.(?:\d{1,2})))?(?: (libssh2\/(?:\d)\.(?:\d{1,2})))?$/i
@isocroft
isocroft / react-hook-use-fetch.js
Last active June 16, 2020 13:15
A React Hook for fetching data and notifying all other components
import { useState } from 'preact/hooks';
import fetch from 'isomorphic-fetch';
/**
* `useSync` was created to abstract the stateful logic for managing rest/graphql
* requests ( fetches / queries / mutations ) in such a manner as to not repeat similar logic
* in different components across the project and to be made instantly reusable in
* these components. The implementation is highly functional
* ( lots of function composition and argument currying ).
*
@isocroft
isocroft / detecting_navigation_direction_in_spas.js
Last active July 7, 2023 17:23
Monkey-patch on the History interface
/**
* Algorithm {getNavDirection} created by @isocroft
*
* Copyright (c) 2021-2023 | Ifeora Okechukwu
*
* Works in ReactJS / VueJS / jQuery / Angular / Vanilla
*
* Algo implmented in Javascript: used to determine the direction
* of a single-page app navigation to track "Rage Refreshes" and to
* determine when the user visits a page from the back/forward button
@isocroft
isocroft / chrome_polyfill_error_filename_linenumber_columnnumber.js
Last active April 2, 2021 12:33
This is a polyfill that makes it possible to replicate the Firefox properties for browser errors to get the 'fileName', 'columnNumber' and 'lineNumber'
if (typeof InstallTrigger === "undefined") { // If the browser isn't a Gecko-based browser (e.g. Firefox)
Object.defineProperty(Error.prototype, 'columnNumber', {
configurable: false,
enumerable: false,
get: function () {
const stackString = (this.stack || '').toString();
const regexStackFrameLine = /at (?:(?:[\w ])+) \(([^:]+)\:([\d]+)\:([\d]+)\)\s*/g
const [ _, fileName, lineNumber, columnNumber ] = regexStackFrameLine.exec(stackString) || [ '', '<anonymous>', '1', '1' ]
@isocroft
isocroft / react-table.d.ts
Last active November 16, 2021 18:15
React-Table Types Declaration for TS 4.x+ (Updated to work with the pagination, filter and sort plugins - if and when needed)
// Type definitions for react-table 7.7.0
// Project: https://github.com/tannerlinsley/react-table
// Definitions by: Guy Gascoigne-Piggford <https://github.com/ggascoigne>,
// Michael Stramel <https://github.com/stramel>
// Rohit Garg <https://github.com/gargroh>
// Jason Clark <https://github.com/riceboyler>
// Definitions: https://gist.github.com/isocroft
// TypeScript Version: 4.x+
// reflects react-table@7.7.0
@isocroft
isocroft / request-query.graphql
Created December 7, 2021 16:06
A sample of a potential GraphQL directive on the client-side for HTTP compression
query GetUserFriendsAndLikes ($id: Int!) {
getUserFriendsAndLikes (id: $id) @httpCompressed(mode: "incremental") {
first_name
last_name
age
gender
friends @defer {
first_name
last_name
age
@isocroft
isocroft / schema.graphql
Created December 7, 2021 16:09
HTTP caching directive
type User {
name: String!
age: Int!
salary: Float!
}
type Query {
getAllUsers (id: ID!, page: Int!, pageSize: Int!): [User!] @httpCached(action: "check", freshness: 1, validation: 0)
}