diff --git a/apps/remix-ide/src/app.js b/apps/remix-ide/src/app.js index b8953cc0fc..616cba5724 100644 --- a/apps/remix-ide/src/app.js +++ b/apps/remix-ide/src/app.js @@ -13,7 +13,7 @@ import { LandingPage } from './app/ui/landing-page/landing-page' import { MainPanel } from './app/components/main-panel' import { PermissionHandlerPlugin } from './app/plugins/permission-handler-plugin' import { AstWalker } from '@remix-project/remix-astwalker' -import { LinkLibraries, DeployLibraries, OpenZeppelinProxy, CodeParser } from '@remix-project/core-plugin' +import { LinkLibraries, DeployLibraries, OpenZeppelinProxy, CodeParser, FileStates } from '@remix-project/core-plugin' import { WalkthroughService } from './walkthroughService' @@ -204,6 +204,7 @@ class AppComponent { ) const contextualListener = new EditorContextListener(new AstWalker()) const codeParser = new CodeParser(new AstWalker()) + const fileStates = new FileStates() this.notification = new NotificationPlugin() @@ -229,6 +230,7 @@ class AppComponent { offsetToLineColumnConverter, contextualListener, codeParser, + fileStates, terminal, web3Provider, compileAndRun, @@ -355,7 +357,7 @@ class AppComponent { await this.appManager.activatePlugin(['sidePanel']) // activating host plugin separately await this.appManager.activatePlugin(['home']) await this.appManager.activatePlugin(['settings', 'config']) - await this.appManager.activatePlugin(['hiddenPanel', 'pluginManager', 'contextualListener', 'codeParser', 'terminal', 'blockchain', 'fetchAndCompile', 'contentImport', 'gistHandler']) + await this.appManager.activatePlugin(['hiddenPanel', 'pluginManager', 'contextualListener', 'codeParser', 'fileStates', 'terminal', 'blockchain', 'fetchAndCompile', 'contentImport', 'gistHandler']) await this.appManager.activatePlugin(['settings']) await this.appManager.activatePlugin(['walkthrough','storage', 'search','compileAndRun']) diff --git a/apps/remix-ide/src/app/components/hidden-panel.tsx b/apps/remix-ide/src/app/components/hidden-panel.tsx index 31c7a0cb0b..0d0fc06a44 100644 --- a/apps/remix-ide/src/app/components/hidden-panel.tsx +++ b/apps/remix-ide/src/app/components/hidden-panel.tsx @@ -5,6 +5,7 @@ import * as packageJson from '../../../../../package.json' import { RemixPluginPanel } from '@remix-ui/panel' import { PluginViewWrapper } from '@remix-ui/helper' + const profile = { name: 'hiddenPanel', displayName: 'Hidden Panel', diff --git a/apps/remix-ide/src/app/panels/file-panel.js b/apps/remix-ide/src/app/panels/file-panel.js index 9bd770b813..1461a648f8 100644 --- a/apps/remix-ide/src/app/panels/file-panel.js +++ b/apps/remix-ide/src/app/panels/file-panel.js @@ -85,9 +85,9 @@ module.exports = class Filepanel extends ViewPlugin { }) } - async setFileState (items) { - console.log(items) - this.emit('setFileState', items) + async setFileState (fileState) { + console.log(fileState) + this.emit('setFileState', fileState) } getCurrentWorkspace () { diff --git a/apps/remix-ide/src/app/panels/tab-proxy.js b/apps/remix-ide/src/app/panels/tab-proxy.js index 82758c169f..e6a0c1bead 100644 --- a/apps/remix-ide/src/app/panels/tab-proxy.js +++ b/apps/remix-ide/src/app/panels/tab-proxy.js @@ -169,6 +169,10 @@ export class TabProxy extends Plugin { this.on('manager', 'pluginDeactivated', (profile) => { this.removeTab(profile.name) }) + + this.on('fileStates', 'fileStateChanged', async (items) => { + this.tabsApi.setFileStates(items) + }) try { this.themeQuality = (await this.call('theme', 'currentTheme') ).quality @@ -306,6 +310,7 @@ export class TabProxy extends Plugin { updateComponent(state) { return { if (this.loadedTabs[index]) { const name = this.loadedTabs[index].name @@ -339,6 +345,7 @@ export class TabProxy extends Plugin { const onReady = (api) => { this.tabsApi = api } this.dispatch({ + plugin: this, loadedTabs: this.loadedTabs, onSelect, onClose, diff --git a/libs/remix-analyzer/src/solidity-analyzer/modules/abstractAstView.ts b/libs/remix-analyzer/src/solidity-analyzer/modules/abstractAstView.ts index 0febc41dc1..761def1e33 100644 --- a/libs/remix-analyzer/src/solidity-analyzer/modules/abstractAstView.ts +++ b/libs/remix-analyzer/src/solidity-analyzer/modules/abstractAstView.ts @@ -9,6 +9,7 @@ import { FunctionHLAst, ReportObj, ReportFunction, VisitFunction, ModifierHLAst, CompilationResult } from '../../types' + type WrapFunction = ((contracts: ContractHLAst[], isSameName: boolean, version: string) => ReportObj[]) export default class abstractAstView { diff --git a/libs/remix-core-plugin/src/index.ts b/libs/remix-core-plugin/src/index.ts index 9e29f80a15..413f67aa4a 100644 --- a/libs/remix-core-plugin/src/index.ts +++ b/libs/remix-core-plugin/src/index.ts @@ -9,3 +9,4 @@ export * from './types/contract' export { LinkLibraries, DeployLibraries } from './lib/link-libraries' export { OpenZeppelinProxy } from './lib/openzeppelin-proxy' export { CodeParser } from './lib/code-parser' +export { FileStates } from './lib/file-states' diff --git a/libs/remix-core-plugin/src/lib/code-parser.tsx b/libs/remix-core-plugin/src/lib/code-parser.tsx index 010568e32d..5bc107ce4c 100644 --- a/libs/remix-core-plugin/src/lib/code-parser.tsx +++ b/libs/remix-core-plugin/src/lib/code-parser.tsx @@ -8,8 +8,10 @@ import { AstNode, CompilationError, CompilationResult, CompilationSource } from import { helper } from '@remix-project/remix-solidity' import React from 'react' +import { fileState, fileStateType } from '@remix-ui/file-states' // eslint-disable-next-line -import { fileState, fileStateType } from '@remix-ui/workspace' + + const SolidityParser = (window as any).SolidityParser = (window as any).SolidityParser || [] const profile = { @@ -111,12 +113,18 @@ export class CodeParser extends Plugin { } console.log('allErrors', allErrors) await this.call('editor', 'addErrorMarker', allErrors) + + for(const error of allErrors){ + + } + + try { let fileState:fileState = { path: this.currentFile, isDirectory: false, - fileStateType: [fileStateType.Custom], + fileStateType: fileStateType.Custom, fileStateLabelClass: 'text-success', fileStateIconClass: '', fileStateIcon: , @@ -124,27 +132,53 @@ export class CodeParser extends Plugin { owner: 'code-parser', bubble: true } - await this.call('filePanel', 'setFileState', [fileState]) + await this.call('fileStates', 'setFileState', fileState) fileState = { ...fileState, - path: 'contracts/1_Storage.sol', fileStateLabelClass: 'text-danger', fileStateIcon: , } - await this.call('filePanel', 'setFileState', [fileState]) fileState = { ...fileState, path: 'scripts/ethers-lib.ts', fileStateLabelClass: 'text-danger', - fileStateIcon:
  • call rob now!
    , + fileStateIcon:
    call rob now!
    , } - await this.call('filePanel', 'setFileState', [fileState]) + await this.call('fileStates', 'setFileState', fileState) + + const states:fileState[] = [ + { + path: 'contracts/2_Owner.sol', + isDirectory: false, + fileStateType: fileStateType.Custom, + fileStateLabelClass: 'text-success', + fileStateIconClass: '', + fileStateIcon: , + comment: '', + owner: 'code-parser', + bubble: true + }, + { + path: 'contracts/2_Owner.sol', + isDirectory: false, + fileStateType: fileStateType.Custom, + fileStateLabelClass: 'text-danger', + fileStateIconClass: '', + fileStateIcon: , + comment: '', + owner: 'code-parser', + bubble: true + } + ] + + await this.call('fileStates', 'setFileState', states) + - } catch (e) { + } catch (e) { console.log('error calling filePanel', e) } } else { - await this.call('filePanel', 'setFileState', [{ + await this.call('fileStates', 'setFileState', [{ path: this.currentFile, isDirectory: false, fileStateType: [], diff --git a/libs/remix-core-plugin/src/lib/file-states.ts b/libs/remix-core-plugin/src/lib/file-states.ts new file mode 100644 index 0000000000..f0a91d0c7e --- /dev/null +++ b/libs/remix-core-plugin/src/lib/file-states.ts @@ -0,0 +1,57 @@ +'use strict' + +import { default as deepequal } from 'deep-equal' // eslint-disable-line + +import { Plugin } from '@remixproject/engine' +import { fileState } from '@remix-ui/file-states' + +const profile = { + name: 'fileStates', + desciption: 'Keeps state of the files', + methods: ['setFileState'], + events: ['fileStateChanged'], + version: '0.0.1' +} + +export class FileStates extends Plugin { + private _fileStates: fileState[] = [] + constructor() { + super(profile) + } + /** + * + * @param fileStates Array of file states + */ + async setFileState(fileStates: fileState[] | fileState) { + const workspace = await this.call('filePanel', 'getCurrentWorkspace') + function sortByPath( a, b ) { + if ( a.path < b.path ){ + return -1; + } + if ( a.path > b.path ){ + return 1; + } + return 0; + } + + const fileStatesPayload = Array.isArray(fileStates) ? fileStates : [fileStates] + // clear all file states in the previous state of this owner on the files called + fileStatesPayload.forEach((state) => { + state.workspace = workspace + }) + const filteredState = this._fileStates.filter((state) => { + const index = fileStatesPayload.findIndex((payloadFileState: fileState) => { + return payloadFileState.owner == state.owner && payloadFileState.path == state.path + }) + return index == -1 + }) + const newState = [...filteredState, ...fileStatesPayload].sort(sortByPath) + + if (!deepequal(newState, this._fileStates)) { + this._fileStates = newState + + console.log('fileStates', this._fileStates) + this.emit('fileStateChanged', this._fileStates) + } + } +} \ No newline at end of file diff --git a/libs/remix-core-plugin/tsconfig.lib.json b/libs/remix-core-plugin/tsconfig.lib.json index 4c89a574be..d1f4736244 100644 --- a/libs/remix-core-plugin/tsconfig.lib.json +++ b/libs/remix-core-plugin/tsconfig.lib.json @@ -6,7 +6,6 @@ "allowSyntheticDefaultImports": true, "esModuleInterop": true, "declaration": true, - "rootDir": "./src", "types": ["node"] }, "exclude": [ diff --git a/libs/remix-debug/src/index.ts b/libs/remix-debug/src/index.ts index 5814cee391..4a3f4041d1 100644 --- a/libs/remix-debug/src/index.ts +++ b/libs/remix-debug/src/index.ts @@ -10,6 +10,7 @@ import { BreakpointManager } from './code/breakpointManager' import * as sourceMappingDecoder from './source/sourceMappingDecoder' import * as traceHelper from './trace/traceHelper' + /* Use of breakPointManager : diff --git a/libs/remix-ui/file-states/.babelrc b/libs/remix-ui/file-states/.babelrc new file mode 100644 index 0000000000..09d67939cc --- /dev/null +++ b/libs/remix-ui/file-states/.babelrc @@ -0,0 +1,4 @@ +{ + "presets": ["@nrwl/react/babel"], + "plugins": [] +} diff --git a/libs/remix-ui/file-states/.eslintrc b/libs/remix-ui/file-states/.eslintrc new file mode 100644 index 0000000000..0d43d424e3 --- /dev/null +++ b/libs/remix-ui/file-states/.eslintrc @@ -0,0 +1,19 @@ +{ + "env": { + "browser": true, + "es6": true + }, + "extends": "../../../.eslintrc.json", + "globals": { + "Atomics": "readonly", + "SharedArrayBuffer": "readonly" + }, + "parserOptions": { + "ecmaVersion": 11, + "sourceType": "module" + }, + "rules": { + "no-unused-vars": "off", + "@typescript-eslint/no-unused-vars": "error" + } +} diff --git a/libs/remix-ui/file-states/src/index.ts b/libs/remix-ui/file-states/src/index.ts new file mode 100644 index 0000000000..1fa5ac421b --- /dev/null +++ b/libs/remix-ui/file-states/src/index.ts @@ -0,0 +1,3 @@ +export { fileState, fileStateType } from './lib/types/index' +export { FileStateIcons } from './lib/components/file-state-icon' + diff --git a/libs/remix-ui/file-states/src/lib/components/file-state-icon.tsx b/libs/remix-ui/file-states/src/lib/components/file-state-icon.tsx new file mode 100644 index 0000000000..70648e9201 --- /dev/null +++ b/libs/remix-ui/file-states/src/lib/components/file-state-icon.tsx @@ -0,0 +1,48 @@ +// eslint-disable-next-line no-use-before-define +import React, { useEffect, useState } from 'react' + +import { fileState, fileStateType, FileType } from '../types' +import FileStateCustomIcon from './filestates/file-state-custom-icon' +import FileStateErrorIcon from './filestates/file-state-error-icon' +import FileStateWarningIcon from './filestates/file-state-warning-icon' + +export type fileStateProps = { + file: FileType, + fileState: fileState[] +} + +export const FileStateIcons = (props: fileStateProps) => { + const [states, setStates] = useState([]) + useEffect(() => { + //console.log(props.file) + //console.log(props.fileState) + setStates(props.fileState.filter((st) => st.path === props.file.path)) + }, [props.fileState]) + + const getTags = function () { + if (states && states.length) { + const elements: JSX.Element[] = [] + + for (const [index, state] of states.entries()) { + switch (state.fileStateType) { + case fileStateType.Error: + elements.push() + break + case fileStateType.Warning: + elements.push() + break + case fileStateType.Custom: + elements.push() + break + } + } + return elements + } + } + + return <> + {getTags()} + +} + +export default FileStateIcons \ No newline at end of file diff --git a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-custom.tsx b/libs/remix-ui/file-states/src/lib/components/filestates/file-state-custom-icon.tsx similarity index 79% rename from libs/remix-ui/workspace/src/lib/components/filestates/file-state-custom.tsx rename to libs/remix-ui/file-states/src/lib/components/filestates/file-state-custom-icon.tsx index ef56538480..b6cefc3429 100644 --- a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-custom.tsx +++ b/libs/remix-ui/file-states/src/lib/components/filestates/file-state-custom-icon.tsx @@ -2,7 +2,7 @@ import React from 'react' import { fileState } from '../../types' -const FileStateError = (props: { +const FileStateCustomIcon = (props: { fileState: fileState }) => { return <> @@ -10,4 +10,4 @@ const FileStateError = (props: { } -export default FileStateError \ No newline at end of file +export default FileStateCustomIcon \ No newline at end of file diff --git a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-warning.tsx b/libs/remix-ui/file-states/src/lib/components/filestates/file-state-error-icon.tsx similarity index 62% rename from libs/remix-ui/workspace/src/lib/components/filestates/file-state-warning.tsx rename to libs/remix-ui/file-states/src/lib/components/filestates/file-state-error-icon.tsx index 81912cfbd2..1324626e19 100644 --- a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-warning.tsx +++ b/libs/remix-ui/file-states/src/lib/components/filestates/file-state-error-icon.tsx @@ -2,10 +2,10 @@ import React from 'react' import { fileState } from '../../types' -const FileStateWarning = (props: { +const FileStateErrorIcon = (props: { fileState: fileState }) => { - return <>⬤ + return <>{props.fileState.comment} } -export default FileStateWarning \ No newline at end of file +export default FileStateErrorIcon \ No newline at end of file diff --git a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-error.tsx b/libs/remix-ui/file-states/src/lib/components/filestates/file-state-warning-icon.tsx similarity index 61% rename from libs/remix-ui/workspace/src/lib/components/filestates/file-state-error.tsx rename to libs/remix-ui/file-states/src/lib/components/filestates/file-state-warning-icon.tsx index 1e8a950218..53ba6f78c1 100644 --- a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-error.tsx +++ b/libs/remix-ui/file-states/src/lib/components/filestates/file-state-warning-icon.tsx @@ -2,10 +2,10 @@ import React from 'react' import { fileState } from '../../types' -const FileStateError = (props: { +const FileStateWarningIcon = (props: { fileState: fileState }) => { - return <>⬤ + return <>{props.fileState.comment} } -export default FileStateError \ No newline at end of file +export default FileStateWarningIcon \ No newline at end of file diff --git a/libs/remix-ui/file-states/src/lib/types/index.ts b/libs/remix-ui/file-states/src/lib/types/index.ts new file mode 100644 index 0000000000..484c546c61 --- /dev/null +++ b/libs/remix-ui/file-states/src/lib/types/index.ts @@ -0,0 +1,37 @@ +export enum fileStateType { + Error = 'ERROR', + Warning = 'WARNING', + Success = 'SUCCESS', + Loading = 'LOADING', + Unsaved = 'UNSAVED', + Untracked = 'UNTRACKED', + Modified = 'MODIFIED', + Staged = 'STAGED', + Committed = 'COMMITTED', + Deleted = 'DELETED', + Added = 'ADDED', + New = 'NEW', + Compiled = 'COMPILED', + Custom = 'CUSTOM', + } + + export type fileState = { + path: string, + isDirectory: boolean, + fileStateType: fileStateType, + fileStateLabelClass: string, + fileStateIconClass: string, + fileStateIcon: string | HTMLDivElement | JSX.Element, + bubble: boolean, + comment: string, + owner: string, + workspace?: string + } + + export interface FileType { + path: string, + name: string, + isDirectory: boolean, + type: 'folder' | 'file' | 'gist', + child?: File[] + } \ No newline at end of file diff --git a/libs/remix-ui/file-states/tsconfig.json b/libs/remix-ui/file-states/tsconfig.json new file mode 100644 index 0000000000..d52e31ad74 --- /dev/null +++ b/libs/remix-ui/file-states/tsconfig.json @@ -0,0 +1,16 @@ +{ + "extends": "../../../tsconfig.base.json", + "compilerOptions": { + "jsx": "react", + "allowJs": true, + "esModuleInterop": true, + "allowSyntheticDefaultImports": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + } + ] +} diff --git a/libs/remix-ui/file-states/tsconfig.lib.json b/libs/remix-ui/file-states/tsconfig.lib.json new file mode 100644 index 0000000000..b560bc4dec --- /dev/null +++ b/libs/remix-ui/file-states/tsconfig.lib.json @@ -0,0 +1,13 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../../dist/out-tsc", + "types": ["node"] + }, + "files": [ + "../../../node_modules/@nrwl/react/typings/cssmodule.d.ts", + "../../../node_modules/@nrwl/react/typings/image.d.ts" + ], + "exclude": ["**/*.spec.ts", "**/*.spec.tsx"], + "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"] +} diff --git a/libs/remix-ui/tabs/src/lib/remix-ui-tabs.tsx b/libs/remix-ui/tabs/src/lib/remix-ui-tabs.tsx index 499d0d1eb1..1cc560f089 100644 --- a/libs/remix-ui/tabs/src/lib/remix-ui-tabs.tsx +++ b/libs/remix-ui/tabs/src/lib/remix-ui-tabs.tsx @@ -1,25 +1,61 @@ +import { fileState } from '@remix-ui/workspace' +import { Plugin } from '@remixproject/engine' import React, { useState, useRef, useEffect, useReducer } from 'react' // eslint-disable-line import { Tab, Tabs, TabList, TabPanel } from 'react-tabs' import './remix-ui-tabs.css' /* eslint-disable-next-line */ export interface TabsUIProps { - tabs: Array - onSelect: (index: number) => void - onClose: (index: number) => void - onZoomOut: () => void - onZoomIn: () => void - onReady: (api: any) => void - themeQuality: string + tabs: Array + plugin: Plugin, + onSelect: (index: number) => void + onClose: (index: number) => void + onZoomOut: () => void + onZoomIn: () => void + onReady: (api: any) => void + themeQuality: string } export interface TabsUIApi { - activateTab: (namee: string) => void - active: () => string + activateTab: (namee: string) => void + active: () => string +} + +interface ITabsState { + selectedIndex: number, + fileStates: fileState[], +} + +interface ITabsAction { + type: string, + payload: any, +} + + +const initialTabsState: ITabsState = { + selectedIndex: -1, + fileStates: [], +} + +const tabsReducer = (state: ITabsState, action: ITabsAction) => { + switch (action.type) { + case 'SELECT_INDEX': + return { + ...state, + selectedIndex: action.payload, + } + case 'SET_FILE_STATES': + return { + ...state, + fileStates: action.payload, + } + default: + return state + } } export const TabsUI = (props: TabsUIProps) => { - const [selectedIndex, setSelectedIndex] = useState(-1) + const [tabsState, dispatch] = useReducer(tabsReducer, initialTabsState); const currentIndexRef = useRef(-1) const tabsRef = useRef({}) const tabsElement = useRef(null) @@ -28,20 +64,26 @@ export const TabsUI = (props: TabsUIProps) => { tabs.current = props.tabs // we do this to pass the tabs list to the onReady callbacks useEffect(() => { - if (props.tabs[selectedIndex]) { - tabsRef.current[selectedIndex].scrollIntoView({ behavior: 'smooth', block: 'center' }) + console.log('TabsUI useEffect') + if (props.tabs[tabsState.selectedIndex]) { + tabsRef.current[tabsState.selectedIndex].scrollIntoView({ behavior: 'smooth', block: 'center' }) } - }, [selectedIndex]) + }, [tabsState.selectedIndex]) + + const getFileState = (tab: any) => { + console.log('TAB', tab, tabsState.fileStates) + } const renderTab = (tab, index) => { + console.log('rendertab') const classNameImg = 'my-1 mr-1 text-dark ' + tab.iconClass const classNameTab = 'nav-item nav-link d-flex justify-content-center align-items-center px-2 py-1 tab' + (index === currentIndexRef.current ? ' active' : '') const invert = props.themeQuality === 'dark' ? 'invert(1)' : 'invert(0)' return (
    { tabsRef.current[index] = el }} className={classNameTab} data-id={index === currentIndexRef.current ? 'tab-active' : ''} title={tab.tooltip}> - {tab.icon ? () : ()} - {tab.title} + {tab.icon ? () : ()} + {tab.title} { props.onClose(index); event.stopPropagation() }}> @@ -56,7 +98,11 @@ export const TabsUI = (props: TabsUIProps) => { const activateTab = (name: string) => { const index = tabs.current.findIndex((tab) => tab.name === name) currentIndexRef.current = index - setSelectedIndex(index) + dispatch({ type: 'SELECT_INDEX', payload: index }) + } + + const setFileStates = (fileStates: fileState[]) => { + dispatch({ type: 'SET_FILE_STATES', payload: fileStates }) } const transformScroll = (event) => { @@ -71,21 +117,23 @@ export const TabsUI = (props: TabsUIProps) => { useEffect(() => { props.onReady({ activateTab, - active + active, + setFileStates }) + return () => { tabsElement.current.removeEventListener('wheel', transformScroll) } }, []) return (
    -
    +
    props.onZoomOut()}> props.onZoomIn()}>
    { if (tabsElement.current) return tabsElement.current = domEl @@ -94,7 +142,7 @@ export const TabsUI = (props: TabsUIProps) => { onSelect={(index) => { props.onSelect(index) currentIndexRef.current = index - setSelectedIndex(index) + dispatch({ type: 'SELECT_INDEX', payload: index }) }} > diff --git a/libs/remix-ui/workspace/src/index.ts b/libs/remix-ui/workspace/src/index.ts index 660e0b217b..c9e5b5355b 100644 --- a/libs/remix-ui/workspace/src/index.ts +++ b/libs/remix-ui/workspace/src/index.ts @@ -1,3 +1,3 @@ export * from './lib/providers/FileSystemProvider' export * from './lib/contexts' -export { fileState, fileStateType } from './lib/types/index' \ No newline at end of file +export { FileType } from './lib/types/index' \ No newline at end of file diff --git a/libs/remix-ui/workspace/src/lib/actions/events.ts b/libs/remix-ui/workspace/src/lib/actions/events.ts index f9e76f1715..ff02f5ec2d 100644 --- a/libs/remix-ui/workspace/src/lib/actions/events.ts +++ b/libs/remix-ui/workspace/src/lib/actions/events.ts @@ -38,7 +38,7 @@ export const listenOnPluginEvents = (filePanelPlugin) => { uploadFile(target, dir, cb) }) - plugin.on('filePanel', 'setFileState', async (items: fileState[]) => { + plugin.on('fileStates', 'fileStateChanged', async (items: fileState[]) => { setFileState(items) }) diff --git a/libs/remix-ui/workspace/src/lib/components/file-label.tsx b/libs/remix-ui/workspace/src/lib/components/file-label.tsx index 90a0b0d1f3..addfe60725 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-label.tsx +++ b/libs/remix-ui/workspace/src/lib/components/file-label.tsx @@ -1,6 +1,7 @@ // eslint-disable-next-line no-use-before-define +import { fileState } from '@remix-ui/file-states' import React, { useEffect, useRef, useState } from 'react' -import { fileState, FileType } from '../types' +import { FileType } from '../types' export interface FileLabelProps { file: FileType, @@ -27,11 +28,12 @@ export const FileLabel = (props: FileLabelProps) => { }, [file.path, focusEdit]) useEffect(() => { + console.log('fileState', fileState, file.name) const state = props.fileState.find((state: fileState) => { + console.log('FOUND STATE', state) if(state.path === props.file.path) return true if(state.bubble && props.file.isDirectory && state.path.startsWith(props.file.path)) return true }) - console.log(props) if (state && state.fileStateLabelClass) { setFileStateClasses(state.fileStateLabelClass) } diff --git a/libs/remix-ui/workspace/src/lib/components/file-render.tsx b/libs/remix-ui/workspace/src/lib/components/file-render.tsx index 398a75f4ae..4fcad89a83 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-render.tsx +++ b/libs/remix-ui/workspace/src/lib/components/file-render.tsx @@ -1,12 +1,13 @@ // eslint-disable-next-line no-use-before-define import React, { SyntheticEvent, useEffect, useState } from 'react' -import { fileState, FileType } from '../types' +import { FileType } from '../types' // eslint-disable-next-line @typescript-eslint/no-unused-vars import { TreeView, TreeViewItem } from '@remix-ui/tree-view' import { getPathIcon } from '@remix-ui/helper' // eslint-disable-next-line @typescript-eslint/no-unused-vars import { FileLabel } from './file-label' -import FileState from './file-state' + +import { fileState, FileStateIcons } from '@remix-ui/file-states' export interface RenderFileProps { file: FileType, @@ -118,7 +119,7 @@ export const FileRender = (props: RenderFileProps) => { <>
    - +
    } diff --git a/libs/remix-ui/workspace/src/lib/components/file-state.tsx b/libs/remix-ui/workspace/src/lib/components/file-state.tsx deleted file mode 100644 index fbf660777a..0000000000 --- a/libs/remix-ui/workspace/src/lib/components/file-state.tsx +++ /dev/null @@ -1,56 +0,0 @@ -// eslint-disable-next-line no-use-before-define -import React, { useEffect, useState } from 'react' -import { FileType, fileState, fileStateType } from '../types' -import FileStateCustom from './filestates/file-state-custom' -import FileStateError from './filestates/file-state-error' -import FileStateWarning from './filestates/file-state-warning' -// import FileStateModified from './filestates/file-state-modified' -// import FileStateUntracked from './filestates/file-state-untracked' - -export type fileStateProps = { - file: FileType, - fileState: fileState[] -} - -export const FileState = (props: fileStateProps) => { - const [state, setState] = useState(undefined) - useEffect(() => { - console.log(props.file) - console.log(props.fileState) - setState(props.fileState.find((st) => st.path === props.file.path)) - }, [props.fileState]) - - const getTags = function () { - if (state) { - const types = state.fileStateType - const elements: any[] = [] - - for (const type of types) { - switch (type) { - case fileStateType.Modified: - //elements.push() - break - case fileStateType.Untracked: - //elements.push() - break - case fileStateType.Error: - elements.push() - break - case fileStateType.Warning: - elements.push() - break - case fileStateType.Custom: - elements.push() - break - } - } - return elements - } - } - - return <> - {getTags()} - -} - -export default FileState \ No newline at end of file diff --git a/libs/remix-ui/workspace/src/lib/components/filestates/file-state-icon-properties.tsx b/libs/remix-ui/workspace/src/lib/components/filestates/file-state-icon-properties.tsx deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/libs/remix-ui/workspace/src/lib/reducers/workspace.ts b/libs/remix-ui/workspace/src/lib/reducers/workspace.ts index a6951c50cc..824ab7daa8 100644 --- a/libs/remix-ui/workspace/src/lib/reducers/workspace.ts +++ b/libs/remix-ui/workspace/src/lib/reducers/workspace.ts @@ -2,8 +2,8 @@ import { extractNameFromKey } from '@remix-ui/helper' import { action, fileState, FileType } from '../types' import * as _ from 'lodash' interface Action { - type: string - payload: any + type: string + payload: any } export interface BrowserState { browser: { @@ -93,8 +93,8 @@ export const browserInitialState: BrowserState = { notification: { title: '', message: '', - actionOk: () => {}, - actionCancel: () => {}, + actionOk: () => { }, + actionCancel: () => { }, labelOk: '', labelCancel: '' }, @@ -604,29 +604,11 @@ export const browserReducer = (state = browserInitialState, action: Action) => { } case 'SET_FILE_STATE_SUCCESS': { - const payload = action.payload as fileState[] - console.log('SET_FILE_STATE_SUCCESS', payload) - const a = state.browser.fileState - const b = payload - const merge = _.merge({}, _.keyBy(a, 'path'), _.keyBy(b, 'path')) - const vals = _.values(merge) - console.log(a) - console.log(vals) - vals.map(function (x) { - const c = a.find(function (el) { - return el.path === x.path - }) - if (c && c.fileStateType) { - x.fileStateType = _.uniq([...c.fileStateType, ...x.fileStateType]) - } - return x - }) - console.log(vals) return { ...state, browser: { ...state.browser, - fileState: vals + fileState: action.payload } } } diff --git a/libs/remix-ui/workspace/src/lib/types/index.ts b/libs/remix-ui/workspace/src/lib/types/index.ts index 9605894846..32dc82df36 100644 --- a/libs/remix-ui/workspace/src/lib/types/index.ts +++ b/libs/remix-ui/workspace/src/lib/types/index.ts @@ -1,5 +1,6 @@ import React from 'react' import { customAction } from '@remixproject/plugin-api/lib/file-system/file-panel' +import { fileState } from '@remix-ui/file-states'; export type action = { name: string, type?: Array<'folder' | 'gist' | 'file'>, path?: string[], extension?: string[], pattern?: string[], id: string, multiselect: boolean, label: string, sticky?: boolean } export interface JSONStandardInput { @@ -66,35 +67,6 @@ export interface FileType { child?: File[] } -export enum fileStateType { - Error = 'ERROR', - Warning = 'WARNING', - Success = 'SUCCESS', - Loading = 'LOADING', - Unsaved = 'UNSAVED', - Untracked = 'UNTRACKED', - Modified = 'MODIFIED', - Staged = 'STAGED', - Committed = 'COMMITTED', - Deleted = 'DELETED', - Added = 'ADDED', - New = 'NEW', - Compiled = 'COMPILED', - Custom = 'CUSTOM', -} - -export type fileState = { - path: string, - isDirectory: boolean, - fileStateType: fileStateType[], - fileStateLabelClass: string, - fileStateIconClass: string, - fileStateIcon: string | HTMLDivElement | JSX.Element, - bubble: boolean, - comment: string, - owner: string, -} - /* eslint-disable-next-line */ export interface FileExplorerProps { name: string, diff --git a/nx.json b/nx.json index c6fca5f4ad..25a3150170 100644 --- a/nx.json +++ b/nx.json @@ -169,6 +169,9 @@ }, "remix-ui-permission-handler": { "tags": [] + }, + "remix-ui-file-states": { + "tags": [] } }, "targetDependencies": { diff --git a/package.json b/package.json index 9ace50e6e5..d2e4a7a1b3 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "workspace-schematic": "nx workspace-schematic", "dep-graph": "nx dep-graph", "help": "nx help", - "lint:libs": "nx run-many --target=lint --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remix-ws-templates,remixd,remix-ui-tree-view,remix-ui-modal-dialog,remix-ui-toaster,remix-ui-helper,remix-ui-debugger-ui,remix-ui-workspace,remix-ui-static-analyser,remix-ui-checkbox,remix-ui-settings,remix-core-plugin,remix-ui-renderer,remix-ui-publish-to-storage,remix-ui-solidity-compiler,solidity-unit-testing,remix-ui-plugin-manager,remix-ui-terminal,remix-ui-editor,remix-ui-app,remix-ui-tabs,remix-ui-panel,remix-ui-run-tab,remix-ui-permission-handler,remix-ui-search", + "lint:libs": "nx run-many --target=lint --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remix-ws-templates,remixd,remix-ui-tree-view,remix-ui-modal-dialog,remix-ui-toaster,remix-ui-helper,remix-ui-debugger-ui,remix-ui-workspace,remix-ui-static-analyser,remix-ui-checkbox,remix-ui-settings,remix-core-plugin,remix-ui-renderer,remix-ui-publish-to-storage,remix-ui-solidity-compiler,solidity-unit-testing,remix-ui-plugin-manager,remix-ui-terminal,remix-ui-editor,remix-ui-app,remix-ui-tabs,remix-ui-panel,remix-ui-run-tab,remix-ui-permission-handler,remix-ui-search,remix-ui-file-states", "build:libs": "nx run-many --target=build --parallel=false --with-deps=true --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remix-ws-templates,remixd", "test:libs": "nx run-many --target=test --projects=remix-analyzer,remix-astwalker,remix-debug,remix-lib,remix-simulator,remix-solidity,remix-tests,remix-url-resolver,remixd", "publish:libs": "yarn run build:libs && lerna publish --skip-git && yarn run bumpVersion:libs", diff --git a/tsconfig.base.json b/tsconfig.base.json index d2d944f693..d3a7b77c15 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -52,6 +52,7 @@ "@remix-ui/modal-dialog": ["libs/remix-ui/modal-dialog/src/index.ts"], "@remix-ui/toaster": ["libs/remix-ui/toaster/src/index.ts"], "@remix-ui/file-explorer": ["libs/remix-ui/file-explorer/src/index.ts"], + "@remix-ui/file-states": ["libs/remix-ui/file-states/src/index.ts"], "@remix-ui/workspace": ["libs/remix-ui/workspace/src/index.ts"], "@remix-ui/static-analyser": [ "libs/remix-ui/static-analyser/src/index.ts" diff --git a/workspace.json b/workspace.json index 7ead3dd32b..c779a61745 100644 --- a/workspace.json +++ b/workspace.json @@ -1125,6 +1125,21 @@ } } }, + "remix-ui-file-states": { + "root": "libs/remix-ui/file-states", + "sourceRoot": "libs/remix-ui/file-states/src", + "projectType": "library", + "architect": { + "lint": { + "builder": "@nrwl/linter:lint", + "options": { + "linter": "eslint", + "tsConfig": ["libs/remix-ui/file-states/tsconfig.lib.json"], + "exclude": ["**/node_modules/**", "!libs/remix-ui/file-states/**/*"] + } + } + } + }, "remix-ui-panel": { "root": "libs/remix-ui/panel", "sourceRoot": "libs/remix-ui/panel/src",