From b4cfa1ac05009e0c521dabc500eb161c6348b74e Mon Sep 17 00:00:00 2001 From: Meierschlumpf Date: Sun, 18 Dec 2022 21:50:08 +0100 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Removed=20widgets=20from=20tile=20d?= =?UTF-8?q?efinitions?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Dashboard/Wrappers/Category/Category.tsx | 11 ++++--- .../Dashboard/Wrappers/Sidebar/Sidebar.tsx | 11 ++++--- .../Dashboard/Wrappers/Wrapper/Wrapper.tsx | 11 ++++--- src/widgets/bitTorrent/BitTorrentTile.tsx | 30 ++++++++++++++++++ src/widgets/calendar/CalendarTile.tsx | 6 ++++ src/widgets/clock/ClockTile.tsx | 7 +++++ src/widgets/dashDot/DashDotTile.tsx | 6 ++++ src/widgets/index.ts | 10 ++++-- .../TorrentNetworkTrafficTile.tsx | 31 +++++++++++++++++++ src/widgets/useNet/UseNetTile.tsx | 6 ++++ src/widgets/weather/WeatherTile.tsx | 6 ++++ src/widgets/widgets.d.ts | 6 ++++ 12 files changed, 126 insertions(+), 15 deletions(-) create mode 100644 src/widgets/bitTorrent/BitTorrentTile.tsx create mode 100644 src/widgets/torrentNetworkTraffic/TorrentNetworkTrafficTile.tsx 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; };