diff --git a/src/components/Dashboard/Wrappers/Category/Category.tsx b/src/components/Dashboard/Wrappers/Category/Category.tsx
index 2d7276878..8024b3386 100644
--- a/src/components/Dashboard/Wrappers/Category/Category.tsx
+++ b/src/components/Dashboard/Wrappers/Category/Category.tsx
@@ -1,7 +1,9 @@
import { Card, Group, Title } from '@mantine/core';
import { CategoryType } from '../../../../types/category';
+import { IWidgetDefinition } from '../../../../widgets/widgets';
import { HomarrCardWrapper } from '../../Tiles/HomarrCardWrapper';
import { Tiles } from '../../Tiles/tilesDefinitions';
+import Widgets from '../../../../widgets';
import { GridstackTileWrapper } from '../../Tiles/TileWrapper';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { useGridstack } from '../gridstack/use-gridstack';
@@ -44,19 +46,20 @@ export const DashboardCategory = ({ category }: DashboardCategoryProps) => {
);
})}
{Object.entries(integrations).map(([k, v]) => {
- const { component: TileComponent, ...tile } = Tiles[k as keyof typeof Tiles];
+ const widget = Widgets[k as keyof typeof Widgets] as IWidgetDefinition | undefined;
+ if (!widget) return null;
return (
-
+
);
})}
diff --git a/src/components/Dashboard/Wrappers/Sidebar/Sidebar.tsx b/src/components/Dashboard/Wrappers/Sidebar/Sidebar.tsx
index 6b79953be..3b5719083 100644
--- a/src/components/Dashboard/Wrappers/Sidebar/Sidebar.tsx
+++ b/src/components/Dashboard/Wrappers/Sidebar/Sidebar.tsx
@@ -1,6 +1,8 @@
import { Card } from '@mantine/core';
import { RefObject } from 'react';
+import { IWidgetDefinition } from '../../../../widgets/widgets';
import { Tiles } from '../../Tiles/tilesDefinitions';
+import Widgets from '../../../../widgets';
import { GridstackTileWrapper } from '../../Tiles/TileWrapper';
import { useGridstack } from '../gridstack/use-gridstack';
@@ -46,19 +48,20 @@ export const DashboardSidebar = ({ location }: DashboardSidebarProps) => {
);
})}
{Object.entries(integrations).map(([k, v]) => {
- const { component: TileComponent, ...tile } = Tiles[k as keyof typeof Tiles];
+ const widget = Widgets[k as keyof typeof Widgets] as IWidgetDefinition | undefined;
+ if (!widget) return null;
return (
-
+
);
})}
diff --git a/src/components/Dashboard/Wrappers/Wrapper/Wrapper.tsx b/src/components/Dashboard/Wrappers/Wrapper/Wrapper.tsx
index 2f02a193c..e8f7a3242 100644
--- a/src/components/Dashboard/Wrappers/Wrapper/Wrapper.tsx
+++ b/src/components/Dashboard/Wrappers/Wrapper/Wrapper.tsx
@@ -1,4 +1,6 @@
import { WrapperType } from '../../../../types/wrapper';
+import Widgets from '../../../../widgets';
+import { IWidget, IWidgetDefinition } from '../../../../widgets/widgets';
import { Tiles } from '../../Tiles/tilesDefinitions';
import { GridstackTileWrapper } from '../../Tiles/TileWrapper';
import { useGridstack } from '../gridstack/use-gridstack';
@@ -34,19 +36,20 @@ export const DashboardWrapper = ({ wrapper }: DashboardWrapperProps) => {
);
})}
{Object.entries(integrations).map(([k, v]) => {
- const { component: TileComponent, ...tile } = Tiles[k as keyof typeof Tiles];
+ const widget = Widgets[k as keyof typeof Widgets] as IWidgetDefinition | undefined;
+ if (!widget) return null;
return (
-
+
);
})}
diff --git a/src/widgets/bitTorrent/BitTorrentTile.tsx b/src/widgets/bitTorrent/BitTorrentTile.tsx
new file mode 100644
index 000000000..5888718bc
--- /dev/null
+++ b/src/widgets/bitTorrent/BitTorrentTile.tsx
@@ -0,0 +1,30 @@
+import { IconClock } from '@tabler/icons';
+import { HomarrCardWrapper } from '../../components/Dashboard/Tiles/HomarrCardWrapper';
+import { BaseTileProps } from '../../components/Dashboard/Tiles/type';
+import { defineWidget } from '../helper';
+import { IWidget } from '../widgets';
+
+const definition = defineWidget({
+ id: 'bitTorrent',
+ icon: IconClock,
+ options: {},
+ gridstack: {
+ minWidth: 2,
+ minHeight: 2,
+ maxWidth: 2,
+ maxHeight: 2,
+ },
+ component: BitTorrentTile,
+});
+
+export type IBitTorrent = IWidget;
+
+interface BitTorrentTileProps extends BaseTileProps {
+ module: IBitTorrent; // TODO: change to new type defined through widgetDefinition
+}
+
+function BitTorrentTile({ className, module }: BitTorrentTileProps) {
+ return Bit Torrent;
+}
+
+export default definition;
diff --git a/src/widgets/calendar/CalendarTile.tsx b/src/widgets/calendar/CalendarTile.tsx
index a23ac7c6d..eff60fa2d 100644
--- a/src/widgets/calendar/CalendarTile.tsx
+++ b/src/widgets/calendar/CalendarTile.tsx
@@ -22,6 +22,12 @@ const definition = defineWidget({
defaultValue: false,
},
},
+ gridstack: {
+ minWidth: 4,
+ minHeight: 5,
+ maxWidth: 12,
+ maxHeight: 12,
+ },
component: CalendarTile,
});
diff --git a/src/widgets/clock/ClockTile.tsx b/src/widgets/clock/ClockTile.tsx
index bd90ae1c3..56f6b2e3c 100644
--- a/src/widgets/clock/ClockTile.tsx
+++ b/src/widgets/clock/ClockTile.tsx
@@ -18,6 +18,13 @@ const definition = defineWidget({
defaultValue: false,
},
},
+
+ gridstack: {
+ minWidth: 4,
+ minHeight: 2,
+ maxWidth: 12,
+ maxHeight: 12,
+ },
component: ClockTile,
});
diff --git a/src/widgets/dashDot/DashDotTile.tsx b/src/widgets/dashDot/DashDotTile.tsx
index e612abe96..1688a4d9e 100644
--- a/src/widgets/dashDot/DashDotTile.tsx
+++ b/src/widgets/dashDot/DashDotTile.tsx
@@ -38,6 +38,12 @@ const definition = defineWidget({
defaultValue: '',
},
},
+ gridstack: {
+ minWidth: 4,
+ minHeight: 5,
+ maxWidth: 12,
+ maxHeight: 14,
+ },
component: DashDotTile,
});
diff --git a/src/widgets/index.ts b/src/widgets/index.ts
index 82126275b..0722ed138 100644
--- a/src/widgets/index.ts
+++ b/src/widgets/index.ts
@@ -1,4 +1,8 @@
import calendar from './calendar/CalendarTile';
-
-export default { calendar };
-// TODO: add exports of new IWidgetDefinitions to here
+import dashDot from './dashDot/DashDotTile';
+import useNet from './useNet/UseNetTile';
+import clock from './clock/ClockTile';
+import weather from './weather/WeatherTile';
+import bitTorrent from './bitTorrent/BitTorrentTile';
+import torrentNetworkTraffic from './torrentNetworkTraffic/TorrentNetworkTrafficTile';
+export default { calendar, dashDot, useNet, clock, weather, bitTorrent, torrentNetworkTraffic };
diff --git a/src/widgets/torrentNetworkTraffic/TorrentNetworkTrafficTile.tsx b/src/widgets/torrentNetworkTraffic/TorrentNetworkTrafficTile.tsx
new file mode 100644
index 000000000..856b4a8d1
--- /dev/null
+++ b/src/widgets/torrentNetworkTraffic/TorrentNetworkTrafficTile.tsx
@@ -0,0 +1,31 @@
+import { IconClock } from '@tabler/icons';
+import { HomarrCardWrapper } from '../../components/Dashboard/Tiles/HomarrCardWrapper';
+import { BaseTileProps } from '../../components/Dashboard/Tiles/type';
+import { defineWidget } from '../helper';
+import { IWidget } from '../widgets';
+
+const definition = defineWidget({
+ id: 'torrentNetworkTraffic',
+ icon: IconClock,
+ options: {},
+
+ gridstack: {
+ minWidth: 2,
+ minHeight: 2,
+ maxWidth: 2,
+ maxHeight: 2,
+ },
+ component: TorrentNetworkTrafficTile,
+});
+
+export type ITorrentNetworkTraffic = IWidget;
+
+interface TorrentNetworkTrafficTileProps extends BaseTileProps {
+ module: ITorrentNetworkTraffic; // TODO: change to new type defined through widgetDefinition
+}
+
+function TorrentNetworkTrafficTile({ className, module }: TorrentNetworkTrafficTileProps) {
+ return TorrentNetworkTraffic;
+}
+
+export default definition;
diff --git a/src/widgets/useNet/UseNetTile.tsx b/src/widgets/useNet/UseNetTile.tsx
index eda2ad4b1..ad3b2587d 100644
--- a/src/widgets/useNet/UseNetTile.tsx
+++ b/src/widgets/useNet/UseNetTile.tsx
@@ -36,6 +36,12 @@ const definition = defineWidget({
icon: IconFileDownload,
options: {},
component: UseNetTile,
+ gridstack: {
+ minWidth: 4,
+ minHeight: 5,
+ maxWidth: 12,
+ maxHeight: 12,
+ },
});
export type IWeatherWidget = IWidget;
diff --git a/src/widgets/weather/WeatherTile.tsx b/src/widgets/weather/WeatherTile.tsx
index c768c5705..914683f85 100644
--- a/src/widgets/weather/WeatherTile.tsx
+++ b/src/widgets/weather/WeatherTile.tsx
@@ -21,6 +21,12 @@ const definition = defineWidget({
defaultValue: 'Paris',
},
},
+ gridstack: {
+ minWidth: 4,
+ minHeight: 2,
+ maxWidth: 12,
+ maxHeight: 12,
+ },
component: WeatherTile,
});
diff --git a/src/widgets/widgets.d.ts b/src/widgets/widgets.d.ts
index a02f7bf1a..729ed2e07 100644
--- a/src/widgets/widgets.d.ts
+++ b/src/widgets/widgets.d.ts
@@ -66,5 +66,11 @@ export type IWidgetDefinition = {
options: {
[key: string]: IWidgetOptionValue;
};
+ gridstack: {
+ minWidth: number;
+ minHeight: number;
+ maxWidth: number;
+ maxHeight: number;
+ };
component: React.ComponentType;
};