From 5e86a52d43b6143fdb951eaf5ca6abc2a07a07e6 Mon Sep 17 00:00:00 2001 From: Nathan Rashleigh Date: Sun, 6 Oct 2024 00:25:53 +1000 Subject: [PATCH] Sliders for accepting --- client/package-lock.json | 14 +++++ client/package.json | 1 + client/src/app.tsx | 9 +++- client/src/components/offer.group.tsx | 76 ++++++++++++++++++++++++++- docker-compose.yaml | 28 +++++----- 5 files changed, 111 insertions(+), 17 deletions(-) mode change 100644 => 100755 client/package-lock.json mode change 100644 => 100755 client/package.json diff --git a/client/package-lock.json b/client/package-lock.json old mode 100644 new mode 100755 index fb24194..4e6040a --- a/client/package-lock.json +++ b/client/package-lock.json @@ -22,6 +22,7 @@ }, "devDependencies": { "@babel/plugin-transform-react-jsx-source": "^7.18.6", + "@types/lodash": "^4.17.10", "@typescript-eslint/eslint-plugin": "^5.30.6", "@typescript-eslint/parser": "^5.30.6", "eslint": "^8.20.0", @@ -3009,6 +3010,13 @@ "integrity": "sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==", "dev": true }, + "node_modules/@types/lodash": { + "version": "4.17.10", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.10.tgz", + "integrity": "sha512-YpS0zzoduEhuOWjAotS6A5AVCva7X4lVlYLF0FYHAY9sdraBfnatttHItlWeZdGhuEkf+OzMNg2ZYAx8t+52uQ==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/mime": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.0.tgz", @@ -23437,6 +23445,12 @@ "integrity": "sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==", "dev": true }, + "@types/lodash": { + "version": "4.17.10", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.10.tgz", + "integrity": "sha512-YpS0zzoduEhuOWjAotS6A5AVCva7X4lVlYLF0FYHAY9sdraBfnatttHItlWeZdGhuEkf+OzMNg2ZYAx8t+52uQ==", + "dev": true + }, "@types/mime": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.0.tgz", diff --git a/client/package.json b/client/package.json old mode 100644 new mode 100755 index 3b129ca..4805beb --- a/client/package.json +++ b/client/package.json @@ -22,6 +22,7 @@ }, "devDependencies": { "@babel/plugin-transform-react-jsx-source": "^7.18.6", + "@types/lodash": "^4.17.10", "@typescript-eslint/eslint-plugin": "^5.30.6", "@typescript-eslint/parser": "^5.30.6", "eslint": "^8.20.0", diff --git a/client/src/app.tsx b/client/src/app.tsx index bb6370a..b849b8d 100644 --- a/client/src/app.tsx +++ b/client/src/app.tsx @@ -16,7 +16,14 @@ import Search from './routes/search'; import List from './routes/list'; import Info from './routes/info'; -if (window.location.host === 'matescrates.au') LogRocket.init('yh0dy3/mcrates'); +if (window.location.host === 'crates.strix.systems') LogRocket.init('yh0dy3/mcrates'); + + +// ██ ██ ███████ █████ ██████ ███████ ███████ ██████ ██████ █████ ██████ ██ ██ +// ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ +// ██ █ ██ █████ ███████ ██████ █████ ███████ ██ ██ ██████ ███████ ██ █████ +// ██ ███ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ +// ███ ███ ███████ ██ ██ ██ ██ ███████ ███████ ██████ ██████ ██ ██ ██████ ██ ██ const Mcrates = () => { diff --git a/client/src/components/offer.group.tsx b/client/src/components/offer.group.tsx index ee3f12b..3c17949 100644 --- a/client/src/components/offer.group.tsx +++ b/client/src/components/offer.group.tsx @@ -1,6 +1,7 @@ import { h } from 'preact'; import { ExternalLink, Check } from 'react-feather'; import { useState } from 'preact/hooks'; +import _ from 'lodash' import { useSelector, useDispatch } from 'react-redux' import { State } from './../store'; @@ -58,6 +59,73 @@ function OfferPriceBtn(offer) { ) } +function OfferConditionSlider([condition, offers], i, groupId, rangeMin, rangeMax) { + // const ws = useSelector((state: State) => state.ws); + // const accepted = offer.status === 'Accepted'; + // const confirmed = offer.status === 'Confirmed'; + + // function setStatus() { + // if (accepted) return ws.sendOfferStatusSet(offer.id, 'Pending') + // ws.sendOfferStatusSet(offer.id, 'Accepted'); + // } + + // const classes = `${accepted ? 'accepted' : ''} ${confirmed ? 'confirmed' : ''}`; + // const btnText = accepted + // ? offer.status + // : 'Accept'; + + // const title = accepted + // ? 'Click to cancel' + // : 'Click to accept this offer'; + + // return ( + // + // ) + + const min = _.first(offers).total + const max = _.last(offers).total + // const step = min === max ? max : "any" + const step = 'any' + const id = `${groupId}-${i}` + const markersId = `${id}-markers` + const steps = offers.map(o => o.total) + + const [acceptedPrice, setAcceptedPrice] = useState(0) + + function onChange(target) { + const highest = () => { + return _.findLast(steps, s => target.value >= Number(s)) || 0 + } + + const v = highest() + setAcceptedPrice(v) + target.value = v + } + + const acceptedPriceLabel = acceptedPrice ? `$${acceptedPrice}` : '-' + + return ( +
+
+
+ onChange((e.target as HTMLInputElement)) } /> + + + {offers.map(o => )} + +
+ ) +} + export default function OfferGroup(group, i) { const ws = useSelector((state: State) => state.ws); @@ -66,6 +134,10 @@ export default function OfferGroup(group, i) { const descriptions = group.details.formats.map(f => f.descriptions.join(' ')).join(' ') const detailText = `${format} ${descriptions}`; + const conditions = Object.entries(_.groupBy(group.offers, 'condition')) + const rangeMin = 0 + const rangeMax = _.maxBy(group.offers, 'total').total + return (
@@ -76,8 +148,8 @@ export default function OfferGroup(group, i) {
Status: {group.status}
-
- {group.offers.map(o => OfferPriceBtn(o))} +
+ {conditions.map((c, i) => OfferConditionSlider(c, i, group.details.id, rangeMin, rangeMax))}
) diff --git a/docker-compose.yaml b/docker-compose.yaml index dfa0466..532ca93 100644 --- a/docker-compose.yaml +++ b/docker-compose.yaml @@ -1,16 +1,18 @@ version: "3.3" services: - # pg: - # image: postgres:latest - # environment: - # POSTGRES_USER: '${POSTGRES_USER}' - # POSTGRES_DB: '${POSTGRES_DB}' - # POSTGRES_PASSWORD: '${POSTGRES_PASSWORD}' - # ports: - # - '45432:5432' - # volumes: - # - "./db:/var/lib/postgresql/data" + pg: + image: postgres:latest + environment: + POSTGRES_USER: '${POSTGRES_USER}' + POSTGRES_DB: '${POSTGRES_DB}' + POSTGRES_PASSWORD: '${POSTGRES_PASSWORD}' + volumes: + # so ez + # insane + - "./pg:/docker-entrypoint-initdb.d" + ports: + - '45432:5432' api: image: crates/api @@ -18,8 +20,8 @@ services: context: ./api dockerfile: ./api.Dockerfile working_dir: /opt/crates/api - # depends_on: - # - 'pg' + depends_on: + - 'pg' command: npm start environment: DATABASE_URL: 'postgresql://${POSTGRES_USER}:${POSTGRES_PASSWORD}@${POSTGRES_HOST}:5432/${POSTGRES_DB}?schema=public' @@ -29,8 +31,6 @@ services: volumes: - "./api:/opt/crates/api" - "/opt/crates/api/node_modules" - extra_hosts: - - "pg:host-gateway" migrate: restart: on-failure:3