show dead jobs

api/resolvers/item.js

@@ -77,7 +77,7 @@ export default {
       }
 
       const activeOrMine = () => {
-        return me ? ` AND (status = 'ACTIVE' OR "userId" = ${me.id}) ` : ' AND status = \'ACTIVE\' '
+        return me ? ` AND (status <> 'STOPPED' OR "userId" = ${me.id}) ` : ' AND status <> \'STOPPED\' '
       }
 
       switch (sort) {
@@ -140,8 +140,8 @@ export default {
                 WHERE "parentId" IS NULL AND created_at <= $1
                 AND "pinId" IS NULL
                 ${subClause(3)}
-                AND status = 'ACTIVE'
-                ORDER BY "maxBid" DESC, created_at ASC
+                AND status <> 'STOPPED'
+                ORDER BY (CASE WHEN status = 'ACTIVE' THEN "maxBid" ELSE 0 END) DESC, created_at ASC
                 OFFSET $2
                 LIMIT ${LIMIT}`, decodedCursor.time, decodedCursor.offset, sub)
               break

components/item.js

@@ -28,7 +28,7 @@ export function ItemJob ({ item, rank, children }) {
             {rank}
           </div>)
         : <div />}
-      <div className={`${styles.item}`}>
+      <div className={`${styles.item} ${item.status === 'NOSATS' && !item.mine ? styles.itemDead : ''}`}>
         <Briefcase width={24} height={24} className={styles.case} />
         <div className={styles.hunk}>
           <div className={`${styles.main} flex-wrap d-inline`}>
@@ -60,7 +60,9 @@ export function ItemJob ({ item, rank, children }) {
             </a>
           </div>
           <div className={`${styles.other}`}>
-            <span>{formatSats(item.maxBid)} sats per min</span>
+            {item.status !== 'NOSATS'
+              ? <span>{formatSats(item.maxBid)} sats per min</span>
+              : <span>expired</span>}
             <span> \ </span>
             <Link href={`/items/${item.id}`} passHref>
               <a className='text-reset'>{item.ncomments} comments</a>

components/item.module.css

@@ -50,6 +50,11 @@ a.link:visited {
     min-width: 0;
 }
 
+.itemDead {
+    pointer-events: none;
+    opacity: .5;
+}
+
 .item .cover {
     top: 4px;
 }