diff --git a/TODO.md b/TODO.md index e127861..caeffef 100644 --- a/TODO.md +++ b/TODO.md @@ -1,14 +1,7 @@ # TODO -info page - minimum quality - acp page needs to fetch offers list -on logged in need to redirect to offers - -discord! - want added -> wants added spamming discogs and generating offers on every want add diff --git a/api/index.ts b/api/index.ts index 4d12a0c..0c70153 100644 --- a/api/index.ts +++ b/api/index.ts @@ -28,7 +28,7 @@ async function start() { events, } = createServices(log); - // events.emit(Events.StartupSync); + events.emit(Events.StartupSync); // events.emit(Events.ListingsUpdated); api.listen(); diff --git a/api/src/api.ts b/api/src/api.ts index d94f2ca..cebf1b4 100644 --- a/api/src/api.ts +++ b/api/src/api.ts @@ -72,7 +72,7 @@ export default function createApi(log: Log, pg: Pg, discogs, offers, events) { const user = await pg.userFindId(ctx.state.user.id); const release = await discogs.release(releaseId); const want = await pg.wantCreate(release, user); - events.emit(Events.WantAdded, want); + events.emit(Events.WantsAdded, [want]); ctx.response.body = [want]; }); @@ -81,7 +81,7 @@ export default function createApi(log: Log, pg: Pg, discogs, offers, events) { const { username } = ctx.request.body; const user = await pg.userFindId(ctx.state.user.id); const wants = await discogs.wantListSync(username, user); - wants.forEach(w => events.emit(Events.WantAdded, w)); + events.emit(Events.WantsAdded, [wants]); ctx.response.body = wants; }); diff --git a/api/src/discogs.ts b/api/src/discogs.ts index c6289ce..144ef20 100644 --- a/api/src/discogs.ts +++ b/api/src/discogs.ts @@ -84,11 +84,9 @@ export default function createDiscogs(log: Log, pg: Pg) { .get(); const unlisted = await pg.listingRmUnlisted(want, ids); - if (unlisted) log.info({ wantId: want.id, unlisted: unlisted }, 'missing listings removed'); + if (unlisted) log.info({ unlisted: unlisted, ...wantDetails(want) }, 'missing listings removed'); // preferentially take listings from sellers if we hit req limits - - log.info({ listings: ids.length, ...wantDetails(want)}, 'found listings'); return Bluebird.mapSeries(ids, async id => listing(id, want)); } diff --git a/api/src/events.ts b/api/src/events.ts index e7f356d..c06fa79 100644 --- a/api/src/events.ts +++ b/api/src/events.ts @@ -9,7 +9,7 @@ import { wantDetails } from './utils'; import routerAuth from './routers/router.auth'; export enum Events { - WantAdded = 'WantAdded', + WantsAdded = 'WantsAdded', StartupSync = 'StartupSync', ListingsUpdated = 'ListingsUpdated', Connection = 'Connection', @@ -37,26 +37,28 @@ export default function createEvents(log: Log, pg: Pg, discogs, offers) { log.error('event error', e); }); - events.on(Events.WantAdded, async function wantAdded(want: Want) { - log.info({ event: Events.WantAdded, ...wantDetails(want) }); - const listings = await populateListings(want); - log.info({ listings: listings.length, ...wantDetails(want) }, 'listings added'); - events.emit(Events.ListingsUpdated); - }); - - events.on(Events.StartupSync, async function wantAdded() { - const wants = await pg.wantsToSync(); - log.info({ event: Events.StartupSync, wants: wants.length }); - + async function updateWantListings(wants: Want[]) { for (const want of wants) { const listings = await populateListings(want); log.info({ listings: listings.length, ...wantDetails(want) }, 'listings added'); } log.info({ wants: wants.length }, 'finished syncing'); + } + + events.on(Events.WantsAdded, async function wantsAdded(wants: Want[]) { + log.info({ event: Events.WantsAdded, wants: wants.map(w => wantDetails(w)) }, 'starting listings population'); + await updateWantListings(wants); + log.info({ event: Events.WantsAdded, wants: wants.map(w => wantDetails(w)) }, 'finished populating listings'); events.emit(Events.ListingsUpdated); }); + events.on(Events.StartupSync, async function startupSync() { + const wants = await pg.wantsToSync(); + log.info({ event: Events.StartupSync, wants: wants.length }); + await updateWantListings(wants); + events.emit(Events.ListingsUpdated); + }); events.on(Events.ListingsUpdated, async function listingsUpdated() { const bundles = await offers.bundles(); diff --git a/api/src/offers.ts b/api/src/offers.ts index 77faffe..78601fc 100644 --- a/api/src/offers.ts +++ b/api/src/offers.ts @@ -9,11 +9,15 @@ import { logAxiosError, wantDetails } from './utils'; import { Pg } from './pg'; export enum Status { - Pending = 'Pending', - Accepted = 'Accepted', - Declined = 'Declined', - Confirmed = 'Confirmed', Complete = 'Complete', + Confirmed = 'Confirmed', + Accepted = 'Accepted', + Pending = 'Pending', + Declined = 'Declined', +} + +function sortOffers(o) { + return Object.values(Status).indexOf(o.status); } export default function createOffers(log: Log, pg: Pg) { @@ -130,7 +134,7 @@ export default function createOffers(log: Log, pg: Pg) { seller: offers[0]?.listing.data.seller.id, shipsFrom: offers[0]?.listing.data.ships_from, shipping, - offers, + offers: sortBy(offers, sortOffers), mentionsAustralia: shipping.toLowerCase().includes('australia'), mentionsWorldwide: shipping.toLowerCase().includes('world'), } diff --git a/client/src/components/offer.tsx b/client/src/components/offer.tsx index 9d02283..bb845e2 100644 --- a/client/src/components/offer.tsx +++ b/client/src/components/offer.tsx @@ -29,11 +29,11 @@ export default function Offer(offer) { return (
-

{details.artists_sort} - {details.title}

-
{details.year}
-
{details.formats[0].descriptions.join(' ')}
-
mcrates price: ${offer.total}
-
shipped by itself: ${offer.comparison}
+

{details.artists_sort} - {details.title}

+
{details.year}
+
{details.formats[0].descriptions.join(' ')}
+
mcrates price: ${offer.total}
+
shipped by itself: ${offer.comparison}
diff --git a/client/src/components/want.tsx b/client/src/components/want.tsx index 671132b..1adba20 100644 --- a/client/src/components/want.tsx +++ b/client/src/components/want.tsx @@ -1,5 +1,6 @@ import { h } from 'preact'; import { useState, useCallback } from 'preact/hooks'; +import { ExternalLink } from 'react-feather'; import { useSelector } from 'react-redux' import { State } from './../store' @@ -25,11 +26,13 @@ function Want(want) { return (
-

{r.artists_sort} - {r.title}

-
{r.year}
-
{r.formats[0].descriptions.join(' ')}
+

{r.artists_sort} - {r.title}

+
+
{r.year}
+
{r.formats[0].descriptions.join(' ')}
+
); diff --git a/client/src/routes/acp.tsx b/client/src/routes/acp.tsx index dcb6765..dbfc975 100644 --- a/client/src/routes/acp.tsx +++ b/client/src/routes/acp.tsx @@ -7,13 +7,15 @@ import { useSelector, useDispatch } from 'react-redux' import { State } from './../store'; enum Status { - Pending = 'Pending', Accepted = 'Accepted', + Pending = 'Pending', Declined = 'Declined', - Ordered = 'Ordered', + Confirmed = 'Confirmed', Complete = 'Complete', } +const POSITIVE_STATUS = [Status.Accepted, Status.Confirmed, Status.Complete]; + function Item({ item }) { const ws = useSelector((state: State) => state.ws); console.log(item); @@ -26,8 +28,12 @@ function Item({ item }) { ws.sendAcpOfferStatusSet(item.id, e.target.value); } + const bold = POSITIVE_STATUS.includes(item.status) + ? 'bold' + : ''; + return ( -
+

{item.listing.data.release.description}

 @@ -43,11 +49,13 @@ function Item({ item }) { } function SellerGroup(group) { + const ready = group.offers.filter(item => POSITIVE_STATUS.includes(item.status)).length; + return (

{group.username} - {group.seller}

-

{group.offers.length} offers

+

{ready} / {group.offers.length} offers

Ships: {group.mentionsAustralia && 'AU'} {group.mentionsWorldwide && 'WORLD'}

diff --git a/client/src/routes/info.tsx b/client/src/routes/info.tsx index 24ce849..14ab666 100644 --- a/client/src/routes/info.tsx +++ b/client/src/routes/info.tsx @@ -12,13 +12,15 @@ const Info = () => {
-

How It Works

+

How It Works

First, add some records to your List on the Search Page.

-

Mates Crates will then make offers to you for releases you add to your List.

+

Mates Crates will then make Offers to you for releases you add to your List.

+

Check back regularly for updated Offers, the global record marketplace is a living thing.

Offers

+

Not all items on your List will have offers. However, as new users join the site the number of offers we can make increases, so be sure to tell your friends!

Think of offers like an expression of interest, they are not confirmed until they are set to Confirmed status.

After that they will be shipped to Melbourne and ready for pick up.

@@ -32,9 +34,11 @@ const Info = () => {

FAQ

Record Condition

-

All Mates Crates offers are for records that are either mint condition or close to it.

+

All Mates Crates offers are for records that are either mint or very good condition.

Delivery Times

Records are usually available for pickup within a week. We order in bulk, which often means express, insured shipping to Melbourne.

+

Duplicates

+

Sometimes we can get a record from multiple sources, these appear as duplicate offers. Accepting multiple offers increases the chance the item will be confirmed.

Friends

Please invite other collectors to the site. More users means offers can become cheaper and shipped sooner.

diff --git a/client/src/style/index.less b/client/src/style/index.less index 3d45963..fc2efb5 100644 --- a/client/src/style/index.less +++ b/client/src/style/index.less @@ -8,7 +8,7 @@ html { box-sizing: inherit; } -body, h1, h2, h3, h4, h5, h6, p, ol, ul { +body, h4, h5, h6, p, ol, ul { margin: 0; padding: 0; font-weight: normal; @@ -100,9 +100,9 @@ html { --max-font-size: var(--large-font-size); --base-border-color: var(--secondary-font-color); - --base-border: 1px solid var(--base-border-color); - --hover-border: 1px solid var(--base-font-color); - --focus-border: 1px solid var(--base-font-color); + --base-border: 2px solid var(--base-border-color); + --hover-border: 2px solid var(--base-font-color); + --focus-border: 2px solid var(--base-font-color); --base-border-radius: .2rem; --base-focus: 2px solid var(--base-accent-color); --base-outline-offset: 0.25em; @@ -158,6 +158,35 @@ button, [type=button], [type=reset], [type=submit] { } } +h1, h2, h3, h4, h5, h6 { + margin-top:0; + line-height:var(--header-line-height); +} + +h1 { + margin-bottom:var(--base-spacing); + font-size:var(--large-font-size) +} + +h2 { + margin-bottom:var(--base-spacing); + font-size:var(--medium-font-size); +} + +h3 { + margin-bottom:calc(var(--base-spacing)/2); + font-size:var(--smedium-font-size) +} + +h4 { + margin-bottom:calc(var(--base-spacing)/3); + font-size:var(--base-font-size) +} + +p { + margin:0 0 var(--base-spacing) +} + // ok actual styles body { @@ -208,8 +237,11 @@ button, [type=submit] { article { background-color: var(--secondary-background-color); -} + button { + border-color: var(--tertiary-background-color); + } +} .search { display: grid; @@ -241,14 +273,23 @@ article { article { display: grid; + + // grid-template-rows: + // 1fr min-content min-content; + grid-template-areas: "title img" + "details details" "remove remove"; button { grid-area: remove } + .details { + grid-area: details; + } + padding: var(--base-spacing); margin: var(--base-spacing-half); } @@ -318,7 +359,6 @@ header { } .items { - // grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, 1fr); @@ -327,7 +367,11 @@ header { margin-bottom: var(--base-spacing); display: grid; - // grid-template-rows: 1fr 1fr 1fr; + + &.bold { + font-weight: bold; + background: var(--tertiary-background-color); + } } } } @@ -339,6 +383,7 @@ header { .offer { display: grid; + grid-template-columns: 1fr min-content; grid-template-areas: "details img" "btn neg"; @@ -358,7 +403,9 @@ header { } button { + margin-top: var(--base-spacing-half); grid-area: btn; + border-color: var(--tertiary-background-color); &.accepted { background: var(--color-accent-blue);