diff --git a/apps/nextjs/package.json b/apps/nextjs/package.json index 6df047885..714db5bfe 100644 --- a/apps/nextjs/package.json +++ b/apps/nextjs/package.json @@ -25,6 +25,7 @@ "@homarr/definitions": "workspace:^0.1.0", "@homarr/form": "workspace:^0.1.0", "@homarr/gridstack": "^1.11.3", + "@homarr/icons": "workspace:^0.1.0", "@homarr/integrations": "workspace:^0.1.0", "@homarr/log": "workspace:^", "@homarr/modals": "workspace:^0.1.0", diff --git a/apps/nextjs/src/app/[locale]/manage/medias/_actions/copy-media.tsx b/apps/nextjs/src/app/[locale]/manage/medias/_actions/copy-media.tsx index 9c63c05bc..af0387482 100644 --- a/apps/nextjs/src/app/[locale]/manage/medias/_actions/copy-media.tsx +++ b/apps/nextjs/src/app/[locale]/manage/medias/_actions/copy-media.tsx @@ -15,6 +15,11 @@ export const CopyMedia = ({ media }: CopyMediaProps) => { const url = typeof window !== "undefined" ? `${window.location.origin}/api/user-medias/${media.id}` : ""; + // Clipboard only works on localhost or secure connections (https) + if (url.startsWith("http://") && !url.startsWith("http://localhost")) { + return null; + } + return ( {({ copy, copied }) => ( diff --git a/apps/nextjs/src/app/[locale]/manage/medias/page.tsx b/apps/nextjs/src/app/[locale]/manage/medias/page.tsx index 102e54cd8..e5c9b98e1 100644 --- a/apps/nextjs/src/app/[locale]/manage/medias/page.tsx +++ b/apps/nextjs/src/app/[locale]/manage/medias/page.tsx @@ -1,13 +1,28 @@ import Image from "next/image"; import Link from "next/link"; import { notFound } from "next/navigation"; -import { Anchor, Group, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Title } from "@mantine/core"; +import { + ActionIcon, + Anchor, + Group, + Stack, + Table, + TableTbody, + TableTd, + TableTh, + TableThead, + TableTr, + Title, + Tooltip, +} from "@mantine/core"; +import { IconExternalLink } from "@tabler/icons-react"; import type { RouterOutputs } from "@homarr/api"; import { api } from "@homarr/api/server"; import { auth } from "@homarr/auth/next"; import { humanFileSize } from "@homarr/common"; import type { inferSearchParamsFromSchema } from "@homarr/common/types"; +import { createLocalImageUrl } from "@homarr/icons/local"; import { getI18n } from "@homarr/translation/server"; import { SearchInput, TablePagination, UserAvatar } from "@homarr/ui"; import { z } from "@homarr/validation"; @@ -91,13 +106,14 @@ interface RowProps { const Row = async ({ media }: RowProps) => { const session = await auth(); + const t = await getI18n(); const canDelete = media.creatorId === session?.user.id || session?.user.permissions.includes("media-full-all"); return ( {media.name} { + + + + + {canDelete && } diff --git a/packages/translation/src/lang/en.json b/packages/translation/src/lang/en.json index 897f03dc6..04f487041 100644 --- a/packages/translation/src/lang/en.json +++ b/packages/translation/src/lang/en.json @@ -785,6 +785,9 @@ }, "copy": { "label": "Copy URL" + }, + "open": { + "label": "Open media" } } }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 33644f728..e46735a4d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -112,6 +112,9 @@ importers: '@homarr/gridstack': specifier: ^1.11.3 version: 1.11.3 + '@homarr/icons': + specifier: workspace:^0.1.0 + version: link:../../packages/icons '@homarr/integrations': specifier: workspace:^0.1.0 version: link:../../packages/integrations