diff --git a/src/components/generic-accounts.css b/src/components/generic-accounts.css
index ad33900a..ab82ee97 100644
--- a/src/components/generic-accounts.css
+++ b/src/components/generic-accounts.css
@@ -1,4 +1,24 @@
#generic-accounts-container {
+ .post-preview {
+ --max-height: 120px;
+ max-height: var(--max-height);
+ overflow: hidden;
+ margin-block: 8px;
+ border: 1px solid var(--outline-color);
+ border-radius: 8px;
+ pointer-events: none;
+
+ .status {
+ font-size: calc(var(--text-size) * 0.9);
+ mask-image: linear-gradient(
+ to bottom,
+ black calc(var(--max-height) / 2),
+ transparent calc(var(--max-height) - 8px)
+ );
+ filter: saturate(0.5);
+ }
+ }
+
.accounts-list {
--list-gap: 16px;
list-style: none;
diff --git a/src/components/generic-accounts.jsx b/src/components/generic-accounts.jsx
index 0fdd557e..1b502a94 100644
--- a/src/components/generic-accounts.jsx
+++ b/src/components/generic-accounts.jsx
@@ -12,10 +12,12 @@ import useLocationChange from '../utils/useLocationChange';
import AccountBlock from './account-block';
import Icon from './icon';
import Loader from './loader';
+import Status from './status';
export default function GenericAccounts({
instance,
excludeRelationshipAttrs = [],
+ postID,
onClose = () => {},
}) {
const { masto, instance: currentInstance } = api();
@@ -129,6 +131,8 @@ export default function GenericAccounts({
}
}, [snapStates.reloadGenericAccounts.counter]);
+ const post = states.statuses[postID];
+
return (