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

🔒️ Link out of translation files

Browse Source
This commit is contained in:
Tagaishi
2023-08-05 23:19:26 +02:00
parent 165c40506d
commit 048b27a89b
7 changed files with 25 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
public/locales/en/common.json
View File

@@ -35,5 +35,6 @@
"small": "small",
"medium": "medium",
"large": "large"
}
},
"seeMore": "See more..."
}

2
public/locales/en/modules/bookmark.json
View File

@@ -6,7 +6,7 @@
"title": "Bookmark settings",
"name": {
"label": "Widget Title",
"info": "Leave empty to keep the title hidden. <a href=\"https://homarr.dev/docs/widgets/bookmarks/\" target=\"_blank\">See More...</a>"
"info": "Leave empty to keep the title hidden."
},
"items": {
"label": "Items"

4
src/components/Dashboard/Tiles/Widgets/Inputs/LocationSelection.tsx
View File

@@ -32,6 +32,7 @@ type LocationSelectionProps = {
value: any;
handleChange: (key: string, value: IntegrationOptionsValueType) => void;
info?: boolean;
infoLink?: string;
};
export const LocationSelection = ({
@@ -40,6 +41,7 @@ export const LocationSelection = ({
value,
handleChange,
info,
infoLink,
}: LocationSelectionProps) => {
const { t } = useTranslation('widgets/location');
const [query, setQuery] = useState(value.name ?? '');
@@ -63,7 +65,7 @@ export const LocationSelection = ({
<Stack spacing="xs">
<Flex direction="row" justify="space-between" wrap="nowrap">
<Title order={5}>{t(`modules/${widgetId}:descriptor.settings.${key}.label`)}</Title>
{info && <InfoCard content={t(`modules/${widgetId}:descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`modules/${widgetId}:descriptor.settings.${key}.info`)} link={infoLink}/>}
</Flex>
<Group noWrap align="end">

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

@@ -15,7 +15,7 @@ import {
Title,
} from '@mantine/core';
import { ContextModalProps } from '@mantine/modals';
import { IconAlertTriangle, IconPlaylistX, IconPlus, IconInfoCircle } from '@tabler/icons-react';
import { IconAlertTriangle, IconPlaylistX, IconPlus } from '@tabler/icons-react';
import { Trans, useTranslation } from 'next-i18next';
import { FC, useState } from 'react';
@@ -136,6 +136,7 @@ const WidgetOptionTypeSwitch: FC<{
}> = ({ option, widgetId, propName: key, value, handleChange }) => {
const { t } = useTranslation([`modules/${widgetId}`, 'common']);
const info = option.info ?? false;
const link = option.infoLink ?? undefined;
switch (option.type) {
case 'switch':
@@ -147,7 +148,7 @@ const WidgetOptionTypeSwitch: FC<{
onChange={(ev) => handleChange(key, ev.currentTarget.checked)}
{...option.inputProps}
/>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
);
case 'text':
@@ -155,7 +156,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing={0}>
<Group align="center" spacing="sm">
<Text size="0.875rem" weight="500">{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<TextInput
value={value as string}
@@ -169,7 +170,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing={0}>
<Group align="center" spacing="sm">
<Text size="0.875rem" weight="500">{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<MultiSelect
data={option.data}
@@ -186,7 +187,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing={0}>
<Group align="center" spacing="sm">
<Text size="0.875rem" weight="500">{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<Select
defaultValue={option.defaultValue}
@@ -203,7 +204,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing={0}>
<Group align="center" spacing="sm">
<Text size="0.875rem" weight="500">{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<NumberInput
value={value as number}
@@ -217,7 +218,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing={0}>
<Group align="center" spacing="sm">
<Text size="0.875rem" weight="500">{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<Slider
label={value}
@@ -268,7 +269,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing="xs">
<Group align="center" spacing="sm">
<Text>{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<StaticDraggableList
value={typedVal}
@@ -297,7 +298,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing={0}>
<Group align="center" spacing="sm">
<Text size="0.875rem" weight="500">{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<MultiSelect
data={value.map((name: any) => ({ value: name, label: name }))}
@@ -322,7 +323,7 @@ const WidgetOptionTypeSwitch: FC<{
<Stack spacing="xs">
<Group align="center" spacing="sm">
<Text>{t(`descriptor.settings.${key}.label`)}</Text>
{info && <InfoCard content={t(`descriptor.settings.${key}.info`)}/>}
{info && <InfoCard message={t(`descriptor.settings.${key}.info`)} link={link}/>}
</Group>
<DraggableList
items={Array.from(value).map((v: any) => ({

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

@@ -9,17 +9,21 @@ import { Link, RichTextEditor, RichTextEditorProps } from '@mantine/tiptap';
import { IconInfoCircle } from '@tabler/icons-react';
import { useEditor } from '@tiptap/react';
import StarterKit from '@tiptap/starter-kit';
import { useTranslation } from 'next-i18next';
interface InfoCardProps {
bg?: SystemProp<DefaultMantineColor>;
cardProp?: Partial<RichTextEditorProps>;
content: string;
message: string;
link?: string;
hoverProp?: Partial<HoverCardProps>;
position?: HoverCardProps['position'];
}
export const InfoCard = ({ bg, cardProp, content, hoverProp, position }: 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 editor = useEditor({
content,
editable: false,

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

@@ -15,7 +15,6 @@ import {
Title,
createStyles,
useMantineTheme,
InputProps,
} from '@mantine/core';
import { useForm } from '@mantine/form';
import {
@@ -55,6 +54,7 @@ const definition = defineWidget({
type: 'text',
defaultValue: '',
info: true,
infoLink: "https://homarr.dev/docs/widgets/bookmarks/",
},
items: {
type: 'draggable-editable-list',

1
src/widgets/widgets.ts
View File

@@ -52,6 +52,7 @@ interface DataType {
interface ICommonWidgetOptions {
info?: boolean;
infoLink?: string;
};
// will show a multi-select with specified data