mirror
/
remix-project
mirror of https://github.com/ethereum/remix-project.git
2
0
Fork 0
Code Issues Releases Wiki Activity

Merge branch 'master' into multiselect-dragdrop

Browse Source
pull/5370/head
Joseph Izang 8 months ago committed by GitHub
parent 31ca9889de 8833c01eb0
commit 81f3b1766c
5 changed files with 117 additions and 95 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 3
      apps/remix-ide/src/app/tabs/locales/en/filePanel.json
  2. 2
      libs/remix-ui/helper/src/lib/components/custom-dropdown.tsx
  3. 2
      libs/remix-ui/home-tab/src/lib/components/homeTabFeatured.tsx
  4. 4
      libs/remix-ui/workspace/src/lib/css/remix-ui-workspace.css
  5. 201
      libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx

3
apps/remix-ide/src/app/tabs/locales/en/filePanel.json
Unescape View File

@ -141,5 +141,6 @@
"filePanel.movingFolderFailed": "Moving Folder Failed", "filePanel.movingFolderFailed": "Moving Folder Failed",
"filePanel.movingFolderFailedMsg": "Unexpected error while moving folder: {src}", "filePanel.movingFolderFailedMsg": "Unexpected error while moving folder: {src}",
"filePanel.workspaceActions": "Workspace actions", "filePanel.workspaceActions": "Workspace actions",
"filePanel.saveCodeSample": "This code-sample workspace will not be persisted. Click here to save it." "filePanel.saveCodeSample": "This code-sample workspace will not be persisted. Click here to save it.",
"filePanel.updateSubmodules": "Update all submodules of repository. Click to pull dependencies."
} }

2
libs/remix-ui/helper/src/lib/components/custom-dropdown.tsx
Unescape View File

@ -29,7 +29,7 @@ export const CustomToggle = React.forwardRef(
className={className.replace('dropdown-toggle', '')} className={className.replace('dropdown-toggle', '')}
> >
<div className="d-flex"> <div className="d-flex">
<div className="mr-auto text-nowrap overflow-hidden">{children}</div> <div className="mr-auto text-nowrap text-truncate overflow-hidden">{children}</div>
{icon && ( {icon && (
<div className="pr-1"> <div className="pr-1">
<i className={`${icon} pr-1`}></i> <i className={`${icon} pr-1`}></i>

2
libs/remix-ui/home-tab/src/lib/components/homeTabFeatured.tsx
Unescape View File

@ -12,7 +12,7 @@ function HomeTabFeatured() {
const themeFilter = useContext(ThemeContext) const themeFilter = useContext(ThemeContext)
return ( return (
<div className="pt-1 pl-2 h-100" id="hTFeaturedeSection"> <div className="pt-1 pl-2" id="hTFeaturedeSection">
<div className="mb-2 remix_ui-carousel-container"> <div className="mb-2 remix_ui-carousel-container">
<div className="w-100 d-flex flex-column rounded-3 remix_ui-carouselbox"> <div className="w-100 d-flex flex-column rounded-3 remix_ui-carouselbox">
<ThemeContext.Provider value={themeFilter}> <ThemeContext.Provider value={themeFilter}>

4
libs/remix-ui/workspace/src/lib/css/remix-ui-workspace.css
Unescape View File

@ -77,6 +77,10 @@
background: var(--custom-select); background: var(--custom-select);
} }
.branches-dropdown {
max-width: 16rem;
}
.custom-dropdown-items a { .custom-dropdown-items a {
border-radius: .25rem; border-radius: .25rem;
text-transform: none; text-transform: none;

201
libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
Unescape View File

@ -1347,102 +1347,119 @@ export function Workspace() {
</div> </div>
</div> </div>
</div> </div>
{selectedWorkspace && ( { selectedWorkspace && (
<div className={`bg-light border-top ${selectedWorkspace.isGitRepo && currentBranch ? 'd-block' : 'd-none'}`} data-id="workspaceGitPanel"> <div className={`bg-light border-top ${selectedWorkspace.isGitRepo && currentBranch ? 'd-block' : 'd-none'}`} data-id="workspaceGitPanel">
<div className="d-flex justify-space-between p-1"> <div className="d-flex justify-content-between p-1">
<div className="mr-auto text-uppercase text-dark pt-2 px-1">GIT</div> <div className="text-uppercase text-dark pt-1 px-1">GIT</div>
{selectedWorkspace.hasGitSubmodules? { selectedWorkspace.hasGitSubmodules?
<div className="pt-1 mr-1"> <CustomTooltip
{global.fs.browser.isRequestingCloning ? <div style={{ height: 30, minWidth: 165 }} className='btn btn-sm border text-muted small'><i className="fad fa-spinner fa-spin"></i> updating submodules</div> : placement="top"
<div style={{ height: 30, minWidth: 165 }} onClick={updateSubModules} data-id='updatesubmodules' className={`btn btn-sm border small ${highlightUpdateSubmodules ? 'text-warning' : 'text-muted'}`}>update submodules</div>} tooltipId="updateSubmodules"
</div> tooltipClasses="text-nowrap"
: null} tooltipText={<FormattedMessage id="filePanel.updateSubmodules" />}
<div className="pt-1 mr-1" data-id="workspaceGitBranchesDropdown"> >
<Dropdown style={{ height: 30, minWidth: 80 }} onToggle={toggleBranches} show={showBranches} drop={'up'}> <div className="pr-1">
<Dropdown.Toggle { global.fs.browser.isRequestingCloning ? <button style={{ height: 30, minWidth: "9rem" }} className='btn btn-sm border text-dark'>
as={CustomToggle} <i className="fad fa-spinner fa-spin"></i>
id="dropdown-custom-components" Updating submodules
className="btn btn-light btn-block w-100 d-inline-block border border-dark form-control h-100 p-0 pl-2 pr-2 text-dark" </button> :
icon={null} <button style={{ height: 30, minWidth: "9rem" }} onClick={updateSubModules} data-id='updatesubmodules' className={`btn btn-sm border ${highlightUpdateSubmodules ? 'text-warning' : 'text-dark'}`}>
> Update submodules
{global.fs.browser.isRequestingCloning ? <i className="fad fa-spinner fa-spin"></i> : currentBranch || '-none-'} </button> }
</Dropdown.Toggle> </div>
</CustomTooltip>
<Dropdown.Menu as={CustomMenu} className="custom-dropdown-items branches-dropdown"> : null
<div data-id="custom-dropdown-menu"> }
<div className="d-flex text-dark" style={{ fontSize: 14, fontWeight: 'bold' }}> <CustomTooltip
<span className="mt-2 ml-2 mr-auto"> placement="right"
<FormattedMessage id="filePanel.switchBranches" /> tooltipId="branchesDropdown"
</span> tooltipClasses="text-nowrap"
<div tooltipText={'Current branch: ' + currentBranch || 'Branches'}
className="pt-2 pr-2" >
onClick={() => { <div className="pt-0 mr-2" data-id="workspaceGitBranchesDropdown">
toggleBranches(false) <Dropdown style={{ height: 30, maxWidth: "6rem", minWidth: "6rem" }} onToggle={toggleBranches} show={showBranches} drop={'up'}>
}} <Dropdown.Toggle
> as={CustomToggle}
<i className="fa fa-close"></i> id="dropdown-custom-components"
className="btn btn-sm btn-light d-inline-block border border-dark form-control h-100 p-0 pl-2 pr-2 text-dark"
icon={null}
>
{global.fs.browser.isRequestingCloning ? <i className="fad fa-spinner fa-spin"></i> : currentBranch || '-none-'}
</Dropdown.Toggle>
<Dropdown.Menu as={CustomMenu} className="custom-dropdown-items branches-dropdown">
<div data-id="custom-dropdown-menu">
<div className="d-flex text-dark" style={{ fontSize: 14, fontWeight: 'bold' }}>
<span className="mt-2 ml-2 mr-auto">
<FormattedMessage id="filePanel.switchBranches" />
</span>
<div
className="pt-2 pr-2"
onClick={() => {
toggleBranches(false)
}}
>
<i className="fa fa-close"></i>
</div>
</div> </div>
</div> <div className="border-top py-2">
<div className="border-top py-2"> <input
<input className="form-control border checkout-input bg-light"
className="form-control border checkout-input bg-light" placeholder={intl.formatMessage({
placeholder={intl.formatMessage({ id: 'filePanel.findOrCreateABranch'
id: 'filePanel.findOrCreateABranch' })}
})} style={{ minWidth: 225 }}
style={{ minWidth: 225 }} onChange={handleBranchFilterChange}
onChange={handleBranchFilterChange} data-id="workspaceGitInput"
data-id="workspaceGitInput" />
/> </div>
</div> <div className="border-top" style={{ maxHeight: 120, overflowY: 'scroll' }} data-id="custom-dropdown-items">
<div className="border-top" style={{ maxHeight: 120, overflowY: 'scroll' }} data-id="custom-dropdown-items"> {filteredBranches.length > 0 ? (
{filteredBranches.length > 0 ? ( filteredBranches.map((branch, index) => {
filteredBranches.map((branch, index) => { return (
return ( <Dropdown.Item
<Dropdown.Item key={index}
key={index} onClick={() => {
onClick={() => { switchToBranch(branch)
switchToBranch(branch) }}
}} title={intl.formatMessage({ id: `filePanel.switchToBranch${branch.remote ? 'Title1' : 'Title2'}` })}
title={intl.formatMessage({ id: `filePanel.switchToBranch${branch.remote ? 'Title1' : 'Title2'}` })} >
> <div data-id={`workspaceGit-${branch.remote ? `${branch.remote}/${branch.name}` : branch.name}`}>
<div data-id={`workspaceGit-${branch.remote ? `${branch.remote}/${branch.name}` : branch.name}`}> {currentBranch === branch.name && !branch.remote ? (
{currentBranch === branch.name && !branch.remote ? ( <span>
<span> &#10003; <i className="far fa-code-branch"></i>
&#10003; <i className="far fa-code-branch"></i> <span className="pl-1">{branch.name}</span>
<span className="pl-1">{branch.name}</span> </span>
</span> ) : (
) : ( <span className="pl-3">
<span className="pl-3"> <i className={`far ${branch.remote ? 'fa-cloud' : 'fa-code-branch'}`}></i>
<i className={`far ${branch.remote ? 'fa-cloud' : 'fa-code-branch'}`}></i> <span className="pl-1">{branch.remote ? `${branch.remote}/${branch.name}` : branch.name}</span>
<span className="pl-1">{branch.remote ? `${branch.remote}/${branch.name}` : branch.name}</span> </span>
</span> )}
)} </div>
</div> </Dropdown.Item>
</Dropdown.Item> )
) })
}) ) : (
) : ( <Dropdown.Item onClick={switchToNewBranch}>
<Dropdown.Item onClick={switchToNewBranch}> <div className="pl-1 pr-1" data-id="workspaceGitCreateNewBranch">
<div className="pl-1 pr-1" data-id="workspaceGitCreateNewBranch"> <i className="fas fa-code-branch pr-2"></i>
<i className="fas fa-code-branch pr-2"></i> <span>
<span> <FormattedMessage id="filePanel.createBranch" />: {branchFilter} from '{currentBranch}'
<FormattedMessage id="filePanel.createBranch" />: {branchFilter} from '{currentBranch}' </span>
</span> </div>
</div> </Dropdown.Item>
</Dropdown.Item> )}
</div>
{(selectedWorkspace.branches || []).length > 4 && (
<button className="btn btn-sm w-100" style={{ cursor: "pointer" }} onClick={showAllBranches}>
<FormattedMessage id="filePanel.viewAllBranches" />
</button>
)} )}
</div> </div>
{(selectedWorkspace.branches || []).length > 4 && ( </Dropdown.Menu>
<div className="text-center border-top pt-2"> </Dropdown>
<label style={{ fontSize: 12, cursor: 'pointer' }} onClick={showAllBranches}> </div>
<FormattedMessage id="filePanel.viewAllBranches" /> </CustomTooltip>
</label>
</div>
)}
</div>
</Dropdown.Menu>
</Dropdown>
</div>
</div> </div>
</div> </div>
)} )}

Write Preview
Loading…
Cancel
Save