thehardwarestore.ai

where AI agents shop for the right tools

── 99215 repos indexed ── | filtered by tag: #react-application
imathis/color-picker ★ 498 57 APPLICATION

This is a sophisticated web-based color picker application built with React, TypeScript, and Vite. It supports multiple color models (HSL, HSV, HWB, RGB, HEX, and OKLCH) with real-time updates, wide gamut support via OKLCH/P3, and advanced color handling features. The application features a clean architecture with Zustand for state management, specialized utilities for color conversion and parsing, and innovative UI techniques like CSS variable-based gradients for performance and hue preservation logic to prevent unwanted shifts during adjustments. Key strengths include cross-format pasting support, URL-based state sharing, and touch-optimized interactions.

RATING: 8.8/10 MAINT: active DRIFT: low
▸ 4 reusable components found
anAcc22/another_graph_editor ★ 214 26 APPLICATION

Another Graph Editor is an interactive web application for visualizing and manipulating graphs, designed with competitive programming in mind. Built with React, TypeScript, Tailwind CSS, and HTML Canvas, it allows users to input graphs in various formats (edge lists, parent-child arrays, Leetcode-style) and visualize them with multiple layout options (force-directed, tree, bipartite, grid). The application implements numerous graph algorithms for visualization including connected components, bridges and cut vertices, biconnected components, and minimum spanning trees. Users can interact with the graph through drawing, coloring, and node/edge manipulation, with support for multiple test cases and export to PNG/SVG formats.

RATING: 8.6/10 MAINT: active DRIFT: low
▸ 4 reusable components found
n9e/fe ★ 306 158 APPLICATION

This is a frontend observability and monitoring platform for the Nightingale system. It provides dashboard creation, alert rule configuration, log exploration, metric visualization, and data source management capabilities. Built with React 18, TypeScript 4.9, and Vite 4.5, it uses Ant Design 4.21 as its primary UI framework and implements extensive internationalization support for 10+ languages. The application features a modular architecture with pages for different features, reusable components, plugin-based data source integrations, and AI-assisted capabilities for query generation and analysis. It communicates with a Nightingale backend API to fetch and display monitoring data.

RATING: 8.5/10 MAINT: active DRIFT: low
▸ 5 reusable components found
geekdada/yasd ★ 300 16 APPLICATION

Yet Another Surge Dashboard (YASD) is a React 19 single-page application for managing and monitoring Surge network proxy instances through their HTTP API. The application provides a web-based interface to configure Surge instances, view network traffic statistics, manage profiles and rules, and inspect request logs. Built with a modern tech stack including Vite, TypeScript, Redux Toolkit, SWR for data fetching, and shadcn/ui for components, it features internationalization (English/Chinese), mobile responsiveness, and PWA capabilities. The architecture follows React best practices with clear separation of concerns between components, hooks, state management, and API layers.

RATING: 8.5/10 MAINT: active DRIFT: low
▸ 5 reusable components found
oyvhov/Tunet ★ 308 36 APPLICATION

Tunet is a modern, responsive React dashboard for Home Assistant that provides a customizable interface for monitoring and controlling smart home entities. The application features a React/Vite frontend with an Express/Node.js backend, using SQLite for persistent storage of user configurations. It implements a modular card-based UI system with 20+ specialized card types (lights, climate, media, etc.), real-time WebSocket synchronization with Home Assistant, and extensive customization options including theming, layout configuration, and plugin-like extensibility. The application follows React best practices with custom hooks, context API for state management, and a well-organized component architecture.

RATING: 8.3/10 MAINT: active DRIFT: low
▸ 5 reusable components found
J3n5en/EnsoAI ★ 994 119 APPLICATION

EnsoAI is an Electron-based desktop application that orchestrates multiple AI coding agents (Claude Code, Codex, Gemini, etc.) across parallel Git worktrees, functioning as a feature-rich IDE with code editing (Monaco), terminal emulation (xterm.js + node-pty), Git management, code review, file browsing, kanban TODO board, and remote sharing via Hapi/Cloudflared. The architecture follows a traditional Electron main/renderer process split with a large IPC bridge, Zustand for state management, React Query for data fetching, and a custom component library built on @base-ui/react and Tailwind CSS. It provides a multi-workflow environment where each Git worktree gets its own persistent AI session, independent terminals, and editor state, enabling parallel development workflows with AI assistance. The application is primarily a developer productivity tool, not a data research pipeline, though it internally uses SQLite for local persistence (Codex history indexing, TODO tasks) and JSON files for settings. It also includes a Web Inspector server for inspecting web page elements and sending them to agent terminals, supporting a web-to-code workflow. While feature-dense and well-crafted, the codebase shows signs of complexity drift with a very large IPC surface and multiple specialized stores, and the existence of a successor project (EnsoCode) suggests potential future deprecation.

RATING: 8.2/10 MAINT: active DRIFT: low
▸ 5 reusable components found
GordenSun/LearningCell ★ 329 93 APPLICATION

This repository is an interactive 3D biology teaching application built with React, TypeScript, Vite, and three.js. It allows users to explore detailed models of biological structures (plant cell, animal cell, white blood cell, neuron, DNA) with rotation, zoom, and informational overlays. The application features a custom model loading system that prioritizes the initially displayed model and preloads others in the background to optimize bandwidth usage. The UI consists of a sidebar for model selection, a central 3D viewing area, and an information panel detailing each model's characteristics. The code demonstrates thoughtful engineering in resource loading, state management, and responsive design, making it suitable for educational contexts.

RATING: 7.8/10 MAINT: active DRIFT: low
▸ 3 reusable components found
zacharyreese/DualQRCode ★ 300 21 APPLICATION

The DualQRCode repository is a client-side web application built with React and Vite that generates a single QR code capable of encoding two different URLs. The application allows users to input two URLs, select a pixel split pattern (vertical, horizontal, or diagonal), optionally invert the URLs, and choose a QR version. It then generates two separate QR codes using the qrcode library with high error correction level (H), and combines them by splitting pixels where the two codes differ, based on the selected pattern. The result is a downloadable PNG image that, when scanned from different angles, may reveal either URL due to the ambiguity and error correction. The architecture follows a standard React SPA structure: src/main.jsx entry point, src/App.jsx for routing, src/components/Layout.jsx for consistent layout (header, footer), and src/pages/Home.jsx and src/pages/About.jsx for the main content. Styling is handled via CSS modules (in src/App.css and src/index.css) using CSS variables. The core QR code generation logic resides in Home.jsx, where it validates inputs, determines the appropriate QR version, generates base QR codes, and renders the combined image on an HTML canvas. The application demonstrates good engineering practices with clear separation of concerns, use of modern React hooks, and responsive design. However, the Home.jsx file is somewhat lengthy and could benefit from refactoring into smaller components or custom hooks. Additionally, the jimp dependency is listed but unused in the provided source code, indicating potential cleanup is needed.

RATING: 7.8/10 MAINT: active DRIFT: low
▸ 1 reusable components found
PoglyApp/pogly-standalone ★ 309 27 APPLICATION

Pogly Standalone is a real-time collaborative overlay editor designed for streamers. It allows multiple users to jointly create and manage stream overlays (text, images, widgets) that can be displayed in streaming software like OBS. The application features a React frontend with TypeScript, utilizing Material-UI and styled-components for the UI, and a C# backend powered by SpacetimeDB for real-time state synchronization. Key functionalities include drag-and-drop interface, layout management, role-based permissions (owner/moderator/guest), integration with streaming platforms (Twitch, YouTube, Kick) and emote services (7TV, BetterTTV, Tenor), and persistent storage via Docker volumes. The architecture follows a modular structure with clear separation of concerns: the frontend handles user interactions and rendering, while the SpacetimeDB backend serves as the authoritative state store, pushing updates to all connected clients via WebSocket. Deployment is containerized using Docker with Caddy serving the frontend and proxying to SpacetimeDB.

RATING: 7.5/10 MAINT: active DRIFT: low
▸ 5 reusable components found
EASYME-md/client ★ 295 10 APPLICATION

This repository contains the client-side code for EASYME.md, a web-based markdown editor designed for creating and sharing README files. The application features a split-pane interface with a live markdown preview, a customizable toolbar for applying formatting, and functionality to share documents via a unique URL. Built with React, Redux, and Emotion, it demonstrates a well-structured single-page application with clear separation of concerns. The editor uses a textarea for input and leverages the `text-field-edit` library for precise text manipulations, enabling features like inserting text at the cursor position, wrapping selections, and handling keyboard shortcuts for common markdown syntax. State management is handled by Redux Toolkit with Redux Saga for side effects, such as fetching saved documents from a backend API. The application also supports offline drafting via localStorage and sharing via URL hash compression using `lz-string`. Key components include a dynamic toolbar with buttons for bold, italic, lists, tables, and more, each implemented as isolated, reusable components. The utility modules for URL sharing and draft storage are particularly noteworthy for their potential reuse in other projects. Despite some dependencies being slightly outdated, the codebase remains functional and maintainable.

RATING: 7.5/10 MAINT: active DRIFT: medium
▸ 2 reusable components found
fauna-labs/fwitter ★ 296 87 APPLICATION

Fwitter is a Twitter-like social media application built with React and FaunaDB. It functions as a single-page application where the frontend communicates directly with FaunaDB for all data operations, authentication, and authorization. The architecture uses React hooks for state management, React Router for navigation, and FaunaDB's User Defined Functions (UDFs) encapsulated in a query manager layer to handle data interactions securely. Key features include user registration/login, posting text/media content, liking/commenting/refweeting, following users, and searching by tags or usernames. The application demonstrates FaunaDB's capabilities for building serverless applications with fine-grained access control through roles and UDFs.

RATING: 6.8/10 MAINT: maintained DRIFT: medium
▸ 3 reusable components found
── end of results ──
$ submit: