diff --git a/apps/remix-ide/src/app/components/plugin-manager-component.js b/apps/remix-ide/src/app/components/plugin-manager-component.js
index cea87ed9ed..799e841088 100644
--- a/apps/remix-ide/src/app/components/plugin-manager-component.js
+++ b/apps/remix-ide/src/app/components/plugin-manager-component.js
@@ -116,9 +116,9 @@ class PluginManagerComponent extends ViewPlugin {
ReactDOM.render(, document.getElementById('pluginManager'))
}
- // isActive (name) {
- // return this.appManager.actives.includes(name)
- // }
+ isActive (name) {
+ return this.appManager.actives.includes(name)
+ }
activateP (name) {
this.appManager.activatePlugin(name)
@@ -219,17 +219,17 @@ class PluginManagerComponent extends ViewPlugin {
}
// // Filter all active and inactive modules that are not required
- // const { actives, inactives } = this.appManager.getAll()
- // .filter(isFiltered)
- // .filter(isNotRequired)
- // .filter(isNotDependent)
- // .filter(isNotHome)
- // .sort(sortByName)
- // .reduce(({ actives, inactives }, profile) => {
- // return this.isActive(profile.name)
- // ? { actives: [...actives, profile], inactives }
- // : { inactives: [...inactives, profile], actives }
- // }, { actives: [], inactives: [] })
+ const { actives, inactives } = this.appManager.getAll()
+ .filter(isFiltered)
+ .filter(isNotRequired)
+ .filter(isNotDependent)
+ .filter(isNotHome)
+ .sort(sortByName)
+ .reduce(({ actives, inactives }, profile) => {
+ return this.isActive(profile.name)
+ ? { actives: [...actives, profile], inactives }
+ : { inactives: [...inactives, profile], actives }
+ }, { actives: [], inactives: [] })
// const activeTile = actives.length !== 0
// ? yo`
diff --git a/libs/remix-ui/plugin-manager/src/lib/components/activeTile.tsx b/libs/remix-ui/plugin-manager/src/lib/components/activeTile.tsx
index fa1ea10316..7bb42ca5ad 100644
--- a/libs/remix-ui/plugin-manager/src/lib/components/activeTile.tsx
+++ b/libs/remix-ui/plugin-manager/src/lib/components/activeTile.tsx
@@ -12,7 +12,7 @@ function ActiveTile ({ inactivesCount, activesCount, tileLabel }: ActiveTileProp
)
diff --git a/libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx b/libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx
index e4d2aeffbb..28c822d1df 100644
--- a/libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx
+++ b/libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx
@@ -1,25 +1,14 @@
-import React from 'react'
-import { Profile, TileLabel } from '../../customTypes'
+import React, { useContext } from 'react'
+import { PluginManagerContext } from '../remix-ui-plugin-manager'
import ActiveTile from './activeTile'
import ListGroupItem from './listGroupItem'
interface RootViewProps {
localPluginButtonText: string
- activeProfiles: Profile[]
- inactiveProfiles?: Profile[]
- filterPlugins: () => void
- openLocalPlugins: () => void
- tileLabel: TileLabel
}
-function RootView ({
- localPluginButtonText,
- activeProfiles,
- inactiveProfiles,
- filterPlugins,
- openLocalPlugins,
- tileLabel
-}: RootViewProps) {
+function RootView ({ localPluginButtonText }: RootViewProps) {
+ const { actives, inactives, tileLabel } = useContext(PluginManagerContext)
return (
@@ -28,13 +17,13 @@ function RootView ({
diff --git a/libs/remix-ui/plugin-manager/src/lib/remix-ui-plugin-manager.tsx b/libs/remix-ui/plugin-manager/src/lib/remix-ui-plugin-manager.tsx
index ab845dc6dc..9c7fd7be6a 100644
--- a/libs/remix-ui/plugin-manager/src/lib/remix-ui-plugin-manager.tsx
+++ b/libs/remix-ui/plugin-manager/src/lib/remix-ui-plugin-manager.tsx
@@ -1,69 +1,51 @@
import React, { createContext, useEffect, useState } from 'react'
-import { Profile } from '../customTypes'
+import { Profile, TileLabel } from '../customTypes'
import { RemixAppManager, RemixEngine, _Paq } from '../types'
import RootView from './components/rootView'
import './remix-ui-plugin-manager.css'
/* eslint-disable-next-line */
-export interface RemixUiPluginManagerProps {
+export interface PluginManagerContextProviderProps {
appManager: RemixAppManager
engine: RemixEngine
_paq: _Paq
filter: string
+ actives: Profile[]
+ inactives: Profile[]
activatePlugin: (name: string) => void
deActivatePlugin: (name: string) => void
- isActive: (name: string) => void
+ isActive: (name: string) => any
openLocalPlugin: () => Promise
filterPlugins: () => void
profile: Profile
+ tileLabel: TileLabel
}
-export const PluginManagerContext = createContext({})
-
-function PluginManagerContextProvider ({ children }) {
- const [globalState] = useState({} as RemixUiPluginManagerProps)
- return (
-
- {children}
-
- )
+export interface RemixUiPluginManagerProps {
+ appManager: RemixAppManager
+ engine: RemixEngine
+ _paq: _Paq
+ filter: string
+ actives: Profile[]
+ inactives: Profile[]
+ activatePlugin: (name: string) => void
+ deActivatePlugin: (name: string) => void
+ isActive: (name: string) => any
+ openLocalPlugin: () => Promise
+ filterPlugins: () => void
+ profile: Profile
+ tileLabel: TileLabel
}
-// // Filtering helpers
-// const isFiltered = (profile) => (profile.displayName ? profile.displayName : profile.name).toLowerCase().includes(this.filter)
-// const isNotRequired = (profile) => !this.appManager.isRequired(profile.name)
-// const isNotDependent = (profile) => !this.appManager.isDependent(profile.name)
-// const isNotHome = (profile) => profile.name !== 'home'
-// const sortByName = (profileA, profileB) => {
-// const nameA = ((profileA.displayName) ? profileA.displayName : profileA.name).toUpperCase()
-// const nameB = ((profileB.displayName) ? profileB.displayName : profileB.name).toUpperCase()
-// return (nameA < nameB) ? -1 : (nameA > nameB) ? 1 : 0
-// }
-
-// // Filter all active and inactive modules that are not required
-// const { actives, inactives } = this.appManager.getAll()
-// .filter(isFiltered)
-// .filter(isNotRequired)
-// .filter(isNotDependent)
-// .filter(isNotHome)
-// .sort(sortByName)
-// .reduce(({ actives, inactives }, profile) => {
-// return this.isActive(profile.name)
-// ? { actives: [...actives, profile], inactives }
-// : { inactives: [...inactives, profile], actives }
-// }, { actives: [], inactives: [] })
+export const PluginManagerContext = createContext>({})
-export const RemixUiPluginManager = (props: RemixUiPluginManagerProps) => {
+function PluginManagerContextProvider ({ children, props }) {
const [isFiltered] = useState((profile) =>
(profile.displayName ? profile.displayName : profile.name).toLowerCase().includes(props.filter))
- const [isNotRequired, setIsNotRequired] = useState(false)
- const [isNotDependent, setIsNotDependent] = useState((profile) => !props.appManager.isDependent(profile.name))
- const [isNotHome, setIsNotHome] = useState((profile) => profile.name !== 'home')
- const [sortByName, setSortByName] = useState<1 | -1 | 0>((profileA, profileB) => {
- const nameA = ((profileA.displayName) ? profileA.displayName : profileA.name).toUpperCase()
- const nameB = ((profileB.displayName) ? profileB.displayName : profileB.name).toUpperCase()
- return (nameA < nameB) ? -1 : (nameA > nameB) ? 1 : 0
- })
+ const [isNotRequired, setIsNotRequired] = useState()
+ const [isNotDependent, setIsNotDependent] = useState()
+ const [isNotHome, setIsNotHome] = useState()
+ const [sortByName, setSortByName] = useState()
const { actives, inactives } = props.appManager.getAll()
.filter(isFiltered)
.filter(isNotRequired)
@@ -71,21 +53,38 @@ export const RemixUiPluginManager = (props: RemixUiPluginManagerProps) => {
.filter(isNotHome)
.sort(sortByName)
.reduce(({ actives, inactives }, profile) => {
- return this.isActive(profile.name)
+ return props.isActive(profile.name)
? { actives: [...actives, profile], inactives }
: { inactives: [...inactives, profile], actives }
}, { actives: [], inactives: [] })
+ props.actives = actives
+ props.inactives = inactives
useEffect(() => {
const notRequired = (profile: Profile) => !props.appManager.isRequired(profile.name)
+ const notDependent = (profile) => !props.appManager.isDependent(profile.name)
+ const notHome = (profile) => profile.name !== 'home'
+ const sortedByName = (profileA: Profile, profileB: Profile) => {
+ const nameA = ((profileA.displayName) ? profileA.displayName : profileA.name).toUpperCase()
+ const nameB = ((profileB.displayName) ? profileB.displayName : profileB.name).toUpperCase()
+ return (nameA < nameB) ? -1 : (nameA > nameB) ? 1 : 0
+ }
setIsNotRequired(notRequired(props.profile))
- })
+ setIsNotDependent(notDependent(notDependent))
+ setIsNotHome(notHome)
+ setSortByName(sortedByName)
+ }, [props.appManager, props.profile])
+ return (
+
+ {children}
+
+ )
+}
+export const RemixUiPluginManager = (props: RemixUiPluginManagerProps) => {
return (
-
+
)