Skip to content

useScrollSpy, useRecaptcha, useIsMobile #21

@landonwjohnson

Description

@landonwjohnson

Description

Motivation

  • Reusability – Hooks like useScrollSpy, useRecaptcha, useIsMobile, responsive utilities, and useToast are generic and portable (no app-specific dependencies).
  • Maintainability – Single source of truth; package can be versioned and updated independently.
  • Reduced duplication – Other projects can depend on the package instead of copy-pasting hooks.
  • Testability – Hooks can be unit-tested once and trusted across consumers.

Possible Implementation

  1. Create package structure

    • Create a new package (e.g. @landonjohnsondev/reusable-hooks or packages/reusable-hooks in a monorepo).
    • Add package.json with react and react-native as peer dependencies.
    • Source files already live in /reusable-hooks/ – move/copy into the new package.
  2. Migration steps

    • Copy /reusable-hooks/ contents into the new package directory.
    • Configure build (e.g. tsup or tsc for ESM/CJS output).
    • Add workspace dependency so this project consumes the package.
    • Update src/theme/responsive.ts and src/hooks/* re-exports to pull from the package instead of @/reusable-hooks.
  3. Exports

    • Main entry: index.ts exporting all hooks and types.
    • Optional subpath exports: @pkg/responsive, @pkg/use-toast, etc.
  4. Dependencies

    • Peer: react, react-native (or react-native-web for web-only setups).
    • No Next.js or project-specific imports.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions