Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(web): abstract-sortition-module-hooks-and-hide-in-university #1723

Merged
merged 2 commits into from
Oct 18, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions web/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ dist
.env.development.local
.env.test.local
.env.production.local
.env.devnet-university

# generated code
src/hooks/contracts/generated.ts
Expand Down
1 change: 1 addition & 0 deletions web/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@
"build-local": "scripts/runEnv.sh local 'yarn generate && vite build'",
"build-devnet": "scripts/runEnv.sh devnet 'yarn generate && vite build'",
"build-devnet-neo": "scripts/runEnv.sh devnet-neo 'yarn generate && vite build'",
"build-devnet-university": "scripts/runEnv.sh devnet-university 'yarn generate && vite build'",
"build-testnet": "scripts/runEnv.sh testnet 'yarn generate && vite build'",
"build-mainnet-neo": "scripts/runEnv.sh mainnet-neo 'yarn generate && vite build'",
"build-netlify": "scripts/generateBuildInfo.sh && yarn generate && vite build",
Expand Down
2 changes: 1 addition & 1 deletion web/src/components/Phase.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import React from "react";
import styled from "styled-components";

import { useSortitionModulePhase } from "hooks/useSortitionModulePhase";
import { useSortitionModulePhase } from "hooks/useSortitionModule";

import { isUndefined } from "src/utils";

Expand Down
54 changes: 54 additions & 0 deletions web/src/hooks/useSortitionModule.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import { REFETCH_INTERVAL } from "consts/index";

import { useReadSortitionModule } from "hooks/contracts/generated";

export const useSortitionModulePhase = () => {
// eslint-disable-next-line
// @ts-ignore
return useReadSortitionModule({ functionName: "phase", query: { refetchInterval: REFETCH_INTERVAL } });
};

export const useReadSortitionModuleDelayedStakeReadIndex = () => {
return useReadSortitionModule({
// eslint-disable-next-line
// @ts-ignore
functionName: "delayedStakeReadIndex",
query: { refetchInterval: REFETCH_INTERVAL },
});
};

export const useReadSortitionModuleDelayedStakeWriteIndex = () => {
return useReadSortitionModule({
// eslint-disable-next-line
// @ts-ignore
functionName: "delayedStakeWriteIndex",
query: { refetchInterval: REFETCH_INTERVAL },
});
};

export const useReadSortitionModuleLastPhaseChange = () => {
return useReadSortitionModule({
// eslint-disable-next-line
// @ts-ignore
functionName: "lastPhaseChange",
query: { refetchInterval: REFETCH_INTERVAL },
});
};

export const useReadSortitionModuleMaxDrawingTime = () => {
return useReadSortitionModule({
// eslint-disable-next-line
// @ts-ignore
functionName: "maxDrawingTime",
query: { refetchInterval: REFETCH_INTERVAL },
});
};

export const useReadSortitionModuleMinStakingTime = () => {
return useReadSortitionModule({
// eslint-disable-next-line
// @ts-ignore
functionName: "minStakingTime",
query: { refetchInterval: REFETCH_INTERVAL },
});
};
9 changes: 0 additions & 9 deletions web/src/hooks/useSortitionModulePhase.ts

This file was deleted.

45 changes: 35 additions & 10 deletions web/src/pages/Cases/CaseDetails/MaintenanceButtons/DrawButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@ import styled from "styled-components";

import { usePublicClient } from "wagmi";

import { Button } from "@kleros/ui-components-library";
import { Button, Field } from "@kleros/ui-components-library";

import { useSimulateKlerosCoreDraw, useWriteKlerosCoreDraw } from "hooks/contracts/generated";
import { useSortitionModulePhase } from "hooks/useSortitionModulePhase";
import { useSortitionModulePhase } from "hooks/useSortitionModule";
import { wrapWithToast } from "utils/wrapWithToast";

import useDisputeMaintenanceQuery from "queries/useDisputeMaintenanceQuery";
Expand All @@ -18,6 +18,8 @@ import { Phases } from "components/Phase";

import { IBaseMaintenanceButton } from ".";
import { Link } from "react-router-dom";
import { isKlerosUniversity } from "src/consts";
import { isAddress } from "viem";

const StyledButton = styled(Button)`
width: 100%;
Expand All @@ -29,17 +31,24 @@ interface IDrawButton extends IBaseMaintenanceButton {
period?: string;
}

const isUniversity = isKlerosUniversity();

const DrawButton: React.FC<IDrawButton> = ({ id, numberOfVotes, setIsOpen, period }) => {
const [isSending, setIsSending] = useState(false);
const publicClient = usePublicClient();
const { data: maintenanceData } = useDisputeMaintenanceQuery(id);
const { data: phase } = useSortitionModulePhase();
const [isSending, setIsSending] = useState(false);
const [drawJuror, setDrawJuror] = useState("");

const isDrawn = useMemo(() => maintenanceData?.dispute?.currentRound.jurorsDrawn, [maintenanceData]);

const canDraw = useMemo(
() => !isUndefined(maintenanceData) && !isDrawn && period === Period.Evidence && phase === Phases.drawing,
[maintenanceData, isDrawn, phase, period]
() =>
!isUndefined(maintenanceData) &&
!isDrawn &&
period === Period.Evidence &&
(isUniversity ? true : phase === Phases.drawing),
[maintenanceData, isDrawn, phase, period, isUniversity]
);

const needToPassPhase = useMemo(
Expand All @@ -53,17 +62,30 @@ const DrawButton: React.FC<IDrawButton> = ({ id, numberOfVotes, setIsOpen, perio
isError,
} = useSimulateKlerosCoreDraw({
query: {
enabled: !isUndefined(id) && !isUndefined(numberOfVotes) && !isUndefined(period) && canDraw,
enabled:
!isUndefined(id) &&
!isUndefined(numberOfVotes) &&
!isUndefined(period) &&
canDraw &&
(isUniversity ? isAddress(drawJuror) : true),
},
args: [BigInt(id ?? 0), BigInt(numberOfVotes ?? 0)],
// eslint-disable-next-line
// @ts-ignore
args: [BigInt(id ?? 0), isUniversity ? drawJuror : BigInt(numberOfVotes ?? 0)],
});

const { writeContractAsync: draw } = useWriteKlerosCoreDraw();

const isLoading = useMemo(() => isLoadingConfig || isSending, [isLoadingConfig, isSending]);
const isDisabled = useMemo(
() => isUndefined(id) || isUndefined(numberOfVotes) || isError || isLoading || !canDraw,
[id, numberOfVotes, isError, isLoading, canDraw]
() =>
isUndefined(id) ||
isUndefined(numberOfVotes) ||
isError ||
isLoading ||
!canDraw ||
(isUniversity && !isAddress(drawJuror)),
[id, numberOfVotes, isError, isLoading, canDraw, isUniversity, drawJuror]
);
const handleClick = () => {
if (!drawConfig || !publicClient) return;
Expand All @@ -77,12 +99,15 @@ const DrawButton: React.FC<IDrawButton> = ({ id, numberOfVotes, setIsOpen, perio
};
return (
<>
{needToPassPhase ? (
{needToPassPhase && !isUniversity ? (
<StyledLabel>
Jurors can be drawn in <small>drawing</small> phase.
<br /> Pass phase <Link to="/courts/1/purpose/#maintenance">here</Link>.
</StyledLabel>
) : null}
{isUniversity && canDraw ? (
<Field placeholder="Juror Address" onChange={(e) => setDrawJuror(e.target.value)} value={drawJuror} />
) : null}
<StyledButton text="Draw" small isLoading={isLoading} disabled={isDisabled} onClick={handleClick} />
</>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,12 @@ import { usePublicClient } from "wagmi";

import { Button } from "@kleros/ui-components-library";

import { useSimulateSortitionModule, useWriteSortitionModule } from "hooks/contracts/generated";
import {
useReadSortitionModuleDelayedStakeReadIndex,
useReadSortitionModuleDelayedStakeWriteIndex,
useSimulateSortitionModuleExecuteDelayedStakes,
useWriteSortitionModuleExecuteDelayedStakes,
} from "hooks/contracts/generated";
import { useSortitionModulePhase } from "hooks/useSortitionModulePhase";
useSortitionModulePhase,
} from "hooks/useSortitionModule";
import { wrapWithToast } from "utils/wrapWithToast";

import { isUndefined } from "src/utils";
Expand Down Expand Up @@ -42,14 +41,19 @@ const ExecuteDelayedStakeButton: React.FC<IExecuteStakeDelayedButton> = ({ setIs
data: executeDelayedStakeConfig,
isLoading: isLoadingConfig,
isError,
} = useSimulateSortitionModuleExecuteDelayedStakes({
} = useSimulateSortitionModule({
query: {
enabled: canExecute,
},
// eslint-disable-next-line
// @ts-ignore
functionName: "executeDelayedStakes",
// eslint-disable-next-line
// @ts-ignore
args: [1n + (delayedStakeWriteIndex ?? 0n) - (delayedStakeReadIndex ?? 0n)],
});

const { writeContractAsync: executeDelayedStake } = useWriteSortitionModuleExecuteDelayedStakes();
const { writeContractAsync: executeDelayedStake } = useWriteSortitionModule();

const isLoading = useMemo(() => isLoadingConfig || isSending, [isLoadingConfig, isSending]);
const isDisabled = useMemo(() => isError || isLoading || !canExecute, [isError, isLoading, canExecute]);
Expand Down
17 changes: 11 additions & 6 deletions web/src/pages/Courts/StakeMaintenanceButton/PassPhaseButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,15 @@ import { Button } from "@kleros/ui-components-library";

import {
useReadSortitionModuleDisputesWithoutJurors,
useSimulateSortitionModule,
useWriteSortitionModule,
} from "hooks/contracts/generated";
import {
useReadSortitionModuleLastPhaseChange,
useReadSortitionModuleMaxDrawingTime,
useReadSortitionModuleMinStakingTime,
useSimulateSortitionModulePassPhase,
useWriteSortitionModulePassPhase,
} from "hooks/contracts/generated";
import { useSortitionModulePhase } from "hooks/useSortitionModulePhase";
useSortitionModulePhase,
} from "hooks/useSortitionModule";
import { wrapWithToast } from "utils/wrapWithToast";

import { isUndefined } from "src/utils";
Expand Down Expand Up @@ -62,13 +64,16 @@ const PassPhaseButton: React.FC<IPassPhaseButton> = ({ setIsOpen }) => {
data: passPhaseConfig,
isLoading: isLoadingConfig,
isError,
} = useSimulateSortitionModulePassPhase({
} = useSimulateSortitionModule({
query: {
enabled: canChangePhase,
},
// eslint-disable-next-line
// @ts-ignore
functionName: "passPhase",
});

const { writeContractAsync: passPhase } = useWriteSortitionModulePassPhase();
const { writeContractAsync: passPhase } = useWriteSortitionModule();

const isLoading = useMemo(() => isLoadingConfig || isSending, [isLoadingConfig, isSending]);
const isDisabled = useMemo(() => isError || isLoading || !canChangePhase, [isError, isLoading, canChangePhase]);
Expand Down
4 changes: 3 additions & 1 deletion web/src/pages/Courts/TopSearch.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { responsiveSize } from "styles/responsiveSize";
import { StyledSkeleton } from "components/StyledSkeleton";

import StakeMaintenanceButtons from "./StakeMaintenanceButton";
import { isKlerosUniversity } from "src/consts";

const Container = styled.div`
width: 100%;
Expand All @@ -33,6 +34,7 @@ const TopSearch: React.FC = () => {
const { data } = useCourtTree();
const navigate = useNavigate();
const items = useMemo(() => !isUndefined(data) && [rootCourtToItems(data.court)], [data]);
const isUniversity = isKlerosUniversity();
return (
<Container>
{items ? (
Expand All @@ -44,7 +46,7 @@ const TopSearch: React.FC = () => {
) : (
<StyledSkeleton width={240} height={42} />
)}
<StakeMaintenanceButtons />
{isUniversity ? null : <StakeMaintenanceButtons />}
</Container>
);
};
Expand Down
Loading