Clean up and fix stuff on answers panel (#914)

web/components/answers/answers-panel.tsx

@@ -38,26 +38,13 @@ export function AnswersPanel(props: {
   const answers = (useAnswers(contract.id) ?? contract.answers).filter(
     (a) => a.number != 0 || contract.outcomeType === 'MULTIPLE_CHOICE'
   )
-  const hasZeroBetAnswers = answers.some((answer) => totalBets[answer.id] < 1)
-
-  const [winningAnswers, losingAnswers] = partition(
-    answers.filter((a) => (showAllAnswers ? true : totalBets[a.id] > 0)),
-    (answer) =>
-      answer.id === resolution || (resolutions && resolutions[answer.id])
+  const [winningAnswers, notWinningAnswers] = partition(
+    answers,
+    (a) => a.id === resolution || (resolutions && resolutions[a.id])
   )
-  const sortedAnswers = [
-    ...sortBy(winningAnswers, (answer) =>
-      resolutions ? -1 * resolutions[answer.id] : 0
-    ),
-    ...sortBy(
-      resolution ? [] : losingAnswers,
-      (answer) => -1 * getDpmOutcomeProbability(contract.totalShares, answer.id)
-    ),
-  ]
-
-  const answerItems = sortBy(
-    losingAnswers.length > 0 ? losingAnswers : sortedAnswers,
-    (answer) => -getOutcomeProbability(contract, answer.id)
+  const [visibleAnswers, invisibleAnswers] = partition(
+    sortBy(notWinningAnswers, (a) => -getOutcomeProbability(contract, a.id)),
+    (a) => showAllAnswers || totalBets[a.id] > 0
   )
 
   const user = useUser()
@@ -107,13 +94,13 @@ export function AnswersPanel(props: {
   return (
     <Col className="gap-3">
       {(resolveOption || resolution) &&
-        sortedAnswers.map((answer) => (
+        sortBy(winningAnswers, (a) => -(resolutions?.[a.id] ?? 0)).map((a) => (
           <AnswerItem
-            key={answer.id}
-            answer={answer}
+            key={a.id}
+            answer={a}
             contract={contract}
             showChoice={showChoice}
-            chosenProb={chosenAnswers[answer.id]}
+            chosenProb={chosenAnswers[a.id]}
             totalChosenProb={chosenTotal}
             onChoose={onChoose}
             onDeselect={onDeselect}
@@ -127,10 +114,10 @@ export function AnswersPanel(props: {
             tradingAllowed(contract) ? '' : '-mb-6'
           )}
         >
-          {answerItems.map((item) => (
-            <OpenAnswer key={item.id} answer={item} contract={contract} />
+          {visibleAnswers.map((a) => (
+            <OpenAnswer key={a.id} answer={a} contract={contract} />
           ))}
-          {hasZeroBetAnswers && !showAllAnswers && (
+          {invisibleAnswers.length > 0 && !showAllAnswers && (
             <Button
               className="self-end"
               color="gray-white"
@@ -143,7 +130,7 @@ export function AnswersPanel(props: {
         </Col>
       )}
 
-      {answers.length <= 1 && (
+      {answers.length === 0 && (
         <div className="pb-4 text-gray-500">No answers yet...</div>
       )}