Pixelfed-related fixes

src/components/media.jsx

@@ -74,7 +74,7 @@ function Media({
   altIndex,
   onClick = () => {},
 }) {
-  const {
+  let {
     blurhash,
     description,
     meta,
@@ -84,10 +84,17 @@ function Media({
     url,
     type,
   } = media;
+  if (/no\-preview\./i.test(previewUrl)) {
+    previewUrl = null;
+  }
   const { original = {}, small, focus } = meta || {};
 
-  const width = showOriginal ? original?.width : small?.width;
+  const width = showOriginal
-  const height = showOriginal ? original?.height : small?.height;
+    ? original?.width
+    : small?.width || original?.width;
+  const height = showOriginal
+    ? original?.height
+    : small?.height || original?.height;
   const mediaURL = showOriginal ? url : previewUrl || url;
   const remoteMediaURL = showOriginal
     ? remoteUrl
@@ -290,7 +297,11 @@ function Media({
                 }}
                 onError={(e) => {
                   const { src } = e.target;
-                  if (src === mediaURL && mediaURL !== remoteMediaURL) {
+                  if (
+                    src === mediaURL &&
+                    remoteMediaURL &&
+                    mediaURL !== remoteMediaURL
+                  ) {
                     e.target.src = remoteMediaURL;
                   }
                 }}
@@ -473,14 +484,26 @@ function Media({
             />
           ) : (
             <>
-              <img
+              {previewUrl ? (
-                src={previewUrl}
+                <img
-                alt={showInlineDesc ? '' : description}
+                  src={previewUrl}
-                width={width}
+                  alt={showInlineDesc ? '' : description}
-                height={height}
+                  width={width}
-                data-orientation={orientation}
+                  height={height}
-                loading="lazy"
+                  data-orientation={orientation}
-              />
+                  loading="lazy"
+                />
+              ) : (
+                <video
+                  src={url}
+                  width={width}
+                  height={height}
+                  data-orientation={orientation}
+                  preload="metadata"
+                  muted
+                  disablePictureInPicture
+                />
+              )}
               <div class="media-play">
                 <Icon icon="play" size="xl" />
               </div>

src/pages/account-statuses.jsx

@@ -151,7 +151,7 @@ function AccountStatuses() {
       }
     }
 
-    const results = [];
+    let results = [];
     if (firstLoad) {
       const { value } = await masto.v1.accounts
         .$select(id)
@@ -192,6 +192,26 @@ function AccountStatuses() {
     }
     const { value, done } = await accountStatusesIterator.current.next();
     if (value?.length) {
+      // Check if value is same as pinned post (results)
+      // If the index for every post is the same, means API might not support pinned posts
+      if (results.length) {
+        let pinnedStatusesIds = [];
+        if (results[0]?.type === 'pinned') {
+          pinnedStatusesIds = results[0].id;
+        } else {
+          pinnedStatusesIds = results
+            .filter((status) => status._pinned)
+            .map((status) => status.id);
+        }
+        const containsAllPinned = pinnedStatusesIds.every((postId) =>
+          value.some((status) => status.id === postId),
+        );
+        if (containsAllPinned) {
+          // Remove pinned posts
+          results = [];
+        }
+      }
+
       results.push(...value);
 
       value.forEach((item) => {

src/pages/following.jsx

@@ -71,7 +71,8 @@ function Following({ title, path, id, ...props }) {
         .next();
       let { value } = results;
       console.log('checkForUpdates', latestItem.current, value);
-      if (value?.length) {
+      const valueContainsLatestItem = value[0]?.id === latestItem.current; // since_id might not be supported
+      if (value?.length && !valueContainsLatestItem) {
         latestItem.current = value[0].id;
         value = dedupeBoosts(value, instance);
         value = filteredItems(value, 'home');

src/pages/hashtag.jsx

@@ -109,8 +109,9 @@ function Hashtags({ media: mediaView, columnMode, ...props }) {
         })
         .next();
       let { value } = results;
-      value = filteredItems(value, 'public');
+      const valueContainsLatestItem = value[0]?.id === latestItem.current; // since_id might not be supported
-      if (value?.length) {
+      if (value?.length && !valueContainsLatestItem) {
+        value = filteredItems(value, 'public');
         return true;
       }
       return false;

src/pages/list.jsx

@@ -63,8 +63,9 @@ function List(props) {
         since_id: latestItem.current,
       });
       let { value } = results;
-      value = filteredItems(value, 'home');
+      const valueContainsLatestItem = value[0]?.id === latestItem.current; // since_id might not be supported
-      if (value?.length) {
+      if (value?.length && !valueContainsLatestItem) {
+        value = filteredItems(value, 'home');
         return true;
       }
       return false;

src/pages/mentions.jsx

@@ -95,7 +95,9 @@ function Mentions({ columnMode, ...props }) {
           latestConversationItem.current,
           value,
         );
-        if (value?.length) {
+        const valueContainsLatestItem =
+          value[0]?.id === latestConversationItem.current; // since_id might not be supported
+        if (value?.length && !valueContainsLatestItem) {
           latestConversationItem.current = value[0].lastStatus.id;
           return true;
         }

src/pages/public.jsx

@@ -63,8 +63,9 @@ function Public({ local, columnMode, ...props }) {
         })
         .next();
       let { value } = results;
-      value = filteredItems(value, 'public');
+      const valueContainsLatestItem = value[0]?.id === latestItem.current; // since_id might not be supported
-      if (value?.length) {
+      if (value?.length && !valueContainsLatestItem) {
+        value = filteredItems(value, 'public');
         return true;
       }
       return false;

src/utils/get-instance-status-url.js

@@ -6,6 +6,7 @@ const statusPostRegexes = [
   /\/notes\/([^\/]+)/i, // Misskey, Firefish
   /^\/(?:notice|objects)\/([a-z0-9-]+)/i, // Pleroma
   /\/@[^@\/]+@?[^\/]+?\/([^\/]+)/i, // Mastodon
+  /^\/p\/[^\/]+\/([^\/]+)/i, // Pixelfed
 ];
 
 export function getInstanceStatusObject(url) {