Skip to content

Commit

Permalink
move custom cors-proxy to settings
Browse files Browse the repository at this point in the history
  • Loading branch information
drafish committed Jul 8, 2024
1 parent b92c860 commit e1a1a1d
Show file tree
Hide file tree
Showing 7 changed files with 123 additions and 49 deletions.
6 changes: 0 additions & 6 deletions apps/remix-ide/src/app/tabs/locales/en/filePanel.json
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,6 @@
"filePanel.workspace.clone": "Clone Git Repository",
"filePanel.workspace.cloneMessage": "Please provide a valid git repository url.",
"filePanel.workspace.enterGitUrl": "Enter git repository url",
"filePanel.workspace.enterCorsproxyUrl": "Enter cors proxy url, default to be https://corsproxy.remixproject.org/",
"filePanel.workspace.gitRepoUrl": "Git Repo Url:",
"filePanel.workspace.corsProxyUrl": "Cors Proxy Url (Optional):",
"filePanel.workspace.corsproxyText1": "Note: To run CorsProxy on your system, run:",
"filePanel.workspace.corsproxyText2": "Note: Cors Proxy Url must be end with /, such as http://127.0.0.1:9999/",
"filePanel.workspace.corsproxyText3": "For more info, visit: <a>CorsProxy Documentation</a>",
"filePanel.workspace.switch": "Switch To Workspace",
"filePanel.workspace.solghaction": "Adds a preset yml file to run solidity unit tests on github actions CI.",
"filePanel.solghaction": "Solidity Test Workflow",
Expand Down
6 changes: 6 additions & 0 deletions apps/remix-ide/src/app/tabs/locales/en/settings.json
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,12 @@
"settings.email": "EMAIL",
"settings.deleteGithubCredentials": "Delete Github Credentials",
"settings.deleteGitlabCredentials": "Delete Gitlab Credentials",
"settings.url": "URL",
"settings.deleteCorsproxy": "Delete Cors Proxy",
"settings.corsproxyTitle": "Cors Proxy for Git",
"settings.corsproxyText": "Cors Proxy is used to proxy git requests, such as clone, push, pull etc. Follow the commands below to start your own service:",
"settings.corsproxyText2": "Cors Proxy Url must be end with /, default to be https://corsproxy.remixproject.org/",
"settings.corsproxyText3": "For more info, visit: <a>CorsProxy Documentation</a>",
"settings.privateBeeAddress": "PRIVATE BEE ADDRESS",
"settings.postageStampID": "POSTAGE STAMP ID",
"settings.host": "HOST",
Expand Down
82 changes: 82 additions & 0 deletions libs/remix-ui/settings/src/lib/corsproxy-settings.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
import {CopyToClipboard} from '@remix-ui/clipboard'
import {CustomTooltip} from '@remix-ui/helper'
import React, {useEffect, useState} from 'react'
import {FormattedMessage, useIntl} from 'react-intl'
import {CorsproxySettingsProps} from '../types'

export function CorsproxySettings(props: CorsproxySettingsProps) {
const [url, setUrl] = useState<string>('')
const intl = useIntl()

useEffect(() => {
if (props.config) {
const url = props.config.get('settings/corsproxy-url') || 'https://corsproxy.remixproject.org/'

setUrl(url)
}
}, [props.config])

const handleChangeUrlState = (event) => {
setUrl(event.target.value)
}

const saveCorsproxy = () => {
props.saveCorsproxy(url)
}

const removeToken = () => {
setUrl('')
props.removeCorsproxy()
}

return (
<div className="border-top">
<div className="card-body pt-3 pb-2">
<h6 className="card-title">
<FormattedMessage id="settings.corsproxyTitle" />
</h6>
<FormattedMessage id="settings.corsproxyText" />
<div className="p-1 pl-3">
<b>npm install -g @drafish/cors-proxy</b>
</div>
<div className="p-1 pl-3">
<b>cors-proxy start</b>
</div>
<div className="pt-2">
<FormattedMessage
id="settings.corsproxyText2"
/>
</div>
<div className="pt-2">
<FormattedMessage
id="settings.corsproxyText3"
values={{
a: (chunks) => (
<a href="https://github.com/drafish/cors-proxy" target="_blank">
{chunks}
</a>
)
}}
/>
</div>

<div>
<label className="pt-2 mb-0 pb-0">
<FormattedMessage id="settings.url" />:
</label>
<div className="text-secondary mb-0 h6">
<input id="corsproxy" data-id="settingsTabCorsproxy" type="text" className="form-control" onChange={(e) => handleChangeUrlState(e)} value={url} />
<div className="d-flex justify-content-end pt-2">
<input className="btn btn-sm btn-primary ml-2" id="savecorsproxy" data-id="settingsTabSaveCorsproxy" onClick={saveCorsproxy} value={intl.formatMessage({id: 'settings.save'})} type="button"></input>
<CustomTooltip tooltipText={<FormattedMessage id="settings.deleteCorsproxy" />} tooltipClasses="text-nowrap" tooltipId="removecorsproxyTooltip" placement="top-start">
<button className="btn btn-sm btn-secondary ml-2" id="removecorsproxy" data-id="settingsTabRemoveCorsproxy" onClick={removeToken}>
<FormattedMessage id="settings.remove" />
</button>
</CustomTooltip>
</div>
</div>
</div>
</div>
</div>
)
}
12 changes: 12 additions & 0 deletions libs/remix-ui/settings/src/lib/remix-ui-settings.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ import {
useMatomoAnalytics,
saveTokenToast,
removeTokenToast,
saveCorsproxyToast,
removeCorsproxyToast,
saveSwarmSettingsToast,
saveIpfsSettingsToast,
useAutoCompletion,
Expand All @@ -31,6 +33,7 @@ import { RemixUiLocaleModule, LocaleModule } from '@remix-ui/locale-module'
import { FormattedMessage, useIntl } from 'react-intl'
import { GithubSettings } from './github-settings'
import { GitlabSettings } from './gitlab-settings'
import { CorsproxySettings } from './corsproxy-settings'
import { EtherscanSettings } from './etherscan-settings'
import { SindriSettings } from './sindri-settings'

Expand Down Expand Up @@ -605,6 +608,15 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
}}
config={props.config}
/>
<CorsproxySettings
saveCorsproxy={(url: string) => {
saveCorsproxyToast(props.config, dispatchToast, url, 'corsproxy-url')
}}
removeCorsproxy={() => {
removeCorsproxyToast(props.config, dispatchToast, 'corsproxy-url')
}}
config={props.config}
/>
<EtherscanSettings
saveToken={(etherscanToken: string) => {
saveTokenToast(props.config, dispatchToast, etherscanToken, 'etherscan-access-token')
Expand Down
10 changes: 10 additions & 0 deletions libs/remix-ui/settings/src/lib/settingsAction.ts
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,16 @@ export const removeTokenToast = (config, dispatch, key) => {
dispatch({ type: 'removed', payload: { message: 'Credentials removed' } })
}

export const saveCorsproxyToast = (config, dispatch, value, key) => {
config.set('settings/' + key, value)
dispatch({ type: 'save', payload: { message: 'Corsproxy updated' } })
}

export const removeCorsproxyToast = (config, dispatch, key) => {
config.set('settings/' + key, '')
dispatch({ type: 'removed', payload: { message: 'Corsproxy removed' } })
}

export const saveSwarmSettingsToast = (config, dispatch, privateBeeAddress, postageStampId) => {
config.set('settings/swarm-private-bee-address', privateBeeAddress)
config.set('settings/swarm-postage-stamp-id', postageStampId)
Expand Down
13 changes: 13 additions & 0 deletions libs/remix-ui/settings/src/types/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,19 @@ export interface GithubSettingsProps {
}
}

export interface CorsproxySettingsProps {
saveCorsproxy: (url: string) => void,
removeCorsproxy: () => void,
config: {
exists: (key: string) => boolean,
get: (key: string) => string,
set: (key: string, content: string) => void,
clear: () => void,
getUnpersistedProperty: (key: string) => void,
setUnpersistedProperty: (key: string, value: string) => void
}
}

export interface EtherscanSettingsProps {
saveToken: (etherscanToken: string) => void,
removeToken: () => void,
Expand Down
43 changes: 0 additions & 43 deletions libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,6 @@ export function Workspace() {
const workspaceCreateTemplateInput = useRef()
const intl = useIntl()
const cloneUrlRef = useRef<HTMLInputElement>()
const config = global.plugin.registry.get('config').api
const corsproxyUrlRef = useRef<HTMLInputElement>()
const initGitRepoRef = useRef<HTMLInputElement>()
const filteredBranches = selectedWorkspace ? (selectedWorkspace.branches || []).filter((branch) => branch.name.includes(branchFilter) && branch.name !== 'HEAD').slice(0, 20) : []
const currentBranch = selectedWorkspace ? selectedWorkspace.currentBranch : null
Expand Down Expand Up @@ -557,9 +555,6 @@ export function Workspace() {
const handleTypingUrl = () => {
const url = cloneUrlRef.current.value

const corsproxy = corsproxyUrlRef.current.value
config.set('corsproxy', corsproxy)

if (url) {
global.dispatchCloneRepository(url)
} else {
Expand Down Expand Up @@ -1046,7 +1041,6 @@ export function Workspace() {
const cloneModalMessage = () => {
return (
<>
<div><FormattedMessage id="filePanel.workspace.gitRepoUrl" /></div>
<input
type="text"
data-id="modalDialogCustomPromptTextClone"
Expand All @@ -1056,43 +1050,6 @@ export function Workspace() {
ref={cloneUrlRef}
className="form-control"
/>
<div className="pt-4"><FormattedMessage id="filePanel.workspace.corsProxyUrl" /></div>
<input
type="text"
data-id="modalDialogCustomPromptTextCorsproxy"
placeholder={intl.formatMessage({
id: 'filePanel.workspace.enterCorsproxyUrl'
})}
ref={corsproxyUrlRef}
defaultValue={config.get('corsproxy')}
className="form-control"
/>
<div className="pt-2">
<FormattedMessage id="filePanel.workspace.corsproxyText1" />
<div className="p-1 pl-3">
<b>npm install -g @drafish/cors-proxy</b>
</div>
<div className="p-1 pl-3">
<b>cors-proxy start</b>
</div>
<div className="pt-2">
<FormattedMessage
id="filePanel.workspace.corsproxyText2"
/>
</div>
<div className="pt-2">
<FormattedMessage
id="filePanel.workspace.corsproxyText3"
values={{
a: (chunks) => (
<a href="https://github.com/drafish/cors-proxy" target="_blank">
{chunks}
</a>
)
}}
/>
</div>
</div>
</>
)
}
Expand Down

0 comments on commit e1a1a1d

Please sign in to comment.