Skip to content

B
baas-ide
Commit d2f893e9 authored by joseph izang's avatar joseph izang
Browse files
Options

finish refactor for inactive plugins, active plugins and plugin permissions

parent 0fb798eb
Hide whitespace changes
Inline Side-by-side
Showing with 122 additions and 83 deletions
libs/remix-ui/plugin-manager/src/lib/components/permissions/permissionsSettings.tsx
View file @ d2f893e9
import React, { Fragment, useCallback, useEffect, useState } from 'react'
import { PluginManagerSettings, PluginPermissions } from '../../../types'
import { ModalDialog } from '@remix-ui/modal-dialog'
import { RemixUiCheckbox } from '@remix-ui/checkbox'
import { useLocalStorage } from '../../useLocalStorage'
import { type } from 'os'
interface PermissionSettingsProps {
pluginSettings: PluginManagerSettings
}
type DisplayPermissions = {
controlPluginName: {
controlPluginAction: {
pluginName: {
allow: boolean
}
}
}
}
function PermisssionsSettings ({ pluginSettings }: PermissionSettingsProps) {
/**
* Declare component local state
*/
const [modalVisibility, setModalVisibility] = useState<boolean>(true)
const [permissions, setPermissions] = useState<PluginPermissions | null>(
const [permissions] = useState<PluginPermissions | null>(
JSON.parse(localStorage.getItem('plugins/permissions') || '{}'))
const [showPermissions, setShowPermissions] = useState<PluginPermissions[]>([])
const [akwaiPermission, setAkwaiPermission] = useState(false)
const [verifyPermission, setVerifyPermission] = useState(false)
const closeModal = () => setModalVisibility(true)
const displayPermissions = useCallback(() => {
if (permissions && Object.length > 0) {
setAkwaiPermission(true)
setVerifyPermission(true)
}
}, [permissions])
const getTopLevelPluginNames = useCallback(() => {
return Object.keys(permissions).map(pluginName => {
return pluginName
})
}, [permissions])
const getInnerPluginPermissionDetails = useCallback(() => {
const showPermissionsCopy = showPermissions
getTopLevelPluginNames().forEach(topLevelName => {
Object.keys(permissions[topLevelName]).forEach(functionName => {
Object.keys(permissions[topLevelName][functionName]).forEach(pluginName => {
showPermissionsCopy.push(permissions[topLevelName][functionName][pluginName])
setShowPermissions(showPermissionsCopy)
})
})
})
}, [getTopLevelPluginNames, permissions, showPermissions])
useEffect(() => {
getInnerPluginPermissionDetails()
displayPermissions()
}, [displayPermissions, getInnerPluginPermissionDetails, permissions, showPermissions])
console.log('fetched permissions', permissions)
}, [displayPermissions, permissions])
// console.log('fetched permissions', permissions)
function ShowPluginHeading ({ headingName }) {
return (
......@@ -79,13 +47,23 @@ function PermisssionsSettings ({ pluginSettings }: PermissionSettingsProps) {
functionName: string,
topLevelPluginName: string
}) {
const [checkBoxState, setCheckBoxState] = useState(allow)
useEffect(() => {
}, [checkBoxState])
const handleCheckboxClick = () => {
setCheckBoxState(!checkBoxState)
}
return (
<div className="form-group remixui_permissionKey">
<div className="remixui_checkbox">
<span className="mr-2">
<RemixUiCheckbox
onChange={() => {}}
checked={allow}
<input
type="checkbox"
onChange={handleCheckboxClick}
checked={checkBoxState}
id={`permission-checkbox-${topLevelPluginName}-${functionName}-${pluginName}`}
aria-describedby={`module ${pluginName} asks permission for ${functionName}`}
/>
......@@ -98,6 +76,11 @@ function PermisssionsSettings ({ pluginSettings }: PermissionSettingsProps) {
</label>
</span>
</div>
<i
onClick={() => pluginSettings.clearPersmission(pluginName, topLevelPluginName, functionName)}
className="fa fa-trash-alt"
data-id={`pluginManagerSettingsRemovePermission-${topLevelPluginName}-${functionName}-${topLevelPluginName}`}
/>
</div>
)
}
......@@ -109,7 +92,7 @@ function PermisssionsSettings ({ pluginSettings }: PermissionSettingsProps) {
hide={modalVisibility}
title="Plugin Manager Permissions"
>
{akwaiPermission ? (<h4 className="text-center">Current Permission Settings</h4>) : (<h4 className="text-center">No Permission requested yet.</h4>)}
{verifyPermission ? (<h4 className="text-center">Current Permission Settings</h4>) : (<h4 className="text-center">No Permission requested yet.</h4>)}
<form className="remixui_permissionForm" data-id="pluginManagerSettingsPermissionForm">
<div className="border p-2">
{
......@@ -118,11 +101,11 @@ function PermisssionsSettings ({ pluginSettings }: PermissionSettingsProps) {
))
}
{
Object.keys(permissions).forEach(topName => {
Object.keys(permissions[topName]).map(funcName => {
Object.keys(permissions).map(topName => {
return Object.keys(permissions[topName]).map(funcName => {
return Object.keys(permissions[topName][funcName]).map(pluginName => (
<ShowCheckBox
allow={permissions.fileManager.writeFile[pluginName].allow}
allow={permissions[topName][funcName][pluginName].allow}
functionName={funcName}
pluginName={pluginName}
topLevelPluginName={topName}
......
libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx
View file @ d2f893e9
/* eslint-disable no-debugger */
import React, { Fragment, useEffect, useState } from 'react'
import React, { Fragment, useCallback, useEffect, useState } from 'react'
import ModuleHeading from './moduleHeading'
import { ModalDialog } from '@remix-ui/modal-dialog'
import { FormStateProps, PluginManagerComponent } from '../../types'
......@@ -8,7 +8,7 @@ import PermisssionsSettings from './permissions/permissionsSettings'
import { Profile } from '@remixproject/plugin-utils'
import ActivePluginCard from './ActivePluginCard'
import InactivePluginCard from './InactivePluginCard'
import { GetNewlyActivatedPlugins, PersistNewInactivesState } from '../../pluginManagerStateMachine'
import { PersistNewInactivesState, RemoveActivatedPlugin } from '../../pluginManagerStateMachine'
const initialState: FormStateProps = {
pname: 'test',
......@@ -33,7 +33,10 @@ function RootView ({ pluginComponent }: RootViewProps) {
const [filterPlugins, setFilterPlugin] = useState('')
const [activeP, setActiveP] = useState<Profile[]>([])
const [inactiveP, setInactiveP] = useState<Profile[]>([])
const [triggerRefresh, setTriggerRefresh] = useState(false)
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const [_, setTriggerRefresh] = useState(false)
const [validInactiveProfiles] = useState<Profile[]>(JSON.parse(window.localStorage.getItem('updatedInactives')))
const [validActiveProfiles] = useState<Profile[]>(JSON.parse(window.localStorage.getItem('newActivePlugins')))
function pluginChangeHandler<P extends keyof FormStateProps> (formProps: P, value: FormStateProps[P]) {
setPlugin({ ...plugin, [formProps]: value })
}
......@@ -52,52 +55,90 @@ function RootView ({ pluginComponent }: RootViewProps) {
setTriggerRefresh(true)
}
useEffect(() => {
pluginComponent.getAndFilterPlugins(filterPlugins)
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [filterPlugins])
useEffect(() => {
if (pluginComponent.activePlugins && pluginComponent.activePlugins.length) {
setActiveP(pluginComponent.activePlugins)
}
// if (pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) {
// setInactiveP(pluginComponent.inactivePlugins)
// }
const validInactiveProfiles: Profile[] = JSON.parse(window.localStorage.getItem('updatedInactives'))
if (validInactiveProfiles && validInactiveProfiles.length) {
if (inactiveP.length > validInactiveProfiles.length) {
setInactiveP(validInactiveProfiles)
}
}
if (pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) {
setInactiveP(pluginComponent.inactivePlugins)
const GetNewlyActivatedPlugins = useCallback((pluginComponent: PluginManagerComponent) => {
// const profiles: Profile[] = JSON.parse(window.localStorage.getItem('newActivePlugins'))
let isValid: boolean = false
// eslint-disable-next-line no-debugger
debugger
pluginComponent.activeProfiles.forEach(profileName => {
isValid = validActiveProfiles.some(profile => profile.name === profileName)
})
if (isValid) {
return validActiveProfiles
} else {
const profiles = validActiveProfiles // make a copy of state and don't mutate state directly
profiles.forEach(profile => {
if (!pluginComponent.activeProfiles.includes(profile.name)) {
RemoveActivatedPlugin(profile.name)
}
})
const newProfiles = JSON.parse(window.localStorage.getItem('newActivePlugins'))
return newProfiles
}
}, [pluginComponent.activePlugins, pluginComponent.inactivePlugins, activeP, inactiveP, pluginComponent.activeProfiles, pluginComponent])
}, [validActiveProfiles])
useEffect(() => {
if (activeP.length === 0) {
const activeProfiles = GetNewlyActivatedPlugins()
const activeProfiles = GetNewlyActivatedPlugins(pluginComponent)
if (activeProfiles !== null && activeProfiles.length) {
setActiveP(activeProfiles)
} else {
setActiveP(pluginComponent.activePlugins)
}
}
}, [activeP, pluginComponent.activePlugins, syncInactiveProfiles])
}, [GetNewlyActivatedPlugins, activeP, pluginComponent, pluginComponent.activePlugins, syncInactiveProfiles])
useEffect(() => {
syncInactiveProfiles()
pluginComponent.getAndFilterPlugins(filterPlugins)
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [inactiveP, triggerRefresh])
}, [filterPlugins])
useEffect(() => {
const validInactiveProfiles: Profile[] = JSON.parse(window.localStorage.getItem('updatedInactives'))
if (validInactiveProfiles && validInactiveProfiles.length &&
inactiveP.length > validInactiveProfiles.length) {
setInactiveP(validInactiveProfiles)
if (pluginComponent.activePlugins && pluginComponent.activePlugins.length) {
setActiveP(pluginComponent.activePlugins)
}
if (pluginComponent.inactivePlugins && pluginComponent.inactivePlugins.length) {
setInactiveP(pluginComponent.inactivePlugins)
}
let inactivesCopy = []
if (validInactiveProfiles && validInactiveProfiles.length) {
if (validActiveProfiles && validActiveProfiles.length) {
validActiveProfiles.forEach(active => {
inactivesCopy = validInactiveProfiles.filter(inactive => inactive.name !== active.name)
.filter(inactive => inactive.displayName !== active.displayName)
})
}
console.log('inactivescopy length', validInactiveProfiles.length)
if (inactivesCopy.length) setInactiveP(validInactiveProfiles)
}
}, [inactiveP, triggerRefresh])
}, [pluginComponent.activePlugins, pluginComponent.inactivePlugins, pluginComponent.activeProfiles, pluginComponent, validInactiveProfiles, inactiveP.length, validActiveProfiles])
// useEffect(() => {
// if (validInactiveProfiles && validInactiveProfiles.length &&
// inactiveP.length > validInactiveProfiles.length) {
// setInactiveP(validInactiveProfiles)
// }
// let inactivesCopy = []
// if (validInactiveProfiles && validInactiveProfiles.length) {
// if (inactiveP.length > validInactiveProfiles.length) {
// if (validActiveProfiles && validActiveProfiles.length) {
// validActiveProfiles.forEach(active => {
// inactivesCopy = validInactiveProfiles.filter(inactive => inactive !== active)
// .filter(inactive => inactive.displayName !== active.displayName)
// })
// }
// console.log('inactivescopy length', validInactiveProfiles.length)
// if (inactivesCopy.length) setInactiveP(validInactiveProfiles)
// }
// }
// }, [inactiveP, triggerRefresh, validActiveProfiles, validInactiveProfiles])
// useEffect(() => {
// syncInactiveProfiles()
// // eslint-disable-next-line react-hooks/exhaustive-deps
// }, [inactiveP, triggerRefresh])
return (
<Fragment>
......
libs/remix-ui/plugin-manager/src/pluginManagerStateMachine.ts
View file @ d2f893e9
......@@ -39,8 +39,9 @@ export async function PersistActivatedPlugin (pluginComponent: PluginManagerComp
const activatedPlugins: Profile[] = JSON.parse(persisted)
const newlyActivatedPlugins: Array<Profile> = []
const defaultActivated = defaultActivatedPlugins.includes(newPlugin.name) === false
if (newPlugin) {
if (defaultActivatedPlugins.includes(newPlugin.name) === false) {
if (defaultActivated) {
// if this is true then we are sure that the profile name is in localStorage/workspace
if (activatedPlugins && activatedPlugins.length && !activatedPlugins.includes(newPlugin)) {
await FetchAndPersistPlugin(pluginComponent, newPlugin, activatedPlugins)
......@@ -83,12 +84,25 @@ export async function UpdateInactivePluginList (deactivatedPlugin: Profile, plug
return tempArray
}
export function GetNewlyActivatedPlugins () {
const profiles = JSON.parse(window.localStorage.getItem('newActivePlugins'))
if (profiles && profiles.length > 0) {
export function GetNewlyActivatedPlugins (pluginComponent: PluginManagerComponent) {
const profiles: Profile[] = JSON.parse(window.localStorage.getItem('newActivePlugins'))
let isValid: boolean = false
// eslint-disable-next-line no-debugger
debugger
pluginComponent.activeProfiles.forEach(profileName => {
isValid = profiles.some(profile => profile.name === profileName)
})
if (isValid) {
return profiles
} else {
profiles.forEach(profile => {
if (!pluginComponent.activeProfiles.includes(profile.name)) {
RemoveActivatedPlugin(profile.name)
}
})
const newProfiles = JSON.parse(window.localStorage.getItem('newActivePlugins'))
return newProfiles
}
return profiles
}
async function FetchAndPersistPlugin (pluginComponent: PluginManagerComponent, newPlugin: Profile<any>, newlyActivatedPlugins: Profile<any>[]) {
......@@ -111,9 +125,10 @@ export function RemoveActivatedPlugin (pluginName: string) {
}
/**
* gets the latest list of inactive plugin profiles and persist them
* Gets the latest list of inactive plugin profiles and persist them
* in local storage
* @param inactivesList Array of inactive plugin profiles
* @returns {void}
*/
export function PersistNewInactivesState (inactivesList: Profile[]) {
if (inactivesList && inactivesList.length) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment