web: refactor in order to get an actual interface
- Splits the app in pages, components and services. - Handles the routing. - Creates an API service. - Uses Pico CSS. - Validates the form. TODO: to add validation state to the form. - Updates the validation rules in the backend to be coherent on both sides. - Adds tests. Co-Authored-by: iGor milhit <igor@milhit.ch>main
parent
c728ca57ef
commit
9fcd4d87e3
8
bread.py
8
bread.py
|
|
@ -29,19 +29,19 @@ class BreadRecipe(BaseModel):
|
|||
All percentages follow baker's percentage (relative to total flour weight).
|
||||
"""
|
||||
# What the user provides
|
||||
total_flour: float = Field(gt=0, description="Total flour weight in grams")
|
||||
total_flour: float = Field(gt=1, description="Total flour weight in grams")
|
||||
hydration: float = Field(
|
||||
ge=50, le=100, description="Total hydration % (water/flour)"
|
||||
)
|
||||
sourdough_percentage: float = Field(
|
||||
ge=0,
|
||||
le=50,
|
||||
ge=10,
|
||||
le=100,
|
||||
description="Sourdough as % of total flour weight"
|
||||
)
|
||||
sourdough_ratio: SourdoughRatio = Field(
|
||||
description="Flour:water ratio in starter"
|
||||
)
|
||||
salt: float = Field(ge=0, le=5, description="Salt as % of total flour")
|
||||
salt: float = Field(ge=0, le=2, description="Salt as % of total flour")
|
||||
|
||||
# What Pydantic calculates automatically
|
||||
@computed_field
|
||||
|
|
|
|||
|
|
@ -108,15 +108,3 @@ class TestBreadRecipe:
|
|||
)
|
||||
assert recipe.salt_weight == 10.0
|
||||
|
||||
def test_no_sourdough_recipe(self):
|
||||
"""Test recipe without sourdough (0%)."""
|
||||
recipe = BreadRecipe(
|
||||
total_flour=500,
|
||||
hydration=70,
|
||||
sourdough_percentage=0,
|
||||
sourdough_ratio=SourdoughRatio(flour_parts=1, water_parts=1),
|
||||
salt=2
|
||||
)
|
||||
assert recipe.sourdough_weight == 0.0
|
||||
assert recipe.flour_to_add == 500.0
|
||||
assert recipe.water_to_add == 350.0
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
# web/.env.development
|
||||
VITE_API_URL=http://localhost:8000
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
# API URL (required)
|
||||
VITE_API_URL=http://localhost:8000
|
||||
|
|
@ -24,3 +24,13 @@ dist-ssr
|
|||
*.sw?
|
||||
|
||||
.vite
|
||||
|
||||
.env
|
||||
.env.local
|
||||
.env*.local
|
||||
!.env.example
|
||||
!.env.template
|
||||
!env.development
|
||||
!env.production
|
||||
|
||||
coverage
|
||||
|
|
|
|||
|
|
@ -13,16 +13,22 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.39.1",
|
||||
"@picocss/pico": "^2.1.1",
|
||||
"@testing-library/jest-dom": "^6.9.1",
|
||||
"@testing-library/react": "^16.3.1",
|
||||
"@testing-library/user-event": "^14.6.1",
|
||||
"@types/react": "^19.2.5",
|
||||
"@types/react-dom": "^19.2.3",
|
||||
"@vitejs/plugin-react": "^5.1.1",
|
||||
"@vitest/coverage-v8": "^4.0.16",
|
||||
"@vitest/ui": "^4.0.16",
|
||||
"eslint": "^9.39.1",
|
||||
"eslint-plugin-react-hooks": "^7.0.1",
|
||||
"eslint-plugin-react-refresh": "^0.4.24",
|
||||
"globals": "^16.5.0",
|
||||
"jsdom": "^27.4.0",
|
||||
"react-router-dom": "^7.12.0",
|
||||
"sass": "^1.97.2",
|
||||
"vite": "^7.2.4",
|
||||
"vitest": "^4.0.16"
|
||||
}
|
||||
|
|
@ -389,6 +395,16 @@
|
|||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@bcoe/v8-coverage": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-1.0.2.tgz",
|
||||
"integrity": "sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/@csstools/color-helpers": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.1.0.tgz",
|
||||
|
|
@ -1245,6 +1261,330 @@
|
|||
"@jridgewell/sourcemap-codec": "^1.4.14"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.1.tgz",
|
||||
"integrity": "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"detect-libc": "^1.0.3",
|
||||
"is-glob": "^4.0.3",
|
||||
"micromatch": "^4.0.5",
|
||||
"node-addon-api": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@parcel/watcher-android-arm64": "2.5.1",
|
||||
"@parcel/watcher-darwin-arm64": "2.5.1",
|
||||
"@parcel/watcher-darwin-x64": "2.5.1",
|
||||
"@parcel/watcher-freebsd-x64": "2.5.1",
|
||||
"@parcel/watcher-linux-arm-glibc": "2.5.1",
|
||||
"@parcel/watcher-linux-arm-musl": "2.5.1",
|
||||
"@parcel/watcher-linux-arm64-glibc": "2.5.1",
|
||||
"@parcel/watcher-linux-arm64-musl": "2.5.1",
|
||||
"@parcel/watcher-linux-x64-glibc": "2.5.1",
|
||||
"@parcel/watcher-linux-x64-musl": "2.5.1",
|
||||
"@parcel/watcher-win32-arm64": "2.5.1",
|
||||
"@parcel/watcher-win32-ia32": "2.5.1",
|
||||
"@parcel/watcher-win32-x64": "2.5.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-android-arm64": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.1.tgz",
|
||||
"integrity": "sha512-KF8+j9nNbUN8vzOFDpRMsaKBHZ/mcjEjMToVMJOhTozkDonQFFrRcfdLWn6yWKCmJKmdVxSgHiYvTCef4/qcBA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"android"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-darwin-arm64": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.1.tgz",
|
||||
"integrity": "sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-darwin-x64": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.1.tgz",
|
||||
"integrity": "sha512-1ZXDthrnNmwv10A0/3AJNZ9JGlzrF82i3gNQcWOzd7nJ8aj+ILyW1MTxVk35Db0u91oD5Nlk9MBiujMlwmeXZg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-freebsd-x64": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.1.tgz",
|
||||
"integrity": "sha512-SI4eljM7Flp9yPuKi8W0ird8TI/JK6CSxju3NojVI6BjHsTyK7zxA9urjVjEKJ5MBYC+bLmMcbAWlZ+rFkLpJQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"freebsd"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm-glibc": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.1.tgz",
|
||||
"integrity": "sha512-RCdZlEyTs8geyBkkcnPWvtXLY44BCeZKmGYRtSgtwwnHR4dxfHRG3gR99XdMEdQ7KeiDdasJwwvNSF5jKtDwdA==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm-musl": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.1.tgz",
|
||||
"integrity": "sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm64-glibc": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.1.tgz",
|
||||
"integrity": "sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-arm64-musl": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.1.tgz",
|
||||
"integrity": "sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-x64-glibc": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.1.tgz",
|
||||
"integrity": "sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-linux-x64-musl": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.1.tgz",
|
||||
"integrity": "sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-arm64": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.1.tgz",
|
||||
"integrity": "sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-ia32": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.1.tgz",
|
||||
"integrity": "sha512-c2KkcVN+NJmuA7CGlaGD1qJh1cLfDnQsHjE89E60vUEMlqduHGCdCLJCID5geFVM0dOtA3ZiIO8BoEQmzQVfpQ==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@parcel/watcher-win32-x64": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.1.tgz",
|
||||
"integrity": "sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/@picocss/pico": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@picocss/pico/-/pico-2.1.1.tgz",
|
||||
"integrity": "sha512-kIDugA7Ps4U+2BHxiNHmvgPIQDWPDU4IeU6TNRdvXQM1uZX+FibqDQT2xUOnnO2yq/LUHcwnGlu1hvf4KfXnMg==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@polka/url": {
|
||||
"version": "1.0.0-next.29",
|
||||
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.29.tgz",
|
||||
"integrity": "sha512-wwQAWhWSuHaag8c4q/KN/vCoeOJYshAIvMQwD4GpSb3OiZklFfvAgmj0VCBBImRpuF/aFgIRzllXlVX93Jevww==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@rolldown/pluginutils": {
|
||||
"version": "1.0.0-beta.53",
|
||||
"resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.53.tgz",
|
||||
|
|
@ -1643,6 +1983,20 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@testing-library/user-event": {
|
||||
"version": "14.6.1",
|
||||
"resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-14.6.1.tgz",
|
||||
"integrity": "sha512-vq7fv0rnt+QTXgPxr5Hjc210p6YKq2kmdziLgnsZGgLJ9e6VAShx1pACLuRjd/AS/sr7phAR58OIIpf0LlmQNw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12",
|
||||
"npm": ">=6"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@testing-library/dom": ">=7.21.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/aria-query": {
|
||||
"version": "5.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
|
||||
|
|
@ -1770,6 +2124,38 @@
|
|||
"vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@vitest/coverage-v8": {
|
||||
"version": "4.0.16",
|
||||
"resolved": "https://registry.npmjs.org/@vitest/coverage-v8/-/coverage-v8-4.0.16.tgz",
|
||||
"integrity": "sha512-2rNdjEIsPRzsdu6/9Eq0AYAzYdpP6Bx9cje9tL3FE5XzXRQF1fNU9pe/1yE8fCrS0HD+fBtt6gLPh6LI57tX7A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@bcoe/v8-coverage": "^1.0.2",
|
||||
"@vitest/utils": "4.0.16",
|
||||
"ast-v8-to-istanbul": "^0.3.8",
|
||||
"istanbul-lib-coverage": "^3.2.2",
|
||||
"istanbul-lib-report": "^3.0.1",
|
||||
"istanbul-lib-source-maps": "^5.0.6",
|
||||
"istanbul-reports": "^3.2.0",
|
||||
"magicast": "^0.5.1",
|
||||
"obug": "^2.1.1",
|
||||
"std-env": "^3.10.0",
|
||||
"tinyrainbow": "^3.0.3"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://opencollective.com/vitest"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@vitest/browser": "4.0.16",
|
||||
"vitest": "4.0.16"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@vitest/browser": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@vitest/expect": {
|
||||
"version": "4.0.16",
|
||||
"resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-4.0.16.tgz",
|
||||
|
|
@ -1867,6 +2253,29 @@
|
|||
"url": "https://opencollective.com/vitest"
|
||||
}
|
||||
},
|
||||
"node_modules/@vitest/ui": {
|
||||
"version": "4.0.16",
|
||||
"resolved": "https://registry.npmjs.org/@vitest/ui/-/ui-4.0.16.tgz",
|
||||
"integrity": "sha512-rkoPH+RqWopVxDnCBE/ysIdfQ2A7j1eDmW8tCxxrR9nnFBa9jKf86VgsSAzxBd1x+ny0GC4JgiD3SNfRHv3pOg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vitest/utils": "4.0.16",
|
||||
"fflate": "^0.8.2",
|
||||
"flatted": "^3.3.3",
|
||||
"pathe": "^2.0.3",
|
||||
"sirv": "^3.0.2",
|
||||
"tinyglobby": "^0.2.15",
|
||||
"tinyrainbow": "^3.0.3"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://opencollective.com/vitest"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vitest": "4.0.16"
|
||||
}
|
||||
},
|
||||
"node_modules/@vitest/utils": {
|
||||
"version": "4.0.16",
|
||||
"resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-4.0.16.tgz",
|
||||
|
|
@ -1985,6 +2394,25 @@
|
|||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/ast-v8-to-istanbul": {
|
||||
"version": "0.3.10",
|
||||
"resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-0.3.10.tgz",
|
||||
"integrity": "sha512-p4K7vMz2ZSk3wN8l5o3y2bJAoZXT3VuJI5OLTATY/01CYWumWvwkUw0SqDBnNq6IiTO3qDa1eSQDibAV8g7XOQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@jridgewell/trace-mapping": "^0.3.31",
|
||||
"estree-walker": "^3.0.3",
|
||||
"js-tokens": "^9.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/ast-v8-to-istanbul/node_modules/js-tokens": {
|
||||
"version": "9.0.1",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-9.0.1.tgz",
|
||||
"integrity": "sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/balanced-match": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
|
||||
|
|
@ -2023,6 +2451,20 @@
|
|||
"concat-map": "0.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/braces": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
|
||||
"integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"fill-range": "^7.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/browserslist": {
|
||||
"version": "4.28.1",
|
||||
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.1.tgz",
|
||||
|
|
@ -2116,6 +2558,22 @@
|
|||
"url": "https://github.com/chalk/chalk?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/chokidar": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
|
||||
"integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"readdirp": "^4.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 14.16.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://paulmillr.com/funding/"
|
||||
}
|
||||
},
|
||||
"node_modules/color-convert": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
|
||||
|
|
@ -2150,6 +2608,20 @@
|
|||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/cookie": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
|
||||
"integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/express"
|
||||
}
|
||||
},
|
||||
"node_modules/cross-spawn": {
|
||||
"version": "7.0.6",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
|
||||
|
|
@ -2264,6 +2736,20 @@
|
|||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/detect-libc": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
|
||||
"integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"bin": {
|
||||
"detect-libc": "bin/detect-libc.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=0.10"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-accessibility-api": {
|
||||
"version": "0.5.16",
|
||||
"resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
|
||||
|
|
@ -2607,6 +3093,13 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"node_modules/fflate": {
|
||||
"version": "0.8.2",
|
||||
"resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
|
||||
"integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/file-entry-cache": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
|
||||
|
|
@ -2620,6 +3113,20 @@
|
|||
"node": ">=16.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/fill-range": {
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
|
||||
"integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"to-regex-range": "^5.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/find-up": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
|
||||
|
|
@ -2749,6 +3256,13 @@
|
|||
"node": "^20.19.0 || ^22.12.0 || >=24.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/html-escaper": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
|
||||
"integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/http-proxy-agent": {
|
||||
"version": "7.0.2",
|
||||
"resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
|
||||
|
|
@ -2787,6 +3301,13 @@
|
|||
"node": ">= 4"
|
||||
}
|
||||
},
|
||||
"node_modules/immutable": {
|
||||
"version": "5.1.4",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.4.tgz",
|
||||
"integrity": "sha512-p6u1bG3YSnINT5RQmx/yRZBpenIl30kVxkTLDyHLIMk0gict704Q9n+thfDI7lTRm9vXdDYutVzXhzcThxTnXA==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/import-fresh": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
|
||||
|
|
@ -2847,6 +3368,17 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-number": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"node": ">=0.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/is-potential-custom-element-name": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
|
||||
|
|
@ -2861,6 +3393,60 @@
|
|||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/istanbul-lib-coverage": {
|
||||
"version": "3.2.2",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
|
||||
"integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/istanbul-lib-report": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
|
||||
"integrity": "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"istanbul-lib-coverage": "^3.0.0",
|
||||
"make-dir": "^4.0.0",
|
||||
"supports-color": "^7.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/istanbul-lib-source-maps": {
|
||||
"version": "5.0.6",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-5.0.6.tgz",
|
||||
"integrity": "sha512-yg2d+Em4KizZC5niWhQaIomgf5WlL4vOOjZ5xGCmF8SnPE/mDWWXgvRExdcpCgh9lLRRa1/fSYp2ymmbJ1pI+A==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"@jridgewell/trace-mapping": "^0.3.23",
|
||||
"debug": "^4.1.1",
|
||||
"istanbul-lib-coverage": "^3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/istanbul-reports": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.2.0.tgz",
|
||||
"integrity": "sha512-HGYWWS/ehqTV3xN10i23tkPkpH46MLCIMFNCaaKNavAXTF1RkqxawEPtnjnGZ6XKSInBKkiOA5BKS+aZiY3AvA==",
|
||||
"dev": true,
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"html-escaper": "^2.0.0",
|
||||
"istanbul-lib-report": "^3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
|
|
@ -3046,6 +3632,47 @@
|
|||
"@jridgewell/sourcemap-codec": "^1.5.5"
|
||||
}
|
||||
},
|
||||
"node_modules/magicast": {
|
||||
"version": "0.5.1",
|
||||
"resolved": "https://registry.npmjs.org/magicast/-/magicast-0.5.1.tgz",
|
||||
"integrity": "sha512-xrHS24IxaLrvuo613F719wvOIv9xPHFWQHuvGUBmPnCA/3MQxKI3b+r7n1jAoDHmsbC5bRhTZYR77invLAxVnw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.28.5",
|
||||
"@babel/types": "^7.28.5",
|
||||
"source-map-js": "^1.2.1"
|
||||
}
|
||||
},
|
||||
"node_modules/make-dir": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz",
|
||||
"integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"semver": "^7.5.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/make-dir/node_modules/semver": {
|
||||
"version": "7.7.3",
|
||||
"resolved": "https://registry.npmjs.org/semver/-/semver-7.7.3.tgz",
|
||||
"integrity": "sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"bin": {
|
||||
"semver": "bin/semver.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/mdn-data": {
|
||||
"version": "2.12.2",
|
||||
"resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.12.2.tgz",
|
||||
|
|
@ -3053,6 +3680,35 @@
|
|||
"dev": true,
|
||||
"license": "CC0-1.0"
|
||||
},
|
||||
"node_modules/micromatch": {
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
|
||||
"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"braces": "^3.0.3",
|
||||
"picomatch": "^2.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
}
|
||||
},
|
||||
"node_modules/micromatch/node_modules/picomatch": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
|
||||
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"engines": {
|
||||
"node": ">=8.6"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/jonschlinkert"
|
||||
}
|
||||
},
|
||||
"node_modules/min-indent": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
|
||||
|
|
@ -3076,6 +3732,16 @@
|
|||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/mrmime": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.1.tgz",
|
||||
"integrity": "sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.3",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
|
||||
|
|
@ -3109,6 +3775,14 @@
|
|||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/node-addon-api": {
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
|
||||
"integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true
|
||||
},
|
||||
"node_modules/node-releases": {
|
||||
"version": "2.0.27",
|
||||
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.27.tgz",
|
||||
|
|
@ -3368,6 +4042,60 @@
|
|||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-router": {
|
||||
"version": "7.12.0",
|
||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-7.12.0.tgz",
|
||||
"integrity": "sha512-kTPDYPFzDVGIIGNLS5VJykK0HfHLY5MF3b+xj0/tTyNYL1gF1qs7u67Z9jEhQk2sQ98SUaHxlG31g1JtF7IfVw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"cookie": "^1.0.1",
|
||||
"set-cookie-parser": "^2.6.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=20.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18",
|
||||
"react-dom": ">=18"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react-dom": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-router-dom": {
|
||||
"version": "7.12.0",
|
||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.12.0.tgz",
|
||||
"integrity": "sha512-pfO9fiBcpEfX4Tx+iTYKDtPbrSLLCbwJ5EqP+SPYQu1VYCXdy79GSj0wttR0U4cikVdlImZuEZ/9ZNCgoaxwBA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"react-router": "7.12.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=20.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18",
|
||||
"react-dom": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/readdirp": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
|
||||
"integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 14.18.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://paulmillr.com/funding/"
|
||||
}
|
||||
},
|
||||
"node_modules/redent": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
|
||||
|
|
@ -3444,6 +4172,28 @@
|
|||
"fsevents": "~2.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/sass": {
|
||||
"version": "1.97.2",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.97.2.tgz",
|
||||
"integrity": "sha512-y5LWb0IlbO4e97Zr7c3mlpabcbBtS+ieiZ9iwDooShpFKWXf62zz5pEPdwrLYm+Bxn1fnbwFGzHuCLSA9tBmrw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"chokidar": "^4.0.0",
|
||||
"immutable": "^5.0.2",
|
||||
"source-map-js": ">=0.6.2 <2.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"sass": "sass.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.0.0"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@parcel/watcher": "^2.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/saxes": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
|
||||
|
|
@ -3473,6 +4223,13 @@
|
|||
"semver": "bin/semver.js"
|
||||
}
|
||||
},
|
||||
"node_modules/set-cookie-parser": {
|
||||
"version": "2.7.2",
|
||||
"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
|
||||
"integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/shebang-command": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
|
||||
|
|
@ -3503,6 +4260,21 @@
|
|||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/sirv": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/sirv/-/sirv-3.0.2.tgz",
|
||||
"integrity": "sha512-2wcC/oGxHis/BoHkkPwldgiPSYcpZK3JU28WoMVv55yHJgcZ8rlXvuG9iZggz+sU1d4bRgIGASwyWqjxu3FM0g==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@polka/url": "^1.0.0-next.24",
|
||||
"mrmime": "^2.0.0",
|
||||
"totalist": "^3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
|
||||
|
|
@ -3637,6 +4409,30 @@
|
|||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/to-regex-range": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
|
||||
"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"dependencies": {
|
||||
"is-number": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/totalist": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.1.tgz",
|
||||
"integrity": "sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/tough-cookie": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.0.tgz",
|
||||
|
|
@ -3799,6 +4595,7 @@
|
|||
"integrity": "sha512-E4t7DJ9pESL6E3I8nFjPa4xGUd3PmiWDLsDztS2qXSJWfHtbQnwAWylaBvSNY48I3vr8PTqIZlyK8TE3V3CA4Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vitest/expect": "4.0.16",
|
||||
"@vitest/mocker": "4.0.16",
|
||||
|
|
|
|||
|
|
@ -8,7 +8,9 @@
|
|||
"build": "vite build",
|
||||
"lint": "eslint .",
|
||||
"preview": "vite preview",
|
||||
"test": "vitest"
|
||||
"test": "vitest",
|
||||
"test:ui": "vitest --ui",
|
||||
"test:coverage": "vitest --coverage"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^19.2.0",
|
||||
|
|
@ -16,16 +18,22 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.39.1",
|
||||
"@picocss/pico": "^2.1.1",
|
||||
"@testing-library/jest-dom": "^6.9.1",
|
||||
"@testing-library/react": "^16.3.1",
|
||||
"@testing-library/user-event": "^14.6.1",
|
||||
"@types/react": "^19.2.5",
|
||||
"@types/react-dom": "^19.2.3",
|
||||
"@vitejs/plugin-react": "^5.1.1",
|
||||
"@vitest/coverage-v8": "^4.0.16",
|
||||
"@vitest/ui": "^4.0.16",
|
||||
"eslint": "^9.39.1",
|
||||
"eslint-plugin-react-hooks": "^7.0.1",
|
||||
"eslint-plugin-react-refresh": "^0.4.24",
|
||||
"globals": "^16.5.0",
|
||||
"jsdom": "^27.4.0",
|
||||
"react-router-dom": "^7.12.0",
|
||||
"sass": "^1.97.2",
|
||||
"vite": "^7.2.4",
|
||||
"vitest": "^4.0.16"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,49 +0,0 @@
|
|||
#root {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
/* text-align: center; */
|
||||
}
|
||||
|
||||
.logo {
|
||||
height: 6em;
|
||||
padding: 1.5em;
|
||||
will-change: filter;
|
||||
transition: filter 300ms;
|
||||
}
|
||||
.logo:hover {
|
||||
filter: drop-shadow(0 0 2em #646cffaa);
|
||||
}
|
||||
.logo.react:hover {
|
||||
filter: drop-shadow(0 0 2em #61dafbaa);
|
||||
}
|
||||
|
||||
@keyframes logo-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
a:nth-of-type(2) .logo {
|
||||
animation: logo-spin infinite 20s linear;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
.read-the-docs {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
form,
|
||||
label,
|
||||
input,
|
||||
button {
|
||||
display: block;
|
||||
}
|
||||
260
web/src/App.jsx
260
web/src/App.jsx
|
|
@ -1,229 +1,39 @@
|
|||
import { useState } from "react";
|
||||
import "./App.css";
|
||||
// web/src/App.jsx
|
||||
import { createBrowserRouter, RouterProvider } from 'react-router-dom'
|
||||
import Layout from './components/Layout'
|
||||
import Home from './pages/Home'
|
||||
import About from "./pages/About";
|
||||
import Calculator from './pages/Calculator'
|
||||
import NotFound from './pages/NotFound'
|
||||
|
||||
// Define the routes
|
||||
const router = createBrowserRouter([
|
||||
{
|
||||
path: '/',
|
||||
element: <Layout />,
|
||||
children: [
|
||||
{
|
||||
index: true,
|
||||
element: <Home />,
|
||||
},
|
||||
{
|
||||
path: 'about',
|
||||
element: <About />,
|
||||
},
|
||||
{
|
||||
path: 'calculator',
|
||||
element: <Calculator />,
|
||||
},
|
||||
{
|
||||
path: '*',
|
||||
element: <NotFound />,
|
||||
},
|
||||
],
|
||||
},
|
||||
])
|
||||
|
||||
function App() {
|
||||
const [formData, setFormData] = useState({
|
||||
total_flour: "",
|
||||
hydration: "",
|
||||
sourdough_percentage: "",
|
||||
sourdough_flour_parts: "1",
|
||||
sourdough_water_parts: "1",
|
||||
salt: "",
|
||||
});
|
||||
|
||||
const [result, setResult] = useState(null);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState(null);
|
||||
|
||||
const handleChange = (e) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData((prev) => ({
|
||||
...prev,
|
||||
[name]: value,
|
||||
}));
|
||||
};
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
|
||||
try {
|
||||
// Transform form data to API format
|
||||
const apiData = {
|
||||
total_flour: parseFloat(formData.total_flour),
|
||||
hydration: parseFloat(formData.hydration),
|
||||
sourdough_percentage: parseFloat(formData.sourdough_percentage),
|
||||
sourdough_ratio: {
|
||||
flour_parts: parseFloat(formData.sourdough_flour_parts),
|
||||
water_parts: parseFloat(formData.sourdough_water_parts),
|
||||
},
|
||||
salt: parseFloat(formData.salt),
|
||||
};
|
||||
|
||||
const response = await fetch("http://localhost:8000/calculate", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify(apiData),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json();
|
||||
throw new Error(
|
||||
errorData.detail || `HTTP error! status: ${response.status}`
|
||||
);
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
setResult(data);
|
||||
} catch (err) {
|
||||
setError(err.message);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<h1>Bread Dough Calculator</h1>
|
||||
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="form-group">
|
||||
<label htmlFor="total_flour">Total Flour (g):</label>
|
||||
<input
|
||||
type="number"
|
||||
id="total_flour"
|
||||
name="total_flour"
|
||||
value={formData.total_flour}
|
||||
onChange={handleChange}
|
||||
min="1"
|
||||
step="1"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="hydration">Hydration (%):</label>
|
||||
<input
|
||||
type="number"
|
||||
id="hydration"
|
||||
name="hydration"
|
||||
value={formData.hydration}
|
||||
onChange={handleChange}
|
||||
min="50"
|
||||
max="100"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="sourdough_percentage">Sourdough (% of flour):</label>
|
||||
<input
|
||||
type="number"
|
||||
id="sourdough_percentage"
|
||||
name="sourdough_percentage"
|
||||
value={formData.sourdough_percentage}
|
||||
onChange={handleChange}
|
||||
min="0"
|
||||
max="50"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<fieldset className="ratio-fieldset">
|
||||
<legend>Sourdough Ratio (Flour:Water)</legend>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="sourdough_flour_parts">Flour parts:</label>
|
||||
<input
|
||||
type="number"
|
||||
id="sourdough_flour_parts"
|
||||
name="sourdough_flour_parts"
|
||||
value={formData.sourdough_flour_parts}
|
||||
onChange={handleChange}
|
||||
min="0.1"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="sourdough_water_parts">Water parts:</label>
|
||||
<input
|
||||
type="number"
|
||||
id="sourdough_water_parts"
|
||||
name="sourdough_water_parts"
|
||||
value={formData.sourdough_water_parts}
|
||||
onChange={handleChange}
|
||||
min="0.1"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="salt">Salt (% of flour):</label>
|
||||
<input
|
||||
type="number"
|
||||
id="salt"
|
||||
name="salt"
|
||||
value={formData.salt}
|
||||
onChange={handleChange}
|
||||
min="0"
|
||||
max="5"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button type="submit" disabled={loading}>
|
||||
{loading ? "Calculating..." : "Calculate"}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{error && (
|
||||
<div className="error">
|
||||
<h2>Error</h2>
|
||||
<p>{error}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{result && (
|
||||
<div className="results">
|
||||
<h2>Ingredients to Add</h2>
|
||||
<div className="result-grid">
|
||||
<div className="result-item">
|
||||
<span className="label">Flour:</span>
|
||||
<span className="value">{result.ingredients_to_add.flour}g</span>
|
||||
</div>
|
||||
<div className="result-item">
|
||||
<span className="label">Water:</span>
|
||||
<span className="value">{result.ingredients_to_add.water}g</span>
|
||||
</div>
|
||||
<div className="result-item">
|
||||
<span className="label">Sourdough:</span>
|
||||
<span className="value">
|
||||
{result.ingredients_to_add.sourdough}g
|
||||
</span>
|
||||
</div>
|
||||
<div className="result-item">
|
||||
<span className="label">Salt:</span>
|
||||
<span className="value">{result.ingredients_to_add.salt}g</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Recipe Details</h3>
|
||||
<div className="result-grid">
|
||||
<div className="result-item">
|
||||
<span className="label">Total flour:</span>
|
||||
<span className="value">{result.details.total_flour}g</span>
|
||||
</div>
|
||||
<div className="result-item">
|
||||
<span className="label">Total water:</span>
|
||||
<span className="value">{result.details.total_water}g</span>
|
||||
</div>
|
||||
<div className="result-item">
|
||||
<span className="label">Flour in sourdough:</span>
|
||||
<span className="value">
|
||||
{result.details.flour_in_sourdough}g
|
||||
</span>
|
||||
</div>
|
||||
<div className="result-item">
|
||||
<span className="label">Water in sourdough:</span>
|
||||
<span className="value">
|
||||
{result.details.water_in_sourdough}g
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
return <RouterProvider router={router} />
|
||||
}
|
||||
|
||||
export default App;
|
||||
export default App
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
// web/src/App.test.jsx
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { render, screen } from '@testing-library/react'
|
||||
import App from './App'
|
||||
|
||||
describe('App', () => {
|
||||
it('affiche le formulaire', () => {
|
||||
render(<App />)
|
||||
expect(screen.getByLabelText(/farine/i)).toBeInTheDocument()
|
||||
expect(screen.getByRole('button', { name: /calculer/i })).toBeInTheDocument()
|
||||
})
|
||||
})
|
||||
|
|
@ -0,0 +1,139 @@
|
|||
// web/src/components/BreadForm.jsx
|
||||
|
||||
function BreadForm({ onSubmit, loading }) {
|
||||
return (
|
||||
<form onSubmit={onSubmit} data-testid="bread-form">
|
||||
<fieldset>
|
||||
<legend>Les ingrédients de base</legend>
|
||||
|
||||
<label htmlFor="total_flour">
|
||||
Farine totale (en grammes)
|
||||
<input
|
||||
type="number"
|
||||
id="total_flour"
|
||||
name="total_flour"
|
||||
defaultValue="500"
|
||||
min="1"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
<small>
|
||||
Indique la quantité totale de farine que tu veux dans ton pâton,
|
||||
en grammes. 500 (g) est la valeur par défaut.
|
||||
</small>
|
||||
</label>
|
||||
|
||||
<label htmlFor="hydration">
|
||||
Hydratation (en % de la farine)
|
||||
<input
|
||||
type="number"
|
||||
id="hydration"
|
||||
name="hydration"
|
||||
defaultValue="60"
|
||||
min="50"
|
||||
max="100"
|
||||
step="1"
|
||||
required
|
||||
/>
|
||||
<small>
|
||||
Indique le pourcentage d'eau par rapport à
|
||||
la farine. La valeur par défaut est de 60 %, ce qui revient
|
||||
600 g pour 1 kg de farine, ou 300 g pour 500 g.
|
||||
</small>
|
||||
</label>
|
||||
|
||||
<label htmlFor="salt">
|
||||
Sel (en % de la farine)
|
||||
<input
|
||||
type="number"
|
||||
id="salt"
|
||||
name="salt"
|
||||
defaultValue="1.6"
|
||||
min="0"
|
||||
max="2"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
<small>
|
||||
Indique la quantité de sel en pourcent de la farine. La valeur par
|
||||
défaut est 1.6 %, ce qui revient à 16 g de sel pour
|
||||
1 kg de farine, ou 8 g pour 500 g.
|
||||
</small>
|
||||
</label>
|
||||
</fieldset>
|
||||
|
||||
<fieldset>
|
||||
<legend>Le levain</legend>
|
||||
|
||||
<label htmlFor="sourdough_percentage">
|
||||
Levain (en % de la farine)
|
||||
<input
|
||||
type="number"
|
||||
id="sourdough_percentage"
|
||||
name="sourdough_percentage"
|
||||
defaultValue="20"
|
||||
min="10"
|
||||
max="100"
|
||||
step="1"
|
||||
required
|
||||
/>
|
||||
<small>
|
||||
Indique la quantité de levain en pourcent de la farine. La valeur
|
||||
par défaut est de 20 %, ce qui revient à 200 g pour
|
||||
1 kg de farine, ou 100 g pour 500 g.
|
||||
</small>
|
||||
</label>
|
||||
|
||||
<p>
|
||||
Pour calculer les quantités à ajouter au pâton pour respecter
|
||||
le taux d'hydratation voulu, il faut connaître les proportions de
|
||||
farine et d'eau du levain. C'est le rôle des champs suivant :
|
||||
</p>
|
||||
|
||||
<label htmlFor="sourdough_flour_parts">
|
||||
Ratio farine
|
||||
<input
|
||||
type="number"
|
||||
id="sourdough_flour_parts"
|
||||
name="sourdough_flour_parts"
|
||||
defaultValue="1"
|
||||
min="0.1"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
<small>
|
||||
Indique une valeur par exemple de 1 ou de 100 qui servira de base
|
||||
à la comparaison avec la proportion d'eau (champ suivant). La
|
||||
valeur par défaut est de 1.
|
||||
</small>
|
||||
</label>
|
||||
|
||||
<label htmlFor="sourdough_water_parts">
|
||||
Ratio eau
|
||||
<input
|
||||
type="number"
|
||||
id="sourdough_water_parts"
|
||||
name="sourdough_water_parts"
|
||||
defaultValue="1"
|
||||
min="0.1"
|
||||
step="0.1"
|
||||
required
|
||||
/>
|
||||
<small>
|
||||
Indique la proportion d'eau du levain, par rapport à la quantité
|
||||
de farine. Un ratio de <code>1:1</code> signifie qu'il y a autant
|
||||
d'eau que de farine dans le levain. C'est la même chose qu'un ratio
|
||||
de <code>100:100</code>. C'est le cas où lors d'un rafraîchi, tu
|
||||
ajoutes autant de farine que d'eau.
|
||||
</small>
|
||||
</label>
|
||||
</fieldset>
|
||||
|
||||
<button type="submit" disabled={loading} aria-busy={loading}>
|
||||
{loading ? "Calcul en cours..." : "Calculer"}
|
||||
</button>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
export default BreadForm;
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
// web/src/components/BreadResult.jsx
|
||||
|
||||
function BreadResult({ result }) {
|
||||
if (!result) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<article>
|
||||
<header>
|
||||
<strong>✅ Ingrédients à ajouter</strong>
|
||||
</header>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">Farine</th>
|
||||
<td>{result.ingredients_to_add.flour} g</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Eau</th>
|
||||
<td>{result.ingredients_to_add.water} g</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Levain</th>
|
||||
<td>{result.ingredients_to_add.sourdough} g</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Sel</th>
|
||||
<td>{result.ingredients_to_add.salt} g</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<details>
|
||||
<summary>Détails de la recette</summary>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">Farine totale</th>
|
||||
<td>{result.details.total_flour} g</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Eau totale</th>
|
||||
<td>{result.details.total_water} g</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Farine dans le levain</th>
|
||||
<td>{result.details.flour_in_sourdough} g</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Eau dans le levain</th>
|
||||
<td>{result.details.water_in_sourdough} g</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</details>
|
||||
</article>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default BreadResult;
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
// web/src/components/ErrorMessage.jsx
|
||||
|
||||
function ErrorMessage({ error }) {
|
||||
if (!error) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<article style={{ backgroundColor: 'var(--pico-del-color)' }}>
|
||||
<header>
|
||||
<strong>❌ Erreur</strong>
|
||||
</header>
|
||||
<p>{error}</p>
|
||||
</article>
|
||||
);
|
||||
}
|
||||
|
||||
export default ErrorMessage;
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
// web/src/components/Layout.jsx
|
||||
import { Outlet } from 'react-router-dom'
|
||||
import Navigation from './Navigation'
|
||||
|
||||
function Layout() {
|
||||
return (
|
||||
<>
|
||||
<Navigation />
|
||||
<Outlet />
|
||||
|
||||
<footer className="container">
|
||||
<hr />
|
||||
<small>
|
||||
Fait avec ❤️ pour les amateurs et le amatrices de pain au levain •
|
||||
<a href="https://git.milhit.ch/igor/dough-calc"
|
||||
target="_blank" rel="noopener noreferrer"
|
||||
title="Code source sur ma forge git"
|
||||
>
|
||||
Source
|
||||
</a>
|
||||
</small>
|
||||
</footer>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Layout;
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
// web/src/components/Navigation.jsx
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
function Navigation() {
|
||||
|
||||
return (
|
||||
<nav className="container">
|
||||
<ul>
|
||||
<li>
|
||||
<Link to="/">
|
||||
<strong>Calculette à pâton</strong>
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<details className='dropdown'>
|
||||
<summary>Menu</summary>
|
||||
<ul dir='rtl'>
|
||||
<li>
|
||||
<Link to="/">Accueil</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="/about">À propos</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="/calculator">Calculette</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
);
|
||||
}
|
||||
|
||||
export default Navigation;
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
// web/src/components/__tests__/BreadForm.test.jsx
|
||||
import { render, screen } from '@testing-library/react'
|
||||
import userEvent from '@testing-library/user-event'
|
||||
import BreadForm from '../BreadForm'
|
||||
|
||||
describe('BreadForm', () => {
|
||||
it('should render all form fields', () => {
|
||||
render(<BreadForm onSubmit={vi.fn()} loading={false} />)
|
||||
|
||||
expect(screen.getByLabelText(/farine totale/i)).toBeInTheDocument()
|
||||
expect(screen.getByLabelText(/hydratation/i)).toBeInTheDocument()
|
||||
expect(screen.getByLabelText(/sel/i)).toBeInTheDocument()
|
||||
expect(screen.getByLabelText(/levain.*%/i)).toBeInTheDocument()
|
||||
expect(screen.getByLabelText(/ratio farine/i)).toBeInTheDocument()
|
||||
expect(screen.getByLabelText(/ratio eau/i)).toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should have default values', () => {
|
||||
render(<BreadForm onSubmit={vi.fn()} loading={false} />)
|
||||
|
||||
expect(screen.getByLabelText(/farine totale/i)).toHaveValue(500)
|
||||
expect(screen.getByLabelText(/hydratation/i)).toHaveValue(60)
|
||||
expect(screen.getByLabelText(/sel/i)).toHaveValue(1.6)
|
||||
expect(screen.getByLabelText(/levain.*%/i)).toHaveValue(20)
|
||||
})
|
||||
|
||||
it('should call onSubmit when form is submitted', async () => {
|
||||
const user = userEvent.setup()
|
||||
const handleSubmit = vi.fn((e) => e.preventDefault())
|
||||
|
||||
render(<BreadForm onSubmit={handleSubmit} loading={false} />)
|
||||
|
||||
const form = screen.getByTestId('bread-form')
|
||||
form.setAttribute('novalidate', '')
|
||||
|
||||
const submitButton = screen.getByRole('button', { name: /calculer/i })
|
||||
await user.click(submitButton)
|
||||
|
||||
expect(handleSubmit).toHaveBeenCalledTimes(1)
|
||||
})
|
||||
|
||||
it('should disable submit button when loading', () => {
|
||||
render(<BreadForm onSubmit={vi.fn()} loading={true} />)
|
||||
|
||||
const submitButton = screen.getByRole('button')
|
||||
expect(submitButton).toBeDisabled()
|
||||
expect(submitButton).toHaveTextContent('Calcul en cours...')
|
||||
})
|
||||
|
||||
it('should allow user to change input values', async () => {
|
||||
const user = userEvent.setup()
|
||||
render(<BreadForm onSubmit={vi.fn()} loading={false} />)
|
||||
|
||||
const flourInput = screen.getByLabelText(/farine totale/i)
|
||||
await user.clear(flourInput)
|
||||
await user.type(flourInput, '1000')
|
||||
|
||||
expect(flourInput).toHaveValue(1000)
|
||||
})
|
||||
})
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
// web/src/components/__tests__/BreadResult.test.jsx
|
||||
import { render, screen } from '@testing-library/react'
|
||||
import BreadResult from '../BreadResult'
|
||||
|
||||
describe('BreadResult', () => {
|
||||
const mockResult = {
|
||||
ingredients_to_add: {
|
||||
flour: 400,
|
||||
water: 260,
|
||||
sourdough: 100,
|
||||
salt: 10,
|
||||
},
|
||||
details: {
|
||||
total_flour: 500,
|
||||
total_water: 325,
|
||||
flour_in_sourdough: 50,
|
||||
water_in_sourdough: 50,
|
||||
},
|
||||
}
|
||||
|
||||
it('should not render when result is null', () => {
|
||||
render(<BreadResult result={null} />)
|
||||
|
||||
const article = screen.queryByRole('article')
|
||||
expect(article).not.toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should render ingredients to add', () => {
|
||||
render(<BreadResult result={mockResult} />)
|
||||
|
||||
expect(screen.getByText('✅ Ingrédients à ajouter')).toBeInTheDocument()
|
||||
expect(screen.getByText('400 g')).toBeInTheDocument()
|
||||
expect(screen.getByText('260 g')).toBeInTheDocument()
|
||||
expect(screen.getByText('100 g')).toBeInTheDocument()
|
||||
expect(screen.getByText('10 g')).toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should render details in collapsed state by default', () => {
|
||||
render(<BreadResult result={mockResult} />)
|
||||
|
||||
const details = screen.getByText('Détails de la recette')
|
||||
expect(details).toBeInTheDocument()
|
||||
|
||||
// Les détails sont dans un <details> qui est fermé par défaut
|
||||
const detailsElement = details.closest('details')
|
||||
expect(detailsElement).not.toHaveAttribute('open')
|
||||
})
|
||||
|
||||
it('should display all ingredient labels', () => {
|
||||
render(<BreadResult result={mockResult} />)
|
||||
|
||||
expect(screen.getByText('Farine')).toBeInTheDocument()
|
||||
expect(screen.getByText('Eau')).toBeInTheDocument()
|
||||
expect(screen.getByText('Levain')).toBeInTheDocument()
|
||||
expect(screen.getByText('Sel')).toBeInTheDocument()
|
||||
})
|
||||
})
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
// web/src/components/__tests__/ErrorMessage.test.jsx
|
||||
import { render, screen } from '@testing-library/react'
|
||||
import ErrorMessage from '../ErrorMessage'
|
||||
|
||||
describe('ErrorMessage', () => {
|
||||
it('should not render when error is null', () => {
|
||||
render(<ErrorMessage error={null} />)
|
||||
|
||||
const article = screen.queryByRole('article')
|
||||
expect(article).not.toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should not render when error is undefined', () => {
|
||||
render(<ErrorMessage error={undefined} />)
|
||||
|
||||
const article = screen.queryByRole('article')
|
||||
expect(article).not.toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should render error message when error is provided', () => {
|
||||
const errorMessage = 'Une erreur est survenue'
|
||||
render(<ErrorMessage error={errorMessage} />)
|
||||
|
||||
expect(screen.getByText('❌ Erreur')).toBeInTheDocument()
|
||||
expect(screen.getByText(errorMessage)).toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should have correct styling for error', () => {
|
||||
render(<ErrorMessage error="Test error" />)
|
||||
|
||||
const article = screen.getByRole('article')
|
||||
expect(article).toHaveStyle({
|
||||
backgroundColor: 'var(--pico-del-color)'
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
@ -1,10 +1,11 @@
|
|||
import { StrictMode } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import './index.css'
|
||||
// web/src/main.jsx
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App.jsx'
|
||||
import './styles/main.scss' // ✅ Import Pico + vos styles
|
||||
|
||||
createRoot(document.getElementById('root')).render(
|
||||
<StrictMode>
|
||||
ReactDOM.createRoot(document.getElementById('root')).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</StrictMode>,
|
||||
</React.StrictMode>,
|
||||
)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,62 @@
|
|||
// web/src/pages/About.jsx
|
||||
|
||||
function About() {
|
||||
return (
|
||||
<>
|
||||
<main className="container">
|
||||
<header className="container">
|
||||
<h1>À propos</h1>
|
||||
</header>
|
||||
<article>
|
||||
<header>
|
||||
<h2>⚠️ Avertissement !</h2>
|
||||
</header>
|
||||
<p>
|
||||
<strong>
|
||||
Tout seul, je ne suis pas capable de développer une
|
||||
application, même aussi simple !
|
||||
</strong> Aussi, j'utilise des modèles de langage proposés par les
|
||||
assistants de <a href="https://kagi.com">Kagi</a>. J'essaie
|
||||
d'apprendre en faisant, mais le code est en grande partie
|
||||
généré par la boîte noire. J'en porte l'entière
|
||||
responsabilité, à défaut du mérite qui revient aux femmes
|
||||
et aux hommes dont le travail a rendu cet outil possible.
|
||||
</p>
|
||||
<p>Non, ça n'excuse rien.</p>
|
||||
</article>
|
||||
<article>
|
||||
<header>
|
||||
<h2>Histoire</h2>
|
||||
</header>
|
||||
<p>
|
||||
J'avais un petit bout de code Python pour m'aider
|
||||
à faire ces calculs. Je voulais simplement le mettre à
|
||||
disposition.
|
||||
</p>
|
||||
<p>
|
||||
Par ailleurs, j'avais besoin de réaliser un petit projet pour
|
||||
évaluer la faisabilité d'utiliser certains outils pour un autre
|
||||
projet, plus conséquent.
|
||||
</p>
|
||||
<p>J'ai démarré ce projet.</p>
|
||||
</article>
|
||||
<article>
|
||||
<header>
|
||||
<h2>
|
||||
Outils
|
||||
</h2>
|
||||
</header>
|
||||
<p>
|
||||
<ul>
|
||||
<li>FastAPI.</li>
|
||||
<li>React et Vite.</li>
|
||||
<li>Pico CSS.</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</main>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default About;
|
||||
|
|
@ -0,0 +1,67 @@
|
|||
// web/src/pages/Calculator.jsx
|
||||
import { useState } from "react";
|
||||
import BreadForm from "../components/BreadForm";
|
||||
import BreadResult from "../components/BreadResult";
|
||||
import ErrorMessage from "../components/ErrorMessage";
|
||||
import { calculateBread } from "../services/api";
|
||||
|
||||
function Calculator() {
|
||||
const [result, setResult] = useState(null);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState(null);
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
|
||||
const formData = new FormData(e.target);
|
||||
|
||||
const params = {
|
||||
total_flour: parseFloat(formData.get("total_flour")),
|
||||
hydration: parseFloat(formData.get("hydration")),
|
||||
sourdough_percentage: parseFloat(formData.get("sourdough_percentage")),
|
||||
sourdough_ratio: {
|
||||
flour_parts: parseFloat(formData.get("sourdough_flour_parts")),
|
||||
water_parts: parseFloat(formData.get("sourdough_water_parts")),
|
||||
},
|
||||
salt: parseFloat(formData.get("salt")),
|
||||
};
|
||||
|
||||
try {
|
||||
const data = await calculateBread(params);
|
||||
setResult(data);
|
||||
} catch (err) {
|
||||
setError(err.message);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<main className="container">
|
||||
<header>
|
||||
<hgroup>
|
||||
<h1>Calculatrice de pain</h1>
|
||||
<p>Calculez les proportions exactes pour votre recette</p>
|
||||
</hgroup>
|
||||
</header>
|
||||
|
||||
<section className="bread-form-result">
|
||||
|
||||
<BreadForm onSubmit={handleSubmit} loading={loading} />
|
||||
|
||||
<BreadResult result={result} />
|
||||
|
||||
</section>
|
||||
<section>
|
||||
|
||||
<ErrorMessage error={error} />
|
||||
|
||||
</section>
|
||||
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
export default Calculator;
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
// web/src/pages/Home.jsx
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
function Home() {
|
||||
return (
|
||||
<>
|
||||
<header className="container">
|
||||
<hgroup>
|
||||
<h1>Une calculette pour votre pâton</h1>
|
||||
<p>
|
||||
Calculez les proportions des ingrédients pour votre
|
||||
pain au levain.
|
||||
</p>
|
||||
</hgroup>
|
||||
</header>
|
||||
|
||||
<main className="container">
|
||||
<article>
|
||||
<header>
|
||||
<hgroup>
|
||||
<h2>Pourquoi utiliser cette calculette ?</h2></hgroup>
|
||||
<h3>💦 Pour une hydratation <em>précise</em>.</h3>
|
||||
</header>
|
||||
<p>
|
||||
Tenez-vous compte de la farine et de l'eau
|
||||
contenues dans le levain que vous ajoutez à
|
||||
votre pâton ?
|
||||
</p>
|
||||
<p>Non ?</p>
|
||||
<p>
|
||||
Désormais, la calculette fait les calculs pour vous.
|
||||
</p>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<header>
|
||||
<h2>Comment ça marche ?</h2>
|
||||
</header>
|
||||
<p>Dans le <Link to="/calculator">formulaire</Link> :</p>
|
||||
<ol>
|
||||
<li>
|
||||
<strong>Indiquez la quantité de farine totale</strong> désirée
|
||||
pour votre pain.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Choisissez votre taux d'hydratation</strong> (eau
|
||||
en % de la farine totale).
|
||||
</li>
|
||||
<li>
|
||||
<strong>
|
||||
Définissez le ratio <code>farine:eau</code> de votre levain
|
||||
</strong>. Un ratio de <code>1:1</code>, signifie que votre
|
||||
levain contient autant d'eau que de farine.
|
||||
</li>
|
||||
<li>
|
||||
<strong>Ajoutez le sel</strong> (par exemple 1.6 % de
|
||||
la farine, ou 16 g / kg).
|
||||
</li>
|
||||
<li>
|
||||
<strong>🎉 Obtenez les quantités exactes</strong> à utiliser pour
|
||||
votre recette !
|
||||
</li>
|
||||
</ol>
|
||||
<footer>
|
||||
<Link to="/calculator" role="button">
|
||||
Commencer le calcul →
|
||||
</Link>
|
||||
</footer>
|
||||
</article>
|
||||
|
||||
</main>
|
||||
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default Home;
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
// web/src/pages/NotFound.jsx
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
function NotFound() {
|
||||
return (
|
||||
<main className="container">
|
||||
<article>
|
||||
<header>
|
||||
<h1>404 : page non trouvée</h1>
|
||||
</header>
|
||||
<p>
|
||||
Désolé, la page que vous recherchez n'existe pas.
|
||||
</p>
|
||||
<footer>
|
||||
<Link to="/" role="button">
|
||||
Retour à l'accueil
|
||||
</Link>
|
||||
</footer>
|
||||
</article>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
export default NotFound;
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
// web/src/services/__tests__/api.test.js
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
|
||||
import { calculateBread, healthCheck } from '../api'
|
||||
|
||||
describe('API Service', () => {
|
||||
beforeEach(() => {
|
||||
// Mock global fetch
|
||||
global.fetch = vi.fn()
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks()
|
||||
})
|
||||
|
||||
describe('calculateBread', () => {
|
||||
it('should make POST request with correct data', async () => {
|
||||
const mockResponse = {
|
||||
ingredients_to_add: {
|
||||
flour: 400,
|
||||
water: 260,
|
||||
sourdough: 100,
|
||||
salt: 10,
|
||||
},
|
||||
details: {
|
||||
total_flour: 500,
|
||||
total_water: 325,
|
||||
flour_in_sourdough: 50,
|
||||
water_in_sourdough: 50,
|
||||
},
|
||||
}
|
||||
|
||||
global.fetch.mockResolvedValueOnce({
|
||||
ok: true,
|
||||
json: async () => mockResponse,
|
||||
})
|
||||
|
||||
const params = {
|
||||
total_flour: 500,
|
||||
hydration: 65,
|
||||
sourdough_percentage: 20,
|
||||
sourdough_ratio: {
|
||||
flour_parts: 1,
|
||||
water_parts: 1,
|
||||
},
|
||||
salt: 2,
|
||||
}
|
||||
|
||||
const result = await calculateBread(params)
|
||||
|
||||
expect(global.fetch).toHaveBeenCalledWith(
|
||||
'http://localhost:8000/calculate',
|
||||
expect.objectContaining({
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(params),
|
||||
})
|
||||
)
|
||||
|
||||
expect(result).toEqual(mockResponse)
|
||||
})
|
||||
|
||||
it('should throw error when API returns error', async () => {
|
||||
global.fetch.mockResolvedValueOnce({
|
||||
ok: false,
|
||||
status: 400,
|
||||
json: async () => ({ detail: 'Invalid parameters' }),
|
||||
})
|
||||
|
||||
await expect(
|
||||
calculateBread({ total_flour: -1 })
|
||||
).rejects.toThrow('Invalid parameters')
|
||||
})
|
||||
|
||||
it('should throw network error when fetch fails', async () => {
|
||||
global.fetch.mockRejectedValueOnce(new Error('Failed to fetch'))
|
||||
|
||||
await expect(
|
||||
calculateBread({ total_flour: 500 })
|
||||
).rejects.toThrow(/Impossible de contacter le serveur/)
|
||||
})
|
||||
})
|
||||
|
||||
describe('healthCheck', () => {
|
||||
it('should make GET request to root endpoint', async () => {
|
||||
const mockResponse = { status: 'ok' }
|
||||
|
||||
global.fetch.mockResolvedValueOnce({
|
||||
ok: true,
|
||||
json: async () => mockResponse,
|
||||
})
|
||||
|
||||
const result = await healthCheck()
|
||||
|
||||
expect(global.fetch).toHaveBeenCalledWith(
|
||||
'http://localhost:8000/',
|
||||
expect.objectContaining({
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
})
|
||||
)
|
||||
|
||||
expect(result).toEqual(mockResponse)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
// web/src/services/api.js
|
||||
|
||||
const API_URL = import.meta.env.VITE_API_URL || 'http://localhost:8000';
|
||||
|
||||
/**
|
||||
* Generic API request handler
|
||||
* @param {string} endpoint - API endpoint (e.g., '/calculate')
|
||||
* @param {object} options - Fetch options
|
||||
* @returns {Promise<object>} - Response data
|
||||
* @throws {Error} - API error with message
|
||||
*/
|
||||
async function apiRequest(endpoint, options = {}) {
|
||||
const url = `${API_URL}${endpoint}`;
|
||||
|
||||
const config = {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...options.headers,
|
||||
},
|
||||
...options,
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch(url, config);
|
||||
|
||||
// Handle HTTP errors
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(
|
||||
errorData.detail ||
|
||||
errorData.message ||
|
||||
`HTTP error! status: ${response.status}`
|
||||
);
|
||||
}
|
||||
|
||||
return await response.json();
|
||||
} catch (error) {
|
||||
// Re-throw with more context if it's a network error
|
||||
if (error.message === 'Failed to fetch') {
|
||||
throw new Error(
|
||||
`Impossible de contacter le serveur. Vérifiez que l'API est démarrée sur ${API_URL}`
|
||||
);
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Calculate bread proportions
|
||||
* @param {object} params - Bread calculation parameters
|
||||
* @param {number} params.total_flour - Total flour in grams
|
||||
* @param {number} params.hydration - Hydration percentage
|
||||
* @param {number} params.sourdough_percentage - Sourdough percentage
|
||||
* @param {object} params.sourdough_ratio - Sourdough flour:water ratio
|
||||
* @param {number} params.salt - Salt percentage
|
||||
* @returns {Promise<object>} - Calculation results
|
||||
*/
|
||||
export async function calculateBread(params) {
|
||||
return apiRequest('/calculate', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(params),
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Health check endpoint
|
||||
* @returns {Promise<object>} - API status
|
||||
*/
|
||||
export async function healthCheck() {
|
||||
return apiRequest('/');
|
||||
}
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
// web/src/styles/_mixins.scss
|
||||
|
||||
@use "sass:map";
|
||||
@use "@picocss/pico/scss/pico" as pico;
|
||||
|
||||
|
||||
/// Mixin for media queries based on Pico's breakpoints
|
||||
/// @param {String} $size - breakpoint name (sm, md, lg, xl, xxl)
|
||||
/// @example
|
||||
/// @include breakpoint(md) {
|
||||
/// font-size: 1.5rem;
|
||||
/// }
|
||||
@mixin breakpoint($size) {
|
||||
$breakpoint: map.get(pico.$breakpoints, $size, "breakpoint");
|
||||
|
||||
@if $breakpoint {
|
||||
@media (min-width: $breakpoint) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
@error "Breakpoint '#{$size}' not found. Available values: sm, md, lg, xl, xxl";
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/// Mixin for media queries min-width based on Pico's breakpoints
|
||||
/// @param {String} $size - breakpoint name (sm, md, lg, xl, xxl)
|
||||
/// @example
|
||||
/// @include breakpoint-up(md) {
|
||||
/// font-size: 1.5rem;
|
||||
/// }
|
||||
@mixin breakpoint-up($size) {
|
||||
$breakpoint: map.get(pico.$breakpoints, $size, "breakpoint");
|
||||
|
||||
@if $breakpoint {
|
||||
@media (min-width: $breakpoint) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
@error "Breakpoint '#{$size}' not found. Available values: sm, md, lg, xl, xxl";
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
// web/src/styles/main.scss
|
||||
|
||||
// Import Pico CSS with default values, except for the color palette.
|
||||
@use "@picocss/pico/scss/pico" as * with (
|
||||
$theme-color: "purple",
|
||||
$semantic-root-element: "#root",
|
||||
$enable-semantic-container: true
|
||||
);
|
||||
@use "mixins" as *;
|
||||
|
||||
#root > footer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.error_message {
|
||||
background-color: var(--pico-del-color);
|
||||
}
|
||||
|
||||
.bread-form-result {
|
||||
// Rules apply on large screens and bigger
|
||||
@include breakpoint-up(lg) {
|
||||
max-width: 50dvi;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
// web/src/test/setup.js
|
||||
import '@testing-library/jest-dom'
|
||||
|
||||
|
|
@ -1,7 +1,13 @@
|
|||
// web/vite.config.js
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
// https://vite.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
test: {
|
||||
globals: true,
|
||||
environment: 'jsdom',
|
||||
setupFiles: './src/test/setup.js',
|
||||
css: true,
|
||||
},
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue