Setup FairScale Environment and Protected Swap Logic#11
Conversation
- Initialized `frontend/vercel.json` for `trustchain-fairscale-prod`. - Added `docs/FAIRSCALE_API.md` documenting the reconstructed API. - Implemented `useIntegrity` hook for fetching wallet scores. - Created `Guard` component for Protected Swap logic (Gini < 0.5). Co-authored-by: Freedomwithin <166790647+Freedomwithin@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Reviewer's GuideSets up FairScale integration scaffolding by documenting the reconstructed API, adding a frontend integrity hook that queries the backend verification endpoint, and introducing a Guard component that blocks protected UI flows for wallets marked as Sybil or with high Gini scores, plus Vercel config for a separate frontend environment. Sequence diagram for wallet integrity verification and guarded swapsequenceDiagram
actor User
participant DAppUI
participant GuardComponent
participant useIntegrityHook
participant WalletAdapter
participant BackendAPI as Backend_API
User->>DAppUI: Open protected swap screen
DAppUI->>GuardComponent: Render Guard with children
GuardComponent->>useIntegrityHook: Call useIntegrity()
useIntegrityHook->>WalletAdapter: Read publicKey, connected
alt Wallet connected
useIntegrityHook->>BackendAPI: POST /api/verify { address }
BackendAPI-->>useIntegrityHook: giniScore, hhiScore, status
useIntegrityHook-->>GuardComponent: { giniScore, status, loading=false, error=null }
GuardComponent->>GuardComponent: Compute isSybil (giniScore > 0.5 or status == SYBIL)
alt isSybil
GuardComponent-->>DAppUI: Render fallback or blocked message
DAppUI-->>User: Show "Protected Swap: Access Denied"
else not Sybil
GuardComponent-->>DAppUI: Render protected children
DAppUI-->>User: Allow swap interaction
end
else Wallet not connected
useIntegrityHook-->>GuardComponent: { giniScore=null, status=null, loading=false }
GuardComponent-->>DAppUI: Render children (no block)
DAppUI-->>User: Prompt to connect wallet or proceed
end
Class diagram for integrity hook and Guard componentclassDiagram
class IntegrityData {
number giniScore
number hhiScore
string status
boolean loading
string error
}
class GuardProps {
ReactNode children
ReactNode fallback
}
class GuardComponent {
+render(props GuardProps) ReactNode
}
class UseIntegrityHook {
+useIntegrity() IntegrityData
}
class WalletAdapterContext {
PublicKey publicKey
boolean connected
+useWallet() WalletAdapterContext
}
class BackendAPIClient {
+verify(address string) IntegrityData
}
GuardComponent --> GuardProps : uses
GuardComponent --> UseIntegrityHook : calls
UseIntegrityHook --> WalletAdapterContext : reads
UseIntegrityHook --> BackendAPIClient : calls
BackendAPIClient --> IntegrityData : returns
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
There was a problem hiding this comment.
Hey - I've found 2 issues, and left some high level feedback:
- In
useIntegrity, the defaultAPI_BASE_URLhardcodes a specific backend URL; consider requiring this to be provided via configuration only so different environments (local, staging, prod) don't accidentally point to the same backend. - The
Guardcomponent bakes in both thePROBATIONARY_THRESHOLDand thestatus === 'SYBIL'check; exposing these as props or shared constants (e.g., an enum for integrity statuses) would make the access logic easier to reuse and keep consistent across the app.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- In `useIntegrity`, the default `API_BASE_URL` hardcodes a specific backend URL; consider requiring this to be provided via configuration only so different environments (local, staging, prod) don't accidentally point to the same backend.
- The `Guard` component bakes in both the `PROBATIONARY_THRESHOLD` and the `status === 'SYBIL'` check; exposing these as props or shared constants (e.g., an enum for integrity statuses) would make the access logic easier to reuse and keep consistent across the app.
## Individual Comments
### Comment 1
<location> `frontend/src/hooks/useIntegrity.ts:22-31` </location>
<code_context>
+ useEffect(() => {
</code_context>
<issue_to_address>
**issue (bug_risk):** Guard against state updates after unmount / stale responses from in-flight fetches.
If the wallet changes quickly or the component unmounts while a request is in flight, the effect can still resolve and call the state setters with stale data, and may hit React warnings. Consider wiring an `AbortController` into the fetch and/or tracking a `currentRequestId` or `mounted` flag so late responses from prior wallet states are ignored.
</issue_to_address>
### Comment 2
<location> `frontend/src/hooks/useIntegrity.ts:32-37` </location>
<code_context>
+ setLoading(true);
+ setError(null);
+
+ fetch(`${API_BASE_URL}/api/verify`, {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({ address: publicKey.toBase58() })
+ })
+ .then(res => {
</code_context>
<issue_to_address>
**suggestion:** Include more context in error handling, e.g. HTTP status, to aid debugging.
Currently any non-2xx status results in the same `Failed to fetch integrity score` error. Please include the HTTP status (and, where safe, a snippet of the response body) in the error message so client-side and backend issues are easier to diagnose in production.
```suggestion
.then(async res => {
if (!res.ok) {
const { status, statusText } = res;
let bodySnippet = '';
try {
const text = await res.text();
if (text) {
bodySnippet = ` - Response: ${text.slice(0, 200)}`;
}
} catch {
// Ignore body parsing errors; we still have status information.
}
throw new Error(
`Failed to fetch integrity score (status ${status} ${statusText || ''})${bodySnippet}`
);
}
return res.json();
})
```
</issue_to_address>Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
Jules Protocol: Technical Hardening (Sourcery Feedback)ObjectiveApply senior-level refactoring to the useIntegrity hook and Guard component to ensure production stability and environment flexibility. Execution Steps
|
Refactored |
- Extract constants to `frontend/src/constants/integrity.ts` - Implement `AbortController` in `useIntegrity` hook - Update `Guard` component to accept optional threshold props - Improve error handling in fetch response - Ensure `import.meta.env` usage for Vite compatibility Co-authored-by: Freedomwithin <166790647+Freedomwithin@users.noreply.github.com>
This PR sets up the environment for the FairScale Production Bounty. It includes:
frontend/vercel.jsonto isolate the production environment.docs/FAIRSCALE_API.mdwith reconstructed API details and integration flow.frontend/src/hooks/useIntegrity.ts: A custom hook to fetch and manage wallet integrity scores from the backend.frontend/src/components/Guard.tsx: A React component that wraps protected actions (like Swaps) and blocks access for wallets with high Gini scores (> 0.5) or Sybil status.Verified by running
vite buildsuccessfully.PR created automatically by Jules for task 3042713778793509027 started by @Freedomwithin
Summary by Sourcery
Introduce FairScale integration scaffolding including wallet integrity checks and protected UI for high-risk wallets.
New Features:
Deployment:
Documentation: