shaquille-galanto/screaming-architecture-nextjs

This system is a Next.js 13 application that implements a todo management feature, handling the creation, editing, completion, and deletion of items. It utilizes React Context and reducers for state management, supported by a custom code scaffolding tool to generate components, hooks, and utilities. The codebase includes a dedicated UI library for buttons and inputs, along with comprehensive testing via Cypress and Jest.

A new AddTodoForm component has been introduced for creating todos. It validates input using Yup, displaying a 'This field is required' error and disabling the submit button when the text field is empty. Upon successful submission, the form automatically resets its input field.

src/features/todos/add-todo-form · high confidence

The todo-list feature now includes a UI component that displays a list of todos, showing an empty state message when no items exist. Each todo item is rendered with controls to toggle its completion status, edit its text content, and delete the item entirely, with validation ensuring the text field is not empty upon saving.

src/features/todos/todo-list · high confidence

A new test utility function \userSetup\ is now available in the \test-utils\ package. It combines \@testing-library/user-event\ setup with React Testing Library's \render\ function, allowing tests to easily access both the user interaction instance and the rendered component results in a single call.

test-utils · high confidence

The plop generator for React contexts now produces a complete, ready-to-use context implementation. This includes a client-side provider component with an 'isUpdating' state, a corresponding TypeScript type definition, a re-export index file, and a sample test file to verify the provider renders without errors.

plop/templates/context · high confidence

A new \check-equality\ helper function has been added to the Plop helpers library, allowing templates to conditionally render content based on strict equality checks between values. This helper is now exported via the main helpers index, enabling its use in Plop templates for precise value comparison logic.

plop/helpers · high confidence

The plop generator now includes a new action that automatically formats generated code using Prettier and ESLint. When a new item is created, the system runs \pnpm prettier --write\ and \pnpm eslint --fix\ on the generated file path to ensure consistent code style and fix linting issues immediately.

plop/actions · high confidence

The project now includes a Plop template for generating new React components, providing a standardized structure that includes TypeScript types, scoped SCSS styles, a basic test file, and an index export. The generated component supports two modes: a simple functional component or a reusable component wrapped in React's forwardRef, allowing developers to choose based on their needs. Additionally, the template is dynamic, allowing the root HTML element (e.g., div, section) to be specified during generation.

plop/templates/component · high confidence

A new plop template for generating a React context-reducer pattern has been added. This template scaffolds a provider component, a reducer handling an 'UPDATE' action to toggle an 'isUpdating' state, associated TypeScript types, and sample test files for both the provider and the reducer.

plop/templates/context-reducer · high confidence

The plop generator now includes a new template for creating custom React hooks. This adds a client-side hook structure that initializes a boolean state for tracking updates and returns it, along with a corresponding test template that verifies the hook renders without throwing errors.

plop/templates/custom-hook · high confidence

New utility modules have been added to the plop configuration to support code generation. The \constants.mjs\ file defines standard input prompts for name and file path, while \set-actions.mjs\ provides a function to generate actions that scaffold files from templates into \src/features\ and automatically format the resulting code. These utilities are exported via \index.mjs\ to be used by the plopfile.

plop/utils · high confidence

The project now includes Handlebars templates for generating utility modules. When a new utility is created, it will automatically generate an index file for re-exporting, a TypeScript source file exporting a default 'Hello World!' function, and a corresponding test file with a sample test case to ensure the function triggers without error.

plop/templates/utils · high confidence

The src/features/ui location now provides a unified entry point for consuming UI elements. Users can import types and components directly from this module, which re-exports everything from the button and input sub-modules, simplifying access to these specific UI primitives.

src/features/ui · high confidence

The application now includes a root layout that imports base styles and renders the main content area, along with a home page that integrates the Todo feature by wrapping the TodoSection component within a TodoProvider.

src/app · high confidence

The project now uses a structured SCSS environment in src/styles, introducing a CSS reset that normalizes margins, padding, and box-sizing across all elements, and sets default font families for body text and form controls. It also provides a responsive breakpoint map and a media-query mixin to simplify responsive design, along with an index file to manage imports for these abstracts and base styles.

src/styles · high confidence

This change introduces the foundational configuration and tooling for a Next.js 13 project, establishing a 'Screaming Architecture' structure. It includes ESLint rules extending Next.js core-web-vitals, Prettier formatting, and TypeScript configuration with path aliases for features and styles. The setup integrates a code generator (Plop.js) for creating components, contexts, hooks, and utilities, alongside environments for Jest unit testing and Cypress end-to-end testing. Additionally, it configures Webpack to detect circular dependencies and sets up SCSS support.

(repo-wide) · high confidence

The todo-provider module now exposes a React context provider that manages todo state using a reducer pattern. Consumers can wrap their application with TodoProvider to access todo state and dispatch actions (add, edit, delete) via the useTodoState and useTodoDispatch hooks, replacing any previous ad-hoc or prop-drilling approaches for todo management within this feature area.

src/features/todos/todo-provider · high confidence

A new Button component has been added to the UI library, allowing users to customize appearance through 'variant' (primary, secondary) and 'size' (md, sm) props. The component supports standard HTML button attributes, includes a disabled state with specific styling, and is accompanied by unit tests to verify class application based on props.

src/features/ui/button · high confidence

A new Input component has been added to the UI library, allowing users to render HTML input elements with a configurable size prop (supporting 'sm' and 'md' variants). The component applies specific CSS classes for height and padding based on the selected size, with 'md' as the default, and exposes standard input props via forwardRef for accessibility and form integration.

src/features/ui/input · high confidence

The repository now enforces code quality standards before commits are finalized. A new pre-commit hook has been added that automatically runs \pnpm typecheck\ and \pnpm lint\ on every commit, ensuring that TypeScript type errors and linting violations are caught early in the development workflow.

.husky · high confidence

The TodoSection component has been reorganized into a new \src/features/todos/sections/todo-section\ directory to align with updated project standards. This change introduces a modular structure where the component logic, styles, and types are co-located, and updates the barrel exports in \src/features/todos/sections\ to correctly expose the refactored module.

src/features/todos/sections · high confidence

The todos feature now provides a unified public API through a new barrel file (index.ts) that re-exports all components and types from its sub-modules (add-todo-form, sections, todo-item, todo-list, todo-provider). Additionally, a dedicated types.ts file centralizes type re-exports and explicitly defines the core Todo type, ensuring consistent access to feature internals for consumers.

src/features/todos · high confidence

This change introduces a new Cypress-based end-to-end testing environment for the application. It includes a test script (\cypress/e2e/todos.cy.ts\) that verifies the core todos functionality, specifically checking that the UI correctly handles empty states, input validation (disabled submit button and error messages), and the full lifecycle of creating, editing, completing, and deleting todo items. The setup also adds necessary configuration files, including a \tsconfig.json\ for TypeScript support in the test directory, a support file for global setup, and a placeholder fixture.

cypress · high confidence

The project is initialized with Next.js 13.4.19 and React 18.2.0, including TypeScript 5.2.2 for type safety. Development workflows are established using ESLint, Prettier, Husky for pre-commit hooks, and Jest for unit testing. Form management is supported by Formik and Yup, while styling utilizes Sass. End-to-end testing is configured via Cypress, and code scaffolding is enabled through Plop.

(dependencies) · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

• CAI 58 → 60 (+2.0)
• Rubric changed (rubric-2026.08.18 → rubric-2026.09.15) — scores are not directly comparable.

• Code Health 88 → 83 (-5.1)
• Architecture 69 → 69 (+0.0)
• Maturity 53 → 55 (+2.1)
• Readiness 57 → 59 (+1.3)
• Security 57 → 69 (+12.3)

• Coverage not included — suite not readable by the collector
• Critical CVE: [GHSA redacted] (pnpm-lock.yaml)
• Critical CVE: [GHSA redacted] (pnpm-lock.yaml)
• Dependency hygiene not measured — dependency manifest found but not parsed for hygiene
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High vulnerability: [GHSA redacted] (pnpm-lock.yaml)
• High: security finding (details withheld)
• High: security finding (details withheld)
• High: security finding (details withheld)
• …and 19 more

• Coverage not measured — JavaScript/TypeScript suite
• Critical CVE: [CVE redacted] (pnpm-lock.yaml)
• Critical CVE: [GHSA redacted] (pnpm-lock.yaml)
• Critical CVE: [GHSA redacted] (pnpm-lock.yaml)
• Critical CVE: [GHSA redacted] (pnpm-lock.yaml)
• Dependency hygiene PARTLY measured — npm pinning read, dependency currency not (the committed lockfile resolved no direct production dependency)
• Documentation: no installation or build instructions (README.md)
• Documentation: no licence statement (README.md)
• Documentation: no usage examples (README.md)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• High CVE: [GHSA redacted] (pnpm-lock.yaml)
• …and 31 more

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

shaquille-galanto/screaming-architecture-nextjs was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.