diff --git a/libs/remix-ui/plugin-manager/src/lib/components/LocalPluginForm.tsx b/libs/remix-ui/plugin-manager/src/lib/components/LocalPluginForm.tsx
index d8ea7c59bb..15e8546ac5 100644
--- a/libs/remix-ui/plugin-manager/src/lib/components/LocalPluginForm.tsx
+++ b/libs/remix-ui/plugin-manager/src/lib/components/LocalPluginForm.tsx
@@ -97,7 +97,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
setName(e.target.value)}
- value={ name }
+ value={ name || defaultPlugin.name }
id="plugin-name"
data-id="localPluginName"
placeholder="Should be camelCase" />
@@ -107,7 +107,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
setDisplayName(e.target.value)}
- value={ displayName }
+ value={ displayName || defaultPlugin.displayName }
id="plugin-displayname"
data-id="localPluginDisplayName"
placeholder="Name in the header" />
@@ -117,7 +117,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
setMethods(e.target.value)}
- value={ methods }
+ value={ methods || defaultPlugin.methods }
id="plugin-methods"
data-id="localPluginMethods"
placeholder="Name in the header" />
@@ -128,7 +128,7 @@ function LocalPluginForm ({ closeModal, visible, pluginManager }: LocalPluginFor
setUrl(e.target.value)}
- value={ url }
+ value={ url || defaultPlugin.url }
id="plugin-url"
data-id="localPluginUrl"
placeholder="ex: https://localhost:8000" />
diff --git a/libs/remix-ui/plugin-manager/src/lib/custom-hooks/useLocalStorage.ts b/libs/remix-ui/plugin-manager/src/lib/custom-hooks/useLocalStorage.ts
new file mode 100644
index 0000000000..19ea07b7eb
--- /dev/null
+++ b/libs/remix-ui/plugin-manager/src/lib/custom-hooks/useLocalStorage.ts
@@ -0,0 +1,36 @@
+import { useState } from 'react'
+
+// Hook
+export const useLocalStorage = (key: string, initialValue: any) => {
+ // State to store our value
+ // Pass initial state function to useState so logic is only executed once
+ const [storedValue, setStoredValue] = useState(() => {
+ try {
+ // Get from local storage by key
+ const item = window.localStorage.getItem(key)
+ // Parse stored json or if none return initialValue
+ return item ? JSON.parse(item) : initialValue
+ } catch (error) {
+ // If error also return initialValue
+ console.log(error)
+ return initialValue
+ }
+ })
+ // Return a wrapped version of useState's setter function that ...
+ // ... persists the new value to localStorage.
+ const setValue = (value: any | ((val: any) => any)) => {
+ try {
+ // Allow value to be a function so we have same API as useState
+ const valueToStore =
+ value instanceof Function ? value(storedValue) : value
+ // Save state
+ setStoredValue(valueToStore)
+ // Save to local storage
+ window.localStorage.setItem(key, JSON.stringify(valueToStore))
+ } catch (error) {
+ // A more advanced implementation would handle the error case
+ console.log(error)
+ }
+ }
+ return [storedValue, setValue] as const
+}
diff --git a/libs/remix-ui/plugin-manager/tsconfig.lib.json b/libs/remix-ui/plugin-manager/tsconfig.lib.json
index ae1aeb41d7..8b7894d03b 100644
--- a/libs/remix-ui/plugin-manager/tsconfig.lib.json
+++ b/libs/remix-ui/plugin-manager/tsconfig.lib.json
@@ -1,10 +1,13 @@
{
"extends": "../../../tsconfig.base.json",
"compilerOptions": {
+ "jsx": "react",
+ "composite": true,
"outDir": "../../../dist/out-tsc",
"types": ["node"]
},
"files": [],
+ "composite": true,
"exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
"include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"],
"references": [