From d6736d65396486c31bd36046761adbc24c97b0f5 Mon Sep 17 00:00:00 2001 From: Tagaishi Date: Fri, 11 Aug 2023 20:47:14 +0200 Subject: [PATCH 1/3] =?UTF-8?q?=F0=9F=90=9B=20App=20tile=20flex=20fix=20(#?= =?UTF-8?q?1255)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 🎨 flex * 🎨 Improved flex organization on app tile * ✏️ disallowAppNameProgagation to Propagation * ✨ User customizable lineclamp and config migration --- public/locales/en/layout/modals/add-app.json | 4 + .../Modals/EditAppModal/EditAppModal.tsx | 2 +- .../Tabs/AppereanceTab/AppereanceTab.tsx | 63 +++++---- .../Overview/AvailableElementsOverview.tsx | 1 + .../Dashboard/Tiles/Apps/AppPing.tsx | 2 +- .../Dashboard/Tiles/Apps/AppTile.tsx | 122 ++++++++---------- src/modules/Docker/ContainerActionBar.tsx | 3 +- src/tools/config/getFrontendConfig.ts | 17 +++ src/types/app.ts | 1 + 9 files changed, 121 insertions(+), 94 deletions(-) diff --git a/public/locales/en/layout/modals/add-app.json b/public/locales/en/layout/modals/add-app.json index 4f40a71cd..6a7670617 100644 --- a/public/locales/en/layout/modals/add-app.json +++ b/public/locales/en/layout/modals/add-app.json @@ -72,6 +72,10 @@ "bottom":"Bottom", "left":"Left" } + }, + "lineClampAppName":{ + "label":"App Name Line Clamp", + "description":"Defines on how many lines your title should fit at it's maximum. Set 0 for unlimited." } }, "integration": { diff --git a/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx b/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx index 53e713764..34ab62500 100644 --- a/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx +++ b/src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx @@ -205,7 +205,7 @@ export const EditAppModal = ({ setAllowAppNamePropagation(false)} + disallowAppNamePropagation={() => setAllowAppNamePropagation(false)} allowAppNamePropagation={allowAppNamePropagation} /> diff --git a/src/components/Dashboard/Modals/EditAppModal/Tabs/AppereanceTab/AppereanceTab.tsx b/src/components/Dashboard/Modals/EditAppModal/Tabs/AppereanceTab/AppereanceTab.tsx index 14e7e22ac..43a371a0a 100644 --- a/src/components/Dashboard/Modals/EditAppModal/Tabs/AppereanceTab/AppereanceTab.tsx +++ b/src/components/Dashboard/Modals/EditAppModal/Tabs/AppereanceTab/AppereanceTab.tsx @@ -1,4 +1,4 @@ -import { Flex, Select, Stack, Switch, Tabs } from '@mantine/core'; +import { Flex, NumberInput, Select, Stack, Switch, Tabs } from '@mantine/core'; import { UseFormReturnType } from '@mantine/form'; import { useDebouncedValue } from '@mantine/hooks'; import { useTranslation } from 'next-i18next'; @@ -9,13 +9,13 @@ import { IconSelector } from '../../../../../IconSelector/IconSelector'; interface AppearanceTabProps { form: UseFormReturnType AppType>; - disallowAppNameProgagation: () => void; + disallowAppNamePropagation: () => void; allowAppNamePropagation: boolean; } export const AppearanceTab = ({ form, - disallowAppNameProgagation, + disallowAppNamePropagation, allowAppNamePropagation, }: AppearanceTabProps) => { const iconSelectorRef = useRef(); @@ -46,7 +46,7 @@ export const AppearanceTab = ({ defaultValue={form.values.appearance.iconUrl} onChange={(value) => { form.setFieldValue('appearance.iconUrl', value); - disallowAppNameProgagation(); + disallowAppNamePropagation(); }} value={form.values.appearance.iconUrl} ref={iconSelectorRef} @@ -66,26 +66,41 @@ export const AppearanceTab = ({ }} /> {form.values.appearance.appNameStatus === 'normal' && ( - { + form.setFieldValue('appearance.positionAppName', value); + }} + /> + { + form.setFieldValue('appearance.lineClampAppName', value); + }} + /> + )} diff --git a/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx b/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx index 21c8354b1..eb99dbcaa 100644 --- a/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx +++ b/src/components/Dashboard/Modals/SelectElement/Components/Overview/AvailableElementsOverview.tsx @@ -95,6 +95,7 @@ export const AvailableElementTypes = ({ iconUrl: '/imgs/logo/logo.png', appNameStatus: 'normal', positionAppName: 'column', + lineClampAppName: 1, }, network: { enabledStatusChecker: true, diff --git a/src/components/Dashboard/Tiles/Apps/AppPing.tsx b/src/components/Dashboard/Tiles/Apps/AppPing.tsx index b4118c9b3..6aaeda388 100644 --- a/src/components/Dashboard/Tiles/Apps/AppPing.tsx +++ b/src/components/Dashboard/Tiles/Apps/AppPing.tsx @@ -30,7 +30,7 @@ export const AppPing = ({ app }: AppPingProps) => { { const isEditMode = useEditModeStore((x) => x.enabled); - const { cx, classes } = useStyles(); - const { colorScheme } = useMantineTheme(); - const tooltipContent = [ - app.appearance.appNameStatus === "hover" ? app.name : undefined, - app.behaviour.tooltipDescription - ].filter( e => e ).join( ': ' ); + app.appearance.appNameStatus === 'hover' ? app.name : undefined, + app.behaviour.tooltipDescription, + ] + .filter((e) => e) + .join(': '); - const { - classes: { card: cardClass }, - } = useCardStyles(false); + const isRow = app.appearance.positionAppName.includes('row'); function Inner() { return ( - - - - - - + {app.name} + + )} + + ); } return ( - + {!app.url || isEditMode ? ( @@ -110,7 +90,7 @@ export const AppTile = ({ className, app }: AppTileProps) => { component={Link} href={app.behaviour.externalUrl.length > 0 ? app.behaviour.externalUrl : app.url} target={app.behaviour.isOpeningNewTab ? '_blank' : '_self'} - className={cx(classes.button)} + className={`${classes.button} ${classes.base}`} > @@ -121,19 +101,27 @@ export const AppTile = ({ className, app }: AppTileProps) => { }; const useStyles = createStyles((theme, _params, getRef) => ({ - image: { - maxHeight: '90%', - maxWidth: '90%', + base: { + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + }, + appContent: { + gap: 0, + overflow: 'visible', + flexGrow: 5, }, appName: { wordBreak: 'break-word', }, + appImage: { + flex: '1', + objectFit: 'contain', + overflowY: 'auto', + }, button: { height: '100%', width: '100%', - display: 'flex', - flexDirection: 'column', - alignItems: 'center', gap: 4, }, })); diff --git a/src/modules/Docker/ContainerActionBar.tsx b/src/modules/Docker/ContainerActionBar.tsx index 6dba36c90..7f172297e 100644 --- a/src/modules/Docker/ContainerActionBar.tsx +++ b/src/modules/Docker/ContainerActionBar.tsx @@ -130,7 +130,8 @@ export default function ContainerActionBar({ selected, reload }: ContainerAction appearance: { iconUrl: '/imgs/logo/logo.png', appNameStatus: 'normal', - positionAppName: 'column' + positionAppName: 'column', + lineClampAppName: 1, }, network: { enabledStatusChecker: true, diff --git a/src/tools/config/getFrontendConfig.ts b/src/tools/config/getFrontendConfig.ts index baad9b98b..1266da585 100644 --- a/src/tools/config/getFrontendConfig.ts +++ b/src/tools/config/getFrontendConfig.ts @@ -10,6 +10,8 @@ export const getFrontendConfig = async (name: string): Promise => { let config = getConfig(name); let shouldMigrateConfig = false; + config = migrateAppConfigs(config); + const anyWeatherWidgetWithStringLocation = config.widgets.some( (widget) => widget.type === 'weather' && typeof widget.properties.location === 'string' ); @@ -129,3 +131,18 @@ const migratePiholeIntegrationField = (config: BackendConfigType) => { }), }; }; + +const migrateAppConfigs = (config: BackendConfigType) => { + return { + ...config, + apps: config.apps.map((app) => ({ + ...app, + appearance: { + ...app.appearance, + appNameStatus: app.appearance.appNameStatus?? 'normal', + positionAppName: app.appearance.positionAppName?? 'column', + lineClampAppName: app.appearance.lineClampAppName?? 1, + } + })) + } +} \ No newline at end of file diff --git a/src/types/app.ts b/src/types/app.ts index 7443a863c..adfb8c50a 100644 --- a/src/types/app.ts +++ b/src/types/app.ts @@ -36,6 +36,7 @@ interface AppAppearanceType { iconUrl: string; appNameStatus: "normal"|"hover"|"hidden"; positionAppName: Property.FlexDirection; + lineClampAppName: number; } export type IntegrationType = From c955b04b481816775207f68c2970cd6abd6e62ae Mon Sep 17 00:00:00 2001 From: Meier Lukas Date: Sat, 12 Aug 2023 11:51:14 +0200 Subject: [PATCH 2/3] =?UTF-8?q?=F0=9F=90=9B=20Issue=20with=20media=20reque?= =?UTF-8?q?st=20url=20(#1260)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/server/api/routers/media-request.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/server/api/routers/media-request.ts b/src/server/api/routers/media-request.ts index e0ecefeb0..99d91a5e0 100644 --- a/src/server/api/routers/media-request.ts +++ b/src/server/api/routers/media-request.ts @@ -65,7 +65,7 @@ export const mediaRequestsRouter = createTRPCRouter({ status: item.status, backdropPath: `https://image.tmdb.org/t/p/original/${genericItem.backdropPath}`, posterPath: `https://image.tmdb.org/t/p/w600_and_h900_bestv2/${genericItem.posterPath}`, - href: `${appUrl}/movie/${item.media.tmdbId}`, + href: `${appUrl}/${item.type}/${item.media.tmdbId}`, }; }) ); From 9519dfaf0a05e97c40622c958134a1e7c8c3926f Mon Sep 17 00:00:00 2001 From: Manuel <30572287+manuel-rw@users.noreply.github.com> Date: Sat, 12 Aug 2023 12:10:21 +0200 Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=90=9B=20AdGuard=20Home=20time=20unit?= =?UTF-8?q?=20fix=20(#1005)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../{dns-hole.ts => dns-hole/router.ts} | 10 ++++++++-- src/tools/server/sdk/adGuard/adGuard.schema.ts | 2 +- src/tools/server/sdk/adGuard/adGuard.ts | 18 ++---------------- src/widgets/dnshole/DnsHoleSummary.tsx | 2 +- 4 files changed, 12 insertions(+), 20 deletions(-) rename src/server/api/routers/{dns-hole.ts => dns-hole/router.ts} (92%) diff --git a/src/server/api/routers/dns-hole.ts b/src/server/api/routers/dns-hole/router.ts similarity index 92% rename from src/server/api/routers/dns-hole.ts rename to src/server/api/routers/dns-hole/router.ts index 2a5c02a94..e21a3dc59 100644 --- a/src/server/api/routers/dns-hole.ts +++ b/src/server/api/routers/dns-hole/router.ts @@ -135,8 +135,14 @@ const collectAdGuardSummary = async (app: ConfigAppType) => { const status = await adGuard.getStatus(); const countFilteredDomains = await adGuard.getCountFilteringDomains(); - const blockedQueriesToday = stats.blocked_filtering.reduce((prev, sum) => prev + sum, 0); - const queriesToday = stats.dns_queries.reduce((prev, sum) => prev + sum, 0); + const blockedQueriesToday = + stats.time_units === 'days' + ? stats.blocked_filtering[stats.blocked_filtering.length - 1] + : stats.blocked_filtering.reduce((prev, sum) => prev + sum, 0); + const queriesToday = + stats.time_units === 'days' + ? stats.dns_queries[stats.dns_queries.length - 1] + : stats.dns_queries.reduce((prev, sum) => prev + sum, 0); return { domainsBeingBlocked: countFilteredDomains, diff --git a/src/tools/server/sdk/adGuard/adGuard.schema.ts b/src/tools/server/sdk/adGuard/adGuard.schema.ts index bad381659..a2c843062 100644 --- a/src/tools/server/sdk/adGuard/adGuard.schema.ts +++ b/src/tools/server/sdk/adGuard/adGuard.schema.ts @@ -1,7 +1,7 @@ import { z } from 'zod'; export const adGuardApiStatsResponseSchema = z.object({ - time_units: z.enum(['hours']), + time_units: z.enum(['hours', 'days']), top_queried_domains: z.array(z.record(z.string(), z.number())), top_clients: z.array(z.record(z.string(), z.number())), top_blocked_domains: z.array(z.record(z.string(), z.number())), diff --git a/src/tools/server/sdk/adGuard/adGuard.ts b/src/tools/server/sdk/adGuard/adGuard.ts index e018a2e7c..38a05102c 100644 --- a/src/tools/server/sdk/adGuard/adGuard.ts +++ b/src/tools/server/sdk/adGuard/adGuard.ts @@ -1,3 +1,4 @@ +import { z } from 'zod'; import { trimStringEnding } from '../../../shared/strings'; import { adGuardApiFilteringStatusSchema, @@ -77,19 +78,4 @@ export class AdGuard { } } -export type AdGuardStatsType = { - time_units: string; - top_queried_domains: { [key: string]: number }[]; - top_clients: { [key: string]: number }[]; - top_blocked_domains: { [key: string]: number }[]; - dns_queries: number[]; - blocked_filtering: number[]; - replaced_safebrowsing: number[]; - replaced_parental: number[]; - num_dns_queries: number; - num_blocked_filtering: number; - num_replaced_safebrowsing: number; - num_replaced_safesearch: number; - num_replaced_parental: number; - avg_processing_time: number; -}; +export type AdGuardStatsType = z.infer; diff --git a/src/widgets/dnshole/DnsHoleSummary.tsx b/src/widgets/dnshole/DnsHoleSummary.tsx index bcfc443e5..270f18dd5 100644 --- a/src/widgets/dnshole/DnsHoleSummary.tsx +++ b/src/widgets/dnshole/DnsHoleSummary.tsx @@ -138,7 +138,7 @@ function DnsHoleSummaryWidgetTile({ widget }: DnsHoleSummaryWidgetProps) {
- {formatNumber(data.dnsQueriesToday, 3)} + {formatNumber(data.dnsQueriesToday, 0)} {t('card.metrics.queriesToday')}