offer groups with status

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();

api/src/offers.ts

@@ -149,7 +149,20 @@ export default function createOffers(log: Log, pg: Pg) {
 
     async function userOffers(user: User) {
         const offers = await pg.userOffers(user);
-        return groupBy(offers, (o) => o.wantId);
+        const groups = Object.values(groupBy(offers, (o) => o.wantId))
+            .map(g => {
+                const offers = sortBy(g, sortOffers);
+                const status = offers[0].status;
+                const details = offers[0].want.data;
+
+                return {
+                    details,
+                    offers,
+                    status,
+                };
+            });
+
+        return groups;
     }
 
     return {

api/src/pg.ts

@@ -11,33 +11,7 @@ export interface UserCreateParams {
     password: string,
 }
 
-export interface Pg {
+export default function createPg(log: Log, prisma: PrismaClient) {
-    userFindId:         (id: UUID) => Promise<User>,
-    userFindEmail:      (email: Email) => Promise<User>,
-    userCreate:         (params: UserCreateParams) => Promise<User>,
-    userWants:          (user: User) => Promise<Want[]>,
-    userOffers:         (user: User) => Promise<Offer[]>,
-    userOfferFind:      (user: User, id: UUID) => Promise<Offer>,
-
-    listingUpsert:      (listing: Listing, want: Want) => Promise<Listing>,
-    listingFind:        (id: DiscogsListing) => Promise<Listing>,
-    listingByIds:       (ids: DiscogsListing[]) => Promise<Listing[]>,
-    listingRmUnlisted:  (want: Want, ids: DiscogsListing[]) => Promise<number>,
-
-    wantCreate:         (discogsWant: any, user: User) => Promise<Want>,
-    wantList:           (user: User) => Promise<Want[]>,
-    wantsToSync:        () => Promise<Want[]>,
-    wantRm:             (id: UUID) => Promise<void>,
-
-    bundleCandidates:   () => Promise<Listing[][]>,
-
-    offersCreate:       (offers: Offer[]) => Promise<Offer[]>,
-    offerStatusSet:     (id: UUID, status: Status) => Promise<Offer>,
-    offersAdmin:        () => Promise<Offer[]>,
-    offerFindId:        (id: UUID) => Promise<Offer>,
-}
-
-export default function createPg(log: Log, prisma: PrismaClient): Pg {
     async function userFindId(id: UUID) {
         return prisma.user.findUnique({ where: { id }});
     }
@@ -325,3 +299,5 @@ export default function createPg(log: Log, prisma: PrismaClient): Pg {
         offerFindId,
     };
 }
+
+export type Pg = ReturnType<typeof createPg>;

client/src/components/offer.group.tsx

@@ -55,23 +55,21 @@ function OfferPriceBtn(offer) {
 }
 
 
-export default function WantOffers(wantOffers, i) {
+export default function OfferGroup(group, i) {
     const ws = useSelector((state: State) => state.ws);
 
-    const details = wantOffers[0].want.data;
-
     return (
         <div class="offer" key={i}>
             <section>
-                <h3>{details.artists_sort} - {details.title} <a href={details.uri} target="_blank"><ExternalLink /></a></h3>
+                <h3>{group.details.artists_sort} - {group.details.title} <a href={group.details.uri} target="_blank"><ExternalLink /></a></h3>
                 <div class='alt-text details'>
-                    {details.year} - {details.formats.map(f => f.descriptions.join(' ')).join(' ')}
+                    {group.details.year} - {group.details.formats.map(f => f.descriptions.join(' ')).join(' ')}
                 </div>
-                <div class='alt-text details'>Status: {wantOffers[0].status}</div>
+                <div class='alt-text details'>Status: {group.status}</div>
             </section>
-            <img src={details.thumb} />
+            <img src={group.details.thumb} />
             <div class="lines">
-                {wantOffers.map(o => OfferPriceBtn(o))}
+                {group.offers.map(o => OfferPriceBtn(o))}
             </div>
         </div>
     )

client/src/routes/offers.tsx

@@ -6,21 +6,19 @@ import { useSelector, useDispatch } from 'react-redux'
 import http from './../http';
 import { State, offersState } from './../store';
 
-import WantOffers from './../components/want.offers';
+import OfferGroup from './../components/offer.group';
 
 function Home() {
     const dispatch = useDispatch()
     const offers = useSelector((state: State) => state.offers);
 
-    const groups = Object.values(offers);
+    if (offers && offers.length === 0) {
-
-    if (offers && !groups.length) {
         route('/search');
     }
 
     return (
         <div class={'offers'}>
-            {groups.map(WantOffers)}
+            {offers.map(OfferGroup)}
         </div>
     );
 }

client/src/store.tsx

@@ -11,7 +11,7 @@ export const userState = createSlice({
 
 export const offersState = createSlice({
   name: 'offers',
-  initialState: {},
+  initialState: [],
   reducers: {
     set: (state, action) => action.payload
   },