mirror of
https://github.com/cheeaun/phanpy.git
synced 2024-11-21 08:45:32 +03:00
Merge branch 'main' into feature/paste-attach
# Conflicts: # src/locales/en.po
This commit is contained in:
commit
aa332743d4
61 changed files with 14477 additions and 9894 deletions
22
.github/workflows/prettier-pr.yml
vendored
Normal file
22
.github/workflows/prettier-pr.yml
vendored
Normal file
|
@ -0,0 +1,22 @@
|
|||
name: Prettier on pull requests
|
||||
|
||||
on:
|
||||
pull_request:
|
||||
workflow_dispatch:
|
||||
|
||||
jobs:
|
||||
prettier:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
# Need node to install prettier plugin(s)
|
||||
- uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: 20
|
||||
- run: npm ci
|
||||
- uses: creyD/prettier_action@v4.3
|
||||
with:
|
||||
dry: true
|
||||
# Don't write anything
|
||||
prettier_options: '--check --config .prettierrc'
|
||||
file_pattern: '.'
|
|
@ -304,6 +304,8 @@ Costs involved in running and developing this web app:
|
|||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/15910131/medium/67fab7eeab5551853450e76e2ef19e59.jpeg" alt="" width="16" height="16" /> CDN (Chinese Simplified)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16556801/medium/ed5e501ca1f3cc6525d2da28db646346.jpeg" alt="" width="16" height="16" /> dannypsnl (Chinese Traditional)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/3711/medium/d95ddd44e8dcb3a039f8a3463aed781d_default.png" alt="" width="16" height="16" /> databio (Catalan)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16533843/medium/ac7af8776858a992d992cf6702d1aaae.jpg" alt="" width="16" height="16" /> Dizro (Italian)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16574625/medium/f2ac3a4f32f104a3a6d4085d4bcb3924_default.png" alt="" width="16" height="16" /> Drift6944 (Czech)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/12618120/medium/ccb11bd042bbf4c7189033f7af2dbd32_default.png" alt="" width="16" height="16" /> drydenwu (Chinese Traditional)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/13557465/medium/8feebf3677fa80c01e8c54c4fbe097e0_default.png" alt="" width="16" height="16" /> elissarc (French)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16528627/medium/9036f6eced0257f4e1ea4c5bd499de2d_default.png" alt="" width="16" height="16" /> ElPamplina (Spanish)
|
||||
|
@ -311,6 +313,7 @@ Costs involved in running and developing this web app:
|
|||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/14444512/medium/99d0e7a3076deccbdfe0aa0b0612308c.jpeg" alt="" width="16" height="16" /> Freeesia (Japanese)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/12617257/medium/a201650da44fed28890b0e0d8477a663.jpg" alt="" width="16" height="16" /> ghose (Galician)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/15248754/medium/0dac6334ea0f4e8d4194a605c0a5594a.jpeg" alt="" width="16" height="16" /> hongminhee (Korean)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16529833/medium/2122d0c5d61c00786ab6d5e5672d4098.png" alt="" width="16" height="16" /> Hugoglyph (Esperanto, Spanish)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/13454728/medium/1f78b7124b3c962bc4ae55e8d701fc91_default.png" alt="" width="16" height="16" /> isard (Catalan)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16532403/medium/4cefb19623bcc44d7cdb9e25aebf5250.jpeg" alt="" width="16" height="16" /> karlafej (Czech)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/15791971/medium/88bdda3090339f16f6083390d32bb434_default.png" alt="" width="16" height="16" /> katullo11 (Italian)
|
||||
|
@ -318,6 +321,7 @@ Costs involved in running and developing this web app:
|
|||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16529521/medium/ae6add93a901b0fefa2d9b1077920d73.png" alt="" width="16" height="16" /> llun (Thai)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16291756/medium/e1c4210f15537394cc764b8bc2dffe37.jpg" alt="" width="16" height="16" /> lucasofchirst (Occitan, Portuguese, Portuguese, Brazilian)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16537713/medium/825f0bf1a14fc545a76891a52839d86e_default.png" alt="" width="16" height="16" /> marcin.kozinski (Polish)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/13521465/medium/76cb9aa6b753ce900a70478bff7fcea0.png" alt="" width="16" height="16" /> mkljczkk (Polish)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/12882812/medium/77744d8db46e9a3e09030e1a02b7a572.jpeg" alt="" width="16" height="16" /> mojosoeun (Korean)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/13613969/medium/c7834ddc0ada84a79671697a944bb274.png" alt="" width="16" height="16" /> moreal (Korean)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/14158861/medium/ba1ff31dc5743b067ea6685f735229a5_default.png" alt="" width="16" height="16" /> MrWillCom (Chinese Simplified)
|
||||
|
@ -331,12 +335,12 @@ Costs involved in running and developing this web app:
|
|||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/13422319/medium/66632a98d73d48e36753d94ebcec9d4f.png" alt="" width="16" height="16" /> rwmpelstilzchen (Esperanto, Hebrew)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16538605/medium/bcdb6e3286b7d6237923f3a9383eed29.png" alt="" width="16" height="16" /> SadmL (Russian)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16539171/medium/0ce95ef6b3b0566136191fbedc1563d0.png" alt="" width="16" height="16" /> SadmL_AI (Russian)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/12381015/medium/35e3557fd61d85f9a5b84545d9e3feb4.png" alt="" width="16" height="16" /> shuuji3 (Japanese)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/14565190/medium/79100599131b7776e9803e4b696915a3_default.png" alt="" width="16" height="16" /> Sky_NiniKo (French)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16532441/medium/1a47e8d80c95636e02d2260f6e233ca5.png" alt="" width="16" height="16" /> Su5hicz (Czech)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16533843/medium/7314c15492ef90118c33a80a427e6c87_default.png" alt="" width="16" height="16" /> Talos00 (Italian)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16530049/medium/683f3581620c6b4a5c753b416ed695a7.jpeg" alt="" width="16" height="16" /> tferrermo (Spanish)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/15752199/medium/7e9efd828c4691368d063b19d19eb894.png" alt="" width="16" height="16" /> tkbremnes (Norwegian Bokmal)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16527851/medium/649e5a9a8a8cc61ced670d89e9cca082.png" alt="" width="16" height="16" /> tux93 (German)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16529833/medium/2991a65722acd721849656223014cd49.png" alt="" width="16" height="16" /> Urbestro (Esperanto, Spanish)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/14427566/medium/ab733b5044c21867fc5a9d1b22cd2c03.png" alt="" width="16" height="16" /> Vac31. (Lithuanian)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16026914/medium/e3ca187f354a298ef0c9d02a0ed17be7.jpg" alt="" width="16" height="16" /> valtlai (Finnish)
|
||||
- <img src="https://crowdin-static.downloads.crowdin.com/avatar/16563757/medium/af4556c13862d1fd593b51084a159b75_default.png" alt="" width="16" height="16" /> voyagercy (Chinese Traditional)
|
||||
|
|
116
package-lock.json
generated
116
package-lock.json
generated
|
@ -32,7 +32,7 @@
|
|||
"moize": "~6.1.6",
|
||||
"p-retry": "~6.2.0",
|
||||
"p-throttle": "~6.2.0",
|
||||
"preact": "~10.23.2",
|
||||
"preact": "~10.24.0",
|
||||
"punycode": "~2.3.1",
|
||||
"react-hotkeys-hook": "~4.5.1",
|
||||
"react-intersection-observer": "~9.13.1",
|
||||
|
@ -52,20 +52,21 @@
|
|||
"@ianvs/prettier-plugin-sort-imports": "~4.3.1",
|
||||
"@lingui/cli": "~4.11.4",
|
||||
"@lingui/vite-plugin": "~4.11.4",
|
||||
"@preact/preset-vite": "~2.9.0",
|
||||
"@preact/preset-vite": "~2.9.1",
|
||||
"babel-plugin-macros": "~3.1.0",
|
||||
"postcss": "~8.4.45",
|
||||
"postcss": "~8.4.47",
|
||||
"postcss-dark-theme-class": "~1.3.0",
|
||||
"postcss-preset-env": "~10.0.2",
|
||||
"postcss-preset-env": "~10.0.3",
|
||||
"twitter-text": "~3.1.0",
|
||||
"vite": "~5.4.3",
|
||||
"vite": "~5.4.7",
|
||||
"vite-plugin-generate-file": "~0.2.0",
|
||||
"vite-plugin-html-config": "~2.0.2",
|
||||
"vite-plugin-pwa": "~0.20.5",
|
||||
"vite-plugin-remove-console": "~2.2.0",
|
||||
"vite-plugin-run": "~0.5.2",
|
||||
"vite-plugin-run": "~0.6.0",
|
||||
"workbox-cacheable-response": "~7.1.0",
|
||||
"workbox-expiration": "~7.1.0",
|
||||
"workbox-navigation-preload": "~7.1.0",
|
||||
"workbox-routing": "~7.1.0",
|
||||
"workbox-strategies": "~7.1.0"
|
||||
}
|
||||
|
@ -4265,9 +4266,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@preact/preset-vite": {
|
||||
"version": "2.9.0",
|
||||
"resolved": "https://registry.npmjs.org/@preact/preset-vite/-/preset-vite-2.9.0.tgz",
|
||||
"integrity": "sha512-B9yVT7AkR6owrt84K3pLNyaKSvlioKdw65VqE/zMiR6HMovPekpsrwBNs5DJhBFEd5cvLMtCjHNHZ9P7Oblveg==",
|
||||
"version": "2.9.1",
|
||||
"resolved": "https://registry.npmjs.org/@preact/preset-vite/-/preset-vite-2.9.1.tgz",
|
||||
"integrity": "sha512-JecWzrOx7ogFhklSMhY+aH/24pajL0Vx+beEgau3WDMUUAo32cpUo/UqerPhLOyhCKXlxK9a3cRoa8g68ZAp5g==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.22.13",
|
||||
|
@ -4280,7 +4281,6 @@
|
|||
"kolorist": "^1.8.0",
|
||||
"magic-string": "0.30.5",
|
||||
"node-html-parser": "^6.1.10",
|
||||
"resolve": "^1.22.8",
|
||||
"source-map": "^0.7.4",
|
||||
"stack-trace": "^1.0.0-pre2"
|
||||
},
|
||||
|
@ -5709,9 +5709,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/cssdb": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/cssdb/-/cssdb-8.1.0.tgz",
|
||||
"integrity": "sha512-BQN57lfS4dYt2iL0LgyrlDbefZKEtUyrO8rbzrbGrqBk6OoyNTQLF+porY9DrpDBjLo4NEvj2IJttC7vf3x+Ew==",
|
||||
"version": "8.1.1",
|
||||
"resolved": "https://registry.npmjs.org/cssdb/-/cssdb-8.1.1.tgz",
|
||||
"integrity": "sha512-kRbSRgZoxtZNl5snb3nOzBkFOt5AwnephcUTIEFc2DebKG9PN50/cHarlwOooTxYQ/gxsnKs3BxykhNLmfvyLg==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
|
@ -5943,11 +5943,10 @@
|
|||
}
|
||||
},
|
||||
"node_modules/ejs": {
|
||||
"version": "3.1.9",
|
||||
"resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.9.tgz",
|
||||
"integrity": "sha512-rC+QVNMJWv+MtPgkt0y+0rVEIdbtxVADApW9JXrUVlzHetgcyczP/E7DJmWJ4fJCZF2cPcBk0laWO9ZHMG3DmQ==",
|
||||
"version": "3.1.10",
|
||||
"resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
|
||||
"integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"jake": "^10.8.5"
|
||||
},
|
||||
|
@ -7782,16 +7781,16 @@
|
|||
"license": "MIT"
|
||||
},
|
||||
"node_modules/micromatch": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz",
|
||||
"integrity": "sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==",
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
|
||||
"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"braces": "^3.0.1",
|
||||
"picomatch": "^2.0.5"
|
||||
"braces": "^3.0.3",
|
||||
"picomatch": "^2.3.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
"node": ">=8.6"
|
||||
}
|
||||
},
|
||||
"node_modules/mime-db": {
|
||||
|
@ -8363,9 +8362,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/postcss": {
|
||||
"version": "8.4.45",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.45.tgz",
|
||||
"integrity": "sha512-7KTLTdzdZZYscUc65XmjFiB73vBhBfbPztCYdUNvlaso9PrzjzcmjqBPR0lNGkcVlcO4BjiO5rK/qNz+XAen1Q==",
|
||||
"version": "8.4.47",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.47.tgz",
|
||||
"integrity": "sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
|
@ -8383,8 +8382,8 @@
|
|||
],
|
||||
"dependencies": {
|
||||
"nanoid": "^3.3.7",
|
||||
"picocolors": "^1.0.1",
|
||||
"source-map-js": "^1.2.0"
|
||||
"picocolors": "^1.1.0",
|
||||
"source-map-js": "^1.2.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^10 || ^12 || >=14"
|
||||
|
@ -8864,9 +8863,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/postcss-opacity-percentage": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-opacity-percentage/-/postcss-opacity-percentage-2.0.0.tgz",
|
||||
"integrity": "sha512-lyDrCOtntq5Y1JZpBFzIWm2wG9kbEdujpNt4NLannF+J9c8CgFIzPa80YQfdza+Y+yFfzbYj/rfoOsYsooUWTQ==",
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/postcss-opacity-percentage/-/postcss-opacity-percentage-3.0.0.tgz",
|
||||
"integrity": "sha512-K6HGVzyxUxd/VgZdX04DCtdwWJ4NGLG212US4/LA1TLAbHgmAsTWVR86o+gGIbFtnTkfOpb9sCRBx8K7HO66qQ==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
|
@ -8878,12 +8877,11 @@
|
|||
"url": "https://liberapay.com/mrcgrtz"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": "^14 || ^16 || >=18"
|
||||
"node": ">=18"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"postcss": "^8.2"
|
||||
"postcss": "^8.4"
|
||||
}
|
||||
},
|
||||
"node_modules/postcss-overflow-shorthand": {
|
||||
|
@ -8947,9 +8945,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/postcss-preset-env": {
|
||||
"version": "10.0.2",
|
||||
"resolved": "https://registry.npmjs.org/postcss-preset-env/-/postcss-preset-env-10.0.2.tgz",
|
||||
"integrity": "sha512-PMxqnz0RQYMUmUi6p4P7BhC9EVGyEUCIdwn4vJ7Fy1jvc2QP4mMH75BSBB1mBFqjl3x4xYwyCNMhGZ8y0+/qOA==",
|
||||
"version": "10.0.3",
|
||||
"resolved": "https://registry.npmjs.org/postcss-preset-env/-/postcss-preset-env-10.0.3.tgz",
|
||||
"integrity": "sha512-1nrZ4IeBXEEj53IMoRKE+k/Ub6nQb3gFjaxTeyUNG5zv3JQclFDY5GKKhAi3nsa1lnPMWgzQX+/1y6wUt2+I7Q==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
|
@ -8997,7 +8995,7 @@
|
|||
"css-blank-pseudo": "^7.0.0",
|
||||
"css-has-pseudo": "^7.0.0",
|
||||
"css-prefers-color-scheme": "^10.0.0",
|
||||
"cssdb": "^8.1.0",
|
||||
"cssdb": "^8.1.1",
|
||||
"postcss-attribute-case-insensitive": "^7.0.0",
|
||||
"postcss-clamp": "^4.1.0",
|
||||
"postcss-color-functional-notation": "^7.0.2",
|
||||
|
@ -9016,7 +9014,7 @@
|
|||
"postcss-lab-function": "^7.0.2",
|
||||
"postcss-logical": "^8.0.0",
|
||||
"postcss-nesting": "^13.0.0",
|
||||
"postcss-opacity-percentage": "^2.0.0",
|
||||
"postcss-opacity-percentage": "^3.0.0",
|
||||
"postcss-overflow-shorthand": "^6.0.0",
|
||||
"postcss-page-break": "^3.0.4",
|
||||
"postcss-place": "^10.0.0",
|
||||
|
@ -9112,9 +9110,9 @@
|
|||
"license": "MIT"
|
||||
},
|
||||
"node_modules/preact": {
|
||||
"version": "10.23.2",
|
||||
"resolved": "https://registry.npmjs.org/preact/-/preact-10.23.2.tgz",
|
||||
"integrity": "sha512-kKYfePf9rzKnxOAKDpsWhg/ysrHPqT+yQ7UW4JjdnqjFIeNUnNcEJvhuA8fDenxAGWzUqtd51DfVg7xp/8T9NA==",
|
||||
"version": "10.24.0",
|
||||
"resolved": "https://registry.npmjs.org/preact/-/preact-10.24.0.tgz",
|
||||
"integrity": "sha512-aK8Cf+jkfyuZ0ZZRG9FbYqwmEiGQ4y/PUO4SuTWoyWL244nZZh7bd5h2APd4rSNDYTBNghg1L+5iJN3Skxtbsw==",
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/preact"
|
||||
|
@ -9793,9 +9791,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
|
||||
"integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
|
||||
"integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
|
@ -10538,9 +10536,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "5.4.3",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.4.3.tgz",
|
||||
"integrity": "sha512-IH+nl64eq9lJjFqU+/yrRnrHPVTlgy42/+IzbOdaFDVlyLgI/wDlf+FCobXLX1cT0X5+7LMyH1mIy2xJdLfo8Q==",
|
||||
"version": "5.4.7",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.4.7.tgz",
|
||||
"integrity": "sha512-5l2zxqMEPVENgvzTuBpHer2awaetimj2BGkhBPdnwKbPNOlHsODU+oiazEZzLK7KhAnOrO+XGYJYn4ZlUhDtDQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"esbuild": "^0.21.3",
|
||||
|
@ -10657,16 +10655,16 @@
|
|||
"dev": true
|
||||
},
|
||||
"node_modules/vite-plugin-run": {
|
||||
"version": "0.5.2",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-run/-/vite-plugin-run-0.5.2.tgz",
|
||||
"integrity": "sha512-ZrbdZ2gNJwvW4MMQr6a4Udioq6+06VgBytviYi/hgRQnz3SCQAcRJu7QKqlIbH229/lNyYTdvkglottfkUlNyQ==",
|
||||
"version": "0.6.0",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-run/-/vite-plugin-run-0.6.0.tgz",
|
||||
"integrity": "sha512-B5iHHz6MjXodmTxZPlEQAOJQAzi47wCqVqSDYo71A7b8MzS+MklwmZ384lb4xUy71PPTEZAxjNs0bIDqL4ly8g==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@antfu/utils": "^0.7.6",
|
||||
"debug": "^4.3.4",
|
||||
"execa": "5.1",
|
||||
"minimatch": "^9.0.3",
|
||||
"picocolors": "^1.0.0"
|
||||
"@antfu/utils": "^0.7.10",
|
||||
"debug": "^4.3.7",
|
||||
"execa": "5.1.1",
|
||||
"minimatch": "^9.0.5",
|
||||
"picocolors": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/vite-plugin-run/node_modules/brace-expansion": {
|
||||
|
@ -11071,9 +11069,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"node_modules/ws": {
|
||||
"version": "8.17.0",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.17.0.tgz",
|
||||
"integrity": "sha512-uJq6108EgZMAl20KagGkzCKfMEjxmKvZHG7Tlq0Z6nOky7YF7aq4mOx6xK8TJ/i1LeK4Qus7INktacctDgY8Ow==",
|
||||
"version": "8.18.0",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz",
|
||||
"integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==",
|
||||
"engines": {
|
||||
"node": ">=10.0.0"
|
||||
},
|
||||
|
|
13
package.json
13
package.json
|
@ -40,7 +40,7 @@
|
|||
"moize": "~6.1.6",
|
||||
"p-retry": "~6.2.0",
|
||||
"p-throttle": "~6.2.0",
|
||||
"preact": "~10.23.2",
|
||||
"preact": "~10.24.0",
|
||||
"punycode": "~2.3.1",
|
||||
"react-hotkeys-hook": "~4.5.1",
|
||||
"react-intersection-observer": "~9.13.1",
|
||||
|
@ -60,20 +60,21 @@
|
|||
"@ianvs/prettier-plugin-sort-imports": "~4.3.1",
|
||||
"@lingui/cli": "~4.11.4",
|
||||
"@lingui/vite-plugin": "~4.11.4",
|
||||
"@preact/preset-vite": "~2.9.0",
|
||||
"@preact/preset-vite": "~2.9.1",
|
||||
"babel-plugin-macros": "~3.1.0",
|
||||
"postcss": "~8.4.45",
|
||||
"postcss": "~8.4.47",
|
||||
"postcss-dark-theme-class": "~1.3.0",
|
||||
"postcss-preset-env": "~10.0.2",
|
||||
"postcss-preset-env": "~10.0.3",
|
||||
"twitter-text": "~3.1.0",
|
||||
"vite": "~5.4.3",
|
||||
"vite": "~5.4.7",
|
||||
"vite-plugin-generate-file": "~0.2.0",
|
||||
"vite-plugin-html-config": "~2.0.2",
|
||||
"vite-plugin-pwa": "~0.20.5",
|
||||
"vite-plugin-remove-console": "~2.2.0",
|
||||
"vite-plugin-run": "~0.5.2",
|
||||
"vite-plugin-run": "~0.6.0",
|
||||
"workbox-cacheable-response": "~7.1.0",
|
||||
"workbox-expiration": "~7.1.0",
|
||||
"workbox-navigation-preload": "~7.1.0",
|
||||
"workbox-routing": "~7.1.0",
|
||||
"workbox-strategies": "~7.1.0"
|
||||
},
|
||||
|
|
65
public/sw.js
65
public/sw.js
|
@ -1,5 +1,6 @@
|
|||
import { CacheableResponsePlugin } from 'workbox-cacheable-response';
|
||||
import { ExpirationPlugin } from 'workbox-expiration';
|
||||
import * as navigationPreload from 'workbox-navigation-preload';
|
||||
import { RegExpRoute, registerRoute, Route } from 'workbox-routing';
|
||||
import {
|
||||
CacheFirst,
|
||||
|
@ -7,19 +8,48 @@ import {
|
|||
StaleWhileRevalidate,
|
||||
} from 'workbox-strategies';
|
||||
|
||||
navigationPreload.enable();
|
||||
|
||||
self.__WB_DISABLE_DEV_LOGS = true;
|
||||
|
||||
const iconsRoute = new Route(
|
||||
({ request, sameOrigin }) => {
|
||||
const isIcon = request.url.includes('/icons/');
|
||||
return sameOrigin && isIcon;
|
||||
},
|
||||
new CacheFirst({
|
||||
cacheName: 'icons',
|
||||
plugins: [
|
||||
new ExpirationPlugin({
|
||||
// Weirdly high maxEntries number, due to some old icons suddenly disappearing and not rendering
|
||||
// NOTE: Temporary fix
|
||||
maxEntries: 300,
|
||||
maxAgeSeconds: 3 * 24 * 60 * 60, // 3 days
|
||||
purgeOnQuotaError: true,
|
||||
}),
|
||||
new CacheableResponsePlugin({
|
||||
statuses: [0, 200],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
);
|
||||
registerRoute(iconsRoute);
|
||||
|
||||
const assetsRoute = new Route(
|
||||
({ request, sameOrigin }) => {
|
||||
const isAsset =
|
||||
request.destination === 'style' || request.destination === 'script';
|
||||
const hasHash = /-[0-9a-f]{4,}\./i.test(request.url);
|
||||
const hasHash = /-[0-9a-z-]{4,}\./i.test(request.url);
|
||||
return sameOrigin && isAsset && hasHash;
|
||||
},
|
||||
new NetworkFirst({
|
||||
cacheName: 'assets',
|
||||
networkTimeoutSeconds: 5,
|
||||
plugins: [
|
||||
new ExpirationPlugin({
|
||||
maxEntries: 30,
|
||||
purgeOnQuotaError: true,
|
||||
}),
|
||||
new CacheableResponsePlugin({
|
||||
statuses: [0, 200],
|
||||
}),
|
||||
|
@ -41,8 +71,7 @@ const imageRoute = new Route(
|
|||
cacheName: 'remote-images',
|
||||
plugins: [
|
||||
new ExpirationPlugin({
|
||||
maxEntries: 50,
|
||||
maxAgeSeconds: 3 * 24 * 60 * 60, // 3 days
|
||||
maxEntries: 30,
|
||||
purgeOnQuotaError: true,
|
||||
}),
|
||||
new CacheableResponsePlugin({
|
||||
|
@ -53,40 +82,18 @@ const imageRoute = new Route(
|
|||
);
|
||||
registerRoute(imageRoute);
|
||||
|
||||
const iconsRoute = new Route(
|
||||
({ request, sameOrigin }) => {
|
||||
const isIcon = request.url.includes('/icons/');
|
||||
return sameOrigin && isIcon;
|
||||
},
|
||||
new CacheFirst({
|
||||
cacheName: 'icons',
|
||||
plugins: [
|
||||
new ExpirationPlugin({
|
||||
maxEntries: 300,
|
||||
maxAgeSeconds: 3 * 24 * 60 * 60, // 3 days
|
||||
purgeOnQuotaError: true,
|
||||
}),
|
||||
new CacheableResponsePlugin({
|
||||
statuses: [0, 200],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
);
|
||||
registerRoute(iconsRoute);
|
||||
|
||||
// 1-day cache for
|
||||
// - /api/v1/instance
|
||||
// - /api/v1/custom_emojis
|
||||
// - /api/v1/preferences
|
||||
// - /api/v1/lists/:id
|
||||
// - /api/v1/announcements
|
||||
const apiExtendedRoute = new RegExpRoute(
|
||||
/^https?:\/\/[^\/]+\/api\/v\d+\/(instance|custom_emojis|preferences|lists\/\d+|announcements)$/,
|
||||
/^https?:\/\/[^\/]+\/api\/v\d+\/(custom_emojis|lists\/\d+|announcements)$/,
|
||||
new StaleWhileRevalidate({
|
||||
cacheName: 'api-extended',
|
||||
plugins: [
|
||||
new ExpirationPlugin({
|
||||
maxAgeSeconds: 24 * 60 * 60, // 1 day
|
||||
maxAgeSeconds: 12 * 60 * 60, // 12 hours
|
||||
purgeOnQuotaError: true,
|
||||
}),
|
||||
new CacheableResponsePlugin({
|
||||
statuses: [0, 200],
|
||||
|
@ -127,7 +134,9 @@ const apiRoute = new RegExpRoute(
|
|||
networkTimeoutSeconds: 5,
|
||||
plugins: [
|
||||
new ExpirationPlugin({
|
||||
maxEntries: 30,
|
||||
maxAgeSeconds: 5 * 60, // 5 minutes
|
||||
purgeOnQuotaError: true,
|
||||
}),
|
||||
new CacheableResponsePlugin({
|
||||
statuses: [0, 200],
|
||||
|
|
29
src/app.css
29
src/app.css
|
@ -367,10 +367,14 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
|
|||
border-bottom: var(--hairline-width) solid var(--divider-color);
|
||||
--line-dir: var(--to-forward);
|
||||
}
|
||||
.timeline:not(.contextual) > li + li {
|
||||
.timeline > li + li:not(.timeline-item-carousel, .hero, .ancestor) {
|
||||
content-visibility: auto;
|
||||
contain-intrinsic-size: auto 160px;
|
||||
}
|
||||
.timeline.contextual > li:is(:hover, :focus-visible) {
|
||||
/* Needed to undo the overflow: hidden "effect" due to "content-visibility: auto" */
|
||||
content-visibility: visible !important;
|
||||
}
|
||||
.timeline.flat > li {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
@ -1634,6 +1638,7 @@ body:has(.media-modal-container + .status-deck) .media-post-link {
|
|||
/* SHEET */
|
||||
|
||||
.sheet {
|
||||
timeline-scope: --sheet-scroll;
|
||||
align-self: flex-end;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
@ -1708,6 +1713,27 @@ body:has(.media-modal-container + .status-deck) .media-post-link {
|
|||
padding-right: max(16px, env(safe-area-inset-right));
|
||||
user-select: none;
|
||||
}
|
||||
@keyframes header-border {
|
||||
0% {
|
||||
box-shadow: none;
|
||||
}
|
||||
100% {
|
||||
box-shadow: 0 0 0 1px var(--outline-color),
|
||||
0 8px 16px -8px var(--drop-shadow-color);
|
||||
}
|
||||
}
|
||||
@supports (animation-timeline: scroll()) {
|
||||
.sheet header {
|
||||
animation: header-border 1s linear both;
|
||||
animation-timeline: --sheet-scroll;
|
||||
animation-range: 0 8px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.sheet header + main {
|
||||
mask-image: none !important;
|
||||
}
|
||||
}
|
||||
.sheet .sheet-close:not(.outer) + header {
|
||||
padding-right: max(44px, env(safe-area-inset-right));
|
||||
|
||||
|
@ -1726,6 +1752,7 @@ body:has(.media-modal-container + .status-deck) .media-post-link {
|
|||
align-items: center;
|
||||
}
|
||||
.sheet main {
|
||||
scroll-timeline: --sheet-scroll;
|
||||
overflow: auto;
|
||||
overflow-x: hidden;
|
||||
overscroll-behavior: contain;
|
||||
|
|
60
src/app.jsx
60
src/app.jsx
|
@ -2,6 +2,7 @@ import './app.css';
|
|||
|
||||
import { useLingui } from '@lingui/react';
|
||||
import debounce from 'just-debounce-it';
|
||||
import { memo } from 'preact/compat';
|
||||
import {
|
||||
useEffect,
|
||||
useLayoutEffect,
|
||||
|
@ -47,6 +48,8 @@ import Trending from './pages/trending';
|
|||
import Welcome from './pages/welcome';
|
||||
import {
|
||||
api,
|
||||
hasInstance,
|
||||
hasPreferences,
|
||||
initAccount,
|
||||
initClient,
|
||||
initInstance,
|
||||
|
@ -327,7 +330,9 @@ function App() {
|
|||
const [isLoggedIn, setIsLoggedIn] = useState(false);
|
||||
const [uiState, setUIState] = useState('loading');
|
||||
__BENCHMARK.start('app-init');
|
||||
__BENCHMARK.start('time-to-following');
|
||||
__BENCHMARK.start('time-to-home');
|
||||
__BENCHMARK.start('time-to-isLoggedIn');
|
||||
useLingui();
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -407,18 +412,27 @@ function App() {
|
|||
setUIState('loading');
|
||||
(async () => {
|
||||
try {
|
||||
await initPreferences(client);
|
||||
await initInstance(client, instance);
|
||||
if (hasPreferences() && hasInstance(instance)) {
|
||||
// Non-blocking
|
||||
initPreferences(client);
|
||||
initInstance(client, instance);
|
||||
} else {
|
||||
await Promise.allSettled([
|
||||
initPreferences(client),
|
||||
initInstance(client, instance),
|
||||
]);
|
||||
}
|
||||
} catch (e) {
|
||||
} finally {
|
||||
setIsLoggedIn(true);
|
||||
setUIState('default');
|
||||
__BENCHMARK.end('app-init');
|
||||
}
|
||||
})();
|
||||
} else {
|
||||
setUIState('default');
|
||||
__BENCHMARK.end('app-init');
|
||||
}
|
||||
__BENCHMARK.end('app-init');
|
||||
}
|
||||
|
||||
// Cleanup
|
||||
|
@ -439,27 +453,36 @@ function App() {
|
|||
return <HttpRoute />;
|
||||
}
|
||||
|
||||
if (uiState === 'loading') {
|
||||
return <Loader id="loader-root" />;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<PrimaryRoutes isLoggedIn={isLoggedIn} loading={uiState === 'loading'} />
|
||||
<PrimaryRoutes isLoggedIn={isLoggedIn} />
|
||||
<SecondaryRoutes isLoggedIn={isLoggedIn} />
|
||||
{uiState === 'default' && (
|
||||
<Routes>
|
||||
<Route path="/:instance?/s/:id" element={<StatusRoute />} />
|
||||
</Routes>
|
||||
)}
|
||||
<Routes>
|
||||
<Route path="/:instance?/s/:id" element={<StatusRoute />} />
|
||||
</Routes>
|
||||
{isLoggedIn && <ComposeButton />}
|
||||
{isLoggedIn && <Shortcuts />}
|
||||
<Modals />
|
||||
{isLoggedIn && <NotificationService />}
|
||||
<BackgroundService isLoggedIn={isLoggedIn} />
|
||||
{uiState !== 'loading' && <SearchCommand onClose={focusDeck} />}
|
||||
<SearchCommand onClose={focusDeck} />
|
||||
<KeyboardShortcutsHelp />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function PrimaryRoutes({ isLoggedIn, loading }) {
|
||||
function Root({ isLoggedIn }) {
|
||||
if (isLoggedIn) {
|
||||
__BENCHMARK.end('time-to-isLoggedIn');
|
||||
}
|
||||
return isLoggedIn ? <Home /> : <Welcome />;
|
||||
}
|
||||
|
||||
const PrimaryRoutes = memo(({ isLoggedIn }) => {
|
||||
const location = useLocation();
|
||||
const nonRootLocation = useMemo(() => {
|
||||
const { pathname } = location;
|
||||
|
@ -468,23 +491,12 @@ function PrimaryRoutes({ isLoggedIn, loading }) {
|
|||
|
||||
return (
|
||||
<Routes location={nonRootLocation || location}>
|
||||
<Route
|
||||
path="/"
|
||||
element={
|
||||
isLoggedIn ? (
|
||||
<Home />
|
||||
) : loading ? (
|
||||
<Loader id="loader-root" />
|
||||
) : (
|
||||
<Welcome />
|
||||
)
|
||||
}
|
||||
/>
|
||||
<Route path="/" element={<Root isLoggedIn={isLoggedIn} />} />
|
||||
<Route path="/login" element={<Login />} />
|
||||
<Route path="/welcome" element={<Welcome />} />
|
||||
</Routes>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
function getPrevLocation() {
|
||||
return states.prevLocation || null;
|
||||
|
|
|
@ -1488,6 +1488,9 @@ function RelatedActions({
|
|||
</span>
|
||||
</>
|
||||
}
|
||||
itemProps={{
|
||||
className: 'danger',
|
||||
}}
|
||||
menuItemClassName="danger"
|
||||
onClick={() => {
|
||||
// if (!blocking && !confirm(`Block @${username}?`)) {
|
||||
|
|
|
@ -721,6 +721,11 @@
|
|||
}
|
||||
|
||||
.custom-emojis-list {
|
||||
.section-container {
|
||||
position: relative;
|
||||
content-visibility: auto;
|
||||
content-intrinsic-size: auto 88px;
|
||||
}
|
||||
.section-header {
|
||||
font-size: 80%;
|
||||
text-transform: uppercase;
|
||||
|
@ -730,6 +735,10 @@
|
|||
top: 0;
|
||||
background-color: var(--bg-color);
|
||||
z-index: 1;
|
||||
display: inline-block;
|
||||
padding-inline-end: 8px;
|
||||
pointer-events: none;
|
||||
border-end-end-radius: 8px;
|
||||
}
|
||||
section {
|
||||
display: flex;
|
||||
|
|
|
@ -16,7 +16,7 @@ import {
|
|||
} from 'preact/hooks';
|
||||
import { useHotkeys } from 'react-hotkeys-hook';
|
||||
import stringLength from 'string-length';
|
||||
import { detectAll } from 'tinyld/light';
|
||||
// import { detectAll } from 'tinyld/light';
|
||||
import { uid } from 'uid/single';
|
||||
import { useDebouncedCallback, useThrottledCallback } from 'use-debounce';
|
||||
import { useSnapshot } from 'valtio';
|
||||
|
@ -1185,11 +1185,12 @@ function Compose({
|
|||
<option value="public">
|
||||
<Trans>Public</Trans>
|
||||
</option>
|
||||
{(supports('@pleroma/local-visibility-post') || supports('@akkoma/local-visibility-post')) &&
|
||||
{(supports('@pleroma/local-visibility-post') ||
|
||||
supports('@akkoma/local-visibility-post')) && (
|
||||
<option value="local">
|
||||
<Trans>Local</Trans>
|
||||
</option>
|
||||
}
|
||||
)}
|
||||
<option value="unlisted">
|
||||
<Trans>Unlisted</Trans>
|
||||
</option>
|
||||
|
@ -1260,7 +1261,10 @@ function Compose({
|
|||
onDescriptionChange={(value) => {
|
||||
setMediaAttachments((attachments) => {
|
||||
const newAttachments = [...attachments];
|
||||
newAttachments[i].description = value;
|
||||
newAttachments[i] = {
|
||||
...newAttachments[i],
|
||||
description: value,
|
||||
};
|
||||
return newAttachments;
|
||||
});
|
||||
}}
|
||||
|
@ -1686,7 +1690,8 @@ const getCustomEmojis = pmem(_getCustomEmojis, {
|
|||
maxAge: 30 * 60 * 1000, // 30 minutes
|
||||
});
|
||||
|
||||
const detectLangs = (text) => {
|
||||
const detectLangs = async (text) => {
|
||||
const { detectAll } = await import('tinyld/light');
|
||||
const langs = detectAll(text);
|
||||
if (langs?.length) {
|
||||
// return max 2
|
||||
|
@ -1976,13 +1981,15 @@ const Textarea = forwardRef((props, ref) => {
|
|||
});
|
||||
const text = dom.innerText?.trim();
|
||||
if (!text) return;
|
||||
const langs = detectLangs(text);
|
||||
if (langs?.length) {
|
||||
onTrigger?.({
|
||||
name: 'auto-detect-language',
|
||||
languages: langs,
|
||||
});
|
||||
}
|
||||
(async () => {
|
||||
const langs = await detectLangs(text);
|
||||
if (langs?.length) {
|
||||
onTrigger?.({
|
||||
name: 'auto-detect-language',
|
||||
languages: langs,
|
||||
});
|
||||
}
|
||||
})();
|
||||
}, 2000);
|
||||
|
||||
return (
|
||||
|
@ -3171,7 +3178,7 @@ function CustomEmojisModal({
|
|||
Object.entries(customEmojisCatList).map(
|
||||
([category, emojis]) =>
|
||||
!!emojis?.length && (
|
||||
<>
|
||||
<div class="section-container">
|
||||
<div class="section-header">
|
||||
{{
|
||||
'--recent--': t`Recently used`,
|
||||
|
@ -3182,7 +3189,7 @@ function CustomEmojisModal({
|
|||
emojis={emojis}
|
||||
onSelect={onSelectEmoji}
|
||||
/>
|
||||
</>
|
||||
</div>
|
||||
),
|
||||
)}
|
||||
</div>
|
||||
|
|
|
@ -60,10 +60,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
a {
|
||||
min-width: 240px;
|
||||
flex-grow: 1;
|
||||
max-width: 320px;
|
||||
a.link-block {
|
||||
width: 240px;
|
||||
flex-shrink: 0;
|
||||
/* max-width: 320px; */
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
border-radius: 16px;
|
||||
|
@ -81,7 +81,7 @@
|
|||
background-clip: border-box;
|
||||
background-origin: border-box;
|
||||
min-height: 160px;
|
||||
height: 320px;
|
||||
height: 340px;
|
||||
max-height: 50vh;
|
||||
|
||||
&:not(:active):is(:hover, :focus-visible) {
|
||||
|
@ -113,6 +113,12 @@
|
|||
opacity: 0.5;
|
||||
mix-blend-mode: luminosity;
|
||||
}
|
||||
|
||||
.byline {
|
||||
transition-duration: 0.3s;
|
||||
opacity: 0.75;
|
||||
mix-blend-mode: luminosity;
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
@ -217,10 +223,29 @@
|
|||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
font-size: 90%;
|
||||
|
||||
&.more-lines {
|
||||
-webkit-line-clamp: 3;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
.byline {
|
||||
white-space: nowrap;
|
||||
mask-image: linear-gradient(var(--to-backward), transparent, black 32px);
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -72,7 +72,7 @@ function Modal({ children, onClose, onClick, class: className, minimized }) {
|
|||
<div
|
||||
ref={(node) => {
|
||||
modalRef.current = node;
|
||||
escRef.current = node?.querySelector?.('[tabindex="-1"]') || node;
|
||||
escRef(node?.querySelector?.('[tabindex="-1"]') || node);
|
||||
}}
|
||||
className={className}
|
||||
onClick={(e) => {
|
||||
|
|
|
@ -3,6 +3,7 @@ import { useLingui } from '@lingui/react';
|
|||
import { Fragment } from 'preact';
|
||||
import { memo } from 'preact/compat';
|
||||
|
||||
import { api } from '../utils/api';
|
||||
import shortenNumber from '../utils/shorten-number';
|
||||
import states, { statusKey } from '../utils/states';
|
||||
import { getCurrentAccountID } from '../utils/store-utils';
|
||||
|
@ -302,6 +303,7 @@ function Notification({
|
|||
disableContextMenu,
|
||||
}) {
|
||||
const { _ } = useLingui();
|
||||
const { masto } = api();
|
||||
const {
|
||||
id,
|
||||
status,
|
||||
|
@ -313,9 +315,11 @@ function Notification({
|
|||
_ids,
|
||||
_accounts,
|
||||
_statuses,
|
||||
_groupKeys,
|
||||
// Server-side grouped notification
|
||||
sampleAccounts,
|
||||
notificationsCount,
|
||||
groupKey,
|
||||
} = notification;
|
||||
let { type } = notification;
|
||||
|
||||
|
@ -374,7 +378,7 @@ function Notification({
|
|||
if (typeof text === 'function') {
|
||||
const count =
|
||||
_accounts?.length || sampleAccounts?.length || (account ? 1 : 0);
|
||||
const postsCount = _statuses?.length || 0;
|
||||
const postsCount = _statuses?.length || (status ? 1 : 0);
|
||||
if (type === 'admin.report') {
|
||||
const targetAccount = report?.targetAccount;
|
||||
if (targetAccount) {
|
||||
|
@ -399,7 +403,11 @@ function Notification({
|
|||
emoji?.shortcode ===
|
||||
notification.emoji.replace(/^:/, '').replace(/:$/, ''),
|
||||
); // Emoji object instead of string
|
||||
text = text({ emoji: notification.emoji, emojiURL });
|
||||
text = text({
|
||||
account: <NameText account={account} showAvatar />,
|
||||
emoji: notification.emoji,
|
||||
emojiURL,
|
||||
});
|
||||
} else {
|
||||
text = text({
|
||||
account: account ? (
|
||||
|
@ -439,10 +447,15 @@ function Notification({
|
|||
|
||||
console.debug('RENDER Notification', notification.id);
|
||||
|
||||
const sameCount =
|
||||
notificationsCount > 0 && notificationsCount <= sampleAccounts?.length;
|
||||
const expandAccounts = sameCount ? 'local' : 'remote';
|
||||
|
||||
return (
|
||||
<div
|
||||
class={`notification notification-${type}`}
|
||||
data-notification-id={_ids || id}
|
||||
data-group-key={_groupKeys?.join(' ') || groupKey}
|
||||
tabIndex="0"
|
||||
>
|
||||
<div
|
||||
|
@ -546,15 +559,67 @@ function Notification({
|
|||
</a>{' '}
|
||||
</Fragment>
|
||||
))}
|
||||
<button
|
||||
type="button"
|
||||
class="small plain"
|
||||
onClick={handleOpenGenericAccounts}
|
||||
>
|
||||
{_accounts.length > AVATARS_LIMIT &&
|
||||
`+${_accounts.length - AVATARS_LIMIT}`}
|
||||
<Icon icon="chevron-down" />
|
||||
</button>
|
||||
{type === 'favourite+reblog' && expandAccounts === 'remote' ? (
|
||||
<button
|
||||
type="button"
|
||||
class="small plain"
|
||||
data-group-keys={_groupKeys?.join(' ')}
|
||||
onClick={() => {
|
||||
states.showGenericAccounts = {
|
||||
heading: genericAccountsHeading,
|
||||
fetchAccounts: async () => {
|
||||
const keyAccounts = await Promise.allSettled(
|
||||
_groupKeys.map(async (gKey) => {
|
||||
const iterator = masto.v2.notifications
|
||||
.$select(gKey)
|
||||
.accounts.list();
|
||||
return [gKey, (await iterator.next()).value];
|
||||
}),
|
||||
);
|
||||
const accounts = [];
|
||||
for (const keyAccount of keyAccounts) {
|
||||
const [key, _accounts] = keyAccount.value;
|
||||
const type = /^favourite/.test(key)
|
||||
? 'favourite'
|
||||
: /^reblog/.test(key)
|
||||
? 'reblog'
|
||||
: null;
|
||||
if (!type) continue;
|
||||
for (const account of _accounts) {
|
||||
const theAccount = accounts.find(
|
||||
(a) => a.id === account.id,
|
||||
);
|
||||
if (theAccount) {
|
||||
theAccount._types.push(type);
|
||||
} else {
|
||||
account._types = [type];
|
||||
accounts.push(account);
|
||||
}
|
||||
}
|
||||
}
|
||||
return {
|
||||
done: true,
|
||||
value: accounts,
|
||||
};
|
||||
},
|
||||
showReactions: true,
|
||||
postID: statusKey(actualStatusID, instance),
|
||||
};
|
||||
}}
|
||||
>
|
||||
<Icon icon="chevron-down" />
|
||||
</button>
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
class="small plain"
|
||||
onClick={handleOpenGenericAccounts}
|
||||
>
|
||||
{_accounts.length > AVATARS_LIMIT &&
|
||||
`+${_accounts.length - AVATARS_LIMIT}`}
|
||||
<Icon icon="chevron-down" />
|
||||
</button>
|
||||
)}
|
||||
</p>
|
||||
)}
|
||||
{!_accounts?.length && sampleAccounts?.length > 1 && (
|
||||
|
|
|
@ -14,10 +14,12 @@ function isValidDate(value) {
|
|||
}
|
||||
}
|
||||
|
||||
const resolvedLocale = new Intl.DateTimeFormat().resolvedOptions().locale;
|
||||
const resolvedLocale = mem(
|
||||
() => new Intl.DateTimeFormat().resolvedOptions().locale,
|
||||
);
|
||||
const DTF = mem((locale, opts = {}) => {
|
||||
const regionlessLocale = locale.replace(/-[a-z]+$/i, '');
|
||||
const lang = localeMatch([regionlessLocale], [resolvedLocale], locale);
|
||||
const lang = localeMatch([regionlessLocale], [resolvedLocale()], locale);
|
||||
try {
|
||||
return new Intl.DateTimeFormat(lang, opts);
|
||||
} catch (e) {}
|
||||
|
|
|
@ -1990,6 +1990,20 @@ a.card:is(:hover, :focus):visited {
|
|||
.card.large.card-post {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
.card-byline-author {
|
||||
display: inline-flex;
|
||||
gap: 4px;
|
||||
color: var(--text-insignificant-color);
|
||||
padding: 2px 8px;
|
||||
align-items: center;
|
||||
|
||||
.avatar {
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
opacity: 0.8;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
/* POLLS */
|
||||
|
||||
|
|
|
@ -26,7 +26,7 @@ import {
|
|||
} from 'preact/hooks';
|
||||
import punycode from 'punycode/';
|
||||
import { useHotkeys } from 'react-hotkeys-hook';
|
||||
import { detectAll } from 'tinyld/light';
|
||||
// import { detectAll } from 'tinyld/light';
|
||||
import { useLongPress } from 'use-long-press';
|
||||
import { useSnapshot } from 'valtio';
|
||||
|
||||
|
@ -51,7 +51,6 @@ import htmlContentLength from '../utils/html-content-length';
|
|||
import isRTL from '../utils/is-rtl';
|
||||
import isMastodonLinkMaybe from '../utils/isMastodonLinkMaybe';
|
||||
import localeMatch from '../utils/locale-match';
|
||||
import mem from '../utils/mem';
|
||||
import niceDateTime from '../utils/nice-date-time';
|
||||
import openCompose from '../utils/open-compose';
|
||||
import pmem from '../utils/pmem';
|
||||
|
@ -168,7 +167,8 @@ const SIZE_CLASS = {
|
|||
l: 'large',
|
||||
};
|
||||
|
||||
const detectLang = mem((text) => {
|
||||
const detectLang = pmem(async (text) => {
|
||||
const { detectAll } = await import('tinyld/light');
|
||||
text = text?.trim();
|
||||
|
||||
// Ref: https://github.com/komodojp/tinyld/blob/develop/docs/benchmark.md
|
||||
|
@ -304,8 +304,8 @@ function Status({
|
|||
if (!content) return;
|
||||
if (_language) return;
|
||||
let timer;
|
||||
timer = setTimeout(() => {
|
||||
let detected = detectLang(
|
||||
timer = setTimeout(async () => {
|
||||
let detected = await detectLang(
|
||||
getHTMLText(content, {
|
||||
preProcess: (dom) => {
|
||||
// Remove anything that can skew the language detection
|
||||
|
@ -1519,11 +1519,11 @@ function Status({
|
|||
node?.closest?.(
|
||||
'.timeline-item, .timeline-item-alt, .status-link, .status-focus',
|
||||
) || node;
|
||||
rRef.current = nodeRef;
|
||||
fRef.current = nodeRef;
|
||||
dRef.current = nodeRef;
|
||||
bRef.current = nodeRef;
|
||||
xRef.current = nodeRef;
|
||||
rRef(nodeRef);
|
||||
fRef(nodeRef);
|
||||
dRef(nodeRef);
|
||||
bRef(nodeRef);
|
||||
xRef(nodeRef);
|
||||
}}
|
||||
tabindex="-1"
|
||||
class={`status ${
|
||||
|
@ -2152,6 +2152,9 @@ function Status({
|
|||
selfReferential={
|
||||
card?.url === status.url || card?.url === status.uri
|
||||
}
|
||||
selfAuthor={card?.authors?.some(
|
||||
(a) => a.account?.url === accountURL,
|
||||
)}
|
||||
instance={currentInstance}
|
||||
/>
|
||||
)}
|
||||
|
@ -2564,7 +2567,27 @@ function isCardPost(domain) {
|
|||
return ['x.com', 'twitter.com', 'threads.net', 'bsky.app'].includes(domain);
|
||||
}
|
||||
|
||||
function Card({ card, selfReferential, instance }) {
|
||||
function Byline({ authors, hidden, children }) {
|
||||
if (hidden) return children;
|
||||
if (!authors?.[0]?.account?.id) return children;
|
||||
const author = authors[0].account;
|
||||
|
||||
return (
|
||||
<div class="card-byline">
|
||||
{children}
|
||||
<div class="card-byline-author">
|
||||
<Icon icon="link" size="s" />{' '}
|
||||
<small>
|
||||
<Trans comment="More from [Author]">
|
||||
More from <NameText account={author} showAvatar />
|
||||
</Trans>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function Card({ card, selfReferential, selfAuthor, instance }) {
|
||||
const snapStates = useSnapshot(states);
|
||||
const {
|
||||
blurhash,
|
||||
|
@ -2584,6 +2607,7 @@ function Card({ card, selfReferential, instance }) {
|
|||
embedUrl,
|
||||
language,
|
||||
publishedAt,
|
||||
authors,
|
||||
} = card;
|
||||
|
||||
/* type
|
||||
|
@ -2677,60 +2701,65 @@ function Card({ card, selfReferential, instance }) {
|
|||
const isPost = isCardPost(domain);
|
||||
|
||||
return (
|
||||
<a
|
||||
href={cardStatusURL || url}
|
||||
target={cardStatusURL ? null : '_blank'}
|
||||
rel="nofollow noopener noreferrer"
|
||||
class={`card link ${isPost ? 'card-post' : ''} ${
|
||||
blurhashImage ? '' : size
|
||||
}`}
|
||||
style={{
|
||||
'--average-color':
|
||||
rgbAverageColor && `rgb(${rgbAverageColor.join(',')})`,
|
||||
}}
|
||||
onClick={handleClick}
|
||||
>
|
||||
<div class="card-image">
|
||||
<img
|
||||
src={image || blurhashImage}
|
||||
width={width}
|
||||
height={height}
|
||||
loading="lazy"
|
||||
alt={imageDescription || ''}
|
||||
onError={(e) => {
|
||||
try {
|
||||
e.target.style.display = 'none';
|
||||
} catch (e) {}
|
||||
}}
|
||||
style={{
|
||||
'--anim-duration':
|
||||
width &&
|
||||
height &&
|
||||
`${Math.min(Math.max(Math.max(width, height) / 100, 5), 120)}s`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div class="meta-container" lang={language}>
|
||||
<p class="meta domain">
|
||||
<span class="domain">{domain}</span>{' '}
|
||||
{!!publishedAt && <>· </>}
|
||||
{!!publishedAt && (
|
||||
<>
|
||||
<RelativeTime datetime={publishedAt} format="micro" />
|
||||
</>
|
||||
)}
|
||||
</p>
|
||||
<p class="title" dir="auto" title={title}>
|
||||
{title}
|
||||
</p>
|
||||
<p class="meta" dir="auto" title={description}>
|
||||
{description ||
|
||||
(!!publishedAt && (
|
||||
<RelativeTime datetime={publishedAt} format="micro" />
|
||||
))}
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
<Byline hidden={!!selfAuthor} authors={authors}>
|
||||
<a
|
||||
href={cardStatusURL || url}
|
||||
target={cardStatusURL ? null : '_blank'}
|
||||
rel="nofollow noopener noreferrer"
|
||||
class={`card link ${isPost ? 'card-post' : ''} ${
|
||||
blurhashImage ? '' : size
|
||||
}`}
|
||||
style={{
|
||||
'--average-color':
|
||||
rgbAverageColor && `rgb(${rgbAverageColor.join(',')})`,
|
||||
}}
|
||||
onClick={handleClick}
|
||||
>
|
||||
<div class="card-image">
|
||||
<img
|
||||
src={image || blurhashImage}
|
||||
width={width}
|
||||
height={height}
|
||||
loading="lazy"
|
||||
alt={imageDescription || ''}
|
||||
onError={(e) => {
|
||||
try {
|
||||
e.target.style.display = 'none';
|
||||
} catch (e) {}
|
||||
}}
|
||||
style={{
|
||||
'--anim-duration':
|
||||
width &&
|
||||
height &&
|
||||
`${Math.min(
|
||||
Math.max(Math.max(width, height) / 100, 5),
|
||||
120,
|
||||
)}s`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div class="meta-container" lang={language}>
|
||||
<p class="meta domain">
|
||||
<span class="domain">{domain}</span>{' '}
|
||||
{!!publishedAt && <>· </>}
|
||||
{!!publishedAt && (
|
||||
<>
|
||||
<RelativeTime datetime={publishedAt} format="micro" />
|
||||
</>
|
||||
)}
|
||||
</p>
|
||||
<p class="title" dir="auto" title={title}>
|
||||
{title}
|
||||
</p>
|
||||
<p class="meta" dir="auto" title={description}>
|
||||
{description ||
|
||||
(!!publishedAt && (
|
||||
<RelativeTime datetime={publishedAt} format="micro" />
|
||||
))}
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
</Byline>
|
||||
);
|
||||
} else if (type === 'photo') {
|
||||
return (
|
||||
|
@ -3514,7 +3543,7 @@ function FilteredStatus({
|
|||
<span class="status-filtered-info">
|
||||
<span class="status-filtered-info-1">
|
||||
{isReblog ? (
|
||||
<Trans>
|
||||
<Trans comment="[Name] [Visibility icon] boosted">
|
||||
<NameText account={status.account} instance={instance} />{' '}
|
||||
<Icon
|
||||
icon={visibilityIconsMap[visibility]}
|
||||
|
|
|
@ -19,6 +19,7 @@ export default function SubMenu2(props) {
|
|||
menuRef.current?.openMenu?.();
|
||||
}
|
||||
},
|
||||
...props.itemProps,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
|
|
|
@ -390,10 +390,10 @@ function Timeline({
|
|||
}`}
|
||||
ref={(node) => {
|
||||
scrollableRef.current = node;
|
||||
jRef.current = node;
|
||||
kRef.current = node;
|
||||
oRef.current = node;
|
||||
dotRef.current = node;
|
||||
jRef(node);
|
||||
kRef(node);
|
||||
oRef(node);
|
||||
dotRef(node);
|
||||
}}
|
||||
tabIndex="-1"
|
||||
onClick={(e) => {
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
"code": "cs-CZ",
|
||||
"nativeName": "čeština",
|
||||
"name": "Czech",
|
||||
"completion": 79
|
||||
"completion": 80
|
||||
},
|
||||
{
|
||||
"code": "de-DE",
|
||||
|
@ -27,7 +27,7 @@
|
|||
"code": "eo-UY",
|
||||
"nativeName": "Esperanto",
|
||||
"name": "Esperanto",
|
||||
"completion": 61
|
||||
"completion": 100
|
||||
},
|
||||
{
|
||||
"code": "es-ES",
|
||||
|
@ -75,13 +75,13 @@
|
|||
"code": "it-IT",
|
||||
"nativeName": "italiano",
|
||||
"name": "Italian",
|
||||
"completion": 95
|
||||
"completion": 100
|
||||
},
|
||||
{
|
||||
"code": "ja-JP",
|
||||
"nativeName": "日本語",
|
||||
"name": "Japanese",
|
||||
"completion": 31
|
||||
"completion": 52
|
||||
},
|
||||
{
|
||||
"code": "kab",
|
||||
|
@ -99,19 +99,25 @@
|
|||
"code": "lt-LT",
|
||||
"nativeName": "lietuvių",
|
||||
"name": "Lithuanian",
|
||||
"completion": 43
|
||||
"completion": 80
|
||||
},
|
||||
{
|
||||
"code": "nb-NO",
|
||||
"nativeName": "norsk bokmål",
|
||||
"name": "Norwegian Bokmål",
|
||||
"completion": 4
|
||||
},
|
||||
{
|
||||
"code": "nl-NL",
|
||||
"nativeName": "Nederlands",
|
||||
"name": "Dutch",
|
||||
"completion": 84
|
||||
"completion": 83
|
||||
},
|
||||
{
|
||||
"code": "pl-PL",
|
||||
"nativeName": "polski",
|
||||
"name": "Polish",
|
||||
"completion": 2
|
||||
"completion": 6
|
||||
},
|
||||
{
|
||||
"code": "pt-BR",
|
||||
|
|
720
src/locales/ar-SA.po
generated
720
src/locales/ar-SA.po
generated
File diff suppressed because it is too large
Load diff
713
src/locales/ca-ES.po
generated
713
src/locales/ca-ES.po
generated
File diff suppressed because it is too large
Load diff
756
src/locales/cs-CZ.po
generated
756
src/locales/cs-CZ.po
generated
File diff suppressed because it is too large
Load diff
720
src/locales/de-DE.po
generated
720
src/locales/de-DE.po
generated
File diff suppressed because it is too large
Load diff
1435
src/locales/eo-UY.po
generated
1435
src/locales/eo-UY.po
generated
File diff suppressed because it is too large
Load diff
811
src/locales/es-ES.po
generated
811
src/locales/es-ES.po
generated
File diff suppressed because it is too large
Load diff
724
src/locales/eu-ES.po
generated
724
src/locales/eu-ES.po
generated
File diff suppressed because it is too large
Load diff
407
src/locales/fa-IR.po
generated
407
src/locales/fa-IR.po
generated
File diff suppressed because it is too large
Load diff
724
src/locales/fi-FI.po
generated
724
src/locales/fi-FI.po
generated
File diff suppressed because it is too large
Load diff
495
src/locales/fr-FR.po
generated
495
src/locales/fr-FR.po
generated
File diff suppressed because it is too large
Load diff
511
src/locales/gl-ES.po
generated
511
src/locales/gl-ES.po
generated
File diff suppressed because it is too large
Load diff
722
src/locales/he-IL.po
generated
722
src/locales/he-IL.po
generated
File diff suppressed because it is too large
Load diff
621
src/locales/it-IT.po
generated
621
src/locales/it-IT.po
generated
File diff suppressed because it is too large
Load diff
1086
src/locales/ja-JP.po
generated
1086
src/locales/ja-JP.po
generated
File diff suppressed because it is too large
Load diff
740
src/locales/kab.po
generated
740
src/locales/kab.po
generated
File diff suppressed because it is too large
Load diff
720
src/locales/ko-KR.po
generated
720
src/locales/ko-KR.po
generated
File diff suppressed because it is too large
Load diff
1378
src/locales/lt-LT.po
generated
1378
src/locales/lt-LT.po
generated
File diff suppressed because it is too large
Load diff
3754
src/locales/nb-NO.po
generated
Normal file
3754
src/locales/nb-NO.po
generated
Normal file
File diff suppressed because it is too large
Load diff
393
src/locales/nl-NL.po
generated
393
src/locales/nl-NL.po
generated
File diff suppressed because it is too large
Load diff
722
src/locales/oc-FR.po
generated
722
src/locales/oc-FR.po
generated
File diff suppressed because it is too large
Load diff
804
src/locales/pl-PL.po
generated
804
src/locales/pl-PL.po
generated
File diff suppressed because it is too large
Load diff
529
src/locales/pt-BR.po
generated
529
src/locales/pt-BR.po
generated
File diff suppressed because it is too large
Load diff
631
src/locales/pt-PT.po
generated
631
src/locales/pt-PT.po
generated
File diff suppressed because it is too large
Load diff
517
src/locales/ru-RU.po
generated
517
src/locales/ru-RU.po
generated
File diff suppressed because it is too large
Load diff
722
src/locales/th-TH.po
generated
722
src/locales/th-TH.po
generated
File diff suppressed because it is too large
Load diff
722
src/locales/uk-UA.po
generated
722
src/locales/uk-UA.po
generated
File diff suppressed because it is too large
Load diff
501
src/locales/zh-CN.po
generated
501
src/locales/zh-CN.po
generated
File diff suppressed because it is too large
Load diff
722
src/locales/zh-TW.po
generated
722
src/locales/zh-TW.po
generated
File diff suppressed because it is too large
Load diff
32
src/main.jsx
32
src/main.jsx
|
@ -48,6 +48,38 @@ setTimeout(() => {
|
|||
} catch (e) {}
|
||||
}, 5000);
|
||||
|
||||
// Service worker cache cleanup
|
||||
if ('serviceWorker' in navigator && typeof caches !== 'undefined') {
|
||||
const MAX_SW_CACHE_SIZE = 50;
|
||||
const IGNORE_CACHE_KEYS = ['icons'];
|
||||
let clearRanOnce = false;
|
||||
const FAST_INTERVAL = 10_000; // 10 seconds
|
||||
const SLOW_INTERVAL = 60 * 60 * 1000; // 1 hour
|
||||
async function clearCaches() {
|
||||
if (window.__IDLE__) {
|
||||
try {
|
||||
const keys = await caches.keys();
|
||||
for (const key of keys) {
|
||||
if (IGNORE_CACHE_KEYS.includes(key)) continue;
|
||||
const cache = await caches.open(key);
|
||||
const _keys = await cache.keys();
|
||||
if (_keys.length > MAX_SW_CACHE_SIZE) {
|
||||
console.warn('Cleaning cache', key, _keys.length);
|
||||
const deleteKeys = _keys.slice(MAX_SW_CACHE_SIZE);
|
||||
for (const deleteKey of deleteKeys) {
|
||||
await cache.delete(deleteKey);
|
||||
}
|
||||
}
|
||||
}
|
||||
clearRanOnce = true;
|
||||
} catch (e) {} // Silent fail
|
||||
}
|
||||
// Once cleared, clear again at slower interval
|
||||
setTimeout(clearCaches, clearRanOnce ? SLOW_INTERVAL : FAST_INTERVAL);
|
||||
}
|
||||
setTimeout(clearCaches, FAST_INTERVAL);
|
||||
}
|
||||
|
||||
window.__CLOAK__ = () => {
|
||||
document.body.classList.toggle('cloak');
|
||||
};
|
||||
|
|
|
@ -666,6 +666,7 @@
|
|||
black calc(100% - 1em),
|
||||
transparent 100%
|
||||
);
|
||||
padding-top: 0.1em;
|
||||
|
||||
@media (min-width: 40em) {
|
||||
--width: 25vw;
|
||||
|
@ -697,7 +698,7 @@
|
|||
|
||||
&:is(.catchup-group-account, .catchup-selected-author):is(
|
||||
.catchup-filter-original,
|
||||
.catchup-filter-reply
|
||||
.catchup-filter-replies
|
||||
)
|
||||
> li {
|
||||
margin-bottom: 0;
|
||||
|
|
|
@ -842,10 +842,10 @@ function Catchup() {
|
|||
<div
|
||||
ref={(node) => {
|
||||
scrollableRef.current = node;
|
||||
jRef.current = node;
|
||||
kRef.current = node;
|
||||
hlRef.current = node;
|
||||
escRef.current = node;
|
||||
jRef(node);
|
||||
kRef(node);
|
||||
hlRef(node);
|
||||
escRef(node);
|
||||
}}
|
||||
id="catchup-page"
|
||||
class="deck-container"
|
||||
|
@ -1193,6 +1193,7 @@ function Catchup() {
|
|||
href={url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="link-block"
|
||||
style={
|
||||
accentColor
|
||||
? {
|
||||
|
|
|
@ -22,6 +22,7 @@ function Following({ title, path, id, ...props }) {
|
|||
const snapStates = useSnapshot(states);
|
||||
const homeIterator = useRef();
|
||||
const latestItem = useRef();
|
||||
__BENCHMARK.end('time-to-following');
|
||||
|
||||
console.debug('RENDER Following', title, id);
|
||||
const supportsPixelfed = supports('@pixelfed/home-include-reblogs');
|
||||
|
@ -66,7 +67,6 @@ function Following({ title, path, id, ...props }) {
|
|||
});
|
||||
}
|
||||
__BENCHMARK.end('fetch-home-first');
|
||||
__BENCHMARK.end('time-to-home');
|
||||
return {
|
||||
...results,
|
||||
value,
|
||||
|
|
|
@ -27,6 +27,7 @@ import {
|
|||
function Home() {
|
||||
const { _ } = useLingui();
|
||||
const snapStates = useSnapshot(states);
|
||||
__BENCHMARK.end('time-to-home');
|
||||
useEffect(() => {
|
||||
(async () => {
|
||||
const keys = await db.drafts.keys();
|
||||
|
|
|
@ -1,3 +1,39 @@
|
|||
#notifications-page {
|
||||
.notification {
|
||||
content-visibility: auto;
|
||||
}
|
||||
|
||||
.timeline-header {
|
||||
position: sticky;
|
||||
--mask-padding: 8px;
|
||||
top: calc(48px - var(--mask-padding));
|
||||
transition: top 0.5s ease-in-out;
|
||||
header[hidden] ~ & {
|
||||
top: calc(-1 * var(--mask-padding));
|
||||
}
|
||||
z-index: 1;
|
||||
background-color: inherit;
|
||||
mask-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent,
|
||||
#000 var(--mask-padding) calc(100% - var(--mask-padding) * 2),
|
||||
transparent
|
||||
);
|
||||
|
||||
@media (min-width: 40em) {
|
||||
background-color: var(--bg-faded-color);
|
||||
}
|
||||
padding-block: 16px;
|
||||
margin: 0;
|
||||
opacity: 1;
|
||||
|
||||
small {
|
||||
font-weight: normal;
|
||||
font-size: var(--text-size);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notification {
|
||||
display: flex;
|
||||
padding: 16px !important;
|
||||
|
@ -10,8 +46,8 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.notification.notification-mention {
|
||||
margin-top: 16px;
|
||||
.notification-type.notification-mention {
|
||||
padding-top: 16px;
|
||||
}
|
||||
.only-mentions .notification:not(.notification-mention),
|
||||
.only-mentions .timeline-empty {
|
||||
|
@ -139,7 +175,6 @@
|
|||
max-height: 320px;
|
||||
filter: none;
|
||||
background-color: var(--bg-color);
|
||||
margin-top: calc(-16px - 1px);
|
||||
border-color: var(--reply-to-color);
|
||||
box-shadow: 0 0 0 3px var(--reply-to-faded-color);
|
||||
}
|
||||
|
@ -203,6 +238,8 @@
|
|||
}
|
||||
|
||||
#mentions-option {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
float: right;
|
||||
&:dir(rtl) {
|
||||
float: left;
|
||||
|
|
|
@ -4,7 +4,13 @@ import { msg, Plural, t, Trans } from '@lingui/macro';
|
|||
import { useLingui } from '@lingui/react';
|
||||
import { Fragment } from 'preact';
|
||||
import { memo } from 'preact/compat';
|
||||
import { useCallback, useEffect, useRef, useState } from 'preact/hooks';
|
||||
import {
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from 'preact/hooks';
|
||||
import { useHotkeys } from 'react-hotkeys-hook';
|
||||
import { InView } from 'react-intersection-observer';
|
||||
import { useSearchParams } from 'react-router-dom';
|
||||
|
@ -63,7 +69,7 @@ export function mastoFetchNotifications(opts = {}) {
|
|||
memSupportsGroupedNotifications()
|
||||
) {
|
||||
// https://github.com/mastodon/mastodon/pull/29889
|
||||
return masto.v2_alpha.notifications.list({
|
||||
return masto.v2.notifications.list({
|
||||
limit: NOTIFICATIONS_GROUPED_LIMIT,
|
||||
...opts,
|
||||
});
|
||||
|
@ -471,15 +477,24 @@ function Notifications({ columnMode }) {
|
|||
}
|
||||
});
|
||||
|
||||
const today = new Date();
|
||||
const todaySubHeading = useMemo(() => {
|
||||
return niceDateTime(today, {
|
||||
forceOpts: {
|
||||
weekday: 'long',
|
||||
},
|
||||
});
|
||||
}, [today]);
|
||||
|
||||
return (
|
||||
<div
|
||||
id="notifications-page"
|
||||
class="deck-container"
|
||||
ref={(node) => {
|
||||
scrollableRef.current = node;
|
||||
jRef.current = node;
|
||||
kRef.current = node;
|
||||
oRef.current = node;
|
||||
jRef(node);
|
||||
kRef(node);
|
||||
oRef(node);
|
||||
}}
|
||||
tabIndex="-1"
|
||||
>
|
||||
|
@ -726,7 +741,8 @@ function Notifications({ columnMode }) {
|
|||
</label>
|
||||
</div>
|
||||
<h2 class="timeline-header">
|
||||
<Trans>Today</Trans>
|
||||
<Trans>Today</Trans>{' '}
|
||||
<small class="insignificant bidi-isolate">{todaySubHeading}</small>
|
||||
</h2>
|
||||
{showTodayEmpty && (
|
||||
<p class="ui-state insignificant">
|
||||
|
@ -757,9 +773,21 @@ function Notifications({ columnMode }) {
|
|||
: niceDateTime(currentDay, {
|
||||
hideTime: true,
|
||||
});
|
||||
const subHeading = niceDateTime(currentDay, {
|
||||
forceOpts: {
|
||||
weekday: 'long',
|
||||
},
|
||||
});
|
||||
return (
|
||||
<Fragment key={notification._ids || notification.id}>
|
||||
{differentDay && <h2 class="timeline-header">{heading}</h2>}
|
||||
{differentDay && (
|
||||
<h2 class="timeline-header">
|
||||
<span>{heading}</span>{' '}
|
||||
<small class="insignificant bidi-isolate">
|
||||
{subHeading}
|
||||
</small>
|
||||
</h2>
|
||||
)}
|
||||
<Notification
|
||||
instance={instance}
|
||||
notification={notification}
|
||||
|
|
|
@ -34,6 +34,7 @@
|
|||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
border-bottom: var(--hairline-width) solid var(--outline-color);
|
||||
gap: 4px;
|
||||
|
||||
&.block {
|
||||
flex-direction: column;
|
||||
|
|
|
@ -841,6 +841,42 @@ function Settings({ onClose }) {
|
|||
)}
|
||||
</ul>
|
||||
)}
|
||||
<p>Service Worker Cache</p>
|
||||
<button
|
||||
type="button"
|
||||
class="plain2 small"
|
||||
onClick={async () => alert(await getCachesKeys())}
|
||||
>
|
||||
Show keys count
|
||||
</button>{' '}
|
||||
<button
|
||||
type="button"
|
||||
class="plain2 small"
|
||||
onClick={() => {
|
||||
const key = prompt('Enter cache key');
|
||||
if (!key) return;
|
||||
try {
|
||||
clearCacheKey(key);
|
||||
} catch (e) {
|
||||
alert(e);
|
||||
}
|
||||
}}
|
||||
>
|
||||
Clear cache key
|
||||
</button>{' '}
|
||||
<button
|
||||
type="button"
|
||||
class="plain2 small"
|
||||
onClick={() => {
|
||||
try {
|
||||
clearCaches();
|
||||
} catch (e) {
|
||||
alert(e);
|
||||
}
|
||||
}}
|
||||
>
|
||||
Clear all caches
|
||||
</button>
|
||||
</details>
|
||||
)}
|
||||
</main>
|
||||
|
@ -848,6 +884,28 @@ function Settings({ onClose }) {
|
|||
);
|
||||
}
|
||||
|
||||
async function getCachesKeys() {
|
||||
const keys = await caches.keys();
|
||||
const total = {};
|
||||
for (const key of keys) {
|
||||
const cache = await caches.open(key);
|
||||
const k = await cache.keys();
|
||||
total[key] = k.length;
|
||||
}
|
||||
return total;
|
||||
}
|
||||
|
||||
function clearCacheKey(key) {
|
||||
return caches.delete(key);
|
||||
}
|
||||
|
||||
async function clearCaches() {
|
||||
const keys = await caches.keys();
|
||||
for (const key of keys) {
|
||||
await caches.delete(key);
|
||||
}
|
||||
}
|
||||
|
||||
function PushNotificationsSection({ onClose }) {
|
||||
if (!isPushSupported()) return null;
|
||||
|
||||
|
|
|
@ -13,6 +13,7 @@ import Icon from '../components/icon';
|
|||
import Link from '../components/link';
|
||||
import Loader from '../components/loader';
|
||||
import Menu2 from '../components/menu2';
|
||||
import NameText from '../components/name-text';
|
||||
import RelativeTime from '../components/relative-time';
|
||||
import Timeline from '../components/timeline';
|
||||
import { api } from '../utils/api';
|
||||
|
@ -229,6 +230,7 @@ function Trending({ columnMode, ...props }) {
|
|||
</header>
|
||||
{links.map((link) => {
|
||||
const {
|
||||
authors,
|
||||
authorName,
|
||||
authorUrl,
|
||||
blurhash,
|
||||
|
@ -244,6 +246,11 @@ function Trending({ columnMode, ...props }) {
|
|||
url,
|
||||
width,
|
||||
} = link;
|
||||
const author = authors?.[0]?.account?.id
|
||||
? authors[0].account
|
||||
: null;
|
||||
const isShortTitle = title.length < 30;
|
||||
const hasAuthor = !!(authorName || author);
|
||||
const domain = punycode.toUnicode(
|
||||
URL.parse(url)
|
||||
.hostname.replace(/^www\./, '')
|
||||
|
@ -267,13 +274,13 @@ function Trending({ columnMode, ...props }) {
|
|||
href={url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class={
|
||||
class={`link-block ${
|
||||
hasCurrentLink
|
||||
? currentLink === url
|
||||
? 'active'
|
||||
: 'inactive'
|
||||
: ''
|
||||
}
|
||||
}`}
|
||||
style={
|
||||
accentColor
|
||||
? {
|
||||
|
@ -322,7 +329,9 @@ function Trending({ columnMode, ...props }) {
|
|||
</header>
|
||||
{!!description && (
|
||||
<p
|
||||
class="description"
|
||||
class={`description ${
|
||||
hasAuthor && !isShortTitle ? '' : 'more-lines'
|
||||
}`}
|
||||
lang={language}
|
||||
dir="auto"
|
||||
title={description}
|
||||
|
@ -330,6 +339,31 @@ function Trending({ columnMode, ...props }) {
|
|||
{description}
|
||||
</p>
|
||||
)}
|
||||
{hasAuthor && (
|
||||
<>
|
||||
<hr />
|
||||
<p class="byline">
|
||||
<small>
|
||||
<Trans comment="By [Author]">
|
||||
By{' '}
|
||||
{author ? (
|
||||
<NameText account={author} showAvatar />
|
||||
) : authorUrl ? (
|
||||
<a
|
||||
href={authorUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
{authorName}
|
||||
</a>
|
||||
) : (
|
||||
authorName
|
||||
)}
|
||||
</Trans>
|
||||
</small>
|
||||
</p>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</article>
|
||||
</a>
|
||||
|
|
|
@ -57,6 +57,11 @@ export function initClient({ instance, accessToken }) {
|
|||
return client;
|
||||
}
|
||||
|
||||
export function hasInstance(instance) {
|
||||
const instances = store.local.getJSON('instances') || {};
|
||||
return !!instances[instance];
|
||||
}
|
||||
|
||||
// Get the instance information
|
||||
// The config is needed for composing
|
||||
export async function initInstance(client, instance) {
|
||||
|
@ -64,6 +69,7 @@ export async function initInstance(client, instance) {
|
|||
const { masto, accessToken } = client;
|
||||
// Request v2, fallback to v1 if fail
|
||||
let info;
|
||||
__BENCHMARK.start('fetch-instance');
|
||||
try {
|
||||
info = await masto.v2.instance.fetch();
|
||||
} catch (e) {}
|
||||
|
@ -72,6 +78,7 @@ export async function initInstance(client, instance) {
|
|||
info = await masto.v1.instance.fetch();
|
||||
} catch (e) {}
|
||||
}
|
||||
__BENCHMARK.end('fetch-instance');
|
||||
if (!info) return;
|
||||
console.log(info);
|
||||
const {
|
||||
|
@ -111,6 +118,7 @@ export async function initInstance(client, instance) {
|
|||
// masto.ws = streamClient;
|
||||
console.log('🎏 Streaming API client:', client);
|
||||
}
|
||||
__BENCHMARK.end('init-instance');
|
||||
}
|
||||
|
||||
// Get the account information and store it
|
||||
|
@ -129,11 +137,17 @@ export async function initAccount(client, instance, accessToken, vapidKey) {
|
|||
});
|
||||
}
|
||||
|
||||
export function hasPreferences() {
|
||||
return !!store.account.get('preferences');
|
||||
}
|
||||
|
||||
// Get preferences
|
||||
export async function initPreferences(client) {
|
||||
try {
|
||||
const { masto } = client;
|
||||
__BENCHMARK.start('fetch-preferences');
|
||||
const preferences = await masto.v1.preferences.fetch();
|
||||
__BENCHMARK.end('fetch-preferences');
|
||||
store.account.set('preferences', preferences);
|
||||
} catch (e) {
|
||||
// silently fail
|
||||
|
|
|
@ -1,16 +1,17 @@
|
|||
import translationTargetLanguages from '../data/lingva-target-languages';
|
||||
|
||||
import localeMatch from './locale-match';
|
||||
import mem from './mem';
|
||||
import states from './states';
|
||||
|
||||
const locales = [
|
||||
const locales = mem(() => [
|
||||
new Intl.DateTimeFormat().resolvedOptions().locale,
|
||||
...navigator.languages,
|
||||
];
|
||||
]);
|
||||
|
||||
const localeTargetLanguages = () =>
|
||||
localeMatch(
|
||||
locales,
|
||||
locales(),
|
||||
translationTargetLanguages.map((l) => l.code.replace('_', '-')), // The underscore will fail Intl.Locale inside `match`
|
||||
'en',
|
||||
);
|
||||
|
|
|
@ -68,66 +68,105 @@ export function groupNotifications2(groupNotifications) {
|
|||
};
|
||||
});
|
||||
|
||||
// DISABLED FOR NOW.
|
||||
// Merge favourited and reblogged of same status into a single notification
|
||||
// - new type: "favourite+reblog"
|
||||
// - sum numbers for `notificationsCount` and `sampleAccounts`
|
||||
// const mappedNotifications = {};
|
||||
// const newNewGroupNotifications = [];
|
||||
// for (let i = 0; i < newGroupNotifications.length; i++) {
|
||||
// const gn = newGroupNotifications[i];
|
||||
// const { type, status, createdAt, notificationsCount, sampleAccounts } = gn;
|
||||
// const date = createdAt ? new Date(createdAt).toLocaleDateString() : '';
|
||||
// let virtualType = type;
|
||||
// if (type === 'favourite' || type === 'reblog') {
|
||||
// virtualType = 'favourite+reblog';
|
||||
// }
|
||||
// const key = `${status?.id}-${virtualType}-${date}`;
|
||||
// const mappedNotification = mappedNotifications[key];
|
||||
// if (mappedNotification) {
|
||||
// const accountIDs = mappedNotification.sampleAccounts.map((a) => a.id);
|
||||
// sampleAccounts.forEach((a) => {
|
||||
// if (!accountIDs.includes(a.id)) {
|
||||
// mappedNotification.sampleAccounts.push(a);
|
||||
// }
|
||||
// });
|
||||
// mappedNotification.notificationsCount = Math.max(
|
||||
// mappedNotification.notificationsCount,
|
||||
// notificationsCount,
|
||||
// mappedNotification.sampleAccounts.length,
|
||||
// );
|
||||
// } else {
|
||||
// mappedNotifications[key] = {
|
||||
// ...gn,
|
||||
// type: virtualType,
|
||||
// };
|
||||
// newNewGroupNotifications.push(mappedNotifications[key]);
|
||||
// }
|
||||
// }
|
||||
const notificationsMap = {};
|
||||
const newGroupNotifications1 = [];
|
||||
for (let i = 0; i < newGroupNotifications.length; i++) {
|
||||
const gn = newGroupNotifications[i];
|
||||
const {
|
||||
type,
|
||||
status,
|
||||
createdAt,
|
||||
notificationsCount,
|
||||
sampleAccounts,
|
||||
groupKey,
|
||||
} = gn;
|
||||
const date = createdAt ? new Date(createdAt).toLocaleDateString() : '';
|
||||
let virtualType = type;
|
||||
const sameCount =
|
||||
notificationsCount > 0 && notificationsCount === sampleAccounts?.length;
|
||||
// if (sameCount && (type === 'favourite' || type === 'reblog')) {
|
||||
if (type === 'favourite' || type === 'reblog') {
|
||||
virtualType = 'favourite+reblog';
|
||||
}
|
||||
// const key = `${status?.id}-${virtualType}-${date}-${sameCount ? 1 : 0}`;
|
||||
const key = `${status?.id}-${virtualType}-${date}`;
|
||||
const mappedNotification = notificationsMap[key];
|
||||
if (mappedNotification) {
|
||||
// Merge sampleAccounts + merge _types
|
||||
sampleAccounts.forEach((a) => {
|
||||
const mappedAccount = mappedNotification.sampleAccounts.find(
|
||||
(ma) => ma.id === a.id,
|
||||
);
|
||||
if (!mappedAccount) {
|
||||
mappedNotification.sampleAccounts.push({
|
||||
...a,
|
||||
_types: [type],
|
||||
});
|
||||
} else {
|
||||
mappedAccount._types.push(type);
|
||||
mappedAccount._types.sort().reverse();
|
||||
}
|
||||
});
|
||||
// mappedNotification.notificationsCount =
|
||||
// mappedNotification.sampleAccounts.length;
|
||||
mappedNotification.notificationsCount = Math.min(
|
||||
mappedNotification.notificationsCount,
|
||||
notificationsCount,
|
||||
);
|
||||
mappedNotification._notificationsCount.push(notificationsCount);
|
||||
mappedNotification._accounts = mappedNotification.sampleAccounts;
|
||||
mappedNotification._groupKeys.push(groupKey);
|
||||
} else {
|
||||
const accounts = sampleAccounts.map((a) => ({
|
||||
...a,
|
||||
_types: [type],
|
||||
}));
|
||||
notificationsMap[key] = {
|
||||
...gn,
|
||||
sampleAccounts: accounts,
|
||||
type: virtualType,
|
||||
_accounts: accounts,
|
||||
_groupKeys: groupKey ? [groupKey] : [],
|
||||
_notificationsCount: [notificationsCount],
|
||||
};
|
||||
newGroupNotifications1.push(notificationsMap[key]);
|
||||
}
|
||||
}
|
||||
|
||||
// 2nd pass.
|
||||
// - Group 1 account favourte/reblog multiple posts
|
||||
// - _statuses: [status, status, ...]
|
||||
// - _statuses: [status, status, ...]
|
||||
const notificationsMap2 = {};
|
||||
const newGroupNotifications2 = [];
|
||||
for (let i = 0; i < newGroupNotifications.length; i++) {
|
||||
const gn = newGroupNotifications[i];
|
||||
const { type, account, _accounts, sampleAccounts, createdAt } = gn;
|
||||
for (let i = 0; i < newGroupNotifications1.length; i++) {
|
||||
const gn = newGroupNotifications1[i];
|
||||
const { type, account, _accounts, sampleAccounts, createdAt, groupKey } =
|
||||
gn;
|
||||
const date = createdAt ? new Date(createdAt).toLocaleDateString() : '';
|
||||
const hasOneAccount =
|
||||
sampleAccounts?.length === 1 || _accounts?.length === 1;
|
||||
if ((type === 'favourite' || type === 'reblog') && hasOneAccount) {
|
||||
if (
|
||||
(type === 'favourite' ||
|
||||
type === 'reblog' ||
|
||||
type === 'favourite+reblog') &&
|
||||
hasOneAccount
|
||||
) {
|
||||
const key = `${account?.id}-${type}-${date}`;
|
||||
const mappedNotification = notificationsMap2[key];
|
||||
if (mappedNotification) {
|
||||
mappedNotification._statuses.push(gn.status);
|
||||
mappedNotification._ids += `-${gn.id}`;
|
||||
mappedNotification._groupKeys.push(groupKey);
|
||||
} else {
|
||||
let n = (notificationsMap2[key] = {
|
||||
...gn,
|
||||
type,
|
||||
_ids: gn.id,
|
||||
_statuses: [gn.status],
|
||||
_groupKeys: groupKey ? [groupKey] : [],
|
||||
});
|
||||
newGroupNotifications2.push(n);
|
||||
}
|
||||
|
@ -136,6 +175,8 @@ export function groupNotifications2(groupNotifications) {
|
|||
}
|
||||
}
|
||||
|
||||
console.log('newGroupNotifications2', newGroupNotifications2);
|
||||
|
||||
return newGroupNotifications2;
|
||||
}
|
||||
|
||||
|
|
|
@ -3,14 +3,16 @@ import { i18n } from '@lingui/core';
|
|||
import localeMatch from './locale-match';
|
||||
import mem from './mem';
|
||||
|
||||
const defaultLocale = new Intl.DateTimeFormat().resolvedOptions().locale;
|
||||
const defaultLocale = mem(
|
||||
() => new Intl.DateTimeFormat().resolvedOptions().locale,
|
||||
);
|
||||
|
||||
const _DateTimeFormat = (opts) => {
|
||||
const { locale, dateYear, hideTime, formatOpts } = opts || {};
|
||||
const { locale, dateYear, hideTime, formatOpts, forceOpts } = opts || {};
|
||||
const regionlessLocale = locale.replace(/-[a-z]+$/i, '');
|
||||
const loc = localeMatch([regionlessLocale], [defaultLocale], locale);
|
||||
const currentYear = new Date().getFullYear();
|
||||
const options = {
|
||||
const options = forceOpts || {
|
||||
// Show year if not current year
|
||||
year: dateYear === currentYear ? undefined : 'numeric',
|
||||
month: 'short',
|
||||
|
|
Loading…
Reference in a new issue