Compare commits

...

3 Commits

Author SHA1 Message Date
Renovate Bot
3a209ba1d8 chore(deps): update dependency vite to v7.3.1 2026-01-12 08:04:55 +00:00
d560b6db6f add extra filters 2026-01-12 08:57:42 +01:00
500be84f39 fix price error 2026-01-11 22:28:53 +01:00
8 changed files with 293 additions and 103 deletions

View File

@ -29,11 +29,11 @@
"ts-proto": "^2.8.3",
"typescript": "~5.9.3",
"typescript-eslint": "^8.48.1",
"vite": "npm:rolldown-vite@7.2.5"
"vite": "npm:rolldown-vite@7.3.1"
},
"pnpm": {
"overrides": {
"vite": "npm:rolldown-vite@7.2.5"
"vite": "npm:rolldown-vite@7.3.1"
}
}
}

167
frontend/pnpm-lock.yaml generated
View File

@ -5,7 +5,7 @@ settings:
excludeLinksFromLockfile: false
overrides:
vite: npm:rolldown-vite@7.2.5
vite: npm:rolldown-vite@7.3.1
importers:
@ -38,7 +38,7 @@ importers:
version: 19.2.3(@types/react@19.2.7)
'@vitejs/plugin-react':
specifier: ^5.1.2
version: 5.1.2(rolldown-vite@7.2.5(@types/node@24.10.1))
version: 5.1.2(rolldown-vite@7.3.1(@types/node@24.10.1))
eslint:
specifier: ^9.39.1
version: 9.39.1
@ -61,8 +61,8 @@ importers:
specifier: ^8.48.1
version: 8.48.1(eslint@9.39.1)(typescript@5.9.3)
vite:
specifier: npm:rolldown-vite@7.2.5
version: rolldown-vite@7.2.5(@types/node@24.10.1)
specifier: npm:rolldown-vite@7.3.1
version: rolldown-vite@7.3.1(@types/node@24.10.1)
packages:
@ -234,99 +234,90 @@ packages:
'@napi-rs/wasm-runtime@1.1.0':
resolution: {integrity: sha512-Fq6DJW+Bb5jaWE69/qOE0D1TUN9+6uWhCeZpdnSBk14pjLcCWR7Q8n49PTSPHazM37JqrsdpEthXy2xn6jWWiA==}
'@oxc-project/runtime@0.97.0':
resolution: {integrity: sha512-yH0zw7z+jEws4dZ4IUKoix5Lh3yhqIJWF9Dc8PWvhpo7U7O+lJrv7ZZL4BeRO0la8LBQFwcCewtLBnVV7hPe/w==}
'@oxc-project/runtime@0.101.0':
resolution: {integrity: sha512-t3qpfVZIqSiLQ5Kqt/MC4Ge/WCOGrrcagAdzTcDaggupjiGxUx4nJF2v6wUCXWSzWHn5Ns7XLv13fCJEwCOERQ==}
engines: {node: ^20.19.0 || >=22.12.0}
'@oxc-project/types@0.97.0':
resolution: {integrity: sha512-lxmZK4xFrdvU0yZiDwgVQTCvh2gHWBJCBk5ALsrtsBWhs0uDIi+FTOnXRQeQfs304imdvTdaakT/lqwQ8hkOXQ==}
'@oxc-project/types@0.101.0':
resolution: {integrity: sha512-nuFhqlUzJX+gVIPPfuE6xurd4lST3mdcWOhyK/rZO0B9XWMKm79SuszIQEnSMmmDhq1DC8WWVYGVd+6F93o1gQ==}
'@rolldown/binding-android-arm64@1.0.0-beta.50':
resolution: {integrity: sha512-XlEkrOIHLyGT3avOgzfTFSjG+f+dZMw+/qd+Y3HLN86wlndrB/gSimrJCk4gOhr1XtRtEKfszpadI3Md4Z4/Ag==}
'@rolldown/binding-android-arm64@1.0.0-beta.53':
resolution: {integrity: sha512-Ok9V8o7o6YfSdTTYA/uHH30r3YtOxLD6G3wih/U9DO0ucBBFq8WPt/DslU53OgfteLRHITZny9N/qCUxMf9kjQ==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm64]
os: [android]
'@rolldown/binding-darwin-arm64@1.0.0-beta.50':
resolution: {integrity: sha512-+JRqKJhoFlt5r9q+DecAGPLZ5PxeLva+wCMtAuoFMWPoZzgcYrr599KQ+Ix0jwll4B4HGP43avu9My8KtSOR+w==}
'@rolldown/binding-darwin-arm64@1.0.0-beta.53':
resolution: {integrity: sha512-yIsKqMz0CtRnVa6x3Pa+mzTihr4Ty+Z6HfPbZ7RVbk1Uxnco4+CUn7Qbm/5SBol1JD/7nvY8rphAgyAi7Lj6Vg==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm64]
os: [darwin]
'@rolldown/binding-darwin-x64@1.0.0-beta.50':
resolution: {integrity: sha512-fFXDjXnuX7/gQZQm/1FoivVtRcyAzdjSik7Eo+9iwPQ9EgtA5/nB2+jmbzaKtMGG3q+BnZbdKHCtOacmNrkIDA==}
'@rolldown/binding-darwin-x64@1.0.0-beta.53':
resolution: {integrity: sha512-GTXe+mxsCGUnJOFMhfGWmefP7Q9TpYUseHvhAhr21nCTgdS8jPsvirb0tJwM3lN0/u/cg7bpFNa16fQrjKrCjQ==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [x64]
os: [darwin]
'@rolldown/binding-freebsd-x64@1.0.0-beta.50':
resolution: {integrity: sha512-F1b6vARy49tjmT/hbloplzgJS7GIvwWZqt+tAHEstCh0JIh9sa8FAMVqEmYxDviqKBaAI8iVvUREm/Kh/PD26Q==}
'@rolldown/binding-freebsd-x64@1.0.0-beta.53':
resolution: {integrity: sha512-9Tmp7bBvKqyDkMcL4e089pH3RsjD3SUungjmqWtyhNOxoQMh0fSmINTyYV8KXtE+JkxYMPWvnEt+/mfpVCkk8w==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [x64]
os: [freebsd]
'@rolldown/binding-linux-arm-gnueabihf@1.0.0-beta.50':
resolution: {integrity: sha512-U6cR76N8T8M6lHj7EZrQ3xunLPxSvYYxA8vJsBKZiFZkT8YV4kjgCO3KwMJL0NOjQCPGKyiXO07U+KmJzdPGRw==}
'@rolldown/binding-linux-arm-gnueabihf@1.0.0-beta.53':
resolution: {integrity: sha512-a1y5fiB0iovuzdbjUxa7+Zcvgv+mTmlGGC4XydVIsyl48eoxgaYkA3l9079hyTyhECsPq+mbr0gVQsFU11OJAQ==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm]
os: [linux]
'@rolldown/binding-linux-arm64-gnu@1.0.0-beta.50':
resolution: {integrity: sha512-ONgyjofCrrE3bnh5GZb8EINSFyR/hmwTzZ7oVuyUB170lboza1VMCnb8jgE6MsyyRgHYmN8Lb59i3NKGrxrYjw==}
'@rolldown/binding-linux-arm64-gnu@1.0.0-beta.53':
resolution: {integrity: sha512-bpIGX+ov9PhJYV+wHNXl9rzq4F0QvILiURn0y0oepbQx+7stmQsKA0DhPGwmhfvF856wq+gbM8L92SAa/CBcLg==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm64]
os: [linux]
'@rolldown/binding-linux-arm64-musl@1.0.0-beta.50':
resolution: {integrity: sha512-L0zRdH2oDPkmB+wvuTl+dJbXCsx62SkqcEqdM+79LOcB+PxbAxxjzHU14BuZIQdXcAVDzfpMfaHWzZuwhhBTcw==}
'@rolldown/binding-linux-arm64-musl@1.0.0-beta.53':
resolution: {integrity: sha512-bGe5EBB8FVjHBR1mOLOPEFg1Lp3//7geqWkU5NIhxe+yH0W8FVrQ6WRYOap4SUTKdklD/dC4qPLREkMMQ855FA==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm64]
os: [linux]
'@rolldown/binding-linux-x64-gnu@1.0.0-beta.50':
resolution: {integrity: sha512-gyoI8o/TGpQd3OzkJnh1M2kxy1Bisg8qJ5Gci0sXm9yLFzEXIFdtc4EAzepxGvrT2ri99ar5rdsmNG0zP0SbIg==}
'@rolldown/binding-linux-x64-gnu@1.0.0-beta.53':
resolution: {integrity: sha512-qL+63WKVQs1CMvFedlPt0U9PiEKJOAL/bsHMKUDS6Vp2Q+YAv/QLPu8rcvkfIMvQ0FPU2WL0aX4eWwF6e/GAnA==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [x64]
os: [linux]
'@rolldown/binding-linux-x64-musl@1.0.0-beta.50':
resolution: {integrity: sha512-zti8A7M+xFDpKlghpcCAzyOi+e5nfUl3QhU023ce5NCgUxRG5zGP2GR9LTydQ1rnIPwZUVBWd4o7NjZDaQxaXA==}
'@rolldown/binding-linux-x64-musl@1.0.0-beta.53':
resolution: {integrity: sha512-VGl9JIGjoJh3H8Mb+7xnVqODajBmrdOOb9lxWXdcmxyI+zjB2sux69br0hZJDTyLJfvBoYm439zPACYbCjGRmw==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [x64]
os: [linux]
'@rolldown/binding-openharmony-arm64@1.0.0-beta.50':
resolution: {integrity: sha512-eZUssog7qljrrRU9Mi0eqYEPm3Ch0UwB+qlWPMKSUXHNqhm3TvDZarJQdTevGEfu3EHAXJvBIe0YFYr0TPVaMA==}
'@rolldown/binding-openharmony-arm64@1.0.0-beta.53':
resolution: {integrity: sha512-B4iIserJXuSnNzA5xBLFUIjTfhNy7d9sq4FUMQY3GhQWGVhS2RWWzzDnkSU6MUt7/aHUrep0CdQfXUJI9D3W7A==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm64]
os: [openharmony]
'@rolldown/binding-wasm32-wasi@1.0.0-beta.50':
resolution: {integrity: sha512-nmCN0nIdeUnmgeDXiQ+2HU6FT162o+rxnF7WMkBm4M5Ds8qTU7Dzv2Wrf22bo4ftnlrb2hKK6FSwAJSAe2FWLg==}
'@rolldown/binding-wasm32-wasi@1.0.0-beta.53':
resolution: {integrity: sha512-BUjAEgpABEJXilGq/BPh7jeU3WAJ5o15c1ZEgHaDWSz3LB881LQZnbNJHmUiM4d1JQWMYYyR1Y490IBHi2FPJg==}
engines: {node: '>=14.0.0'}
cpu: [wasm32]
'@rolldown/binding-win32-arm64-msvc@1.0.0-beta.50':
resolution: {integrity: sha512-7kcNLi7Ua59JTTLvbe1dYb028QEPaJPJQHqkmSZ5q3tJueUeb6yjRtx8mw4uIqgWZcnQHAR3PrLN4XRJxvgIkA==}
'@rolldown/binding-win32-arm64-msvc@1.0.0-beta.53':
resolution: {integrity: sha512-s27uU7tpCWSjHBnxyVXHt3rMrQdJq5MHNv3BzsewCIroIw3DJFjMH1dzCPPMUFxnh1r52Nf9IJ/eWp6LDoyGcw==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [arm64]
os: [win32]
'@rolldown/binding-win32-ia32-msvc@1.0.0-beta.50':
resolution: {integrity: sha512-lL70VTNvSCdSZkDPPVMwWn/M2yQiYvSoXw9hTLgdIWdUfC3g72UaruezusR6ceRuwHCY1Ayu2LtKqXkBO5LIwg==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [ia32]
os: [win32]
'@rolldown/binding-win32-x64-msvc@1.0.0-beta.50':
resolution: {integrity: sha512-4qU4x5DXWB4JPjyTne/wBNPqkbQU8J45bl21geERBKtEittleonioACBL1R0PsBu0Aq21SwMK5a9zdBkWSlQtQ==}
'@rolldown/binding-win32-x64-msvc@1.0.0-beta.53':
resolution: {integrity: sha512-cjWL/USPJ1g0en2htb4ssMjIycc36RvdQAx1WlXnS6DpULswiUTVXPDesTifSKYSyvx24E0YqQkEm0K/M2Z/AA==}
engines: {node: ^20.19.0 || >=22.12.0}
cpu: [x64]
os: [win32]
'@rolldown/pluginutils@1.0.0-beta.50':
resolution: {integrity: sha512-5e76wQiQVeL1ICOZVUg4LSOVYg9jyhGCin+icYozhsUzM+fHE7kddi1bdiE0jwVqTfkjba3jUFbEkoC9WkdvyA==}
'@rolldown/pluginutils@1.0.0-beta.53':
resolution: {integrity: sha512-vENRlFU4YbrwVqNDZ7fLvy+JR1CRkyr01jhSiDpE1u6py3OMzQfztQU2jxykW3ALNxO4kSlqIDeYyD0Y9RcQeQ==}
@ -425,7 +416,7 @@ packages:
resolution: {integrity: sha512-EcA07pHJouywpzsoTUqNh5NwGayl2PPVEJKUSinGGSxFGYn+shYbqMGBg6FXDqgXum9Ou/ecb+411ssw8HImJQ==}
engines: {node: ^20.19.0 || >=22.12.0}
peerDependencies:
vite: ^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0
vite: npm:rolldown-vite@7.3.1
acorn-jsx@5.3.2:
resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
@ -897,13 +888,13 @@ packages:
resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
engines: {node: '>=4'}
rolldown-vite@7.2.5:
resolution: {integrity: sha512-u09tdk/huMiN8xwoiBbig197jKdCamQTtOruSalOzbqGje3jdHiV0njQlAW0YvzoahkirFePNQ4RYlfnRQpXZA==}
rolldown-vite@7.3.1:
resolution: {integrity: sha512-LYzdNAjRHhF2yA4JUQm/QyARyi216N2rpJ0lJZb8E9FU2y5v6Vk+xq/U4XBOxMefpWixT5H3TslmAHm1rqIq2w==}
engines: {node: ^20.19.0 || >=22.12.0}
hasBin: true
peerDependencies:
'@types/node': ^20.19.0 || >=22.12.0
esbuild: ^0.25.0
esbuild: ^0.27.0
jiti: '>=1.21.0'
less: ^4.0.0
sass: ^1.70.0
@ -937,8 +928,8 @@ packages:
yaml:
optional: true
rolldown@1.0.0-beta.50:
resolution: {integrity: sha512-JFULvCNl/anKn99eKjOSEubi0lLmNqQDAjyEMME2T4CwezUDL0i6t1O9xZsu2OMehPnV2caNefWpGF+8TnzB6A==}
rolldown@1.0.0-beta.53:
resolution: {integrity: sha512-Qd9c2p0XKZdgT5AYd+KgAMggJ8ZmCs3JnS9PTMWkyUfteKlfmKtxJbWTHkVakxwXs1Ub7jrRYVeFeF7N0sQxyw==}
engines: {node: ^20.19.0 || >=22.12.0}
hasBin: true
@ -1268,56 +1259,51 @@ snapshots:
'@tybys/wasm-util': 0.10.1
optional: true
'@oxc-project/runtime@0.97.0': {}
'@oxc-project/runtime@0.101.0': {}
'@oxc-project/types@0.97.0': {}
'@oxc-project/types@0.101.0': {}
'@rolldown/binding-android-arm64@1.0.0-beta.50':
'@rolldown/binding-android-arm64@1.0.0-beta.53':
optional: true
'@rolldown/binding-darwin-arm64@1.0.0-beta.50':
'@rolldown/binding-darwin-arm64@1.0.0-beta.53':
optional: true
'@rolldown/binding-darwin-x64@1.0.0-beta.50':
'@rolldown/binding-darwin-x64@1.0.0-beta.53':
optional: true
'@rolldown/binding-freebsd-x64@1.0.0-beta.50':
'@rolldown/binding-freebsd-x64@1.0.0-beta.53':
optional: true
'@rolldown/binding-linux-arm-gnueabihf@1.0.0-beta.50':
'@rolldown/binding-linux-arm-gnueabihf@1.0.0-beta.53':
optional: true
'@rolldown/binding-linux-arm64-gnu@1.0.0-beta.50':
'@rolldown/binding-linux-arm64-gnu@1.0.0-beta.53':
optional: true
'@rolldown/binding-linux-arm64-musl@1.0.0-beta.50':
'@rolldown/binding-linux-arm64-musl@1.0.0-beta.53':
optional: true
'@rolldown/binding-linux-x64-gnu@1.0.0-beta.50':
'@rolldown/binding-linux-x64-gnu@1.0.0-beta.53':
optional: true
'@rolldown/binding-linux-x64-musl@1.0.0-beta.50':
'@rolldown/binding-linux-x64-musl@1.0.0-beta.53':
optional: true
'@rolldown/binding-openharmony-arm64@1.0.0-beta.50':
'@rolldown/binding-openharmony-arm64@1.0.0-beta.53':
optional: true
'@rolldown/binding-wasm32-wasi@1.0.0-beta.50':
'@rolldown/binding-wasm32-wasi@1.0.0-beta.53':
dependencies:
'@napi-rs/wasm-runtime': 1.1.0
optional: true
'@rolldown/binding-win32-arm64-msvc@1.0.0-beta.50':
'@rolldown/binding-win32-arm64-msvc@1.0.0-beta.53':
optional: true
'@rolldown/binding-win32-ia32-msvc@1.0.0-beta.50':
'@rolldown/binding-win32-x64-msvc@1.0.0-beta.53':
optional: true
'@rolldown/binding-win32-x64-msvc@1.0.0-beta.50':
optional: true
'@rolldown/pluginutils@1.0.0-beta.50': {}
'@rolldown/pluginutils@1.0.0-beta.53': {}
'@tybys/wasm-util@0.10.1':
@ -1454,7 +1440,7 @@ snapshots:
'@typescript-eslint/types': 8.48.1
eslint-visitor-keys: 4.2.1
'@vitejs/plugin-react@5.1.2(rolldown-vite@7.2.5(@types/node@24.10.1))':
'@vitejs/plugin-react@5.1.2(rolldown-vite@7.3.1(@types/node@24.10.1))':
dependencies:
'@babel/core': 7.28.5
'@babel/plugin-transform-react-jsx-self': 7.27.1(@babel/core@7.28.5)
@ -1462,7 +1448,7 @@ snapshots:
'@rolldown/pluginutils': 1.0.0-beta.53
'@types/babel__core': 7.20.5
react-refresh: 0.18.0
vite: rolldown-vite@7.2.5(@types/node@24.10.1)
vite: rolldown-vite@7.3.1(@types/node@24.10.1)
transitivePeerDependencies:
- supports-color
@ -1870,38 +1856,37 @@ snapshots:
resolve-from@4.0.0: {}
rolldown-vite@7.2.5(@types/node@24.10.1):
rolldown-vite@7.3.1(@types/node@24.10.1):
dependencies:
'@oxc-project/runtime': 0.97.0
'@oxc-project/runtime': 0.101.0
fdir: 6.5.0(picomatch@4.0.3)
lightningcss: 1.30.2
picomatch: 4.0.3
postcss: 8.5.6
rolldown: 1.0.0-beta.50
rolldown: 1.0.0-beta.53
tinyglobby: 0.2.15
optionalDependencies:
'@types/node': 24.10.1
fsevents: 2.3.3
rolldown@1.0.0-beta.50:
rolldown@1.0.0-beta.53:
dependencies:
'@oxc-project/types': 0.97.0
'@rolldown/pluginutils': 1.0.0-beta.50
'@oxc-project/types': 0.101.0
'@rolldown/pluginutils': 1.0.0-beta.53
optionalDependencies:
'@rolldown/binding-android-arm64': 1.0.0-beta.50
'@rolldown/binding-darwin-arm64': 1.0.0-beta.50
'@rolldown/binding-darwin-x64': 1.0.0-beta.50
'@rolldown/binding-freebsd-x64': 1.0.0-beta.50
'@rolldown/binding-linux-arm-gnueabihf': 1.0.0-beta.50
'@rolldown/binding-linux-arm64-gnu': 1.0.0-beta.50
'@rolldown/binding-linux-arm64-musl': 1.0.0-beta.50
'@rolldown/binding-linux-x64-gnu': 1.0.0-beta.50
'@rolldown/binding-linux-x64-musl': 1.0.0-beta.50
'@rolldown/binding-openharmony-arm64': 1.0.0-beta.50
'@rolldown/binding-wasm32-wasi': 1.0.0-beta.50
'@rolldown/binding-win32-arm64-msvc': 1.0.0-beta.50
'@rolldown/binding-win32-ia32-msvc': 1.0.0-beta.50
'@rolldown/binding-win32-x64-msvc': 1.0.0-beta.50
'@rolldown/binding-android-arm64': 1.0.0-beta.53
'@rolldown/binding-darwin-arm64': 1.0.0-beta.53
'@rolldown/binding-darwin-x64': 1.0.0-beta.53
'@rolldown/binding-freebsd-x64': 1.0.0-beta.53
'@rolldown/binding-linux-arm-gnueabihf': 1.0.0-beta.53
'@rolldown/binding-linux-arm64-gnu': 1.0.0-beta.53
'@rolldown/binding-linux-arm64-musl': 1.0.0-beta.53
'@rolldown/binding-linux-x64-gnu': 1.0.0-beta.53
'@rolldown/binding-linux-x64-musl': 1.0.0-beta.53
'@rolldown/binding-openharmony-arm64': 1.0.0-beta.53
'@rolldown/binding-wasm32-wasi': 1.0.0-beta.53
'@rolldown/binding-win32-arm64-msvc': 1.0.0-beta.53
'@rolldown/binding-win32-x64-msvc': 1.0.0-beta.53
scheduler@0.27.0: {}

View File

@ -333,7 +333,7 @@ export function EditGame({ onShowToast }: Props) {
<input
type="number"
value={price}
onChange={(e) => setPrice(Number(e.target.value))}
onChange={(e) => setPrice(Number(e.target.value.replace(',', '.')))}
min="0"
step="0.01"
style={inputStyles}

View File

@ -11,4 +11,82 @@
.gamefilter-entry:hover {
background-color: var(--primary-bg);
}
.filter-controls {
background-color: var(--secondary-alt-bg);
border-radius: 8px;
padding: 1.5rem;
margin-bottom: 2rem;
border: 1px solid var(--border-color);
}
.filter-controls h3 {
margin: 0 0 1rem 0;
font-size: 1.1rem;
color: var(--text-color);
}
.filter-groups {
display: flex;
flex-wrap: wrap;
gap: 1.5rem;
}
.filter-group {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.filter-group label {
font-size: 0.9rem;
color: var(--text-color);
font-weight: 500;
}
.checkbox-wrapper {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
}
.checkbox-wrapper input[type="checkbox"] {
width: 18px;
height: 18px;
cursor: pointer;
accent-color: var(--accent-color);
}
.checkbox-wrapper span {
font-size: 0.9rem;
color: var(--text-color);
}
.price-input {
padding: 0.5rem;
border: 1px solid var(--border-color);
border-radius: 4px;
background-color: var(--primary-bg);
color: var(--text-color);
width: 120px;
font-size: 0.9rem;
}
.price-input:focus {
outline: none;
border-color: var(--accent-color);
}
.tooltip-icon {
display: inline-block;
margin-left: 0.3rem;
cursor: help;
font-size: 0.9rem;
opacity: 0.6;
}
.tooltip-icon:hover {
opacity: 1;
}

View File

@ -11,10 +11,16 @@ export function GameFilter() {
const [people, setPeople] = useState<Person[]>([]);
const [loading, setLoading] = useState(true);
const [selectedPeople, setSelectedPeople] = useState<Set<string>>(new Set());
const [freeGamesOnly, setFreeGamesOnly] = useState(false);
const [maxPrice, setMaxPrice] = useState<number | null>(null);
const [ownershipMode, setOwnershipMode] = useState(false);
const { filteredGames, gameToPositive } = useGameFilter(
const { filteredGames, gameToPositive, games } = useGameFilter(
people,
selectedPeople
selectedPeople,
freeGamesOnly,
maxPrice,
ownershipMode
);
useEffect(() => {
@ -57,10 +63,62 @@ export function GameFilter() {
onTogglePerson={togglePerson}
/>
<div className="filter-controls">
<h3>Additional Filters</h3>
<div className="filter-groups">
<div className="filter-group">
<label className="checkbox-wrapper">
<input
type="checkbox"
checked={freeGamesOnly}
onChange={(e) => setFreeGamesOnly(e.target.checked)}
/>
<span>Free games only</span>
</label>
</div>
<div className="filter-group">
<label htmlFor="max-price">Maximum price ($)</label>
<input
id="max-price"
type="number"
className="price-input"
min="0"
placeholder="No limit"
value={maxPrice ?? ""}
onChange={(e) => {
const value = e.target.value;
setMaxPrice(value === "" ? null : parseInt(value, 10));
}}
/>
</div>
<div className="filter-group">
<label className="checkbox-wrapper">
<input
type="checkbox"
checked={ownershipMode}
onChange={(e) => setOwnershipMode(e.target.checked)}
/>
<span>
Ownership mode
<span
className="tooltip-icon"
title="For paid games, only show if ALL selected people have marked it as wouldPlay"
>
?
</span>
</span>
</label>
</div>
</div>
</div>
<FilteredGamesList
filteredGames={filteredGames}
gameToPositive={gameToPositive}
selectedPeopleCount={selectedPeople.size}
games={games}
/>
</div>
);

View File

@ -463,7 +463,7 @@ export function GameList({ onShowToast }: Props) {
<input
type="number"
value={price}
onChange={(e) => setPrice(Number(e.target.value))}
onChange={(e) => setPrice(Number(e.target.value.replace(',', '.')))}
min="0"
step="0.01"
style={inputStyles}

View File

@ -1,17 +1,20 @@
import { Link } from "react-router-dom";
import { GameImage } from "../GameImage";
import { EmptyState } from "./EmptyState";
import { Game as GameProto } from "../../items";
interface FilteredGamesListProps {
filteredGames: string[];
gameToPositive: Map<string, Set<string>>;
selectedPeopleCount: number;
games: Map<string, GameProto>;
}
export function FilteredGamesList({
filteredGames,
gameToPositive,
selectedPeopleCount,
games,
}: FilteredGamesListProps) {
if (selectedPeopleCount === 0) {
return (
@ -31,6 +34,8 @@ export function FilteredGamesList({
{filteredGames.map((game) => {
const positiveCount = gameToPositive.get(game)?.size || 0;
const neutralCount = selectedPeopleCount - positiveCount;
const gameData = games.get(game);
const price = gameData?.price ?? 0;
return (
<Link
@ -68,6 +73,21 @@ export function FilteredGamesList({
{neutralCount > 1 ? "are" : "is"} neutral
</div>
)}
<div
className="price-badge"
style={{
fontSize: "0.85em",
marginTop: "0.5rem",
padding: "0.2rem 0.6rem",
borderRadius: "4px",
display: "inline-block",
backgroundColor: price === 0 ? "rgba(76, 175, 80, 0.2)" : "rgba(255, 152, 0, 0.2)",
color: price === 0 ? "#4caf50" : "#ff9800",
fontWeight: 600,
}}
>
${price === 0 ? "0 (Free)" : price}
</div>
</div>
<GameImage game={game} />
</Link>

View File

@ -7,7 +7,13 @@ import {
} from "../../items";
import { apiFetch } from "../api";
export function useGameFilter(people: Person[], selectedPeople: Set<string>) {
export function useGameFilter(
people: Person[],
selectedPeople: Set<string>,
freeGamesOnly: boolean,
maxPrice: number | null,
ownershipMode: boolean
) {
const [fetchedTitles, setFetchedTitles] = useState<string[]>([]);
const metaDataRef = useRef<{ [key: string]: GameProto }>({});
@ -79,20 +85,63 @@ export function useGameFilter(people: Person[], selectedPeople: Set<string>) {
.filter((title) => metaDataRef.current[title])
.map((title) => metaDataRef.current[title]);
return filterByPlayerCount(games, selectedPeople.size);
return filterGames(
games,
selectedPeople.size,
freeGamesOnly,
maxPrice,
ownershipMode,
selectedPeople,
people
);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [titlesEveryoneWouldPlay, selectedPeople.size, fetchedTitles]);
}, [
titlesEveryoneWouldPlay,
selectedPeople.size,
fetchedTitles,
freeGamesOnly,
maxPrice,
ownershipMode,
people,
selectedPeople,
]);
return { filteredGames, gameToPositive: gameToPositiveOpinion };
const gamesMap = useMemo(() => {
return new Map(Object.entries(metaDataRef.current));
}, [fetchedTitles]);
return { filteredGames, gameToPositive: gameToPositiveOpinion, games: gamesMap };
}
function filterByPlayerCount(
function filterGames(
games: GameProto[],
playerCount: number
playerCount: number,
freeGamesOnly: boolean,
maxPrice: number | null,
ownershipMode: boolean,
selectedPeople: Set<string>,
people: Person[]
): string[] {
const selectedPersons = people.filter((p) => selectedPeople.has(p.name));
return games
.filter(
(game) => game.maxPlayers >= playerCount && game.minPlayers <= playerCount
)
.filter((game) => {
if (freeGamesOnly) return game.price === 0;
if (maxPrice !== null) return game.price <= maxPrice;
return true;
})
.filter((game) => {
if (!ownershipMode) return true;
if (game.price === 0) return true;
return selectedPersons.every((person) =>
person.opinion.some(
(op) => op.title === game.title && op.wouldPlay
)
);
})
.map((game) => game.title);
}