state-management

typescript
import { createContext } from 'react';

export type ToastVariant = 'success' | 'error' | 'info';

export interface Toast {
  id: number;

Imperative Toast Notification System with React Context and Auto-Dismiss

react toast context
by codesnips 4 tabs
javascript
import React, { createContext, useContext, useReducer, useState } from 'react';

// 1. Basic Context
const UserContext = createContext(null);

function UserProvider({ children }) {

State management with Context API and Redux patterns

react redux state-management
by Alex Chang 2 tabs
javascript
import { useCallback, useMemo, useState } from 'react';

function compare(a, b) {
  if (typeof a === 'number' && typeof b === 'number') return a - b;
  return String(a ?? '').localeCompare(String(b ?? ''));
}

Building a Paginated, Sortable Data Table with a useTable Hook in React

react hooks pagination
by codesnips 3 tabs
javascript
import { useState, useEffect, useCallback } from 'react';

export function useLocalStorage(key, initialValue) {
  const readValue = useCallback(() => {
    if (typeof window === 'undefined') return initialValue;
    try {

Persist a React Shopping Cart to localStorage with a Context Provider

javascript react context
by codesnips 3 tabs
typescript
export interface DocState {
  text: string;
  selection: number;
}

export interface Command<S> {

Undo/Redo in a React Text Editor with a Command-History Stack

react hooks undo-redo
by codesnips 3 tabs
javascript
import React, { createContext, useCallback, useMemo, useRef, useState } from 'react';
import { ToastViewport } from './ToastViewport';

export const ToastContext = createContext(undefined);

let counter = 0;

Build a React Toast Notification System with Context Provider, Hook, and Portal

react toast context-api
by codesnips 4 tabs
ruby
require 'sinatra/base'
require_relative 'cart'
require_relative 'cart_helpers'

class StoreApp < Sinatra::Base
  enable :sessions

Session-Backed Shopping Cart with Sinatra Helpers and a Cart Value Object

sinatra sessions shopping-cart
by codesnips 3 tabs
typescript
export interface CartItem {
  id: string;
  name: string;
  price: number;
  quantity: number;
}

Type-Safe Shopping Cart with useReducer, Context, and a useCart Hook

react context usereducer
by codesnips 4 tabs