diff --git a/plugin-catalog/src/components/plugins/InstalledList.tsx b/plugin-catalog/src/components/plugins/InstalledList.tsx
index 61addb7..87854c5 100644
--- a/plugin-catalog/src/components/plugins/InstalledList.tsx
+++ b/plugin-catalog/src/components/plugins/InstalledList.tsx
@@ -17,46 +17,116 @@ interface Plugin {
export interface PurePluginInstalledListProps {
installedPlugins: Plugin[] | null;
+ otherInstalledPlugins: any[] | null;
error: string | null;
}
-export function PurePluginInstalledList({ installedPlugins, error }: PurePluginInstalledListProps) {
+export function PurePluginInstalledList({
+ installedPlugins,
+ otherInstalledPlugins,
+ error,
+}: PurePluginInstalledListProps) {
return (
{error ? (
{`Error loading Installed plugins: ${error}`}
) : (
- (
-
-
- {plugin.pluginTitle}
-
-
- ),
- },
- {
- label: 'Version',
- getter: plugin => plugin.pluginVersion,
- },
- {
- label: 'Repo',
- getter: plugin => plugin.repoName,
- },
- {
- label: 'Author',
- getter: plugin => plugin.author,
- },
- ]}
- emptyMessage="No plugins installed"
- data={installedPlugins || []}
- />
+
+
+
+ Installed from the Plugin Catalog
+
+ (
+
+
+ {plugin.pluginTitle}
+
+
+ ),
+ },
+ {
+ label: 'Version',
+ getter: plugin => plugin.pluginVersion,
+ },
+ {
+ label: 'Repo',
+ getter: plugin => plugin.repoName,
+ },
+ {
+ label: 'Author',
+ getter: plugin => plugin.author,
+ },
+ ]}
+ emptyMessage="No plugins installed"
+ data={installedPlugins || []}
+ />
+
+
+
+
+ Other Installed Plugins
+
+
+ (
+
+
+ {otherInstalledPlugins.name}
+
+
+ ),
+ },
+ {
+ label: 'Version',
+ getter: otherInstalledPlugins => otherInstalledPlugins.version,
+ },
+ {
+ label: 'Repo',
+ getter: plugin => plugin.repoName,
+ },
+ {
+ label: 'Author',
+ getter: plugin => plugin.author,
+ },
+ ]}
+ emptyMessage="No plugins installed"
+ data={otherInstalledPlugins || []}
+ />
+
+
)}
);
@@ -64,6 +134,7 @@ export function PurePluginInstalledList({ installedPlugins, error }: PurePluginI
export function PluginInstalledList() {
const [installedPlugins, setInstalledPlugins] = useState(null);
+ const [otherInstalledPlugins, setOtherInstalledPlugins] = useState(null);
const [error, setError] = useState(null);
useEffect(() => {
@@ -81,8 +152,25 @@ export function PluginInstalledList() {
}
}
+ function fetchOtherInstalledPlugins() {
+ const storedPlugins = localStorage.getItem('headlampPluginSettings');
+ if (storedPlugins) {
+ const parsedPlugins = JSON.parse(storedPlugins);
+ setOtherInstalledPlugins(parsedPlugins);
+ } else {
+ setOtherInstalledPlugins([]);
+ }
+ }
+
fetchInstalledPlugins();
+ fetchOtherInstalledPlugins();
}, []);
- return ;
+ return (
+
+ );
}