diff --git a/packages/api/src/router/test/widgets/rssFeed.spec.ts b/packages/api/src/router/test/widgets/rssFeed.spec.ts index acd7f5c17..4773fa149 100644 --- a/packages/api/src/router/test/widgets/rssFeed.spec.ts +++ b/packages/api/src/router/test/widgets/rssFeed.spec.ts @@ -208,6 +208,7 @@ async function setupUrlRestrictionAsync(dbUrls: string[]) { hideDescription: false, textLinesClamp: 3, maximumAmountPosts: 5, + showPosterImage: true, } satisfies WidgetComponentProps<"rssFeed">["options"]), }) satisfies InferInsertModel, ), diff --git a/packages/old-import/src/widgets/options.ts b/packages/old-import/src/widgets/options.ts index b3e5f0b9f..32b1f25c3 100644 --- a/packages/old-import/src/widgets/options.ts +++ b/packages/old-import/src/widgets/options.ts @@ -122,6 +122,7 @@ const optionMapping: OptionMapping = { maximumAmountPosts: (oldOptions) => oldOptions.maximumAmountOfPosts, textLinesClamp: (oldOptions) => oldOptions.textLinesClamp, hideDescription: () => undefined, + showPosterImage: () => true, // This was the default in oldmarr }, notebook: { allowReadOnlyCheck: (oldOptions) => oldOptions.allowReadOnlyCheck, diff --git a/packages/translation/src/lang/en.json b/packages/translation/src/lang/en.json index a069f9c4e..0d88f2e63 100644 --- a/packages/translation/src/lang/en.json +++ b/packages/translation/src/lang/en.json @@ -2516,6 +2516,9 @@ }, "hideDescription": { "label": "Hide description" + }, + "showPosterImage": { + "label": "Show poster image" } } }, diff --git a/packages/widgets/src/rssFeed/component.tsx b/packages/widgets/src/rssFeed/component.tsx index 179a448e2..f219cd2e4 100644 --- a/packages/widgets/src/rssFeed/component.tsx +++ b/packages/widgets/src/rssFeed/component.tsx @@ -39,7 +39,7 @@ const useLiveFeedEntries = (input: RouterInputs["widget"]["rssFeed"]["getFeeds"] return feedEntries; }; -export default function RssFeed({ options }: WidgetComponentProps<"rssFeed">) { +export default function RssFeed({ options, width }: WidgetComponentProps<"rssFeed">) { const feedEntries = useLiveFeedEntries({ urls: options.feedUrls, maximumAmountPosts: typeof options.maximumAmountPosts === "number" ? options.maximumAmountPosts : 100, @@ -49,6 +49,8 @@ export default function RssFeed({ options }: WidgetComponentProps<"rssFeed">) { const languageDir = options.enableRtl ? "RTL" : "LTR"; + const isNarrow = width < 128 * 3; + return ( @@ -63,27 +65,33 @@ export default function RssFeed({ options }: WidgetComponentProps<"rssFeed">) { w="100%" p="sm" > - {feedEntry.enclosure && ( + {feedEntry.enclosure !== undefined && ( backdrop )} - - - {feedEntry.title} - - {!options.hideDescription && feedEntry.description && ( - + + {feedEntry.enclosure !== undefined && options.showPosterImage && !isNarrow && ( + {feedEntry.title} )} - {feedEntry.published && } - + + + {feedEntry.title} + + {!options.hideDescription && feedEntry.description && ( + + )} + + {feedEntry.published && } + + ))} diff --git a/packages/widgets/src/rssFeed/index.ts b/packages/widgets/src/rssFeed/index.ts index 4f754d602..079c761a9 100644 --- a/packages/widgets/src/rssFeed/index.ts +++ b/packages/widgets/src/rssFeed/index.ts @@ -32,6 +32,9 @@ export const { definition, componentLoader } = createWidgetDefinition("rssFeed", hideDescription: factory.switch({ defaultValue: false, }), + showPosterImage: factory.switch({ + defaultValue: false, + }), })); }, }).withDynamicImport(() => import("./component"));