Merge remote-tracking branch 'upstream/main'

It causes text to jump. It has different kerning when optimized for speed

.gitignore

@@ -25,6 +25,5 @@ dist-ssr
 
 # Custom
 .env.dev
-src/data/instances-full.json
 phanpy-dist.zip
 phanpy-dist.tar.gz

README.md

@@ -103,8 +103,7 @@ Prerequisites: Node.js 18+
 - `npm run dev` - Start development server
 - `npm run build` - Build for production
 - `npm run preview` - Preview the production build
-- `npm run fetch-instances` - Fetch instances list from [instances.social](https://instances.social/), save it to `src/data/instances.json`
-  - requires `.env.local` file with `INSTANCES_SOCIAL_SECRET_TOKEN` variable set
+- `npm run fetch-instances` - Fetch instances list from [joinmastodon.org/servers](https://joinmastodon.org/servers), save it to `src/data/instances.json`
 - `npm run sourcemap` - Run `source-map-explorer` on the production build
 
 ## Tech stack
@@ -200,6 +199,7 @@ These are self-hosted by other wonderful folks.
 - [phanpy.gotosocial.social](https://phanpy.gotosocial.social/) by [@admin@gotosocial.social](https://gotosocial.social/@admin)
 - [phanpy.bauxite.tech](https://phanpy.bauxite.tech) by [@b4ux1t3@hachyderm.io](https://hachyderm.io/@b4ux1t3)
 - [phanpy.hear-me.social](https://phanpy.hear-me.social) by [@admin@hear-me.social](https://hear-me.social/@admin)
+- [phanpy.fulda.social](https://phanpy.fulda.social) by [@Ganneff@fulda.social](https://fulda.social/@Ganneff)
 
 > Note: Add yours by creating a pull request.
 

package.json

@@ -25,13 +25,13 @@
     "idb-keyval": "~6.2.1",
     "just-debounce-it": "~3.2.0",
     "lz-string": "~1.5.0",
-    "masto": "~6.5.2",
+    "masto": "~6.5.4",
     "moize": "~6.1.6",
     "p-retry": "~6.2.0",
     "p-throttle": "~6.1.0",
-    "preact": "~10.19.5",
+    "preact": "~10.19.6",
     "react-hotkeys-hook": "~4.5.0",
-    "react-intersection-observer": "~9.8.0",
+    "react-intersection-observer": "~9.8.1",
     "react-quick-pinch-zoom": "~5.1.0",
     "react-router-dom": "6.6.2",
     "runes2": "~1.1.4",
@@ -49,12 +49,12 @@
     "@trivago/prettier-plugin-sort-imports": "~4.3.0",
     "postcss": "~8.4.35",
     "postcss-dark-theme-class": "~1.2.1",
-    "postcss-preset-env": "~9.3.0",
+    "postcss-preset-env": "~9.4.0",
     "twitter-text": "~3.1.0",
-    "vite": "~5.1.3",
+    "vite": "~5.1.4",
     "vite-plugin-generate-file": "~0.1.1",
     "vite-plugin-html-config": "~1.0.11",
-    "vite-plugin-pwa": "~0.18.2",
+    "vite-plugin-pwa": "~0.19.0",
     "vite-plugin-remove-console": "~2.2.0",
     "workbox-cacheable-response": "~7.0.0",
     "workbox-expiration": "~7.0.0",

scripts/fetch-instances-list.js

@@ -1,34 +1,12 @@
 import fs from 'fs';
 
-const { INSTANCES_SOCIAL_SECRET_TOKEN } = process.env;
-
-const params = new URLSearchParams({
-  count: 0,
-  min_users: 500,
-  sort_by: 'active_users',
-  sort_order: 'desc',
-});
-
-const url = `https://instances.social/api/1.0/instances/list?${params.toString()}`;
-const results = await fetch(url, {
-  headers: {
-    Authorization: `Bearer ${INSTANCES_SOCIAL_SECRET_TOKEN}`,
-  },
-});
+const url = 'https://api.joinmastodon.org/servers';
+const results = await fetch(url);
 
 const json = await results.json();
 
-// Filters
-json.instances = json.instances.filter(
-  (instance) => Number(instance.connections) > 20,
-);
-
-const names = json.instances.map((instance) => instance.name);
+const domains = json.map((instance) => instance.domain);
 
 // Write to file
 const path = './src/data/instances.json';
-fs.writeFileSync(path, JSON.stringify(names, null, '\t'), 'utf8');
-
-// Write everything to file, for debugging
-const path2 = './src/data/instances-full.json';
-fs.writeFileSync(path2, JSON.stringify(json, null, '\t'), 'utf8');
+fs.writeFileSync(path, JSON.stringify(domains, null, '\t'), 'utf8');

src/app.css

@@ -1125,7 +1125,7 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
   z-index: 1000;
   display: flex;
   background-color: var(--backdrop-color);
-  animation: appear 0.2s ease-out;
+  animation: appear 0.1s ease-out;
 }
 .deck-backdrop > a {
   flex-grow: 1;
@@ -1255,7 +1255,7 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
   width: 70%;
   flex-grow: 1;
   background-color: var(--backdrop-solid-color);
-  animation: appear 0.3s var(--timing-function) both;
+  animation: appear 0.1s var(--timing-function) both;
   transition: width 0.3s var(--timing-function);
 
   &:only-child {

src/cloak-mode.css

@@ -15,7 +15,7 @@ body.cloak,
   .account-block {
     text-decoration-thickness: 1.1em;
     text-decoration-line: line-through;
-    text-rendering: optimizeSpeed;
+    /* text-rendering: optimizeSpeed; */
     filter: opacity(0.5);
   }
   .name-text *,

src/components/name-text.css

@@ -2,9 +2,11 @@
   color: inherit;
   text-decoration: none;
   display: inline;
+  unicode-bidi: isolate;
 
   b {
     font-weight: 500;
+    unicode-bidi: isolate;
   }
 }
 .name-text.show-acct {

src/components/notification.jsx

@@ -334,14 +334,14 @@ function Notification({
               <Status
                 status={actualStatus}
                 size="s"
-                previewMode
+                readOnly
                 allowContextMenu
               />
             ) : (
               <Status
                 statusID={actualStatusID}
                 size="s"
-                previewMode
+                readOnly
                 allowContextMenu
               />
             )}

src/components/search-form.jsx

@@ -219,6 +219,7 @@ const SearchForm = forwardRef((props, ref) => {
               hidden: /^https?:/.test(query),
               top: /\s/.test(query),
               icon: 'document',
+              queryType: 'statuses',
             },
             {
               label: (
@@ -232,6 +233,7 @@ const SearchForm = forwardRef((props, ref) => {
               top: /^#/.test(query),
               type: 'link',
               icon: 'hashtag',
+              queryType: 'hashtags',
             },
             {
               label: (
@@ -252,9 +254,14 @@ const SearchForm = forwardRef((props, ref) => {
               ),
               to: `/search?q=${encodeURIComponent(query)}&type=accounts`,
               icon: 'group',
+              queryType: 'accounts',
             },
           ]
             .sort((a, b) => {
+              if (type) {
+                if (a.queryType === type) return -1;
+                if (b.queryType === type) return 1;
+              }
               if (a.top && !b.top) return -1;
               if (!a.top && b.top) return 1;
               return 0;

src/components/status.css

@@ -611,7 +611,7 @@
     opacity: 0.2;
     text-decoration-thickness: 1.5em;
     text-decoration-line: line-through;
-    text-rendering: optimizeSpeed;
+    /* text-rendering: optimizeSpeed; */
     pointer-events: none;
     user-select: none;
     /* contain: layout; */
@@ -622,7 +622,7 @@
       text-decoration-color: inherit;
       text-decoration-thickness: 1.5em;
       text-decoration-line: line-through;
-      text-rendering: optimizeSpeed;
+      /* text-rendering: optimizeSpeed; */
     }
 
     img {
@@ -638,7 +638,7 @@
       opacity: 0.2;
       text-decoration-thickness: 1.5em;
       text-decoration-line: line-through;
-      text-rendering: optimizeSpeed;
+      /* text-rendering: optimizeSpeed; */
       pointer-events: none;
       user-select: none;
 
@@ -646,7 +646,7 @@
         text-decoration-color: inherit;
         text-decoration-thickness: 1.5em;
         text-decoration-line: line-through;
-        text-rendering: optimizeSpeed;
+        /* text-rendering: optimizeSpeed; */
       }
     }
   }
@@ -670,7 +670,7 @@
     color: inherit;
     text-decoration-thickness: 1.5em;
     text-decoration-line: line-through;
-    text-rendering: optimizeSpeed;
+    /* text-rendering: optimizeSpeed; */
     pointer-events: none;
     user-select: none;
     /* contain: layout; */
@@ -680,7 +680,7 @@
     * {
       text-decoration-thickness: 1.5em;
       text-decoration-line: line-through;
-      text-rendering: optimizeSpeed;
+      /* text-rendering: optimizeSpeed; */
     }
 
     img {
@@ -2011,11 +2011,17 @@ a.card:is(:hover, :focus):visited {
   &:focus {
     background-image: var(--bg-gradient);
   }
+  &.visibility-direct:focus {
+    background-image: var(--bg-gradient), var(--yellow-stripes);
+  }
 
   @media (pointer: fine), (hover: hover) {
     &:hover {
       background-image: var(--bg-gradient);
     }
+    &.visibility-direct:hover {
+      background-image: var(--bg-gradient), var(--yellow-stripes);
+    }
   }
 }
 
@@ -2039,7 +2045,7 @@ a.card:is(:hover, :focus):visited {
   color: var(--link-color);
 }
 .status-badge .pin {
-  color: var(--red-color);
+  color: var(--link-text-color);
 }
 @keyframes swoosh-from-right {
   0% {

src/components/status.jsx

@@ -1503,7 +1503,7 @@ function Status({
             {size !== 'l' &&
               (_deleted ? (
                 <span class="status-deleted-tag">Deleted</span>
-              ) : url && !previewMode && !quoted ? (
+              ) : url && !previewMode && !readOnly && !quoted ? (
                 <Link
                   to={instance ? `/${instance}/s/${id}` : `/s/${id}`}
                   onClick={(e) => {
@@ -1551,7 +1551,9 @@ function Status({
                     />
                   )}{' '}
                   <RelativeTime datetime={createdAtDate} format="micro" />
-                  {!previewMode && <Icon icon="more2" class="more" />}
+                  {!previewMode && !readOnly && (
+                    <Icon icon="more2" class="more" />
+                  )}
                 </Link>
               ) : (
                 // <Menu

src/pages/notifications.jsx

@@ -285,6 +285,11 @@ function Notifications({ columnMode }) {
               scrollableRef.current?.scrollTo({ top: 0, behavior: 'smooth' });
             }
           }}
+          onDblClick={(e) => {
+            if (!e.target.closest('a, button')) {
+              loadNotifications(true);
+            }
+          }}
           class={uiState === 'loading' ? 'loading' : ''}
         >
           <div class="header-grid">