From 737ad458a8cb3ff865a6d53d97e375c7a0aac7e9 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Mon, 8 Jul 2024 14:36:41 +0530 Subject: [PATCH 1/5] refactor(web): make-aliases-optional --- web/src/context/NewDisputeContext.tsx | 5 +---- web/src/pages/Resolver/NavigationButtons/NextButton.tsx | 4 ++-- web/src/pages/Resolver/Parameters/NotablePersons/index.tsx | 2 +- 3 files changed, 4 insertions(+), 7 deletions(-) diff --git a/web/src/context/NewDisputeContext.tsx b/web/src/context/NewDisputeContext.tsx index 1c5606a4d..f766391bf 100644 --- a/web/src/context/NewDisputeContext.tsx +++ b/web/src/context/NewDisputeContext.tsx @@ -66,10 +66,7 @@ const initialDisputeData: IDisputeData = { { title: "", id: "1" }, { title: "", id: "2" }, ], - aliasesArray: [ - { name: "", address: "", id: "1" }, - { name: "", address: "", id: "2" }, - ], + aliasesArray: [{ name: "", address: "", id: "1" }], }; const initialDisputeTemplate = initialDisputeData as IDisputeTemplate; diff --git a/web/src/pages/Resolver/NavigationButtons/NextButton.tsx b/web/src/pages/Resolver/NavigationButtons/NextButton.tsx index 21ba5737a..a313cdc02 100644 --- a/web/src/pages/Resolver/NavigationButtons/NextButton.tsx +++ b/web/src/pages/Resolver/NavigationButtons/NextButton.tsx @@ -20,8 +20,8 @@ const NextButton: React.FC = ({ nextRoute }) => { disputeData.question !== "" && disputeData.answers.every((answer) => answer.title !== ""); //check if any filled address or ens is invalid - const areFilledAddressesValid = disputeData?.aliasesArray?.every( - (alias) => alias.address !== "" && alias.isValid && alias.name !== "" + const areFilledAddressesValid = disputeData?.aliasesArray?.every((alias) => + alias.address === "" && alias.name === "" ? true : alias.isValid ); const isButtonDisabled = diff --git a/web/src/pages/Resolver/Parameters/NotablePersons/index.tsx b/web/src/pages/Resolver/Parameters/NotablePersons/index.tsx index 277c02634..5ee69ae1f 100644 --- a/web/src/pages/Resolver/Parameters/NotablePersons/index.tsx +++ b/web/src/pages/Resolver/Parameters/NotablePersons/index.tsx @@ -43,7 +43,7 @@ const NotablePersons: React.FC = () => { From 94b577f87c5cbf57b98bfcec3a17d433d0e91b79 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Mon, 8 Jul 2024 18:02:42 +0530 Subject: [PATCH 2/5] fix(web): dispute-resolver-template-validation --- web/src/context/NewDisputeContext.tsx | 25 +++++++++++++++---- .../Resolver/NavigationButtons/NextButton.tsx | 4 ++- .../NavigationButtons/SubmitDisputeButton.tsx | 3 ++- .../VotingOptions/OptionsFields.tsx | 8 +++--- 4 files changed, 29 insertions(+), 11 deletions(-) diff --git a/web/src/context/NewDisputeContext.tsx b/web/src/context/NewDisputeContext.tsx index f766391bf..09e671caa 100644 --- a/web/src/context/NewDisputeContext.tsx +++ b/web/src/context/NewDisputeContext.tsx @@ -2,13 +2,15 @@ import React, { createContext, useState, useContext, useMemo } from "react"; import { Address } from "viem"; +import { DEFAULT_CHAIN } from "consts/chains"; +import { disputeResolverAddress, klerosCoreAddress } from "hooks/contracts/generated"; import { useLocalStorage } from "hooks/useLocalStorage"; import { isUndefined } from "utils/index"; export type Answer = { - id?: string; + id: string; title: string; - description?: string; + description: string; reserved?: boolean; }; @@ -26,7 +28,7 @@ export interface IDisputeTemplate { arbitrableChainID?: string; arbitratorAddress?: string; arbitratorChainID?: string; - category?: string; + category: string; description: string; frontendUrl?: string; lang?: string; @@ -35,6 +37,7 @@ export interface IDisputeTemplate { specification?: string; title: string; aliases?: Alias; + version: string; // attachment: Attachment; // type: string; } @@ -62,11 +65,13 @@ const initialDisputeData: IDisputeData = { title: "", description: "", question: "", + category: "", answers: [ - { title: "", id: "1" }, - { title: "", id: "2" }, + { title: "", id: "1", description: "" }, + { title: "", id: "2", description: "" }, ], aliasesArray: [{ name: "", address: "", id: "1" }], + version: "1.0", }; const initialDisputeTemplate = initialDisputeData as IDisputeTemplate; @@ -127,7 +132,17 @@ const constructDisputeTemplate = (disputeData: IDisputeData) => { baseTemplate.aliases = aliases; } } + + for (const answer of baseTemplate.answers) { + answer.id = "0x" + BigInt(answer.id).toString(16); + } if (!isUndefined(baseTemplate.policyURI) && baseTemplate.policyURI === "") delete baseTemplate.policyURI; + // in future if we support chain switching these would need to be calculated from connected 'chainId' + baseTemplate.arbitrableAddress = disputeResolverAddress[DEFAULT_CHAIN]; + baseTemplate.arbitrableChainID = DEFAULT_CHAIN.toString(); + baseTemplate.arbitratorAddress = klerosCoreAddress[DEFAULT_CHAIN]; + baseTemplate.arbitratorChainID = DEFAULT_CHAIN.toString(); + return baseTemplate as IDisputeTemplate; }; diff --git a/web/src/pages/Resolver/NavigationButtons/NextButton.tsx b/web/src/pages/Resolver/NavigationButtons/NextButton.tsx index a313cdc02..5c9c440b7 100644 --- a/web/src/pages/Resolver/NavigationButtons/NextButton.tsx +++ b/web/src/pages/Resolver/NavigationButtons/NextButton.tsx @@ -17,7 +17,8 @@ const NextButton: React.FC = ({ nextRoute }) => { //checks if each answer is filled in const areVotingOptionsFilled = - disputeData.question !== "" && disputeData.answers.every((answer) => answer.title !== ""); + disputeData.question !== "" && + disputeData.answers.every((answer) => answer.title !== "" && answer.description !== ""); //check if any filled address or ens is invalid const areFilledAddressesValid = disputeData?.aliasesArray?.every((alias) => @@ -28,6 +29,7 @@ const NextButton: React.FC = ({ nextRoute }) => { (location.pathname.includes("/resolver/title") && !disputeData.title) || (location.pathname.includes("/resolver/description") && !disputeData.description) || (location.pathname.includes("/resolver/court") && !disputeData.courtId) || + (location.pathname.includes("/resolver/category") && !disputeData.category) || (location.pathname.includes("/resolver/jurors") && !disputeData.arbitrationCost) || (location.pathname.includes("/resolver/voting-options") && !areVotingOptionsFilled) || (location.pathname.includes("/resolver/notable-persons") && !areFilledAddressesValid) || diff --git a/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx b/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx index 8b86f0772..7bb60fdd6 100644 --- a/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx +++ b/web/src/pages/Resolver/NavigationButtons/SubmitDisputeButton.tsx @@ -96,7 +96,8 @@ const SubmitDisputeButton: React.FC = () => { const isTemplateValid = (disputeTemplate: IDisputeTemplate) => { const areVotingOptionsFilled = - disputeTemplate.question !== "" && disputeTemplate.answers.every((answer) => answer.title !== ""); + disputeTemplate.question !== "" && + disputeTemplate.answers.every((answer) => answer.title !== "" && answer.description !== ""); return (disputeTemplate.title && disputeTemplate.description && diff --git a/web/src/pages/Resolver/Parameters/VotingOptions/OptionsFields.tsx b/web/src/pages/Resolver/Parameters/VotingOptions/OptionsFields.tsx index 0509c4da7..cd7eabf9f 100644 --- a/web/src/pages/Resolver/Parameters/VotingOptions/OptionsFields.tsx +++ b/web/src/pages/Resolver/Parameters/VotingOptions/OptionsFields.tsx @@ -43,15 +43,15 @@ const OptionsFields: React.FC = () => { const { disputeData, setDisputeData } = useNewDisputeContext(); const updateOptions = (value: number) => { - let defaultAnswer: Answer = { title: "", id: value.toString() }; - let answers = disputeData.answers; + const defaultAnswer: Answer = { title: "", id: value.toString(), description: "" }; + const answers = disputeData.answers; if (value < answers?.length) return setDisputeData({ ...disputeData, answers: answers.splice(0, value) }); if (value > answers?.length) return setDisputeData({ ...disputeData, answers: [...answers, defaultAnswer] }); }; const handleOptionWrite = (event: React.ChangeEvent, key: number) => { - let answers = disputeData.answers; + const answers = disputeData.answers; answers[key] = { ...answers[key], [event.target.name]: event.target.value }; setDisputeData({ ...disputeData, answers }); }; @@ -69,7 +69,7 @@ const OptionsFields: React.FC = () => { /> handleOptionWrite(event, index)} From ee5e44630b1f23b84fc929195f78211b39238bc6 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Tue, 16 Jul 2024 19:57:30 +0530 Subject: [PATCH 3/5] refactor(web): explicit-context-provider-check --- web/src/context/NewDisputeContext.tsx | 28 ++++++++++++--------------- web/src/pages/Resolver/index.tsx | 13 ------------- 2 files changed, 12 insertions(+), 29 deletions(-) diff --git a/web/src/context/NewDisputeContext.tsx b/web/src/context/NewDisputeContext.tsx index 09e671caa..a1c7c2025 100644 --- a/web/src/context/NewDisputeContext.tsx +++ b/web/src/context/NewDisputeContext.tsx @@ -1,4 +1,4 @@ -import React, { createContext, useState, useContext, useMemo } from "react"; +import React, { createContext, useState, useContext, useMemo, useCallback } from "react"; import { Address } from "viem"; @@ -73,20 +73,16 @@ const initialDisputeData: IDisputeData = { aliasesArray: [{ name: "", address: "", id: "1" }], version: "1.0", }; -const initialDisputeTemplate = initialDisputeData as IDisputeTemplate; -const NewDisputeContext = createContext({ - disputeData: initialDisputeData, - setDisputeData: () => {}, - disputeTemplate: initialDisputeTemplate, - resetDisputeData: () => {}, - isSubmittingCase: false, - setIsSubmittingCase: () => {}, - isPolicyUploading: false, - setIsPolicyUploading: () => {}, -}); +const NewDisputeContext = createContext(undefined); -export const useNewDisputeContext = () => useContext(NewDisputeContext); +export const useNewDisputeContext = () => { + const context = useContext(NewDisputeContext); + if (!context) { + throw new Error("Context Provider not found."); + } + return context; +}; export const NewDisputeProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => { const [disputeData, setDisputeData] = useLocalStorage("disputeData", initialDisputeData); @@ -95,9 +91,9 @@ export const NewDisputeProvider: React.FC<{ children: React.ReactNode }> = ({ ch const disputeTemplate = useMemo(() => constructDisputeTemplate(disputeData), [disputeData]); - const resetDisputeData = () => { + const resetDisputeData = useCallback(() => { setDisputeData(initialDisputeData); - }; + }, [setDisputeData]); const contextValues = useMemo( () => ({ @@ -110,7 +106,7 @@ export const NewDisputeProvider: React.FC<{ children: React.ReactNode }> = ({ ch isPolicyUploading, setIsPolicyUploading, }), - [disputeData, disputeTemplate, resetDisputeData, isSubmittingCase, isPolicyUploading] + [disputeData, disputeTemplate, resetDisputeData, isSubmittingCase, isPolicyUploading, setDisputeData] ); return {children}; diff --git a/web/src/pages/Resolver/index.tsx b/web/src/pages/Resolver/index.tsx index 87e4550fd..06a71c3dd 100644 --- a/web/src/pages/Resolver/index.tsx +++ b/web/src/pages/Resolver/index.tsx @@ -73,19 +73,6 @@ const MiddleContentContainer = styled.div` position: relative; `; -const StyledLabel = styled.label` - display: none; - - ${landscapeStyle( - () => css` - display: flex; - color: ${({ theme }) => theme.secondaryPurple}; - margin-bottom: 20px; - padding-left: ${responsiveSize(25, 65)}; - ` - )} -`; - const DisputeResolver: React.FC = () => { const location = useLocation(); const [isDisputeResolverMiniGuideOpen, toggleDisputeResolverMiniGuide] = useToggle(false); From c5f63ad35871f6b3ddd45251ed16e3f3b6c992a3 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Fri, 19 Jul 2024 16:57:36 +0530 Subject: [PATCH 4/5] refactor(web): category-param-optional-in-dr --- web/src/context/NewDisputeContext.tsx | 2 +- web/src/pages/Resolver/NavigationButtons/NextButton.tsx | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/web/src/context/NewDisputeContext.tsx b/web/src/context/NewDisputeContext.tsx index a1c7c2025..9893373d3 100644 --- a/web/src/context/NewDisputeContext.tsx +++ b/web/src/context/NewDisputeContext.tsx @@ -28,7 +28,7 @@ export interface IDisputeTemplate { arbitrableChainID?: string; arbitratorAddress?: string; arbitratorChainID?: string; - category: string; + category?: string; description: string; frontendUrl?: string; lang?: string; diff --git a/web/src/pages/Resolver/NavigationButtons/NextButton.tsx b/web/src/pages/Resolver/NavigationButtons/NextButton.tsx index 5c9c440b7..499f26f0f 100644 --- a/web/src/pages/Resolver/NavigationButtons/NextButton.tsx +++ b/web/src/pages/Resolver/NavigationButtons/NextButton.tsx @@ -29,7 +29,6 @@ const NextButton: React.FC = ({ nextRoute }) => { (location.pathname.includes("/resolver/title") && !disputeData.title) || (location.pathname.includes("/resolver/description") && !disputeData.description) || (location.pathname.includes("/resolver/court") && !disputeData.courtId) || - (location.pathname.includes("/resolver/category") && !disputeData.category) || (location.pathname.includes("/resolver/jurors") && !disputeData.arbitrationCost) || (location.pathname.includes("/resolver/voting-options") && !areVotingOptionsFilled) || (location.pathname.includes("/resolver/notable-persons") && !areFilledAddressesValid) || From bedfc49753ef32455331d3af58f4cb6318ecfd58 Mon Sep 17 00:00:00 2001 From: Harman-singh-waraich Date: Wed, 24 Jul 2024 16:53:01 +0530 Subject: [PATCH 5/5] refactor(web): update-dispute-template-fields --- web/src/context/NewDisputeContext.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/web/src/context/NewDisputeContext.tsx b/web/src/context/NewDisputeContext.tsx index 9893373d3..e01b09c98 100644 --- a/web/src/context/NewDisputeContext.tsx +++ b/web/src/context/NewDisputeContext.tsx @@ -3,7 +3,7 @@ import React, { createContext, useState, useContext, useMemo, useCallback } from import { Address } from "viem"; import { DEFAULT_CHAIN } from "consts/chains"; -import { disputeResolverAddress, klerosCoreAddress } from "hooks/contracts/generated"; +import { klerosCoreAddress } from "hooks/contracts/generated"; import { useLocalStorage } from "hooks/useLocalStorage"; import { isUndefined } from "utils/index"; @@ -113,7 +113,8 @@ export const NewDisputeProvider: React.FC<{ children: React.ReactNode }> = ({ ch }; const constructDisputeTemplate = (disputeData: IDisputeData) => { - const baseTemplate = { ...disputeData }; + // eslint-disable-next-line @typescript-eslint/no-unused-vars + const { courtId, numberOfJurors, arbitrationCost, ...baseTemplate } = disputeData; if (!isUndefined(baseTemplate.aliasesArray)) { baseTemplate.aliasesArray = baseTemplate.aliasesArray.filter((item) => item.address !== "" && item.isValid); @@ -134,9 +135,6 @@ const constructDisputeTemplate = (disputeData: IDisputeData) => { } if (!isUndefined(baseTemplate.policyURI) && baseTemplate.policyURI === "") delete baseTemplate.policyURI; - // in future if we support chain switching these would need to be calculated from connected 'chainId' - baseTemplate.arbitrableAddress = disputeResolverAddress[DEFAULT_CHAIN]; - baseTemplate.arbitrableChainID = DEFAULT_CHAIN.toString(); baseTemplate.arbitratorAddress = klerosCoreAddress[DEFAULT_CHAIN]; baseTemplate.arbitratorChainID = DEFAULT_CHAIN.toString();