-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(ptokens-dapp): add support for personalized endpoints
fix: add style settings feat: add theme for settings button refactor(API-key-config): update layout
- Loading branch information
Showing
12 changed files
with
315 additions
and
29 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| export const getWeb3Settings = () => ({ | ||
| eth: 'https://cloudflare-eth.com/', | ||
| eos: 'https://corsproxy.ptokens.io/v1/?apiurl=https://eos.greymass.com', | ||
| telos: 'https://telos.eosphere.io', | ||
| libre: 'https://libre-node-2.ptokens.io:8889', | ||
| bsc: 'https://bsc-dataseed1.binance.org/', | ||
| xdai: 'https://rpc.xdaichain.com/', | ||
| polygon: 'https://polygon-rpc.com/', | ||
| ultra: 'https://corsproxy.ptokens.io/v1/?apiurl=http://ultra-mainnet-1.ptokens.io:8888', | ||
| arbitrum: 'https://arb1.arbitrum.io/rpc', | ||
| luxochain: 'https://corsproxy.ptokens.io/v1/?apiurl=https://lugano.nodes.luxochain.io', | ||
| algorand: 'https://algorand-node-1.ptokens.io', | ||
| ftm: 'https://rpc.ftm.tools/', | ||
| ore: 'https://ore-node-1.ptokens.io', | ||
| btc: 'https://blockstream.info/api/', | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,28 +1,58 @@ | ||
| import React from 'react' | ||
| import { Web3SettingsButton } from 'react-web3-settings' | ||
| import styled from 'styled-components' | ||
|
|
||
| const VersionDiv = styled.div` | ||
| background: transparent; | ||
| position: fixed; | ||
| bottom: 0; | ||
| right: 0; | ||
| padding-right: 30px; | ||
| padding-bottom: 10px; | ||
| padding-right: 1rem; | ||
| padding-bottom: 1rem; | ||
| ` | ||
|
|
||
| const VersionContainer = styled.p` | ||
| const ContainerOptions = styled.div` | ||
| justify-content: right !important; | ||
| display: flex; | ||
| color: ${({ theme }) => theme.text2}; | ||
| font-size: 13px; | ||
| @media (max-width: 767.98px) { | ||
| display: none; | ||
| } | ||
| ` | ||
|
|
||
| const VersionButton = styled.button` | ||
| width: auto; | ||
| color: white; | ||
| border-radius: 3px; | ||
| font-size: 15px; | ||
| font-weight: 300; | ||
| height: 40px; | ||
| border: 0; | ||
| padding-left: 10px; | ||
| padding-right: 10px; | ||
| font-weight: 400; | ||
| border-radius: 10px; | ||
| outline: none !important; | ||
| background: ${({ theme }) => theme.secondary4}; | ||
| &:hover { | ||
| background: ${({ theme }) => theme.secondary4Hovered}; | ||
| } | ||
| color: ${({ theme }) => theme.text1}; | ||
| @media (max-width: 767.98px) { | ||
| height: 35px; | ||
| } | ||
| ` | ||
|
|
||
| export default function Version() { | ||
| const githubLink = | ||
| 'https://github.com/pnetwork-association/ptokens-dapp/tree/' + import.meta.env.VITE_REACT_APP_GIT_SHA | ||
| return ( | ||
| <VersionDiv className="version-div"> | ||
| <VersionContainer className="version-container"> | ||
| Version: {import.meta.env.VITE_REACT_APP_GIT_SHA} | ||
| </VersionContainer> | ||
| <VersionDiv> | ||
| <ContainerOptions> | ||
| <VersionButton onClick={() => window.open(githubLink, '_blank', 'noopener,noreferrer')}> | ||
| Version: {import.meta.env.VITE_REACT_APP_GIT_SHA} | ||
| </VersionButton> | ||
| <Web3SettingsButton className={'api-button'} iconClassName={'api-icon'}></Web3SettingsButton> | ||
| </ContainerOptions> | ||
| </VersionDiv> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,117 @@ | ||
| import React, { useContext } from 'react' | ||
| import { Web3SettingsProvider } from 'react-web3-settings' | ||
| import { ThemeContext } from 'styled-components' | ||
|
|
||
| import settings from '../../../settings' | ||
| import generateSettings from '../../../settings/utils' | ||
|
|
||
| const SettingsDrawer = ({ children }) => { | ||
| const theme = useContext(ThemeContext) | ||
|
|
||
| const buttonSaveStyle = { | ||
| color: 'white', | ||
| background: `${theme.primary1}`, | ||
| fontSize: '16px', | ||
| borderRadius: '10px', | ||
| border: '0', | ||
| padding: '5px 10px 5px 10px', | ||
| } | ||
|
|
||
| const buttonResetStyle = { | ||
| color: 'white', | ||
| background: `${theme.secondary2}`, | ||
| fontSize: '16px', | ||
| borderRadius: '10px', | ||
| border: '0', | ||
| padding: '5px 10px 5px 10px', | ||
| marginLeft: '10px', | ||
| } | ||
|
|
||
| const titleStyle = { | ||
| color: `${theme.text1}`, | ||
| fontSize: '1.5rem', | ||
| fontWeight: '500', | ||
| } | ||
|
|
||
| const drawerStyle = { | ||
| background: `${theme.bg1}`, | ||
| display: 'flex', | ||
| flexDirection: 'column', | ||
| } | ||
|
|
||
| const bodyStyle = { | ||
| overflowY: 'auto', | ||
| marginBottom: '4.3rem', | ||
| } | ||
|
|
||
| const headerStyle = { | ||
| paddingBottom: '0px', | ||
| } | ||
|
|
||
| const inputStyle = { | ||
| border: '0', | ||
| outline: '0px !important', | ||
| WebkitAppearance: 'none', | ||
| boxShadow: 'none !important', | ||
| textAlign: 'left', | ||
| fontSize: '16px', | ||
| color: `${theme.secondary1}`, | ||
| width: '75%', | ||
| marginLeft: '1rem', | ||
| background: `${theme.secondary4}`, | ||
| borderRadius: '5px', | ||
| } | ||
|
|
||
| const sectionLabelStyle = { | ||
| color: `${theme.text1}`, | ||
| fontSize: '1.25rem', | ||
| fontWeight: '350', | ||
| marginBottom: '0px', | ||
| } | ||
|
|
||
| const sectionRowStyle = { | ||
| marginTop: '2.5rem', | ||
| } | ||
|
|
||
| const settingRowStyle = { | ||
| color: `${theme.text2}`, | ||
| marginTop: '1rem', | ||
| display: 'flex', | ||
| justifyContent: 'space-between', | ||
| } | ||
|
|
||
| const buttonAreaStyle = { | ||
| position: 'absolute', | ||
| bottom: '0px', | ||
| right: '1rem', | ||
| marginBottom: '1rem', | ||
| } | ||
|
|
||
| const labelStyle = { | ||
| marginTop: '0.25rem', | ||
| marginBottom: '0.25rem', | ||
| } | ||
|
|
||
| return ( | ||
| <Web3SettingsProvider | ||
| title={'RPC Endpoint Settings'} | ||
| drawerStyle={drawerStyle} | ||
| bodyStyle={bodyStyle} | ||
| buttonSaveStyle={buttonSaveStyle} | ||
| buttonResetStyle={buttonResetStyle} | ||
| titleStyle={titleStyle} | ||
| headerStyle={headerStyle} | ||
| inputStyle={inputStyle} | ||
| sectionLabelStyle={sectionLabelStyle} | ||
| sectionRowStyle={sectionRowStyle} | ||
| settingRowStyle={settingRowStyle} | ||
| buttonAreaStyle={buttonAreaStyle} | ||
| labelStyle={labelStyle} | ||
| settings={generateSettings(settings.rpc.mainnet)} | ||
| > | ||
| {children} | ||
| </Web3SettingsProvider> | ||
| ) | ||
| } | ||
|
|
||
| export default SettingsDrawer |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,34 @@ | ||
| import { test, describe, expect } from 'vitest' | ||
| import generateRpcSettings from '../utils' | ||
|
|
||
| describe('generateRpcSettings', () => { | ||
| test('Should generate a setting object for https://www.npmjs.com/package/react-web3-settings', () => { | ||
| const settings = { | ||
| eos: { | ||
| chainId: 'aca376f206b8fc25a6ed44dbdc66547c36c6c33e3a119ffbeaef943642f0e906', | ||
| host: 'https://eos.greymass.com', | ||
| port: 443, | ||
| protocol: 'https', | ||
| endpoint: 'https://corsproxy.ptokens.io/v1/?apiurl=https://eos.greymass.com', | ||
| label: 'Eos', | ||
| }, | ||
| ftm: { | ||
| endpoint: 'https://rpc.ftm.tools/', | ||
| chainId: 250, | ||
| label: 'Ftm', | ||
| }, | ||
| } | ||
| const expected = { | ||
| eos: { | ||
| label: 'Eos', | ||
| value: 'https://corsproxy.ptokens.io/v1/?apiurl=https://eos.greymass.com', | ||
| }, | ||
| ftm: { | ||
| label: 'Ftm', | ||
| value: 'https://rpc.ftm.tools/', | ||
| }, | ||
| } | ||
| const res = generateRpcSettings(settings) | ||
| expect(res).toStrictEqual(expected) | ||
| }) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| const generateRpcSettings = (settings) => | ||
| Object.assign( | ||
| {}, | ||
| Object.fromEntries( | ||
| Object.entries(settings).map(([key, val]) => { | ||
| return [key, { label: val.label, value: val.endpoint }] | ||
| }) | ||
| ) | ||
| ) | ||
|
|
||
| export default generateRpcSettings |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.