Show new label instead of 0 volume

web/components/feed/feed-items.tsx

@@ -9,6 +9,7 @@ import {
   UserIcon,
   UsersIcon,
   XIcon,
+  SparklesIcon,
 } from '@heroicons/react/solid'
 import clsx from 'clsx'
 import Textarea from 'react-expanding-textarea'
@@ -46,6 +47,7 @@ import { useSaveSeenContract } from '../../hooks/use-seen-contracts'
 import { User } from '../../../common/user'
 import { Modal } from '../layout/modal'
 import { trackClick } from '../../lib/firebase/tracking'
+import { DAY_MS } from '../../../common/util/time'
 
 export function FeedItems(props: {
   contract: Contract
@@ -307,10 +309,18 @@ export function FeedQuestion(props: {
   contractPath?: string
 }) {
   const { contract, showDescription } = props
-  const { creatorName, creatorUsername, question, resolution, outcomeType } =
-    contract
+  const {
+    creatorName,
+    creatorUsername,
+    question,
+    resolution,
+    outcomeType,
+    volume,
+    createdTime,
+  } = contract
   const { volumeLabel } = contractMetrics(contract)
   const isBinary = outcomeType === 'BINARY'
+  const isNew = createdTime > Date.now() - DAY_MS
 
   // const closeMessage =
   //   contract.isResolved || !contract.closeTime ? null : (
@@ -336,10 +346,18 @@ export function FeedQuestion(props: {
           />{' '}
           asked
           {/* Currently hidden on mobile; ideally we'd fit this in somewhere. */}
-          <span className="float-right hidden text-gray-400 sm:inline">
+          <div className="relative -top-2 float-right text-gray-400">
+            {isNew || volume === 0 ? (
+              <Row className="gap-1">
+                <SparklesIcon className="h-5 w-5" aria-hidden="true" /> New
+              </Row>
+            ) : (
+              <span className="hidden sm:inline">
                 {volumeLabel}
                 {/* {closeMessage} */}
               </span>
+            )}
+          </div>
         </div>
         <Col className="items-start justify-between gap-2 sm:flex-row sm:gap-4">
           <Col>