nathan-hyan

{
	"useTabs":  false,
	"semi":  true,
	"singleQuote":  true,
	"jsxSingleQuote":  true,
	"trailingComma":  "es5",
	"endOfLine":  "lf"
}

nathan-hyan

import { useMemo } from 'react';
import { useLocation } from 'react-router-dom';

export function useQuery<T = Record<string, string | number | undefined>>() {
    const { search } = useLocation();

    const searchParams = useMemo(() => new URLSearchParams(search), [search]);

    let result: Partial<T> = {} as T;

nathan-hyan

@mixin flex($justify: center, $align: center, $direction: row) {
  display: flex;
  flex-direction: $direction;
  align-items: $align;
  justify-content: $justify;
}

nathan-hyan

{
  "defaultSeverity": "warning",
  "extends": [
    "stylelint-config-standard-scss",
    "stylelint-config-prettier-scss",
    "stylelint-config-rational-order"
  ],
  "ignoreFiles": ["**/*.js", "**/*.ts", "**/*.tsx", "**/*.jsx", "**/*.html"],
  "rules": {
    "order/properties-order": [[], { "severity": "warning" }],

nathan-hyan

describe('testing localStorage', () => {
  // This following snippet is from https://amitd.co/code/testing/spying-on-localstorage-in-jest 
  // Thank you so much Amit Dhamu for this implementation

  jest.spyOn(Object.getPrototypeOf(window.localStorage), 'setItem');
  Object.setPrototypeOf(window.localStorage.setItem, jest.fn());

  it('saves to localStorage when clicked on button', () => {
    render(<Component />);
    

nathan-hyan

module.exports = {
  env: {
    browser: true,
    es2021: true,
    jest: true, // Enable if testing is used on the project
  },
  extends: ['plugin:react/recommended', 'plugin:import/recommended', 'airbnb'],
  parser: '@typescript-eslint/parser',
  parserOptions: {
    ecmaFeatures: {

nathan-hyan

// Shout out to YouTube channel "FrontDev" for this mixin
// that makes responsive so much easier to work with. You can check out the full tutorial on
// his video here: https://www.youtube.com/watch?v=1334bFDilgk&ab_channel=FrontDev

// Put your breakpoints here
$available-breakpoints: (
    sm: 540px,
    md: 768px,
    lg: 1024px
);