add modifications

pull/5370/head
Joseph Izang 2 years ago
parent 5e07c43977
commit 109b60ee36
  1. 33
      libs/remix-ui/checkbox/src/lib/remix-ui-checkbox.tsx
  2. 3
      libs/remix-ui/helper/src/lib/components/custom-tooltip.tsx
  3. 3
      libs/remix-ui/helper/src/types/customtooltip.ts
  4. 30
      libs/remix-ui/run-tab/src/lib/components/contractDropdownUI.tsx
  5. 2
      libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx
  6. 1
      libs/remix-ui/static-analyser/src/lib/remix-ui-static-analyser.tsx
  7. 4
      libs/remix-ui/vertical-icons-panel/src/lib/components/Icon.tsx

@ -37,7 +37,12 @@ export const RemixUiCheckbox = ({
tooltipPlacement = 'right'
}: RemixUiCheckboxProps) => {
const childJSX = (
const childJSXWithTooltip = (
<CustomTooltip
tooltipText={title}
tooltipId={`${name}Tooltip`}
placement={tooltipPlacement}
>
<div className="listenOnNetwork_2A0YE0 custom-control custom-checkbox" style={{ display: display, alignItems: 'center', visibility: visibility } as CSSProperties } onClick={onClick}>
<input
id={id}
@ -53,15 +58,27 @@ export const RemixUiCheckbox = ({
{label}
</label>
</div>
</CustomTooltip>
)
const childJSX = (
<div className="listenOnNetwork_2A0YE0 custom-control custom-checkbox" style={{ display: display, alignItems: 'center', visibility: visibility } as CSSProperties } onClick={onClick}>
<input
id={id}
type={inputType}
onChange={onChange}
style={{ verticalAlign: 'bottom' }}
name={name}
className="custom-control-input"
checked={checked}
/>
<label className="form-check-label custom-control-label" id={`heading${categoryId}`} style={{ paddingTop: '0.15rem' }}>
{name ? <div className="font-weight-bold">{itemName}</div> : ''}
{label}
</label>
</div>
)
return (
<CustomTooltip
tooltipText={title}
tooltipId={`${name}Tooltip`}
placement={tooltipPlacement}
>
{childJSX}
</CustomTooltip>
title ? (childJSXWithTooltip) : (childJSX)
)
}

@ -4,7 +4,7 @@ import { OverlayTrigger, Tooltip } from 'react-bootstrap';
import { CustomTooltipType } from '../../types/customtooltip'
export function CustomTooltip({ children, placement, tooltipId, tooltipClasses, tooltipText, tooltipTextClasses }: CustomTooltipType) {
export function CustomTooltip({ children, placement, tooltipId, tooltipClasses, tooltipText, tooltipTextClasses, delay }: CustomTooltipType) {
return (
<Fragment>
@ -15,6 +15,7 @@ export function CustomTooltip({ children, placement, tooltipId, tooltipClasses,
{typeof tooltipText === 'string' ? (<span className={tooltipTextClasses}>{tooltipText}</span>) : (tooltipText)}
</Tooltip>
}
delay={delay}
>
{children}
</OverlayTrigger>

@ -1,5 +1,5 @@
import { Placement } from 'react-bootstrap/esm/Overlay'
import { OverlayTriggerRenderProps } from 'react-bootstrap/esm/OverlayTrigger'
import { OverlayDelay, OverlayTriggerRenderProps } from 'react-bootstrap/esm/OverlayTrigger'
export type CustomTooltipType = {
children: React.ReactElement<any, string | React.JSXElementConstructor<any>> | ((props: OverlayTriggerRenderProps) => React.ReactNode),
@ -8,4 +8,5 @@ export type CustomTooltipType = {
tooltipClasses?:string,
tooltipText: string | JSX.Element,
tooltipTextClasses?: string
delay?: OverlayDelay
}

@ -141,7 +141,7 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
} else {
setAtAddressOptions({
disabled: true,
title: loadedAddress ? 'Compile a *.sol file or select a *.abi file.' : <span className="text-start">To interact with a deployed contract either,<br /> enter its address and compile its source *.sol file <br />(with the same compiler settings) or select its .abi file in the editor. </span>
title: loadedAddress ? 'Compile a *.sol file or select a *.abi file.' : <span className="text-start">To interact with a deployed contract, either<br /> enter its address and compile its source *.sol file <br />(with the same compiler settings) or select its .abi file in the editor. </span>
})
}
}
@ -281,28 +281,22 @@ export function ContractDropdownUI (props: ContractDropdownProps) {
: null}
</div>
<div className="udapp_subcontainer">
{contractOptions.disabled ? (
<select ref={contractsRef} value={currentContract} onChange={handleContractChange} className="udapp_contractNames custom-select" disabled={contractOptions.disabled} style={{ display: loadType === 'abi' && !isContractFile(currentFile) ? 'none' : 'block' }}>
{(contractList[currentFile] || []).map((contract, index) => {
return <option key={index} value={contract.alias}>
{contract.alias} - {contract.file}
</option>
})}
</select>
) : (<CustomTooltip
<CustomTooltip
placement={"right"}
tooltipClasses="text-nowrap text-left"
tooltipId="remixUdappContractNamesTooltip"
tooltipText={contractOptions.title}
>
<select ref={contractsRef} value={currentContract} onChange={handleContractChange} className="udapp_contractNames custom-select" disabled={contractOptions.disabled} style={{ display: loadType === 'abi' && !isContractFile(currentFile) ? 'none' : 'block' }}>
{(contractList[currentFile] || []).map((contract, index) => {
return <option key={index} value={contract.alias}>
{contract.alias} - {contract.file}
</option>
})}
</select>
</CustomTooltip>)}
<div id="udappcontractNamesWrapper" className="w-100">
<select ref={contractsRef} value={currentContract} onChange={handleContractChange} className="udapp_contractNames custom-select" disabled={contractOptions.disabled} style={{ display: loadType === 'abi' && !isContractFile(currentFile) ? 'none' : 'block', pointerEvents: 'none' }}>
{(contractList[currentFile] || []).map((contract, index) => {
return <option key={index} value={contract.alias}>
{contract.alias} - {contract.file}
</option>
})}
</select>
</div>
</CustomTooltip>
<span className="py-1" style={{ display: abiLabel.display }}>{abiLabel.content}</span>
</div>
<div>

@ -862,7 +862,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
tooltipText={<span>{'Language specification available from Compiler >= v0.5.7'}</span>}
>
<div id="compilerLanguageSelectorWrapper">
<select onChange={(e) => handleLanguageChange(e.target.value)} disabled={state.useFileConfiguration} value={state.language} className="custom-select" id="compilierLanguageSelector">
<select onChange={(e) => handleLanguageChange(e.target.value)} disabled={state.useFileConfiguration} value={state.language} className="custom-select" id="compilierLanguageSelector" style={{ pointerEvents: 'none' }}>
<option data-id={state.language === 'Solidity' ? 'selected' : ''} value='Solidity'>Solidity</option>
<option data-id={state.language === 'Yul' ? 'selected' : ''} value='Yul'>Yul</option>
</select>

@ -431,7 +431,6 @@ export const RemixUiStaticAnalyser = (props: RemixUiStaticAnalyserProps) => {
onClick={event => handleCheckSingle(event, item._index)}
checked={categoryIndex.includes(item._index.toString())}
onChange={() => {}}
title={item.description}
/>
</div>
)

@ -86,9 +86,9 @@ const Icon = ({
return (
<>
<CustomTooltip
placement={name === 'settings' ? 'right' : name === 'search' ? 'bottom' :
name === 'udapp' ? 'bottom' : "top"}
placement={'bottom'}
tooltipText={title}
delay={{ show: 1000, hide: 0 }}
>
<div
className={`remixui_icon m-2 pt-1`}

Loading…
Cancel
Save