Skip to content

feat: allow users to add custom RPC endpoints#2170

Open
Nick-1979 wants to merge 5 commits into
mainfrom
addCustomRpc
Open

feat: allow users to add custom RPC endpoints#2170
Nick-1979 wants to merge 5 commits into
mainfrom
addCustomRpc

Conversation

@Nick-1979
Copy link
Copy Markdown
Member

@Nick-1979 Nick-1979 commented May 24, 2026

close #2166, #2167

Summary by CodeRabbit

  • New Features

    • Added full custom RPC management: add, edit, remove, validate (wss://), verify network, and persist per chain
    • Real-time connection checks with "Checking"/"Saved" status and clipboard paste/clear controls
    • Custom endpoint appears in endpoint lists and integrates with auto/manual selection
  • UI Improvements

    • Input fields now support optional end adornments for additional controls
  • Documentation

    • Updated translations for DE/EN/ES/FR/HI/PT/RU/ZH

Review Change Stack

@qodo-code-review
Copy link
Copy Markdown

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 24, 2026

Warning

Review limit reached

@Nick-1979, we couldn't start this review because you've used your available PR reviews for now.

Your plan includes 1 review of capacity. Refill in 46 minutes and 54 seconds.

Your organization has run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After more review capacity refills, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than trial, open-source, and free plans. In all cases, review capacity refills continuously over time.

Please see our FAQ for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 38aa70f3-0f72-4393-95af-f3eab6b55c31

📥 Commits

Reviewing files that changed from the base of the PR and between 2f8324c and 3d97ce8.

📒 Files selected for processing (9)
  • packages/extension-polkagate/src/hooks/useCustomEndpoint.ts
  • packages/extension-polkagate/src/hooks/useEndpoints.ts
  • packages/extension/public/locales/de/translation.json
  • packages/extension/public/locales/es/translation.json
  • packages/extension/public/locales/fr/translation.json
  • packages/extension/public/locales/hi/translation.json
  • packages/extension/public/locales/pt/translation.json
  • packages/extension/public/locales/ru/translation.json
  • packages/extension/public/locales/zh/translation.json
📝 Walkthrough

Walkthrough

This PR adds custom RPC endpoint configuration per chain: persistent storage and types, a per-genesis hook, UI for adding/editing/removing endpoints with wss:// validation and genesis-hash verification, integration into fullscreen and popup endpoint lists, and translations for the new UI strings.

Changes

Custom RPC Endpoint Management

Layer / File(s) Summary
Storage & Type Schema
packages/extension-polkagate/src/util/constants.ts, packages/extension-polkagate/src/util/types.ts
Adds STORAGE_KEY.CUSTOM_ENDPOINTS constant and CustomEndpoints type alias (Record<string, string>) to define the storage shape for per-genesis-hash endpoint mappings.
Custom Endpoint State Hook
packages/extension-polkagate/src/hooks/useCustomEndpoint.ts, packages/extension-polkagate/src/hooks/index.ts
Implements useCustomEndpoint(genesisHash) hook that loads, watches, and persists custom endpoint data via getAndWatchStorage and updateStorage. Exposes customEndpoint, setCustomEndpoint, and removeCustomEndpoint API. Re-exported from hooks barrel.
Endpoint Selection Integration
packages/extension-polkagate/src/hooks/useEndpoints.ts, packages/extension-polkagate/src/hooks/useChainSelectionSettings.ts, packages/extension-polkagate/src/fullscreen/settings/partials/useEndpointsSetting.ts
useEndpoints appends custom RPC option when available. useChainSelectionSettings merges user-added endpoint chains into dropdown. useEndpointsSetting adds SET_AUTO reducer action and new onSelectAuto, onSelectEndpoint callbacks for explicit endpoint selection.
Text Input Enhancement
packages/extension-polkagate/src/components/MyTextField.tsx
Adds optional endAdornment?: React.ReactNode prop to MyTextField for rendering UI at input end (paste/clear buttons). Wraps adornment in MUI InputAdornment.
Custom Endpoint Form Component
packages/extension-polkagate/src/popup/settings/extensionSettings/CustomEndpoint.tsx
New component: manages endpoint text, validation state, form open/close; sanitizes input; detects duplicates; validates wss:// format; connects via ApiPromise with timeout and genesis-hash verification; persists via setCustomEndpoint; supports removal and clipboard paste. Returns error on network mismatch or validation failure; scrolls container on error.
Fullscreen Settings Integration
packages/extension-polkagate/src/fullscreen/settings/partials/Endpoints.tsx
Imports CustomEndpoint and selection handlers from useEndpointsSetting; computes endpointValues and scrollToEnd callback; updates container styling (boxSizing), fade overlay height/ratio, and border radius; renders CustomEndpoint with disabled state, existing endpoints, and selection callbacks.
Popup Settings Integration
packages/extension-polkagate/src/popup/settings/extensionSettings/Endpoints.tsx
Mirrors fullscreen integration: adds useMemo/useRef hooks, creates refContainer for scroll management, derives theme colors, extends useEndpointsSetting destructuring, computes endpointValues and scrollToEnd, and renders CustomEndpoint with full prop wiring.
Localization Strings
packages/extension/public/locales/{en,de,es,fr,hi,pt,ru,zh}/translation.json
Adds UI strings for custom RPC management: duplicate detection, network unavailable, invalid wss://, connection failures, endpoint-network mismatch, save failures, edit/add labels, "Saved" and "Checking" status messages across all eight language files.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

Suggested labels

new feature

Suggested reviewers

  • AMIRKHANEF

Poem

🐰 Custom endpoints, a gift so fine,
Users now choose where to align,
Validation checks the RPC's soul,
Network tests ensure it's whole,
One more chain, under their control!

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 8.33% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly summarizes the main feature addition: allowing users to add custom RPC endpoints, which directly corresponds to the primary changeset.
Linked Issues check ✅ Passed The changes comprehensively implement the requirement from issue #2166 to enable users to add custom RPC endpoints with UI, persistence, and management capabilities.
Out of Scope Changes check ✅ Passed All changes are directly related to implementing custom RPC endpoint functionality; no unrelated modifications were detected outside the stated objectives.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch addCustomRpc

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@Nick-1979 Nick-1979 self-assigned this May 24, 2026
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 5

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/extension-polkagate/src/hooks/useCustomEndpoint.ts`:
- Around line 41-46: The deletion currently copies in-memory customEndpoints and
persists the whole map which can overwrite concurrent updates; update
useCustomEndpoint to first read the latest storage snapshot for
STORAGE_KEY.CUSTOM_ENDPOINTS (via setStorage's backing read or the storage
getter used elsewhere), remove only the entry for genesisHash from that fresh
snapshot, and then call setStorage(STORAGE_KEY.CUSTOM_ENDPOINTS,
updatedSnapshot); reference the existing symbols customEndpoints, genesisHash,
setStorage and STORAGE_KEY.CUSTOM_ENDPOINTS when making the change to ensure you
don't rely on possibly stale in-memory customEndpoints.

In `@packages/extension-polkagate/src/hooks/useEndpoints.ts`:
- Line 94: Replace the hardcoded label in useEndpoints.ts where you return
[...baseEndpoints, { text: 'Custom RPC', value: customEndpoint }] with the i18n
translation call using the previously added translation key for this feature
(use the file's translation helper, e.g., t('<existing_key>')). In short: find
the return that appends the customEndpoint option and swap the literal 'Custom
RPC' for the translated string (via the module's t/useTranslation helper) so the
option label uses the existing translation key.

In `@packages/extension/public/locales/de/translation.json`:
- Around line 959-970: The German locale is missing the new translation key
"{{mode}} enabled" which causes fallback to English; add an entry for the
"{{mode}} enabled" key in the existing translation JSON
(packages/extension/public/locales/de/translation.json) with an appropriate
German string (e.g., "{{mode}} aktiviert") ensuring the key matches exactly
including braces and spacing so that whatever code uses "{{mode}} enabled" will
resolve to the German text.

In `@packages/extension/public/locales/es/translation.json`:
- Around line 959-970: Add the missing translation key "{{mode}} enabled" to the
Spanish localization by inserting an entry for the exact key "{{mode}} enabled"
with an appropriate Spanish value (e.g., "Modo {{mode}} habilitado" or similar)
in the same JSON block where RPC-related keys like "Edit Custom RPC" and "Saved"
are defined so the runtime will use the localized string instead of the
untranslated key.

In `@packages/extension/public/locales/fr/translation.json`:
- Around line 959-970: Missing translation key "{{mode}} enabled": add the same
key to the French translation JSON and provide a localized value that preserves
the placeholder (for example "{{mode}} activé" or appropriate gendered form),
ensuring the JSON key is exactly "{{mode}} enabled" and the value keeps the
{{mode}} token intact; place it near the related RPC/endpoint keys (e.g., near
"Saved" / "Checking") and validate the JSON remains well-formed after insertion.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 0da0b0fd-8c36-4952-9e05-433f615ff058

📥 Commits

Reviewing files that changed from the base of the PR and between 69cf254 and a835d49.

📒 Files selected for processing (19)
  • packages/extension-polkagate/src/components/MyTextField.tsx
  • packages/extension-polkagate/src/fullscreen/settings/partials/Endpoints.tsx
  • packages/extension-polkagate/src/fullscreen/settings/partials/useEndpointsSetting.ts
  • packages/extension-polkagate/src/hooks/index.ts
  • packages/extension-polkagate/src/hooks/useChainSelectionSettings.ts
  • packages/extension-polkagate/src/hooks/useCustomEndpoint.ts
  • packages/extension-polkagate/src/hooks/useEndpoints.ts
  • packages/extension-polkagate/src/popup/settings/extensionSettings/CustomEndpoint.tsx
  • packages/extension-polkagate/src/popup/settings/extensionSettings/Endpoints.tsx
  • packages/extension-polkagate/src/util/constants.ts
  • packages/extension-polkagate/src/util/types.ts
  • packages/extension/public/locales/de/translation.json
  • packages/extension/public/locales/en/translation.json
  • packages/extension/public/locales/es/translation.json
  • packages/extension/public/locales/fr/translation.json
  • packages/extension/public/locales/hi/translation.json
  • packages/extension/public/locales/pt/translation.json
  • packages/extension/public/locales/ru/translation.json
  • packages/extension/public/locales/zh/translation.json

Comment thread packages/extension-polkagate/src/hooks/useCustomEndpoint.ts Outdated
Comment thread packages/extension-polkagate/src/hooks/useEndpoints.ts Outdated
Comment thread packages/extension/public/locales/de/translation.json
Comment thread packages/extension/public/locales/es/translation.json
Comment thread packages/extension/public/locales/fr/translation.json
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/extension-polkagate/src/hooks/useCustomEndpoint.ts`:
- Around line 41-47: The removeCustomEndpoint flow can throw if getStorage or
setStorage rejects, breaking the Promise<boolean> contract; update the
removeCustomEndpoint implementation (the block that reads
STORAGE_KEY.CUSTOM_ENDPOINTS, creates updated = { ...(latestCustomEndpoints ??
{}) }, deletes updated[genesisHash], then calls setStorage) to wrap the async
storage calls in a try/catch and return false on any error; on success return
the boolean result from setStorage (or true) so callers always receive a
resolved Promise<boolean> and storage errors are swallowed/handled gracefully.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a6ad7b66-6540-4d62-840b-f3892691d654

📥 Commits

Reviewing files that changed from the base of the PR and between a835d49 and 2f8324c.

📒 Files selected for processing (1)
  • packages/extension-polkagate/src/hooks/useCustomEndpoint.ts

Comment thread packages/extension-polkagate/src/hooks/useCustomEndpoint.ts Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

let users add their own rpc for a chain besides existing endpoints

1 participant