codesnips

history-api

ruby 
class ProductsController < ApplicationController
  PER_PAGE = 24

  def index
    @page = [params[:page].to_i, 1].max
    @sort = %w[name price recent].include?(params[:sort]) ? params[:sort] : "recent"

Use data-turbo-action to control history (advance vs replace)

rails hotwire turbo
by codesnips 3 tabs
javascript 
import { useCallback, useEffect, useState } from 'react';

function parseSearch(search) {
  const params = new URLSearchParams(search);
  const out = {};
  for (const [key, value] of params.entries()) out[key] = value;

Sync React Form State to the URL Query String with a Debounced useSearchParams Hook

react hooks url-state
by codesnips 3 tabs
typescript 
import { useCallback, useEffect, useState } from "react";

type Patch = Record<string, string | null | undefined>;

function readParams(): URLSearchParams {
  return new URLSearchParams(window.location.search);

Sync a Filter Panel to the URL Query String with a Custom useSearchParams Hook

react hooks url-state
by codesnips 3 tabs