Add a message for empty markets and bets

web/components/bets-list.tsx

@@ -45,7 +45,16 @@ export function BetsList(props: { user: User }) {
   }
 
   if (bets.length === 0)
-    return <div className="text-gray-500">You have not made any bets yet!</div>
+    return (
+      <div>
+        You have not made any bets yet.{' '}
+        <Link href="/">
+          <a className="text-green-500 hover:underline hover:decoration-2">
+            Find a prediction market!
+          </a>
+        </Link>
+      </div>
+    )
 
   // Decending creation time.
   bets.sort((bet1, bet2) => bet2.createdTime - bet1.createdTime)

web/components/contracts-list.tsx

@@ -86,6 +86,20 @@ function ContractsGrid(props: { contracts: Contract[] }) {
   )
   const contracts = [...activeContracts, ...resolvedContracts]
 
+  if (contracts.length === 0) {
+    return (
+      <p>
+        No markets found. Would you like to{' '}
+        <Link href="/create">
+          <a className="text-green-500 hover:underline hover:decoration-2">
+            create one
+          </a>
+        </Link>
+        ?
+      </p>
+    )
+  }
+
   return (
     <ul role="list" className="grid grid-cols-1 gap-6 lg:grid-cols-2">
       {contracts.map((contract) => (