{"id":29293569,"url":"https://github.com/aulanchik/checkout","last_synced_at":"2026-05-09T09:04:14.552Z","repository":{"id":286193331,"uuid":"958266685","full_name":"aulanchik/checkout","owner":"aulanchik","description":null,"archived":false,"fork":false,"pushed_at":"2025-06-28T10:10:20.000Z","size":55,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-28T11:24:52.411Z","etag":null,"topics":["input-validation","react","react-testing-library","sass","scss","typescript","vitest"],"latest_commit_sha":null,"homepage":"https://chout.netlify.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aulanchik.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-03-31T23:18:33.000Z","updated_at":"2025-06-28T10:10:21.000Z","dependencies_parsed_at":"2025-04-04T22:20:34.390Z","dependency_job_id":"ec15a9c7-6661-48c8-9396-85c916e27a48","html_url":"https://github.com/aulanchik/checkout","commit_stats":null,"previous_names":["aulanchik/store-checkout","aulanchik/checkout"],"tags_count":0,"template":false,"template_full_name":"aulanchik/vite-react-ts","purl":"pkg:github/aulanchik/checkout","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aulanchik%2Fcheckout","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aulanchik%2Fcheckout/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aulanchik%2Fcheckout/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aulanchik%2Fcheckout/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aulanchik","download_url":"https://codeload.github.com/aulanchik/checkout/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aulanchik%2Fcheckout/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263889804,"owners_count":23525616,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["input-validation","react","react-testing-library","sass","scss","typescript","vitest"],"created_at":"2025-07-06T11:06:15.025Z","updated_at":"2026-05-09T09:04:09.521Z","avatar_url":"https://github.com/aulanchik.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Store Checkout\n\nThis repository contains a dynamic shopping cart checkout application built with React, TypeScript, and Vite. It allows users to manage a shopping basket, apply complex pricing rules including special offers, and edit these rules in real-time.\n\n## Features\n\n*   **Dynamic Basket Management**: Add items to the basket by SKU, adjust quantities, or clear the entire basket.\n*   **Real-time Total Calculation**: The total price is instantly updated as items are added or quantities change.\n*   **Complex Pricing Logic**: Supports both standard unit pricing and special multi-buy offers (e.g., \"3 for the price of 2\").\n*   **Editable Pricing Rules**: An intuitive interface to view and modify the pricing rules for each product, including unit prices and special deals.\n*   **Form Validation**: Client-side validation ensures that pricing rule modifications are valid before saving.\n*   **Responsive Design**: A responsive layout that works across different screen sizes.\n\n## Tech Stack\n\n*   **Framework**: React 19\n*   **Language**: TypeScript\n*   **Build Tool**: Vite\n*   **Styling**: SCSS\n*   **State Management**: React Context API\n*   **Testing**: Vitest, React Testing Library\n*   **Linting**: ESLint\n*   **Formatting**: Prettier\n\n## Project Structure\n\nThe project follows a standard React application structure, organized for clarity and scalability.\n\n```\nsrc/\n├── assets/         # SCSS stylesheets and other static assets\n├── components/     # Reusable React components\n│   ├── Basket/     # Components related to the shopping basket\n│   ├── PricingRules/ # Components for displaying and editing pricing rules\n│   └── ...\n├── contexts/       # React Context for global state management (BasketContext)\n├── data/           # Initial data, like default pricing rules\n├── hooks/          # Custom React hooks (useBasket)\n├── tests/          # Test setup and configuration\n├── types/          # TypeScript type definitions\n├── utils/          # Helper functions (calculations, formatting, validation)\n├── App.tsx         # Main application component\n└── main.tsx        # Application entry point\n```\n\n## Core Logic\n\n### State Management\n\nThe application's state, including the contents of the basket and the current pricing rules, is managed globally using React's Context API. `BasketContext.tsx` provides the state and functions to manipulate it, such as `addItemQuantity`, `removeItemQuantity`, `clearBasket`, and `updatePricingRule`.\n\n### Price Calculation\n\nThe total cost is calculated by the `calculateTotal` function within the `BasketContext`. For each item in the basket, it checks for applicable special offers.\n\n-   If a special offer exists and the item quantity meets the offer's requirement, the price is calculated based on the special deal. For example, for an offer of \"3 for 130p\" and a quantity of 4, the total for that item would be `130p` (for the first 3) + `50p` (for the remaining 1 at its unit price).\n-   If no special offer applies, the price is simply the `unitPrice` multiplied by the `quantity`.\n\nThis logic is encapsulated in the `calculateItemPrice` helper function.\n\n## Getting Started\n\nFollow these instructions to get a local copy of the project up and running.\n\n### Prerequisites\n\n*   Node.js (v18 or later recommended)\n*   npm, pnpm or yarn\n\n### Installation \u0026 Setup\n\n1.  **Clone the repository:**\n    ```sh\n    git clone https://github.com/aulanchik/checkout.git\n    ```\n\n2.  **Navigate to the project directory:**\n    ```sh\n    cd checkout\n    ```\n\n3.  **Install the dependencies:**\n    ```sh\n    npm install\n    ```\n\n### Available Scripts\n\n*   **To run the development server:**\n    ```sh\n    npm run dev\n    ```\n    The application will be available at `http://localhost:5173`.\n\n*   **To run the tests:**\n    ```sh\n    npm test\n    ```\n\n*   **To run tests with a UI:**\n    ```sh\n    npm run test:ui\n    ```\n\n*   **To generate a test coverage report:**\n    ```sh\n    npm run test:coverage\n    ```\n\n*   **To build the application for production:**\n    ```sh\n    npm run build\n    ```\n    The production-ready files will be located in the `dist` directory.\n\n*   **To preview the production build locally:**\n    ```sh\n    npm run preview\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faulanchik%2Fcheckout","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faulanchik%2Fcheckout","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faulanchik%2Fcheckout/lists"}