Feat/removal challenge justification display #42
Conversation
WalkthroughThis update introduces several enhancements and fixes across different parts of the project. Significant changes include adding new fields to the GraphQL schema and corresponding updates to the data handling logic in both the backend and frontend. Additionally, there are updates to the React application UI components, custom hooks for handling GraphQL data, and upgraded dependencies. The goal is to increase functionality, improve user experience, and maintainability of the codebase. Changes
Sequence Diagram(s)sequenceDiagram
participant Client as Client Application
participant API as GraphQL API
participant IPFS as IPFS Service
Note over Client,API: Request creation or update flow
Client->>API: Create/Update Request (POST)
API->>API: Save `challengeTime` & `externalDisputeID`
API-->>Client: Confirmation response
Note over Client,IPFS: Fetching justification details
Client->>API: Query for evidence with Justification
API->>IPFS: Fetch JSON from URI
IPFS-->>API: Return JSON data
API-->>Client: Evidence data with Justification
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
✅ Deploy Preview for curate-v2 ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
Outside diff range and nitpick comments (2)
web/src/components/HistoryDisplay/Party/JustificationModal.tsx (1)
43-47: Consider using more descriptive names for the interface properties.For better readability and maintainability, consider renaming
isRemovaltoisRemovalRequestto clearly indicate its purpose.subgraph/schema.graphql (1)
Line range hint
166-178: Ensure consistency in documentation comments.The documentation for
externalDisputeIDcould be improved for clarity. Consider specifying what "requestID" refers to explicitly, and ensure that the description is clear and concise.- "External ID of the dispute, this is always there since it's just requestID. Please use disputed field to check if the dispute was created." + "External ID of the dispute, corresponding to the requestID. This field is always present. Use the 'disputed' field to check if a dispute has been initiated."
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (2)
web/src/assets/svgs/icons/close-circle.svgis excluded by!**/*.svgyarn.lockis excluded by!**/yarn.lock,!**/*.lock
Files selected for processing (19)
- subgraph/schema.graphql (2 hunks)
- subgraph/src/Curate.ts (1 hunks)
- subgraph/src/entities/Request.ts (2 hunks)
- web/.env.devnet.public (1 hunks)
- web/package.json (1 hunks)
- web/src/components/HistoryDisplay/Party/Header.tsx (1 hunks)
- web/src/components/HistoryDisplay/Party/JustificationDetails.tsx (1 hunks)
- web/src/components/HistoryDisplay/Party/JustificationModal.tsx (1 hunks)
- web/src/components/HistoryDisplay/Party/index.tsx (1 hunks)
- web/src/components/HistoryDisplay/index.tsx (5 hunks)
- web/src/components/InformationCards/ItemInformationCard/index.tsx (3 hunks)
- web/src/components/InformationCards/RegistryInformationCard/TopInfo.tsx (2 hunks)
- web/src/components/InformationCards/RegistryInformationCard/index.tsx (2 hunks)
- web/src/components/StyledSkeleton.tsx (2 hunks)
- web/src/consts/index.ts (1 hunks)
- web/src/context/GraphqlBatcher.tsx (1 hunks)
- web/src/hooks/queries/useEvidences.ts (1 hunks)
- web/src/hooks/queries/useRequestsQuery.ts (3 hunks)
- web/src/utils/fetchJsonIpfs.ts (1 hunks)
Files skipped from review due to trivial changes (4)
- web/.env.devnet.public
- web/package.json
- web/src/components/HistoryDisplay/Party/Header.tsx
- web/src/consts/index.ts
Additional context used
Biome
web/src/components/HistoryDisplay/index.tsx
[error] 87-87: Unnecessary use of boolean literals in conditional expression. (lint/complexity/noUselessTernary)
Simplify your code by directly assigning the result without using a ternary operator.
If your goal is negation, you may use the logical NOT (!) or double NOT (!!) operator for clearer and concise code.
Check for more details about NOT operator.
Unsafe fix: Remove the conditional expression withweb/src/components/HistoryDisplay/Party/JustificationModal.tsx
[error] 113-115: This else clause can be omitted because previous branches break early. (lint/style/noUselessElse)
Unsafe fix: Omit the else clause.
subgraph/src/Curate.ts
[error] 2-2: Do not shadow the global "BigInt" property. (lint/suspicious/noShadowRestrictedNames)
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
Additional comments not posted (26)
web/src/utils/fetchJsonIpfs.ts (2)
7-22: The error handling and response processing infetchJsonIpfsfunction are well-implemented.
25-25: The export offetchJsonIpfsas default is appropriate for utility modules like this.web/src/hooks/queries/useEvidences.ts (2)
8-15: The GraphQL query inuseEvidencesis well-structured to fetch evidence based on group ID and order by timestamp.
17-32: TheuseEvidenceshook is correctly implemented with conditional fetching and usesgraphqlBatcherfor optimized data fetching.web/src/hooks/queries/useRequestsQuery.ts (2)
Line range hint
11-34: The GraphQL fragmentRequestDetailsis comprehensive and includes new fields likeexternalDisputeIDandchallengeTime, aligning with the PR's objectives.
11-11: TheuseItemRequestshook is correctly implemented, ensuring efficient and conditional data fetching.Also applies to: 34-34
web/src/components/HistoryDisplay/Party/index.tsx (2)
36-49: ThePartycomponent is well-structured, taking relevant props and integrating theJustificationModaleffectively.
9-29: The styled components in thePartycomponent are appropriately defined, ensuring consistent theming and design.web/src/components/HistoryDisplay/Party/JustificationDetails.tsx (2)
33-37: Define theJustificationtype correctly.
39-56: TheJustificationDetailscomponent is well-structured and uses React best practices.subgraph/src/entities/Request.ts (1)
34-34: Ensure thatexternalDisputeIDis utilized appropriately in the system.Verification successful
The usage of
externalDisputeIDhas been verified in relevant parts of the system. It is used in theRequest.tsfile, theJustificationModal.tsxcomponent, and within theuseRequestsQuery.tshook.
subgraph/src/entities/Request.ts:request.externalDisputeID = event.params._requestID;web/src/components/HistoryDisplay/Party/JustificationModal.tsx:useEvidences(request.externalDisputeID);web/src/hooks/queries/useRequestsQuery.ts:externalDisputeIDScripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the usage of `externalDisputeID` across the system. # Test: Search for usage of `externalDisputeID`. Expect: Proper usage in relevant parts of the system. rg --type graphql $'externalDisputeID'Length of output: 69
Script:
#!/bin/bash # Description: Verify the usage of `externalDisputeID` across the system. # Test: Search for usage of `externalDisputeID`. Expect: Proper usage in relevant parts of the system. rg 'externalDisputeID' --type ts --type graphqlLength of output: 79
Script:
#!/bin/bash # Description: Verify the usage of `externalDisputeID` across the system. # Test: Search for usage of `externalDisputeID`. Expect: Proper usage in relevant parts of the system. rg 'externalDisputeID' --type ts --type jsLength of output: 362
web/src/context/GraphqlBatcher.tsx (2)
18-18: AddingisCoreas an optional parameter enhances the flexibility of GraphQL queries.
24-25: Ensure error handling is robust in the GraphQL fetcher function.web/src/components/StyledSkeleton.tsx (2)
41-61: The new skeleton components for Justification details are well-designed to match the UI specifications.
78-84: TheSkeletonJustificationCardcomponent is correctly implemented to display loading states.web/src/components/InformationCards/RegistryInformationCard/index.tsx (2)
35-40: Introduce a new styled componentAliasContainer.This addition provides a consistent styling for alias display across the application, improving user interface consistency.
89-94: UpdatedBottomInfosection to includeAliasContainer.The nested
AliasContainerenhances the semantic structure and visual grouping of theSubmitted byinformation. This change aligns with modern UI practices by making information more accessible and visually appealing.web/src/components/InformationCards/ItemInformationCard/index.tsx (2)
80-85: Introduce a new styled componentAliasContainer.This addition is consistent with similar changes in other components, promoting uniformity in the design of various card components across the application.
120-127: UpdatedBottomInfosection to includeAliasContainer.The use of
AliasContainerhere mirrors the update inRegistryInformationCard, ensuring that the UI remains consistent across different types of information cards. This is crucial for maintaining a coherent user experience.web/src/components/HistoryDisplay/index.tsx (5)
3-3: Import additional styled-components utilities.The inclusion of
cssandThemefromstyled-componentsis necessary for the dynamic styling used in this file, particularly for responsive layouts.
11-12: Introduce import for newPartycomponent andlandscapeStyle.These imports are essential for the new functionality related to displaying party information and adjusting styles based on the landscape orientation.
27-34: Add new CSS class.party-wrapperwith responsive styling.This addition enhances the UI by making the party information responsive, aligning with modern web design practices.
63-63: Add optionalisItemparameter toconstructItemsFromRequestfunction.This parameter allows the function to handle item-specific logic, increasing its versatility and aligning with the expanded functionality of the application.
78-81: Enhanced timeline items with party details.Integrating the
Partycomponent into the timeline items allows for a more detailed and interactive history display, significantly improving user engagement and information accessibility.Also applies to: 104-104, 109-111
web/src/components/InformationCards/RegistryInformationCard/TopInfo.tsx (2)
14-14: ImportshortenAddressutility.This utility is crucial for displaying user-friendly, shortened addresses, enhancing readability and user experience.
140-141: UseshortenAddressto display registry addresses.Applying
shortenAddressin theCopiablecomponent improves the display of potentially long blockchain addresses, making them more manageable and user-friendly.
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (1)
- web/src/components/HistoryDisplay/Party/index.tsx (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- web/src/components/HistoryDisplay/Party/index.tsx
|
|
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (3)
- web/src/components/HistoryDisplay/Party/JustificationDetails.tsx (1 hunks)
- web/src/components/InformationCards/RegistryInformationCard/TopInfo.tsx (3 hunks)
- web/src/styles/customScrollbar.ts (1 hunks)
Files skipped from review due to trivial changes (1)
- web/src/styles/customScrollbar.ts
Files skipped from review as they are similar to previous changes (2)
- web/src/components/HistoryDisplay/Party/JustificationDetails.tsx
- web/src/components/InformationCards/RegistryInformationCard/TopInfo.tsx
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (3)
- web/src/components/InformationCards/ItemInformationCard/index.tsx (2 hunks)
- web/src/components/InformationCards/RegistryInformationCard/TopInfo.tsx (4 hunks)
- web/src/components/InformationCards/RegistryInformationCard/index.tsx (2 hunks)
Files skipped from review as they are similar to previous changes (3)
- web/src/components/InformationCards/ItemInformationCard/index.tsx
- web/src/components/InformationCards/RegistryInformationCard/TopInfo.tsx
- web/src/components/InformationCards/RegistryInformationCard/index.tsx
externalDisputeIDinRequestentity, to make it easier to link it to evidenceschallengeTimefield inRequestenitityPR-Codex overview
This PR enhances the Curate application by adding challenge time tracking, improving UI components, updating subgraph queries, and refining data fetching functions.
Detailed summary
challengeTimetracking to requestsHeader,RegistryInformationCard, andJustificationDetailsuseRequestsQueryanduseEvidencesfetchJsonIpfsdata fetching functionexternalDisputeIDfieldSummary by CodeRabbit
New Features
externalDisputeIDandchallengeTimefields in request details.Party,JustificationDetails, andJustificationModal.useEvidencesfor fetching evidence data.fetchJsonIpfsfor fetching JSON data from IPFS.Enhancements
@kleros/ui-components-libraryto version2.13.1.Configuration
.env.devnet.public.Bug Fixes
fetcherfunction inGraphqlBatcher.tsxto handle core service requests.