remove intermediate element by rendering the mantine Paper as <article>

This commit is contained in:
Athou
2025-04-05 17:12:40 +02:00
parent f7b6677bb1
commit 8b854b5cda
2 changed files with 14 additions and 18 deletions

View File

@@ -307,25 +307,18 @@ export function FeedEntries() {
loader={<Box key={0}>{loading && <Loader />}</Box>} loader={<Box key={0}>{loading && <Loader />}</Box>}
> >
{entries.map(entry => ( {entries.map(entry => (
<article <FeedEntry
key={entry.id} key={entry.id}
ref={el => { entry={entry}
if (el) el.id = Constants.dom.entryId(entry) expanded={!!entry.expanded || viewMode === "expanded"}
}} selected={entry.id === selectedEntryId}
data-id={entry.id} showSelectionIndicator={entry.id === selectedEntryId && (!entry.expanded || viewMode === "expanded")}
> maxWidth={sidebarVisible ? Constants.layout.entryMaxWidth : undefined}
<FeedEntry onHeaderClick={event => headerClicked(entry, event)}
entry={entry} onHeaderRightClick={event => headerRightClicked(entry, event)}
expanded={!!entry.expanded || viewMode === "expanded"} onBodyClick={() => bodyClicked(entry)}
selected={entry.id === selectedEntryId} onSwipedLeft={async () => await swipedLeft(entry)}
showSelectionIndicator={entry.id === selectedEntryId && (!entry.expanded || viewMode === "expanded")} />
maxWidth={sidebarVisible ? Constants.layout.entryMaxWidth : undefined}
onHeaderClick={event => headerClicked(entry, event)}
onHeaderRightClick={event => headerRightClicked(entry, event)}
onBodyClick={() => bodyClicked(entry)}
onSwipedLeft={async () => await swipedLeft(entry)}
/>
</article>
))} ))}
</InfiniteScroll> </InfiniteScroll>
) )

View File

@@ -137,6 +137,9 @@ export function FeedEntry(props: FeedEntryProps) {
const compactHeader = !props.expanded && (viewMode === "title" || viewMode === "cozy") const compactHeader = !props.expanded && (viewMode === "title" || viewMode === "cozy")
return ( return (
<Paper <Paper
component="article"
id={Constants.dom.entryId(props.entry)}
data-id={props.entry.id}
withBorder withBorder
radius={borderRadius} radius={borderRadius}
className={cx(classes.paper, { className={cx(classes.paper, {