Merge pull request #486 from kleros/feat/support-reality-hash-questions

Feat: support reality hash type questions

Author: alcercu

package.json

@@ -66,7 +66,7 @@
     "@kleros/pnk-merkle-drop-contracts": "^0.1.0",
     "@loadable/component": "^5.5.0",
     "@reality.eth/contracts": "3.0.0",
-    "@reality.eth/reality-eth-lib": "3.0.0",
+    "@reality.eth/reality-eth-lib": "3.4.6",
     "@sentry/react": "^7.37.2",
     "@sentry/tracing": "^7.37.2",
     "antd": "^3.10.8",
@@ -103,6 +103,9 @@
     "use-persisted-state": "^0.3.3",
     "web3": "1.5.2"
   },
+  "resolutions": {
+    "html-to-text": "^7.0.0"
+  },
   "volta": {
     "node": "16.20.2",
     "yarn": "1.22.10"

src/components/case-details-card.jsx

@@ -59,10 +59,33 @@ const VoteOptions = ({ metaEvidence, votesData, complexRuling, setComplexRuling,
   const isSingleSelect = metaEvidence.rulingOptions.type === "single-select";
   const isMultipleSelect = metaEvidence.rulingOptions.type === "multiple-select";
   const isDateTime = metaEvidence.rulingOptions.type === "datetime";
+  const isHash = metaEvidence.rulingOptions.type === "hash";
 
   let inputComponent;
 
-  if (isMultipleSelect) {
+  if (isHash) {
+    inputComponent = (
+      <StyledInput
+        disabled={!votesData.canVote}
+        onInput={(e) => {
+          const newValue = e.target.value;
+          if (/^(0)?([xX])?[0-9a-fA-F]{0,64}$/.test(newValue)) {
+            if (!/0{64}/.test(newValue)) {
+              setComplexRuling(newValue);
+            }
+          }
+        }}
+        onBlur={() => {
+          const emptyOrUndefined = typeof complexRuling === "undefined" || complexRuling === "";
+          const formatted = complexRuling?.replace("0x", "").padStart(64, "0");
+          setComplexRuling(emptyOrUndefined ? "" : `0x${formatted}`);
+        }}
+        value={complexRuling}
+        placeholder="0xffff...ffff"
+        size="large"
+      />
+    );
+  } else if (isMultipleSelect) {
     inputComponent = (
       <div style={{ paddingTop: "1rem" }}>
         <Checkbox.Group
@@ -382,6 +405,9 @@ export default function CaseDetailsCard({ ID }) {
         case "uint":
           choice = complexRuling;
           break;
+        case "hash":
+          choice = complexRuling;
+          break;
         default:
           choice = id;
           break;
@@ -390,6 +416,7 @@ export default function CaseDetailsCard({ ID }) {
         case "multiple-select":
         case "datetime":
         case "uint":
+        case "hash":
           choice = realitioLibQuestionFormatter.answerToBytes32(choice, {
             decimals: metaEvidence.rulingOptions.precision,
             type: metaEvidence.rulingOptions.type,
@@ -983,6 +1010,10 @@ const StyledInputNumber = styled(InputNumber)`
   width: 80%;
 `;
 
+const StyledInput = styled(Input)`
+  width: 80%;
+`;
+
 const StyledButtonsDiv = styled.div`
   display: flex;
   flex-wrap: wrap;