Skip to content

Instantly share code, notes, and snippets.

View sethdavis512's full-sized avatar
🤖

Seth Davis sethdavis512

🤖
View GitHub Profile
@sethdavis512
sethdavis512 / Grid.tsx
Created April 14, 2024 01:13
Grid component (Tailwind)
import { type ReactNode } from 'react';
interface GridProps {
children: ReactNode;
as?: keyof JSX.IntrinsicElements;
className?: string;
}
export default function Grid({ as = 'div', children, className }: GridProps) {
const Component = as;
const getRandomBool = (chance: number = 50): boolean =>
Math.round(Math.random() * 100) >= chance;
/*==================================================
= Bootstrap 3 Media Queries =
==================================================*/
/*========== Mobile First Method ==========*/
/* Custom, iPhone Retina */
@sethdavis512
sethdavis512 / favicon.svg
Last active March 18, 2024 19:20
Set favicon to SVG
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@sethdavis512
sethdavis512 / ConditionalWrapper.tsx
Last active December 13, 2023 03:20
A component that wraps children with a tag based on the condition
import type { ReactNode } from 'react';
interface ConditionalWrapperProps {
condition: boolean;
wrapper: (children: ReactNode) => ReactNode;
children: ReactNode;
}
export default function ConditionalWrapper({
condition,
@sethdavis512
sethdavis512 / mock-hook.ts
Created December 12, 2023 22:23
The Typescript way to mock custom hooks
jest.mock('../path/to/hooks/useMyHook', () => ({
__esModule: true,
default: jest.fn(() => ({
isLoading: false
}))
}));
(useMyHook as jest.MockedFunction<any>).mockReturnValue({ isLoading: true });
# Aliases
# Commit handlers
alias ga="git commit --amend"
alias gam="git add . && git commit --amend"
alias gamp="gam && gpf"
alias gp="git push -u origin $(git symbolic-ref --short HEAD)"
alias gpu="git pull"
alias gr="git reset HEAD^"
alias gt="git add . && git commit -m \"TEMP\" --no-verify"
@sethdavis512
sethdavis512 / getUniqueId.ts
Last active October 4, 2023 20:05
Get unique ID function
function getUniqueId(prefix: string, length: number = 8): string {
let result = `${prefix}-`;
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
const charactersLength = characters.length;
let counter = 0;
while (counter < length) {
result = `${result}${characters.charAt(Math.floor(Math.random() * charactersLength))}`;
@sethdavis512
sethdavis512 / useD3.ts
Created June 23, 2023 13:50
React hook for D3 usage
const useD3 = (renderChartFn: (el: any) => void, dependencies: any[]) => {
const ref = useRef<HTMLElement>();
useEffect(() => {
if (!!ref.current) {
renderChartFn(d3.select(ref.current));
}
return () => {};
}, dependencies);
@sethdavis512
sethdavis512 / gist:8c1cea61ecdd12f55db06d581daa6025
Created March 16, 2023 21:59 — forked from BjornDCode/gist:5cb836a6b23638d6d02f5cb6ed59a04a
Tailwind - Fixed sidebar, scrollable content
// Source: https://twitter.com/calebporzio/status/1151876736931549185
<div class="flex">
<aside class="h-screen sticky top-0">
// Fixed Sidebar
</aside>
<main>
// Content
</main>