Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-03 12:05:57 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' into add-umami

Browse Source
This commit is contained in:
Thomas Camlong
2023-10-26 12:40:46 +02:00
committed by GitHub
parent 743d06b88e 70f130569b
commit a9144a9340
107 changed files with 432 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "homarr",
"version": "0.13.2",
"version": "0.14.0",
"description": "Homarr - A homepage for your server.",
"license": "MIT",
"repository": {

2
public/locales/en/modules/media-requests-list.json
View File

@@ -13,8 +13,6 @@
}
},
"noRequests": "No requests found. Please ensure that you've configured your apps correctly.",
"pending": "There are {{countPendingApproval}} requests waiting for approval.",
"nonePending": "There are currently no pending approvals. You're good to go!",
"state": {
"approved": "Approved",
"pendingApproval": "Pending approval",

10
src/components/Board/Customize/Access/AccessCustomization.tsx
View File

@@ -7,7 +7,11 @@ export const AccessCustomization = () => {
const form = useBoardCustomizationFormContext();
return (
<Stack>
<Switch label={t('allowGuests.label')} description={t('allowGuests.description')} {...form.getInputProps('access.allowGuests', { type: 'checkbox' })} />
<Switch
label={t('allowGuests.label')}
description={t('allowGuests.description')}
{...form.getInputProps('access.allowGuests', { type: 'checkbox' })}
/>
</Stack>
)
}
);
};

2
src/components/Dashboard/Mobile/Ribbon/MobileRibbon.tsx
View File

@@ -1,9 +1,9 @@
import { ActionIcon, Space, createStyles } from '@mantine/core';
import { useDisclosure } from '@mantine/hooks';
import { IconChevronLeft, IconChevronRight } from '@tabler/icons-react';
import { useConfigContext } from '~/config/provider';
import { useScreenLargerThan } from '~/hooks/useScreenLargerThan';
import { MobileRibbonSidebarDrawer } from './MobileRibbonSidebarDrawer';
export const MobileRibbons = () => {

2
src/components/Dashboard/Modals/ChangePosition/ChangeAppPositionModal.tsx
View File

@@ -1,9 +1,9 @@
import { SelectItem } from '@mantine/core';
import { ContextModalProps, closeModal } from '@mantine/modals';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { AppType } from '~/types/app';
import { useGridstackStore, useWrapperColumnCount } from '../../Wrappers/gridstack/store';
import { ChangePositionModal } from './ChangePositionModal';

1
src/components/Dashboard/Modals/ChangePosition/ChangePositionModal.tsx
View File

@@ -1,7 +1,6 @@
import { Button, Flex, Grid, NumberInput, Select, SelectItem } from '@mantine/core';
import { useForm } from '@mantine/form';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
interface ChangePositionModalProps {

2
src/components/Dashboard/Modals/ChangePosition/ChangeWidgetPositionModal.tsx
View File

@@ -1,8 +1,8 @@
import { SelectItem } from '@mantine/core';
import { ContextModalProps, closeModal } from '@mantine/modals';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import widgets from '../../../../widgets';
import { WidgetChangePositionModalInnerProps } from '../../Tiles/Widgets/WidgetsMenu';
import { useGridstackStore, useWrapperColumnCount } from '../../Wrappers/gridstack/store';

2
src/components/Dashboard/Modals/EditAppModal/EditAppModal.tsx
View File

@@ -12,10 +12,10 @@ import {
} from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useState } from 'react';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { AppType } from '~/types/app';
import { DebouncedImage } from '../../../IconSelector/DebouncedImage';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { AppearanceTab } from './Tabs/AppereanceTab/AppereanceTab';

9
src/components/Dashboard/Modals/EditAppModal/Tabs/AppereanceTab/AppereanceTab.tsx
View File

@@ -3,9 +3,8 @@ import { UseFormReturnType } from '@mantine/form';
import { useDebouncedValue } from '@mantine/hooks';
import { useTranslation } from 'next-i18next';
import { useEffect, useRef } from 'react';
import { AppType } from '~/types/app';
import { IconSelector } from '~/components/IconSelector/IconSelector';
import { AppType } from '~/types/app';
interface AppearanceTabProps {
form: UseFormReturnType<AppType, (values: AppType) => AppType>;
@@ -83,7 +82,8 @@ export const AppearanceTab = ({
data={[
{
value: 'column',
label: t('appearance.positionAppName.dropdown.top') as string },
label: t('appearance.positionAppName.dropdown.top') as string,
},
{
value: 'row-reverse',
label: t('appearance.positionAppName.dropdown.right') as string,
@@ -94,7 +94,8 @@ export const AppearanceTab = ({
},
{
value: 'row',
label: t('appearance.positionAppName.dropdown.left') as string },
label: t('appearance.positionAppName.dropdown.left') as string,
},
]}
{...form.getInputProps('appearance.positionAppName')}
onChange={(value) => {

23
src/components/Dashboard/Modals/EditAppModal/Tabs/BehaviourTab/BehaviourTab.tsx
View File

@@ -1,9 +1,18 @@
import { Text, TextInput, Tooltip, Stack, Switch, Tabs, Group, useMantineTheme, HoverCard } from '@mantine/core';
import {
Group,
HoverCard,
Stack,
Switch,
Tabs,
Text,
TextInput,
Tooltip,
useMantineTheme,
} from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { useTranslation } from 'next-i18next';
import { InfoCard } from '~/components/InfoCard/InfoCard';
import { AppType } from '~/types/app';
import { InfoCard } from '~/components/InfoCard/InfoCard'
interface BehaviourTabProps {
form: UseFormReturnType<AppType, (values: AppType) => AppType>;
@@ -19,7 +28,7 @@ export const BehaviourTab = ({ form }: BehaviourTabProps) => {
<Switch
label={t('behaviour.isOpeningNewTab.label')}
description={t('behaviour.isOpeningNewTab.description')}
styles={{ label: { fontWeight: 500, }, description: { marginTop: 0, }, }}
styles={{ label: { fontWeight: 500 }, description: { marginTop: 0 } }}
{...form.getInputProps('behaviour.isOpeningNewTab', { type: 'checkbox' })}
/>
<Stack spacing="0.25rem">
@@ -27,11 +36,9 @@ export const BehaviourTab = ({ form }: BehaviourTabProps) => {
<Text size="0.875rem" weight={500}>
{t('behaviour.tooltipDescription.label')}
</Text>
<InfoCard message={t('behaviour.tooltipDescription.description')}/>
<InfoCard message={t('behaviour.tooltipDescription.description')} />
</Group>
<TextInput
{...form.getInputProps('behaviour.tooltipDescription')}
/>
<TextInput {...form.getInputProps('behaviour.tooltipDescription')} />
</Stack>
</Stack>
</Tabs.Panel>

2
src/components/Dashboard/Modals/EditAppModal/Tabs/GeneralTab/GeneralTab.tsx
View File

@@ -2,8 +2,8 @@ import { Stack, Tabs, Text, TextInput } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { IconClick, IconCursorText, IconLink } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { AppType } from '~/types/app';
import { EditAppModalTab } from '../type';
interface GeneralTabProps {

1
src/components/Dashboard/Modals/EditAppModal/Tabs/IntegrationTab/Components/InputElements/GenericSecretInput.tsx
View File

@@ -15,7 +15,6 @@ import {
import { Icon } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useState } from 'react';
import { AppIntegrationPropertyAccessabilityType } from '~/types/app';
interface GenericSecretInputProps {

1
src/components/Dashboard/Modals/EditAppModal/Tabs/IntegrationTab/Components/InputElements/IntegrationSelector.tsx
View File

@@ -3,7 +3,6 @@ import { Group, Image, Select, SelectItem, Text } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { useTranslation } from 'next-i18next';
import { forwardRef } from 'react';
import {
AppIntegrationPropertyType,
AppIntegrationType,

2
src/components/Dashboard/Modals/EditAppModal/Tabs/IntegrationTab/Components/IntegrationOptionsRenderer/IntegrationOptionsRenderer.tsx
View File

@@ -1,7 +1,6 @@
import { Stack } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { IconKey } from '@tabler/icons-react';
import {
AppIntegrationPropertyType,
AppType,
@@ -9,6 +8,7 @@ import {
integrationFieldDefinitions,
integrationFieldProperties,
} from '~/types/app';
import { GenericSecretInput } from '../InputElements/GenericSecretInput';
interface IntegrationOptionsRendererProps {

2
src/components/Dashboard/Modals/EditAppModal/Tabs/IntegrationTab/IntegrationTab.tsx
View File

@@ -2,8 +2,8 @@ import { Alert, Divider, Tabs, Text } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { IconAlertTriangle } from '@tabler/icons-react';
import { Trans, useTranslation } from 'next-i18next';
import { AppType } from '~/types/app';
import { IntegrationSelector } from './Components/InputElements/IntegrationSelector';
import { IntegrationOptionsRenderer } from './Components/IntegrationOptionsRenderer/IntegrationOptionsRenderer';

3
src/components/Dashboard/Modals/EditAppModal/Tabs/NetworkTab/NetworkTab.tsx
View File

@@ -1,7 +1,6 @@
import { MultiSelect, Stack, Switch, Tabs } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { useTranslation } from 'next-i18next';
import { StatusCodes } from '~/tools/acceptableStatusCodes';
import { AppType } from '~/types/app';
@@ -20,7 +19,7 @@ export const NetworkTab = ({ form }: NetworkTabProps) => {
<Switch
label={t('network.statusChecker.label')}
description={t('network.statusChecker.description')}
styles={{ label: { fontWeight: 500, }, description: { marginTop: 0, }, }}
styles={{ label: { fontWeight: 500 }, description: { marginTop: 0 } }}
defaultChecked={form.values.network.enabledStatusChecker}
{...form.getInputProps('network.enabledStatusChecker')}
/>

1
src/components/Dashboard/Tiles/Apps/AppMenu.tsx
View File

@@ -2,6 +2,7 @@ import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { openContextModalGeneric } from '~/tools/mantineModalManagerExtensions';
import { AppType } from '~/types/app';
import { GenericTileMenu } from '../GenericTileMenu';
interface TileMenuProps {

3
src/components/Dashboard/Tiles/Apps/AppPing.tsx
View File

@@ -4,10 +4,9 @@ import Consola from 'consola';
import { TargetAndTransition, Transition, motion } from 'framer-motion';
import { useSession } from 'next-auth/react';
import { useTranslation } from 'next-i18next';
import { RouterOutputs, api } from '~/utils/api';
import { useConfigContext } from '~/config/provider';
import { AppType } from '~/types/app';
import { RouterOutputs, api } from '~/utils/api';
interface AppPingProps {
app: AppType;

4
src/components/Dashboard/Tiles/Apps/AppTile.tsx
View File

@@ -2,8 +2,8 @@ import { Affix, Box, Text, Tooltip, UnstyledButton } from '@mantine/core';
import { createStyles, useMantineTheme } from '@mantine/styles';
import { motion } from 'framer-motion';
import Link from 'next/link';
import { AppType } from '~/types/app';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { HomarrCardWrapper } from '../HomarrCardWrapper';
import { BaseTileProps } from '../type';
@@ -111,7 +111,7 @@ const useStyles = createStyles((theme, _params, getRef) => ({
overflow: 'visible',
flexGrow: 5,
},
appImage:{
appImage: {
maxHeight: '100%',
maxWidth: '100%',
overflow: 'auto',

8
src/components/Dashboard/Tiles/GenericTileMenu.tsx
View File

@@ -1,8 +1,8 @@
import { ActionIcon, Menu } from '@mantine/core';
import { IconLayoutKanban, IconPencil, IconSettings, IconTrash } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useColorTheme } from '~/tools/color';
import { useEditModeStore } from '../Views/useEditModeStore';
interface GenericTileMenuProps {
@@ -12,14 +12,12 @@ interface GenericTileMenuProps {
displayEdit: boolean;
}
export const GenericTileMenu = (
{
export const GenericTileMenu = ({
handleClickEdit,
handleClickChangePosition,
handleClickDelete,
displayEdit,
}: GenericTileMenuProps
) => {
}: GenericTileMenuProps) => {
const { t } = useTranslation('common');
const isEditMode = useEditModeStore((x) => x.enabled);

1
src/components/Dashboard/Tiles/Widgets/Inputs/DraggableList.tsx
View File

@@ -3,7 +3,6 @@ import { useDisclosure } from '@mantine/hooks';
import { IconChevronDown, IconGripVertical } from '@tabler/icons-react';
import { Reorder, useDragControls } from 'framer-motion';
import { FC, useEffect, useRef } from 'react';
import { IDraggableEditableListInputValue } from '~/widgets/widgets';
interface DraggableListProps {

1
src/components/Dashboard/Tiles/Widgets/Inputs/StaticDraggableList.tsx
View File

@@ -3,7 +3,6 @@ import { useDisclosure } from '@mantine/hooks';
import { IconChevronDown, IconGripVertical } from '@tabler/icons-react';
import { Reorder, useDragControls } from 'framer-motion';
import { FC, ReactNode, useEffect, useRef } from 'react';
import { IDraggableListInputValue } from '~/widgets/widgets';
const useStyles = createStyles((theme) => ({

4
src/components/Dashboard/Tiles/Widgets/WidgetsEditModal.tsx
View File

@@ -18,13 +18,13 @@ import { ContextModalProps } from '@mantine/modals';
import { IconAlertTriangle, IconPlaylistX, IconPlus } from '@tabler/icons-react';
import { Trans, useTranslation } from 'next-i18next';
import { FC, useState } from 'react';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { mapObject } from '~/tools/client/objects';
import Widgets from '../../../../widgets';
import type { IDraggableListInputValue, IWidgetOptionValue } from '~/widgets/widgets';
import { IWidget } from '~/widgets/widgets';
import Widgets from '../../../../widgets';
import { InfoCard } from '../../../InfoCard/InfoCard';
import { DraggableList } from './Inputs/DraggableList';
import { LocationSelection } from './Inputs/LocationSelection';

4
src/components/Dashboard/Tiles/Widgets/WidgetsMenu.tsx
View File

@@ -1,9 +1,9 @@
import { Title } from '@mantine/core';
import { useTranslation } from 'next-i18next';
import { openContextModalGeneric } from '~/tools/mantineModalManagerExtensions';
import WidgetsDefinitions from '../../../../widgets';
import { IWidget } from '~/widgets/widgets';
import WidgetsDefinitions from '../../../../widgets';
import { useWrapperColumnCount } from '../../Wrappers/gridstack/store';
import { GenericTileMenu } from '../GenericTileMenu';
import { WidgetEditModalInnerProps } from './WidgetsEditModal';

1
src/components/Dashboard/Tiles/Widgets/WidgetsRemoveModal.tsx
View File

@@ -1,7 +1,6 @@
import { Button, Group, Stack, Text } from '@mantine/core';
import { ContextModalProps } from '@mantine/modals';
import { Trans, useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';

2
src/components/Dashboard/Views/DashboardView.tsx
View File

@@ -1,11 +1,11 @@
import { Group, Stack } from '@mantine/core';
import { useEffect, useMemo, useRef } from 'react';
import { useConfigContext } from '~/config/provider';
import { useResize } from '~/hooks/use-resize';
import { useScreenLargerThan } from '~/hooks/useScreenLargerThan';
import { CategoryType } from '~/types/category';
import { WrapperType } from '~/types/wrapper';
import { DashboardCategory } from '../Wrappers/Category/Category';
import { DashboardSidebar } from '../Wrappers/Sidebar/Sidebar';
import { DashboardWrapper } from '../Wrappers/Wrapper/Wrapper';

2
src/components/Dashboard/Views/ViewToggleButton.tsx
View File

@@ -1,8 +1,8 @@
import { ActionIcon, Button, Text, Tooltip } from '@mantine/core';
import { IconEdit, IconEditOff } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useScreenLargerThan } from '~/hooks/useScreenLargerThan';
import { useEditModeStore } from './useEditModeStore';
export const ViewToggleButton = () => {

2
src/components/Dashboard/Wrappers/Category/Category.tsx
View File

@@ -13,9 +13,9 @@ import { useLocalStorage } from '@mantine/hooks';
import { modals } from '@mantine/modals';
import { IconDotsVertical, IconShare3 } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
import { CategoryType } from '~/types/category';
import { useCardStyles } from '../../../layout/Common/useCardStyles';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { WrapperContent } from '../WrapperContent';

18
src/components/Dashboard/Wrappers/Category/CategoryEditMenu.tsx
View File

@@ -8,11 +8,11 @@ import {
IconTransitionTop,
IconTrash,
} from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
import { CategoryType } from '~/types/category';
import { useCategoryActions } from './useCategoryActions';
import { useTranslation } from 'next-i18next';
interface CategoryEditMenuProps {
category: CategoryType;
@@ -22,7 +22,7 @@ export const CategoryEditMenu = ({ category }: CategoryEditMenuProps) => {
const { name: configName } = useConfigContext();
const { addCategoryAbove, addCategoryBelow, moveCategoryUp, moveCategoryDown, edit, remove } =
useCategoryActions(configName, category);
const { t } = useTranslation(['layout/common','common']);
const { t } = useTranslation(['layout/common', 'common']);
return (
<Menu withinPortal withArrow>
@@ -38,23 +38,19 @@ export const CategoryEditMenu = ({ category }: CategoryEditMenuProps) => {
<Menu.Item icon={<IconTrash size={20} />} onClick={remove}>
{t('common:remove')}
</Menu.Item>
<Menu.Label>
{t('common:changePosition')}
</Menu.Label>
<Menu.Label>{t('common:changePosition')}</Menu.Label>
<Menu.Item icon={<IconTransitionTop size={20} />} onClick={moveCategoryUp}>
{t('menu.moveUp')}
</Menu.Item>
<Menu.Item icon={<IconTransitionBottom size={20} />} onClick={moveCategoryDown}>
{t('menu.moveDown')}
</Menu.Item>
<Menu.Label>
{t('menu.addCategory',{location: ''})}
</Menu.Label>
<Menu.Label>{t('menu.addCategory', { location: '' })}</Menu.Label>
<Menu.Item icon={<IconRowInsertTop size={20} />} onClick={addCategoryAbove}>
{t('menu.addCategory',{location: t('menu.addAbove')})}
{t('menu.addCategory', { location: t('menu.addAbove') })}
</Menu.Item>
<Menu.Item icon={<IconRowInsertBottom size={20} />} onClick={addCategoryBelow}>
{t('menu.addCategory',{location: t('menu.addBelow')})}
{t('menu.addCategory', { location: t('menu.addBelow') })}
</Menu.Item>
</Menu.Dropdown>
</Menu>

1
src/components/Dashboard/Wrappers/Category/CategoryEditModal.tsx
View File

@@ -2,7 +2,6 @@ import { Button, Group, TextInput } from '@mantine/core';
import { useForm } from '@mantine/form';
import { ContextModalProps } from '@mantine/modals';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { CategoryType } from '~/types/category';

2
src/components/Dashboard/Wrappers/Category/useCategoryActions.tsx
View File

@@ -1,11 +1,11 @@
import { v4 as uuidv4 } from 'uuid';
import { useConfigStore } from '~/config/store';
import { openContextModalGeneric } from '~/tools/mantineModalManagerExtensions';
import { AppType } from '~/types/app';
import { CategoryType } from '~/types/category';
import { WrapperType } from '~/types/wrapper';
import { IWidget } from '~/widgets/widgets';
import { CategoryEditModalInnerProps } from './CategoryEditModal';
export const useCategoryActions = (configName: string | undefined, category: CategoryType) => {

1
src/components/Dashboard/Wrappers/Wrapper/Wrapper.tsx
View File

@@ -1,4 +1,5 @@
import { WrapperType } from '~/types/wrapper';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { WrapperContent } from '../WrapperContent';
import { useGridstack } from '../gridstack/use-gridstack';

4
src/components/Dashboard/Wrappers/WrapperContent.tsx
View File

@@ -1,10 +1,10 @@
import { GridStack } from 'fily-publish-gridstack';
import { MutableRefObject, RefObject } from 'react';
import { AppType } from '~/types/app';
import Widgets from '../../../widgets';
import { WidgetWrapper } from '~/widgets/WidgetWrapper';
import { IWidget, IWidgetDefinition } from '~/widgets/widgets';
import Widgets from '../../../widgets';
import { appTileDefinition } from '../Tiles/Apps/AppTile';
import { GridstackTileWrapper } from '../Tiles/TileWrapper';
import { useGridstackStore } from './gridstack/store';

1
src/components/Dashboard/Wrappers/gridstack/init-gridstack.ts
View File

@@ -1,6 +1,5 @@
import { GridItemHTMLElement, GridStack, GridStackNode } from 'fily-publish-gridstack';
import { MutableRefObject, RefObject } from 'react';
import { AppType } from '~/types/app';
import { ShapeType } from '~/types/shape';
import { IWidget } from '~/widgets/widgets';

1
src/components/Dashboard/Wrappers/gridstack/store.tsx
View File

@@ -1,5 +1,4 @@
import { createWithEqualityFn } from 'zustand/traditional';
import { useConfigContext } from '~/config/provider';
import { GridstackBreakpoints } from '~/constants/gridstack-breakpoints';

2
src/components/Dashboard/Wrappers/gridstack/use-gridstack.ts
View File

@@ -1,11 +1,11 @@
import { GridStack, GridStackNode } from 'fily-publish-gridstack';
import { MutableRefObject, RefObject, createRef, useEffect, useMemo, useRef } from 'react';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { AppType } from '~/types/app';
import { AreaType } from '~/types/area';
import { IWidget } from '~/widgets/widgets';
import { useEditModeStore } from '../../Views/useEditModeStore';
import { TileWithUnknownLocation, initializeGridstack } from './init-gridstack';
import { useGridstackStore, useWrapperColumnCount } from './store';

6
src/components/IconSelector/IconSelector.tsx
View File

@@ -15,9 +15,9 @@ import {
import { IconSearch } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { forwardRef, useImperativeHandle, useState } from 'react';
import { humanFileSize } from '~/tools/humanFileSize';
import { api } from '~/utils/api';
import { humanFileSize } from '~/tools/humanFileSize';
import { DebouncedImage } from './DebouncedImage';
export const IconSelector = forwardRef(
@@ -83,9 +83,7 @@ export const IconSelector = forwardRef(
}
icon={<DebouncedImage src={value ?? currentValue} width={20} height={20} />}
rightSection={
(value ?? currentValue).length > 0 ? (
<CloseButton onClick={() => onChange("")} />
) : null
(value ?? currentValue).length > 0 ? <CloseButton onClick={() => onChange('')} /> : null
}
itemComponent={AutoCompleteItem}
className={classes.textInput}

4
src/components/InfoCard/InfoCard.tsx
View File

@@ -23,7 +23,9 @@ interface InfoCardProps {
export const InfoCard = ({ bg, cardProp, message, link, hoverProp, position }: InfoCardProps) => {
const { colorScheme } = useMantineTheme();
const { t } = useTranslation('common');
const content = link? message + ` <a href=\"${link}\" target=\"_blank\">${t('seeMore')}</a>` : message;
const content = link
? message + ` <a href=\"${link}\" target=\"_blank\">${t('seeMore')}</a>`
: message;
const editor = useEditor({
content,
editable: false,

7
src/components/Manage/User/Create/review-input-step.tsx
View File

@@ -23,7 +23,12 @@ export const ReviewInputStep = ({ values, prevStep, nextStep }: ReviewInputStepP
const { t } = useTranslation('manage/users/create');
const utils = api.useContext();
const { mutateAsync: createAsync, isLoading, isError, error } = api.user.create.useMutation({
const {
mutateAsync: createAsync,
isLoading,
isError,
error,
} = api.user.create.useMutation({
onSettled: () => {
void utils.user.all.invalidate();
},

6
src/components/Onboarding/step-update-path-mappings.tsx
View File

@@ -39,7 +39,7 @@ services:
const added = { color: 'green', label: '+' };
export const StepUpdatePathMappings = ({ next }: { next: () => void }) => {
const [selectedTab, setSelectedTab] = useState<TabsValue>("standard_docker");
const [selectedTab, setSelectedTab] = useState<TabsValue>('standard_docker');
return (
<OnboardingStepWrapper>
<Title order={2} align="center" mb="md">
@@ -140,7 +140,9 @@ export const StepUpdatePathMappings = ({ next }: { next: () => void }) => {
{dockerComposeCommand}
</Prism>
</List.Item>
<List.Item>Run <Code>docker compose up</Code>.</List.Item>
<List.Item>
Run <Code>docker compose up</Code>.
</List.Item>
<List.Item>Refresh this page and click on "continue"</List.Item>
</List>
</Tabs.Panel>

1
src/components/Password/password-requirements.tsx
View File

@@ -23,7 +23,6 @@ function getStrength(password: string) {
score += 1;
}
return (score / goal) * 100;
}
export const PasswordRequirements = ({ value }: { value: string }) => {

19
src/components/ThemeSchemeToggle/ThemeSchemeToggle.tsx
View File

@@ -1,23 +1,14 @@
import {
ActionIcon,
ActionIconProps,
} from '@mantine/core';
import { useColorScheme } from '~/hooks/use-colorscheme';
import { ActionIcon, ActionIconProps } from '@mantine/core';
import { IconMoonStars, IconSun } from '@tabler/icons-react';
import { useColorScheme } from '~/hooks/use-colorscheme';
export const ThemeSchemeToggle = (props : Partial<ActionIconProps>) => {
export const ThemeSchemeToggle = (props: Partial<ActionIconProps>) => {
const { colorScheme, toggleColorScheme } = useColorScheme();
const Icon = colorScheme === 'dark' ? IconSun : IconMoonStars;
return (
<ActionIcon
size={50}
variant="outline"
radius="md"
onClick={toggleColorScheme}
{...props}
>
<Icon size="66%"/>
<ActionIcon size={50} variant="outline" radius="md" onClick={toggleColorScheme} {...props}>
<Icon size="66%" />
</ActionIcon>
);
};

2
src/components/layout/Background/PolkaElement.tsx
View File

@@ -17,7 +17,7 @@ export const PolkaElement = ({
<Box
style={{
transform: `rotate(${rotation}deg)`,
pointerEvents: 'none'
pointerEvents: 'none',
}}
className="polka"
pos="absolute"

2
src/components/layout/Common/Logo.tsx
View File

@@ -1,7 +1,7 @@
import { Group, Image, Text } from '@mantine/core';
import { useConfigContext } from '~/config/provider';
import { useScreenLargerThan } from '~/hooks/useScreenLargerThan';
import { useConfigContext } from '~/config/provider';
import { usePrimaryGradient } from './useGradient';
interface LogoProps {

1
src/components/layout/Common/useCardStyles.ts
View File

@@ -1,5 +1,4 @@
import { createStyles } from '@mantine/core';
import { useConfigContext } from '~/config/provider';
export const useCardStyles = (isCategory: boolean) => {

1
src/components/layout/Common/useGradient.tsx
View File

@@ -1,5 +1,4 @@
import { MantineGradient } from '@mantine/core';
import { useColorTheme } from '~/tools/color';
export const usePrimaryGradient = () => {

3
src/components/layout/Meta/BoardHeadOverride.tsx
View File

@@ -1,8 +1,7 @@
import Head from 'next/head';
import React from 'react';
import { firstUpperCase } from '~/tools/shared/strings';
import { useConfigContext } from '~/config/provider';
import { firstUpperCase } from '~/tools/shared/strings';
export const BoardHeadOverride = () => {
const { config, name } = useConfigContext();

8
src/components/layout/Templates/ManageLayout.tsx
View File

@@ -112,7 +112,13 @@ export const ManageLayout = ({ children }: ManageLayoutProps) => {
{children}
</Paper>
</AppShell>
<Drawer opened={burgerMenuOpen} onClose={closeBurgerMenu}>
<Drawer
opened={burgerMenuOpen}
onClose={closeBurgerMenu}
transitionProps={{
transition: 'slide-right',
}}
>
{navigationLinkComponents}
</Drawer>
</>

26
src/components/layout/header/About/AboutModal.tsx
View File

@@ -7,8 +7,8 @@ import {
Grid,
Group,
HoverCard,
Kbd,
Image,
Kbd,
Modal,
Table,
Text,
@@ -31,11 +31,11 @@ import { motion } from 'framer-motion';
import { InitOptions } from 'i18next';
import { Trans, i18n, useTranslation } from 'next-i18next';
import { ReactNode } from 'react';
import { useConfigContext } from '~/config/provider';
import { useConfigStore } from '~/config/store';
import { usePackageAttributesStore } from '~/tools/client/zustands/usePackageAttributesStore';
import { useColorTheme } from '~/tools/color';
import { usePrimaryGradient } from '../../Common/useGradient';
import Credits from './Credits';
import Tip from './Tip';
@@ -75,13 +75,7 @@ export const AboutModal = ({ opened, closeModal, newVersionAvailable }: AboutMod
opened={opened}
title={
<Group spacing="sm">
<Image
alt="Homarr logo"
src="/imgs/logo/logo.png"
width={30}
height={30}
fit="contain"
/>
<Image alt="Homarr logo" src="/imgs/logo/logo.png" width={30} height={30} fit="contain" />
<Title order={3} variant="gradient" gradient={colorGradiant}>
{t('about')} Homarr
</Title>
@@ -271,13 +265,17 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl
transition={{ duration: 0.8, ease: 'easeInOut' }}
>
<Badge color="green" variant="filled">
{t('version.new',{ newVersion: newVersionAvailable})}
{t('version.new', { newVersion: newVersionAvailable })}
</Badge>
</motion.div>
</HoverCard.Target>
<HoverCard.Dropdown>
<Text>
{t('version.dropdown', {currentVersion: attributes.packageVersion}).split('{{newVersion}}')[0]}
{
t('version.dropdown', { currentVersion: attributes.packageVersion }).split(
'{{newVersion}}'
)[0]
}
<b>
<Anchor
target="_blank"
@@ -286,7 +284,11 @@ const useInformationTableItems = (newVersionAvailable?: string): InformationTabl
{newVersionAvailable}
</Anchor>
</b>
{t('version.dropdown', {currentVersion: attributes.packageVersion}).split('{{newVersion}}')[1]}
{
t('version.dropdown', { currentVersion: attributes.packageVersion }).split(
'{{newVersion}}'
)[1]
}
</Text>
</HoverCard.Dropdown>
</HoverCard>

1
src/components/layout/header/About/Credits.tsx
View File

@@ -1,7 +1,6 @@
import { Anchor, Box, Collapse, Flex, Table, Text } from '@mantine/core';
import { useDisclosure } from '@mantine/hooks';
import { useTranslation } from 'next-i18next';
import { usePackageAttributesStore } from '~/tools/client/zustands/usePackageAttributesStore';
export default function Credits() {

26
src/components/layout/header/AvatarMenu.tsx
View File

@@ -1,4 +1,4 @@
import { Avatar, Badge, Menu, UnstyledButton, useMantineTheme } from '@mantine/core';
import { Avatar, Badge, Indicator, Menu, UnstyledButton, useMantineTheme } from '@mantine/core';
import { useDisclosure } from '@mantine/hooks';
import {
IconDashboard,
@@ -38,10 +38,17 @@ export const AvatarMenu = () => {
<UnstyledButton>
<Menu width={256}>
<Menu.Target>
<CurrentUserAvatar user={sessionData?.user ?? null} />
<CurrentUserAvatar
newVersionAvailable={newVersionAvailable ? true : false}
user={sessionData?.user ?? null}
/>
</Menu.Target>
<Menu.Dropdown>
<Menu.Item closeMenuOnClick={false} icon={<Icon size="1rem" />} onClick={toggleColorScheme}>
<Menu.Item
closeMenuOnClick={false}
icon={<Icon size="1rem" />}
onClick={toggleColorScheme}
>
{t('actions.avatar.switchTheme')}
</Menu.Item>
{sessionData?.user && (
@@ -113,13 +120,24 @@ export const AvatarMenu = () => {
};
type CurrentUserAvatarProps = {
newVersionAvailable: boolean;
user: User | null;
};
const CurrentUserAvatar = forwardRef<HTMLDivElement, CurrentUserAvatarProps>(
({ user, ...others }, ref) => {
({ user, newVersionAvailable, ...others }, ref) => {
const { primaryColor } = useMantineTheme();
if (!user) return <Avatar ref={ref} {...others} />;
if (newVersionAvailable)
return (
<Indicator withBorder offset={2} color="blue" processing size={15}>
<Avatar ref={ref} color={primaryColor} {...others}>
{user.name?.slice(0, 2).toUpperCase()}
</Avatar>
</Indicator>
);
return (
<Avatar ref={ref} color={primaryColor} {...others}>
{user.name?.slice(0, 2).toUpperCase()}

2
src/config/init.ts
View File

@@ -1,6 +1,6 @@
import { useEffect } from 'react';
import { ConfigType } from '~/types/config';
import { useConfigContext } from './provider';
import { useConfigStore } from './store';

2
src/config/provider.tsx
View File

@@ -1,8 +1,8 @@
import { ReactNode, createContext, useContext, useEffect, useState } from 'react';
import { shallow } from 'zustand/shallow';
import { useColorTheme } from '~/tools/color';
import { ConfigType } from '~/types/config';
import { useConfigStore } from './store';
export type ConfigContextType = {

3
src/config/store.ts
View File

@@ -1,7 +1,6 @@
import { createWithEqualityFn } from 'zustand/traditional';
import { trcpProxyClient } from '~/utils/api';
import { ConfigType } from '~/types/config';
import { trcpProxyClient } from '~/utils/api';
export const useConfigStore = createWithEqualityFn<UseConfigStoreType>(
(set, get) => ({

2
src/env.js
View File

@@ -26,6 +26,7 @@ const env = createEnv({
),
DOCKER_HOST: z.string().optional(),
DOCKER_PORT: portSchema,
DEMO_MODE: z.string().optional(),
HOSTNAME: z.string().optional(),
},
@@ -63,6 +64,7 @@ const env = createEnv({
NEXT_PUBLIC_PORT: process.env.PORT,
NEXT_PUBLIC_NODE_ENV: process.env.NODE_ENV,
HOSTNAME: process.env.HOSTNAME,
DEMO_MODE: process.env.DEMO_MODE,
},
skipValidation: !!process.env.SKIP_ENV_VALIDATION,
});

2
src/middleware.ts
View File

@@ -48,7 +48,7 @@ const shouldRedirectToOnboard = async (): Promise<boolean> => {
const cacheAndGetUserCount = async () => {
cachedUserCount = await client.user.count.query();
return cachedUserCount === 0;
}
};
if (!env.DATABASE_URL?.startsWith('file:')) {
return await cacheAndGetUserCount();

2
src/modules/common/MediaDisplay.tsx
View File

@@ -2,9 +2,9 @@ import { Badge, Button, Group, Image, Stack, Text, Title } from '@mantine/core';
import { IconDownload, IconExternalLink, IconPlayerPlay } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useState } from 'react';
import { useConfigContext } from '~/config/provider';
import { useColorTheme } from '~/tools/color';
import { RequestModal } from '../overseerr/RequestModal';
import { Result } from '../overseerr/SearchResult';

2
src/modules/overseerr/RequestModal.tsx
View File

@@ -5,9 +5,9 @@ import Consola from 'consola';
import { useTranslation } from 'next-i18next';
import { useState } from 'react';
import { useConfigContext } from '~/config/provider';
import { useColorTheme } from '~/tools/color';
import { api } from '~/utils/api';
import { useColorTheme } from '~/tools/color';
import { MovieResult } from './Movie.d';
import { Result } from './SearchResult';
import { TvShowResult, TvShowResultSeason } from './TvShow.d';

6
src/pages/404.tsx
View File

@@ -5,9 +5,8 @@ import Head from 'next/head';
import Image from 'next/image';
import Link from 'next/link';
import pageNotFoundImage from '~/images/undraw_page_not_found_re_e9o6.svg';
import { pageNotFoundNamespaces } from '~/tools/server/translation-namespaces';
import { getServerSideTranslations } from '~/tools/server/getServerSideTranslations';
import { pageNotFoundNamespaces } from '~/tools/server/translation-namespaces';
export default function Custom404() {
const { classes } = useStyles();
@@ -27,6 +26,9 @@ export default function Custom404() {
<Button component={Link} variant="light" href="/b">
{t('button')}
</Button>
<Button component={Link} variant="light" href="/auth/login">
Login
</Button>
</Stack>
</Center>
);

11
src/pages/auth/login.tsx
View File

@@ -22,6 +22,7 @@ import { useState } from 'react';
import { z } from 'zod';
import { ThemeSchemeToggle } from '~/components/ThemeSchemeToggle/ThemeSchemeToggle';
import { FloatingBackground } from '~/components/layout/Background/FloatingBackground';
import { env } from '~/env';
import { getServerAuthSession } from '~/server/auth';
import { getServerSideTranslations } from '~/tools/server/getServerSideTranslations';
import { useI18nZodResolver } from '~/utils/i18n-zod-resolver';
@@ -29,6 +30,7 @@ import { signInSchema } from '~/validations/user';
export default function LoginPage({
redirectAfterLogin,
isDemo,
}: InferGetServerSidePropsType<typeof getServerSideProps>) {
const { t } = useTranslation('authentication/login');
const { i18nZodResolver } = useI18nZodResolver();
@@ -86,6 +88,12 @@ export default function LoginPage({
Homarr
</Text>
</Stack>
{isDemo && (
<Alert title="Demo credentials">
For demo purposes, you can login with the login <b>demo</b> and password :{' '}
<b>demodemo</b>
</Alert>
)}
<Card withBorder shadow="md" p="xl" radius="md" w="90%" maw={450}>
<Title style={{ whiteSpace: 'nowrap' }} align="center" weight={900}>
{t('title')}
@@ -156,10 +164,13 @@ export const getServerSideProps: GetServerSideProps = async ({ locale, req, res,
};
}
const isDemo = env.DEMO_MODE === 'true';
return {
props: {
...(await getServerSideTranslations(['authentication/login'], locale, req, res)),
redirectAfterLogin,
isDemo,
},
};
};

2
src/pages/manage/index.tsx
View File

@@ -2,11 +2,11 @@ import {
Box,
Card,
Group,
Image,
SimpleGrid,
Stack,
Text,
Title,
Image,
UnstyledButton,
createStyles,
} from '@mantine/core';

16
src/server/api/routers/app.ts
View File

@@ -10,10 +10,14 @@ import { AppType } from '~/types/app';
import { createTRPCRouter, publicProcedure } from '../trpc';
export const appRouter = createTRPCRouter({
ping: publicProcedure.input(z.object({
ping: publicProcedure
.input(
z.object({
id: z.string(),
configName: z.string()
})).query(async ({ input }) => {
configName: z.string(),
})
)
.query(async ({ input }) => {
const agent = new https.Agent({ rejectUnauthorized: false });
const config = getConfig(input.configName);
const app = config.apps.find((app) => app.id === input.id);
@@ -31,7 +35,7 @@ export const appRouter = createTRPCRouter({
.then((response) => ({
status: response.status,
statusText: response.statusText,
state: isStatusOk(app as AppType, response.status) ? 'online' : 'offline'
state: isStatusOk(app as AppType, response.status) ? 'online' : 'offline',
}))
.catch((error: AxiosError) => {
if (error.response) {
@@ -43,7 +47,9 @@ export const appRouter = createTRPCRouter({
}
if (error.code === 'ECONNABORTED') {
Consola.error(`Ping timed out for app with id '${input.id}' in config '${input.configName}' -> url: ${app.url})`);
Consola.error(
`Ping timed out for app with id '${input.id}' in config '${input.configName}' -> url: ${app.url})`
);
throw new TRPCError({
code: 'TIMEOUT',
cause: input,

10
src/server/api/routers/media-request.ts
View File

@@ -1,13 +1,13 @@
import Consola from 'consola';
import { removeTrailingSlash } from 'next/dist/shared/lib/router/utils/remove-trailing-slash';
import { z } from 'zod';
import { checkIntegrationsType } from '~/tools/client/app-properties';
import { getConfig } from '~/tools/config/getConfig';
import { MediaRequestListWidget } from '~/widgets/media-requests/MediaRequestListTile';
import { MediaRequestStatsWidget } from '~/widgets/media-requests/MediaRequestStatsTile';
import { MediaRequest, Users } from '~/widgets/media-requests/media-request-types';
import { createTRPCRouter, publicProcedure } from '../trpc';
import { MediaRequestStatsWidget } from '~/widgets/media-requests/MediaRequestStatsTile';
import { removeTrailingSlash } from 'next/dist/shared/lib/router/utils/remove-trailing-slash';
export const mediaRequestsRouter = createTRPCRouter({
allMedia: publicProcedure
@@ -33,7 +33,9 @@ export const mediaRequestsRouter = createTRPCRouter({
})
.then(async (response) => {
const body = (await response.json()) as OverseerrResponse;
let appUrl = input.widget.properties.replaceLinksWithExternalHost && app.behaviour.externalUrl?.length > 0
let appUrl =
input.widget.properties.replaceLinksWithExternalHost &&
app.behaviour.externalUrl?.length > 0
? app.behaviour.externalUrl
: app.url;
@@ -163,7 +165,7 @@ const retrieveDetailsForItem = async (
backdropPath: series.backdropPath,
posterPath: series.backdropPath,
};
};
}
const movieResponse = await fetch(`${baseUrl}/api/v1/movie/${id}`, {
headers,

27
src/server/api/routers/media-server.ts
View File

@@ -2,21 +2,18 @@ import { Jellyfin } from '@jellyfin/sdk';
import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client/models';
import { getSessionApi } from '@jellyfin/sdk/lib/utils/api/session-api';
import { getSystemApi } from '@jellyfin/sdk/lib/utils/api/system-api';
import Consola from 'consola';
import { z } from 'zod';
import { createTRPCRouter, publicProcedure } from '../trpc';
import { ConfigAppType } from '~/types/app';
import { checkIntegrationsType, findAppProperty } from '~/tools/client/app-properties';
import { getConfig } from '~/tools/config/getConfig';
import { PlexClient } from '~/tools/server/sdk/plex/plexClient';
import { trimStringEnding } from '~/tools/shared/strings';
import { GenericMediaServer } from '~/types/api/media-server/media-server';
import { MediaServersResponseType } from '~/types/api/media-server/response';
import { GenericCurrentlyPlaying, GenericSessionInfo } from '~/types/api/media-server/session-info';
import { PlexClient } from '~/tools/server/sdk/plex/plexClient';
import { ConfigAppType } from '~/types/app';
import { createTRPCRouter, publicProcedure } from '../trpc';
const jellyfin = new Jellyfin({
clientInfo: {
@@ -108,7 +105,13 @@ const handleServer = async (app: ConfigAppType): Promise<GenericMediaServer | un
return {
type: 'jellyfin',
appId: app.id,
serverAddress: trimStringEnding(app.url, ['/web/index.html#!/home.html', '/web', '/web/index.html', '/web/', '/web/index.html#']),
serverAddress: trimStringEnding(app.url, [
'/web/index.html#!/home.html',
'/web',
'/web/index.html',
'/web/',
'/web/index.html#',
]),
version: infoApi.data.Version ?? undefined,
sessions: sessions
.filter((session) => session.NowPlayingItem)
@@ -180,7 +183,13 @@ const handleServer = async (app: ConfigAppType): Promise<GenericMediaServer | un
if (!apiKey) {
return {
serverAddress: trimStringEnding(app.url, ['/web', '/web/index.html', '/web/index.html#!', '/web/index.html#!/settings/web/general', '/web/']),
serverAddress: trimStringEnding(app.url, [
'/web',
'/web/index.html',
'/web/index.html#!',
'/web/index.html#!/settings/web/general',
'/web/',
]),
sessions: [],
type: 'plex',
appId: app.id,

2
src/server/api/routers/rss.ts
View File

@@ -70,7 +70,7 @@ export const rssRouter = createTRPCRouter({
}
if (input.feedUrls.length === 0) {
return []
return [];
}
const result = await Promise.all(

7
src/server/api/routers/timezone.ts
View File

@@ -1,8 +1,9 @@
import { z } from 'zod';
const GeoTz = require('browser-geo-tz/dist/geotz.js');
import { createTRPCRouter, publicProcedure } from '../trpc';
const GeoTz = require('browser-geo-tz/dist/geotz.js');
export const timezoneRouter = createTRPCRouter({
at: publicProcedure
.input(
@@ -12,7 +13,7 @@ export const timezoneRouter = createTRPCRouter({
})
)
.query(async ({ input }) => {
const timezone = GeoTz.find(input.latitude,input.longitude);
const timezone = GeoTz.find(input.latitude, input.longitude);
return Array.isArray(timezone) ? timezone[0] : timezone;
}),
})
});

2
src/tools/config/getConfig.ts
View File

@@ -1,7 +1,7 @@
import Consola from 'consola';
import { v4 as uuidv4 } from 'uuid';
import { BackendConfigType, ConfigType } from '~/types/config';
import { configExists } from './configExists';
import { getFallbackConfig } from './getFallbackConfig';
import { readConfig } from './readConfig';

5
src/tools/config/getFallbackConfig.ts
View File

@@ -1,4 +1,5 @@
import { ConfigType } from '~/types/config';
import defaultConfig from '../../../data/configs/default.json';
export const getFallbackConfig = (name?: string) => ({
@@ -11,7 +12,7 @@ export const getFallbackConfig = (name?: string) => ({
export const getStaticFallbackConfig = (name: string): ConfigType => ({
schemaVersion: 1,
configProperties: {
name: name
name: name,
},
categories: [
{
@@ -55,7 +56,7 @@ export const getStaticFallbackConfig = (name: string): ConfigType => ({
},
accessibility: {
disablePingPulse: false,
replacePingDotsWithIcons: false
replacePingDotsWithIcons: false,
},
pageTitle: 'Homarr ⭐️',
logoImageUrl: '/imgs/logo/logo.png',

18
src/tools/config/getFrontendConfig.ts
View File

@@ -2,8 +2,8 @@ import Consola from 'consola';
import fs from 'fs';
import { fetchCity } from '~/server/api/routers/weather';
import { IntegrationField } from '~/types/app';
import { BackendConfigType, ConfigType } from '~/types/config';
import { getConfig } from './getConfig';
export const getFrontendConfig = async (name: string): Promise<ConfigType> => {
@@ -139,11 +139,11 @@ const migrateAppConfigs = (config: BackendConfigType) => {
...app,
appearance: {
...app.appearance,
appNameStatus: app.appearance.appNameStatus?? 'normal',
positionAppName: app.appearance.positionAppName?? 'column',
appNameFontSize: app.appearance.appNameFontSize?? 16,
lineClampAppName: app.appearance.lineClampAppName?? 1,
}
}))
}
}
appNameStatus: app.appearance.appNameStatus ?? 'normal',
positionAppName: app.appearance.positionAppName ?? 'column',
appNameFontSize: app.appearance.appNameFontSize ?? 16,
lineClampAppName: app.appearance.lineClampAppName ?? 1,
},
})),
};
};

2
src/tools/config/writeConfig.ts
View File

@@ -1,6 +1,6 @@
import fs from 'fs';
import { BackendConfigType } from '~/types/config';
import { generateConfigPath } from './generateConfigPath';
export function writeConfig(config: BackendConfigType) {

8
src/tools/server/getServerSideTranslations.ts
View File

@@ -10,7 +10,13 @@ export const getServerSideTranslations = async (
req?: IncomingMessage,
res?: ServerResponse
) => {
namespaces = namespaces.concat(['common', 'zod', 'layout/header', 'layout/modals/about']);
namespaces = namespaces.concat([
'common',
'zod',
'layout/header',
'layout/modals/about',
'settings/common',
]);
if (!req || !res) {
return serverSideTranslations(requestLocale ?? 'en', namespaces);

6
src/tools/server/loginBuilder.ts
View File

@@ -10,7 +10,7 @@ import { ParsedUrlQuery } from 'querystring';
export const checkForSessionOrAskForLogin = (
context: GetServerSidePropsContext<ParsedUrlQuery, PreviewData>,
session: Session | null,
accessCallback: () => boolean,
accessCallback: () => boolean
): GetServerSidePropsResult<any> | undefined => {
if (!session?.user) {
console.log('detected logged out user!');
@@ -26,8 +26,8 @@ export const checkForSessionOrAskForLogin = (
if (!accessCallback()) {
return {
props: {},
notFound: true
}
notFound: true,
};
}
return undefined;

1
src/tools/server/sdk/adGuard/adGuard.ts
View File

@@ -2,6 +2,7 @@ import axios from 'axios';
import Consola from 'consola';
import { z } from 'zod';
import { trimStringEnding } from '~/tools/shared/strings';
import {
adGuardApiFilteringStatusSchema,
adGuardApiStatsResponseSchema,

14
src/tools/server/sdk/pihole/piHole.spec.ts
View File

@@ -171,7 +171,7 @@ describe('PiHole API client', () => {
});
}
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice'){
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice') {
countTriedRequests += 1;
return JSON.stringify({
status: 'enabled',
@@ -213,9 +213,9 @@ describe('PiHole API client', () => {
});
}
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice'){
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice') {
countTriedRequests += 1;
if(countTriedRequests < 10) {
if (countTriedRequests < 10) {
return JSON.stringify({
status: 'disabled',
});
@@ -261,7 +261,7 @@ describe('PiHole API client', () => {
});
}
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice'){
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice') {
countTriedRequests += 1;
return JSON.stringify({
status: 'disabled',
@@ -303,9 +303,9 @@ describe('PiHole API client', () => {
});
}
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice'){
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice') {
countTriedRequests += 1;
if(countTriedRequests < 10) {
if (countTriedRequests < 10) {
return JSON.stringify({
status: 'enabled',
});
@@ -351,7 +351,7 @@ describe('PiHole API client', () => {
});
}
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice'){
if (request.url === 'http://pi.hole/admin/api.php?summaryRaw&auth=nice') {
countTriedRequests += 1;
return JSON.stringify({
status: 'disabled',

17
src/tools/server/sdk/pihole/piHole.ts
View File

@@ -1,4 +1,5 @@
import { trimStringEnding } from '~/tools/shared/strings';
import { PiHoleApiStatusChangeResponse, PiHoleApiSummaryResponse } from './piHole.type';
export class PiHoleClient {
@@ -62,18 +63,18 @@ export class PiHoleClient {
);
}
for(let loops = 0; loops < 10; loops++){
const summary = await this.getSummary()
if (summary.status === action + 'd'){
for (let loops = 0; loops < 10; loops++) {
const summary = await this.getSummary();
if (summary.status === action + 'd') {
return { status: summary.status } as PiHoleApiStatusChangeResponse;
}
await new Promise ((resolve) => { setTimeout(resolve, 50)});
await new Promise((resolve) => {
setTimeout(resolve, 50);
});
}
return Promise.reject(
new Error(
`Although PiHole received the command, it failed to update it's status: ${json}`
)
)
new Error(`Although PiHole received the command, it failed to update it's status: ${json}`)
);
}
}

7
src/tools/server/sdk/plex/plexClient.ts
View File

@@ -1,9 +1,5 @@
import { Element, xml2js } from 'xml-js';
import {
GenericCurrentlyPlaying,
GenericSessionInfo,
} from '~/types/api/media-server/session-info';
import { GenericCurrentlyPlaying, GenericSessionInfo } from '~/types/api/media-server/session-info';
export class PlexClient {
constructor(
@@ -44,7 +40,6 @@ export class PlexClient {
const { videoCodec, videoFrameRate, audioCodec, audioChannels, height, width, bitrate } =
mediaElement;
return {
id: sessionElement?.id as string | undefined,
username: userElement?.title ?? ('Anonymous' as string),

2
src/tools/shared/app.ts
View File

@@ -11,7 +11,7 @@ export const generateDefaultApp = (wrapperId: string): AppType =>
appNameStatus: 'normal',
positionAppName: 'column',
lineClampAppName: 1,
appNameFontSize: 16
appNameFontSize: 16,
},
network: {
enabledStatusChecker: true,

1
src/types/api/downloads/queue/NormalizedDownloadQueueResponse.ts
View File

@@ -1,5 +1,4 @@
import { NormalizedTorrent } from '@ctrl/shared-torrent';
import { UsenetQueueItem } from '~/widgets/useNet/types';
export type NormalizedDownloadQueueResponse = {

4
src/types/app.ts
View File

@@ -1,5 +1,5 @@
import { Icon, IconKey, IconPassword, IconUser } from '@tabler/icons-react';
import { Property } from 'csstype'
import { Property } from 'csstype';
import { TileBaseType } from './tile';
@@ -34,7 +34,7 @@ interface AppNetworkType {
interface AppAppearanceType {
iconUrl: string;
appNameStatus: "normal"|"hover"|"hidden";
appNameStatus: 'normal' | 'hover' | 'hidden';
positionAppName: Property.FlexDirection;
appNameFontSize: number;
lineClampAppName: number;

1
src/types/config.ts
View File

@@ -1,4 +1,5 @@
import { IWidget } from '~/widgets/widgets';
import { AppType, ConfigAppType } from './app';
import { CategoryType } from './category';
import { SettingsType } from './settings';

3
src/utils/session.ts
View File

@@ -1,4 +1,4 @@
import { randomUUID } from "crypto";
import { randomUUID } from 'crypto';
export const fromDate = (seconds: number, date = Date.now()) => {
return new Date(date + seconds * 1000);
@@ -8,4 +8,3 @@ export const fromDate = (seconds: number, date = Date.now()) => {
export const generateSessionToken = () => {
return randomUUID();
};

4
src/widgets/WidgetWrapper.tsx
View File

@@ -1,8 +1,8 @@
import { ComponentType } from 'react';
import Widgets from '.';
import { HomarrCardWrapper } from '~/components/Dashboard/Tiles/HomarrCardWrapper';
import { WidgetsMenu } from '~/components/Dashboard/Tiles/Widgets/WidgetsMenu';
import Widgets from '.';
import ErrorBoundary from './boundary';
import { IWidget } from './widgets';

74
src/widgets/bookmark/BookmarkWidgetTile.tsx
View File

@@ -3,11 +3,11 @@ import {
Box,
Button,
Card,
Divider,
Flex,
Group,
Image,
ScrollArea,
Divider,
Stack,
Switch,
Text,
@@ -27,12 +27,12 @@ import {
} from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useEffect } from 'react';
import React from 'react';
import { v4 } from 'uuid';
import { z } from 'zod';
import React from 'react';
import { useEditModeStore } from '~/components/Dashboard/Views/useEditModeStore';
import { IconSelector } from '~/components/IconSelector/IconSelector';
import { defineWidget } from '../helper';
import { IDraggableEditableListInputValue, IWidget } from '../widgets';
@@ -54,7 +54,7 @@ const definition = defineWidget({
type: 'text',
defaultValue: '',
info: true,
infoLink: "https://homarr.dev/docs/widgets/bookmarks/",
infoLink: 'https://homarr.dev/docs/widgets/bookmarks/',
},
items: {
type: 'draggable-editable-list',
@@ -84,11 +84,11 @@ const definition = defineWidget({
return undefined;
}
return t('item.validation.length', {shortest: "1", longest: "100"});
return t('item.validation.length', { shortest: '1', longest: '100' });
},
href: (value) => {
if (!z.string().min(1).max(200).safeParse(value).success) {
return t('item.validation.length', {shortest: "1", longest: "200"});
return t('item.validation.length', { shortest: '1', longest: '200' });
}
if (!z.string().url().safeParse(value).success) {
@@ -102,7 +102,7 @@ const definition = defineWidget({
return undefined;
}
return t('item.validation.length', {shortest: "1", longest: "400"});
return t('item.validation.length', { shortest: '1', longest: '400' });
},
},
validateInputOnChange: true,
@@ -174,11 +174,7 @@ const definition = defineWidget({
} satisfies IDraggableEditableListInputValue<BookmarkItem>,
layout: {
type: 'select',
data: [
{ value: 'autoGrid', },
{ value: 'horizontal', },
{ value: 'vertical', },
],
data: [{ value: 'autoGrid' }, { value: 'horizontal' }, { value: 'vertical' }],
defaultValue: 'autoGrid',
},
},
@@ -223,10 +219,12 @@ function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
case 'autoGrid':
return (
<Stack h="100%" spacing={0}>
<Title size="h4" px="0.25rem">{widget.properties.name}</Title>
<Title size="h4" px="0.25rem">
{widget.properties.name}
</Title>
<Box
className={classes.grid}
mr={isEditModeEnabled && widget.properties.name === "" ? 'xl' : undefined}
mr={isEditModeEnabled && widget.properties.name === '' ? 'xl' : undefined}
h="100%"
>
{widget.properties.items.map((item: BookmarkItem, index) => (
@@ -239,10 +237,12 @@ function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
href={item.href}
target={item.openNewTab ? '_blank' : undefined}
withBorder
bg={colorScheme === 'dark' ? colors.dark[5].concat('80') : colors.blue[0].concat('80')}
bg={
colorScheme === 'dark' ? colors.dark[5].concat('80') : colors.blue[0].concat('80')
}
sx={{
'&:hover': { backgroundColor: fn.primaryColor().concat('40'), }, //'40' = 25% opacity
flex:'1 1 auto',
'&:hover': { backgroundColor: fn.primaryColor().concat('40') }, //'40' = 25% opacity
flex: '1 1 auto',
}}
display="flex"
>
@@ -265,29 +265,29 @@ function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
type="auto"
h="100%"
offsetScrollbars
mr={isEditModeEnabled && widget.properties.name === ""? 'xl' : undefined}
mr={isEditModeEnabled && widget.properties.name === '' ? 'xl' : undefined}
styles={{
viewport:{
viewport: {
//mantine being mantine again... this might break. Needed for taking 100% of widget space
'& div[style="min-width: 100%; display: table;"]':{
'& div[style="min-width: 100%; display: table;"]': {
display: 'flex !important',
height:'100%',
height: '100%',
},
},
}}
>
<Flex
direction={flexDirection}
gap="0"
h="100%"
w="100%"
>
<Flex direction={flexDirection} gap="0" h="100%" w="100%">
{widget.properties.items.map((item: BookmarkItem, index) => (
<div key={index} style={{ display: 'flex', flex: '1', flexDirection: flexDirection, }}>
<div
key={index}
style={{ display: 'flex', flex: '1', flexDirection: flexDirection }}
>
<Divider
m="3px"
orientation={ widget.properties.layout !== 'vertical' ? 'vertical' : 'horizontal' }
color={index === 0 ? "transparent" : undefined}
orientation={
widget.properties.layout !== 'vertical' ? 'vertical' : 'horizontal'
}
color={index === 0 ? 'transparent' : undefined}
/>
<Card
px="md"
@@ -298,13 +298,13 @@ function BookmarkWidgetTile({ widget }: BookmarkWidgetTileProps) {
radius="md"
bg="transparent"
sx={{
'&:hover': { backgroundColor: fn.primaryColor().concat('40'),}, //'40' = 25% opacity
flex:'1 1 auto',
'&:hover': { backgroundColor: fn.primaryColor().concat('40') }, //'40' = 25% opacity
flex: '1 1 auto',
overflow: 'unset',
}}
display="flex"
>
<BookmarkItemContent item={item}/>
<BookmarkItemContent item={item} />
</Card>
</div>
))}
@@ -327,11 +327,12 @@ const BookmarkItemContent = ({ item }: { item: BookmarkItem }) => {
width={47}
height={47}
fit="contain"
withPlaceholder />
withPlaceholder
/>
<Stack spacing={0}>
<Text size="md">{item.name}</Text>
<Text
color={colorScheme === 'dark' ? "gray.6" : "gray.7"}
color={colorScheme === 'dark' ? 'gray.6' : 'gray.7'}
size="sm"
hidden={item.hideHostname}
>
@@ -339,7 +340,8 @@ const BookmarkItemContent = ({ item }: { item: BookmarkItem }) => {
</Text>
</Stack>
</Group>
)};
);
};
const useStyles = createStyles(() => ({
grid: {

2
src/widgets/boundary.tsx
View File

@@ -4,8 +4,8 @@ import { IconBrandGithub, IconBug, IconInfoCircle, IconRefresh } from '@tabler/i
import Consola from 'consola';
import { withTranslation } from 'next-i18next';
import React, { ReactNode } from 'react';
import { WidgetsMenu } from '~/components/Dashboard/Tiles/Widgets/WidgetsMenu';
import { IWidget } from './widgets';
type ErrorBoundaryState = {

2
src/widgets/calendar/MediaList.tsx
View File

@@ -1,13 +1,13 @@
import { Divider, ScrollArea, createStyles } from '@mantine/core';
import { useViewportSize } from '@mantine/hooks';
import React from 'react';
import {
LidarrMediaDisplay,
RadarrMediaDisplay,
ReadarrMediaDisplay,
SonarrMediaDisplay,
} from '~/modules/common';
import { MediasType } from './type';
interface MediaListProps {

1
src/widgets/calendar/bg-calculator.ts
View File

@@ -1,5 +1,4 @@
import { ColorScheme, useMantineTheme } from '@mantine/core';
import { isToday } from '~/tools/shared/time/date.tool';
export const getBgColorByDateAndTheme = (colorScheme: ColorScheme, date: Date) => {

3
src/widgets/dashDot/DashDotCompactNetwork.tsx
View File

@@ -1,9 +1,8 @@
import { Group, Stack, Text } from '@mantine/core';
import { IconArrowNarrowDown, IconArrowNarrowUp } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { RouterOutputs } from '~/utils/api';
import { bytes } from '~/tools/bytesHelper';
import { RouterOutputs } from '~/utils/api';
interface DashDotCompactNetworkProps {
info: DashDotInfo;

4
src/widgets/dashDot/DashDotCompactStorage.tsx
View File

@@ -1,9 +1,9 @@
import { Group, Stack, Text } from '@mantine/core';
import { useTranslation } from 'next-i18next';
import { api } from '~/utils/api';
import { bytes } from '~/tools/bytesHelper';
import { percentage } from '~/tools/shared/math/percentage.tool';
import { api } from '~/utils/api';
import { DashDotInfo } from './DashDotCompactNetwork';
interface DashDotCompactStorageProps {

9
src/widgets/dashDot/api.ts
View File

@@ -1,6 +1,13 @@
import { useConfigContext } from '~/config/provider';
import { RouterInputs, api } from '~/utils/api';
import { UsenetHistoryRequestParams, UsenetInfoRequestParams, UsenetPauseRequestParams, UsenetQueueRequestParams, UsenetResumeRequestParams } from '../useNet/types';
import {
UsenetHistoryRequestParams,
UsenetInfoRequestParams,
UsenetPauseRequestParams,
UsenetQueueRequestParams,
UsenetResumeRequestParams,
} from '../useNet/types';
const POLLING_INTERVAL = 2000;

14
src/widgets/date/DateTile.tsx
View File

@@ -6,10 +6,10 @@ import timezones from 'dayjs/plugin/timezone';
import utc from 'dayjs/plugin/utc';
import { useSession } from 'next-auth/react';
import { useEffect, useRef, useState } from 'react';
import { useSetSafeInterval } from '~/hooks/useSetSafeInterval';
import { getLanguageByCode } from '~/tools/language';
import { api } from '~/utils/api';
import { useSetSafeInterval } from '~/hooks/useSetSafeInterval';
import { defineWidget } from '../helper';
import { IWidget } from '../widgets';
@@ -108,8 +108,8 @@ function DateTile({ widget }: DateTileProps) {
);
}
const useStyles = createStyles(()=>({
wrapper:{
const useStyles = createStyles(() => ({
wrapper: {
display: 'flex',
flexDirection: 'column',
justifyContent: 'space-evenly',
@@ -117,17 +117,17 @@ const useStyles = createStyles(()=>({
height: '100%',
gap: 0,
},
clock:{
clock: {
lineHeight: '1',
whiteSpace: 'nowrap',
fontWeight: 700,
fontSize: '2.125rem',
},
extras:{
extras: {
lineHeight: '1',
whiteSpace: 'nowrap',
}
}))
},
}));
/**
* State which updates when the minute is changing

34
src/widgets/dnshole/DnsHoleControls.tsx
View File

@@ -16,9 +16,9 @@ import { useElementSize } from '@mantine/hooks';
import { IconDeviceGamepad, IconPlayerPlay, IconPlayerStop } from '@tabler/icons-react';
import { useSession } from 'next-auth/react';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
import { api } from '~/utils/api';
import { useConfigContext } from '~/config/provider';
import { defineWidget } from '../helper';
import { WidgetLoading } from '../loading';
import { IWidget } from '../widgets';
@@ -84,15 +84,19 @@ function DnsHoleControlsWidgetTile({ widget }: DnsHoleControlsWidgetProps) {
}
if (data.status.length === 0) {
return(
return (
<Center h="100%">
<Stack align="center">
<IconDeviceGamepad size={40} strokeWidth={1}/>
<Title align="center" order={6}>{t('modules/dns-hole-controls:descriptor.errors.general.title')}</Title>
<Text align="center">{t('modules/dns-hole-controls:descriptor.errors.general.text')}</Text>
<IconDeviceGamepad size={40} strokeWidth={1} />
<Title align="center" order={6}>
{t('modules/dns-hole-controls:descriptor.errors.general.title')}
</Title>
<Text align="center">
{t('modules/dns-hole-controls:descriptor.errors.general.text')}
</Text>
</Stack>
</Center>
)
);
}
console.log(data);
@@ -136,15 +140,18 @@ function DnsHoleControlsWidgetTile({ widget }: DnsHoleControlsWidgetProps) {
>
<Button
onClick={async () => {
await mutateAsync({
await mutateAsync(
{
action: 'enable',
configName,
appsToChange: getDnsStatus()?.disabled,
},{
},
{
onSettled: () => {
reFetchSummaryDns();
},
}
});
);
}}
disabled={getDnsStatus()?.disabled.length === 0 || fetchingDnsSummary || changingStatus}
leftIcon={<IconPlayerPlay size={20} />}
@@ -156,15 +163,18 @@ function DnsHoleControlsWidgetTile({ widget }: DnsHoleControlsWidgetProps) {
</Button>
<Button
onClick={async () => {
await mutateAsync({
await mutateAsync(
{
action: 'disable',
configName,
appsToChange: getDnsStatus()?.enabled,
},{
},
{
onSettled: () => {
reFetchSummaryDns();
},
}
});
);
}}
disabled={getDnsStatus()?.enabled.length === 0 || fetchingDnsSummary || changingStatus}
leftIcon={<IconPlayerStop size={20} />}

2
src/widgets/dnshole/DnsHoleSummary.tsx
View File

@@ -10,9 +10,9 @@ import {
} from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '~/config/provider';
import { formatNumber, formatPercentage } from '~/tools/client/math';
import { RouterOutputs, api } from '~/utils/api';
import { formatNumber, formatPercentage } from '~/tools/client/math';
import { defineWidget } from '../helper';
import { WidgetLoading } from '../loading';
import { IWidget } from '../widgets';

4
src/widgets/download-speed/Tile.tsx
View File

@@ -15,17 +15,17 @@ import { Datum, ResponsiveLine, Serie } from '@nivo/line';
import { IconDownload, IconUpload } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { useEffect } from 'react';
import { AppAvatar } from '~/components/AppAvatar';
import { useConfigContext } from '~/config/provider';
import { useGetDownloadClientsQueue } from './useGetNetworkSpeed';
import { useColorTheme } from '~/tools/color';
import { humanFileSize } from '~/tools/humanFileSize';
import {
NormalizedDownloadQueueResponse,
TorrentTotalDownload,
} from '~/types/api/downloads/queue/NormalizedDownloadQueueResponse';
import definition, { ITorrentNetworkTraffic } from './TorrentNetworkTrafficTile';
import { useGetDownloadClientsQueue } from './useGetNetworkSpeed';
interface TorrentNetworkTrafficTileProps {
widget: ITorrentNetworkTraffic;

2
src/widgets/index.ts
View File

@@ -9,12 +9,12 @@ import iframe from './iframe/IFrameTile';
import mediaRequestsList from './media-requests/MediaRequestListTile';
import mediaRequestsStats from './media-requests/MediaRequestStatsTile';
import mediaServer from './media-server/MediaServerTile';
import notebook from './notebook/NotebookWidgetTile';
import rss from './rss/RssWidgetTile';
import torrent from './torrent/TorrentTile';
import usenet from './useNet/UseNetTile';
import videoStream from './video/VideoStreamTile';
import weather from './weather/WeatherTile';
import notebook from './notebook/NotebookWidgetTile';
export default {
calendar,

5
src/widgets/media-requests/MediaRequestListTile.tsx
View File

@@ -139,11 +139,6 @@ function MediaRequestListTile({ widget }: MediaRequestListWidgetProps) {
return (
<ScrollArea h="100%">
<Stack>
{countPendingApproval > 0 ? (
<Text>{t('pending', { countPendingApproval })}</Text>
) : (
<Text>{t('nonePending')}</Text>
)}
{sortedData.map((item, index) => (
<Card radius="md" withBorder key={index}>
<Flex wrap="wrap" justify="space-between" gap="md">

4
src/widgets/media-requests/MediaRequestStatsTile.tsx
View File

@@ -57,7 +57,7 @@ function MediaRequestStatsTile({ widget }: MediaRequestStatsWidgetProps) {
const {
data: usersData,
isFetching: usersFetching,
isLoading: usersLoading
isLoading: usersLoading,
} = useUsersQuery(widget);
const { ref, height } = useElementSize();
const { colorScheme } = useMantineTheme();
@@ -128,7 +128,7 @@ function MediaRequestStatsTile({ widget }: MediaRequestStatsWidgetProps) {
p={0}
component="a"
href={user.userLink}
target={widget.properties.openInNewTab ? "_blank" : "_self"}
target={widget.properties.openInNewTab ? '_blank' : '_self'}
mah={95}
mih={55}
radius="md"

9
src/widgets/media-requests/media-request-query.tsx
View File

@@ -1,9 +1,10 @@
import { useConfigContext } from '~/config/provider';
import { MediaRequestListWidget } from './MediaRequestListTile';
import { MediaRequestStatsWidget } from './MediaRequestStatsTile';
import { api } from '~/utils/api';
export const useMediaRequestQuery = (widget: MediaRequestListWidget|MediaRequestStatsWidget) => {
import { MediaRequestListWidget } from './MediaRequestListTile';
import { MediaRequestStatsWidget } from './MediaRequestStatsTile';
export const useMediaRequestQuery = (widget: MediaRequestListWidget | MediaRequestStatsWidget) => {
const { name: configName } = useConfigContext();
return api.mediaRequest.allMedia.useQuery(
{ configName: configName!, widget: widget },
@@ -13,7 +14,7 @@ export const useMediaRequestQuery = (widget: MediaRequestListWidget|MediaRequest
);
};
export const useUsersQuery = (widget: MediaRequestListWidget|MediaRequestStatsWidget) => {
export const useUsersQuery = (widget: MediaRequestListWidget | MediaRequestStatsWidget) => {
const { name: configName } = useConfigContext();
return api.mediaRequest.users.useQuery(
{ configName: configName!, widget: widget },

4
src/widgets/media-server/MediaServerTile.tsx
View File

@@ -11,13 +11,13 @@ import {
} from '@mantine/core';
import { IconAlertTriangle, IconMovie } from '@tabler/icons-react';
import { useTranslation } from 'next-i18next';
import { AppAvatar } from '~/components/AppAvatar';
import { useConfigContext } from '~/config/provider';
import { useGetMediaServers } from './useGetMediaServers';
import { defineWidget } from '../helper';
import { IWidget } from '../widgets';
import { TableRow } from './TableRow';
import { useGetMediaServers } from './useGetMediaServers';
const definition = defineWidget({
id: 'media-server',

2
src/widgets/media-server/NowPlayingDisplay.tsx
View File

@@ -6,11 +6,9 @@ import {
IconQuestionMark,
IconVideo,
} from '@tabler/icons-react';
import { GenericSessionInfo } from '~/types/api/media-server/session-info';
export const NowPlayingDisplay = ({ session }: { session: GenericSessionInfo }) => {
if (!session.currentlyPlaying) {
return null;
}

12
src/widgets/rss/RssWidgetTile.tsx
View File

@@ -30,7 +30,7 @@ const definition = defineWidget({
options: {
rssFeedUrl: {
type: 'multiple-text',
defaultValue: [],
defaultValue: ['https://noted.lol/rss'],
},
refreshInterval: {
type: 'slider',
@@ -92,7 +92,7 @@ function RssTile({ widget }: RssTileProps) {
}
}
if (!data || isLoading) {
if (isLoading) {
return (
<Center h="100%">
<Loader />
@@ -100,12 +100,12 @@ function RssTile({ widget }: RssTileProps) {
);
}
if (data.length < 1 || !data[0].feed || isError) {
if (!data || data.length < 1 || !data[0].feed || isError) {
return (
<Center h="100%">
<Stack align="center">
<IconRss size={40} strokeWidth={1} />
<Title order={6}>{t('descriptor.card.errors.general.title')}</Title>
<IconRss size={25} strokeWidth={1} />
<Title order={5}>{t('descriptor.card.errors.general.title')}</Title>
<Text align="center">{t('descriptor.card.errors.general.text')}</Text>
</Stack>
<RefetchButton refetch={refetch} isFetching={isFetching} />
@@ -246,7 +246,7 @@ const useStyles = createStyles(({ colorScheme, colors, radius, spacing }) => ({
position: 'absolute',
width: '100%',
height: '100%',
filter: colorScheme === 'dark' ? 'blur(30px)' : 'blur(15px)',
filter: colorScheme === 'dark' ? 'blur(5px)' : 'blur(5px)',
transform: 'scaleX(-1)',
opacity: colorScheme === 'dark' ? 0.3 : 0.2,
transition: 'ease-in-out 0.2s',

Some files were not shown because too many files have changed in this diff Show More