diff --git a/src/components/icon.jsx b/src/components/icon.jsx
index 7701a743..82221ee1 100644
--- a/src/components/icon.jsx
+++ b/src/components/icon.jsx
@@ -56,6 +56,7 @@ const ICONS = {
shortcut: 'mingcute:lightning-line',
user: 'mingcute:user-4-line',
following: 'mingcute:walk-line',
+ pin: 'mingcute:pin-line',
};
const modules = import.meta.glob('/node_modules/@iconify-icons/mingcute/*.js');
diff --git a/src/components/status.css b/src/components/status.css
index 4ddc3ba6..e975ac15 100644
--- a/src/components/status.css
+++ b/src/components/status.css
@@ -922,6 +922,9 @@ a.card:is(:hover, :focus) {
.status-badge .bookmark {
color: var(--link-color);
}
+.status-badge .pin {
+ color: var(--red-color);
+}
/* MISC */
diff --git a/src/components/status.jsx b/src/components/status.jsx
index d3c3db14..8541342e 100644
--- a/src/components/status.jsx
+++ b/src/components/status.jsx
@@ -106,7 +106,9 @@ function Status({
reblog,
uri,
emojis,
+ // Non-API props
_deleted,
+ _pinned,
} = status;
console.debug('RENDER Status', id, status?.account.displayName);
@@ -203,7 +205,7 @@ function Status({
tabindex="-1"
class={`status ${
!withinContext && inReplyToAccount ? 'status-reply-to' : ''
- } visibility-${visibility} ${
+ } visibility-${visibility} ${_pinned ? 'status-pinned' : ''} ${
{
s: 'small',
m: 'medium',
@@ -217,6 +219,7 @@ function Status({
{reblogged && }
{favourited && }
{bookmarked && }
+ {_pinned && }
)}
{size !== 's' && (
diff --git a/src/pages/account-statuses.jsx b/src/pages/account-statuses.jsx
index 77fada8d..0008b1fa 100644
--- a/src/pages/account-statuses.jsx
+++ b/src/pages/account-statuses.jsx
@@ -16,12 +16,33 @@ function AccountStatuses() {
const { masto, instance } = api({ instance: params.instance });
const accountStatusesIterator = useRef();
async function fetchAccountStatuses(firstLoad) {
+ const results = [];
+ if (firstLoad) {
+ const { value: pinnedStatuses } = await masto.v1.accounts
+ .listStatuses(id, {
+ pinned: true,
+ })
+ .next();
+ if (pinnedStatuses?.length) {
+ pinnedStatuses.forEach((status) => {
+ status._pinned = true;
+ });
+ results.push(...pinnedStatuses);
+ }
+ }
if (firstLoad || !accountStatusesIterator.current) {
accountStatusesIterator.current = masto.v1.accounts.listStatuses(id, {
limit: LIMIT,
});
}
- return await accountStatusesIterator.current.next();
+ const { value, done } = await accountStatusesIterator.current.next();
+ if (value?.length) {
+ results.push(...value);
+ }
+ return {
+ value: results,
+ done,
+ };
}
const [account, setAccount] = useState({});