Merge pull request #251 from cheeaun/main

Update from main

src/components/timeline.jsx

@@ -412,7 +412,7 @@ function Timeline({
                     const isMiddle = i > 0 && i < items.length - 1;
                     const isSpoiler = item.sensitive && !!item.spoilerText;
                     const showCompact =
-                      (isSpoiler && i > 0) ||
+                      (!_differentAuthor && isSpoiler && i > 0) ||
                       (manyItems &&
                         isMiddle &&
                         (type === 'thread' ||

src/index.css

@@ -92,6 +92,11 @@
     --link-light-color: #6494ed99;
     --link-faded-color: #6494ed88;
     --link-bg-hover-color: #34353799;
+    --link-visited-color: color-mix(
+      in lch,
+      mediumslateblue 70%,
+      var(--text-color) 30%
+    );
     --reblog-faded-color: #b190f141;
     --reply-to-text-color: var(--reply-to-color);
     --reply-to-faded-color: #ffa60017;

src/utils/get-translate-target-language.jsx

@@ -3,6 +3,11 @@ import translationTargetLanguages from '../data/lingva-target-languages';
 import localeMatch from './locale-match';
 import states from './states';
 
+const locales = [
+  new Intl.DateTimeFormat().resolvedOptions().locale,
+  ...navigator.languages,
+];
+
 function getTranslateTargetLanguage(fromSettings = false) {
   if (fromSettings) {
     const { contentTranslationTargetLanguage } = states.settings;
@@ -11,10 +16,7 @@ function getTranslateTargetLanguage(fromSettings = false) {
     }
   }
   return localeMatch(
-    [
-      new Intl.DateTimeFormat().resolvedOptions().locale,
-      ...navigator.languages,
-    ],
+    locales,
     translationTargetLanguages.map((l) => l.code.replace('_', '-')), // The underscore will fail Intl.Locale inside `match`
     'en',
   );

src/utils/useTruncated.js

@@ -1,27 +1,21 @@
 import { useRef } from 'preact/hooks';
-import { useDebouncedCallback } from 'use-debounce';
+import { useThrottledCallback } from 'use-debounce';
 import useResizeObserver from 'use-resize-observer';
 
 export default function useTruncated({ className = 'truncated' } = {}) {
   const ref = useRef();
-  const onResize = useDebouncedCallback(
-    ({ height }) => {
-      if (ref.current) {
-        const { scrollHeight } = ref.current;
-        let truncated = scrollHeight > height;
-        if (truncated) {
-          const { height: _height, maxHeight } = getComputedStyle(ref.current);
-          const computedHeight = parseInt(maxHeight || _height, 10);
-          truncated = scrollHeight > computedHeight;
-        }
-        ref.current.classList.toggle(className, truncated);
+  const onResize = useThrottledCallback(({ height }) => {
+    if (ref.current) {
+      const { scrollHeight } = ref.current;
+      let truncated = scrollHeight > height;
+      if (truncated) {
+        const { height: _height, maxHeight } = getComputedStyle(ref.current);
+        const computedHeight = parseInt(maxHeight || _height, 10);
+        truncated = scrollHeight > computedHeight;
       }
-    },
-    300,
-    {
-      maxWait: 2000,
-    },
-  );
+      ref.current.classList.toggle(className, truncated);
+    }
+  }, 300);
   useResizeObserver({
     ref,
     box: 'border-box',