mirror of
https://github.com/immich-app/immich.git
synced 2026-05-18 03:10:24 +03:00
Merge branch 'main' into feat/search-filter-album/web
This commit is contained in:
Generated
+49
-211
@@ -64,14 +64,14 @@
|
||||
"eslint-config-prettier": "^10.0.0",
|
||||
"eslint-p": "^0.23.0",
|
||||
"eslint-plugin-svelte": "^3.9.0",
|
||||
"eslint-plugin-unicorn": "^57.0.0",
|
||||
"eslint-plugin-unicorn": "^59.0.0",
|
||||
"factory.ts": "^1.4.1",
|
||||
"globals": "^16.0.0",
|
||||
"prettier": "^3.4.2",
|
||||
"prettier-plugin-organize-imports": "^4.0.0",
|
||||
"prettier-plugin-sort-json": "^4.1.1",
|
||||
"prettier-plugin-svelte": "^3.3.3",
|
||||
"rollup-plugin-visualizer": "^5.14.0",
|
||||
"rollup-plugin-visualizer": "^6.0.0",
|
||||
"svelte": "^5.25.3",
|
||||
"svelte-check": "^4.1.5",
|
||||
"tailwindcss": "^4.1.7",
|
||||
@@ -2915,13 +2915,6 @@
|
||||
"undici-types": "~6.21.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/normalize-package-data": {
|
||||
"version": "2.4.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/normalize-package-data/-/normalize-package-data-2.4.4.tgz",
|
||||
"integrity": "sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/pbf": {
|
||||
"version": "3.0.5",
|
||||
"resolved": "https://registry.npmjs.org/@types/pbf/-/pbf-3.0.5.tgz",
|
||||
@@ -3663,9 +3656,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/builtin-modules": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-4.0.0.tgz",
|
||||
"integrity": "sha512-p1n8zyCkt1BVrKNFymOHjcDSAl7oq/gUvfgULv2EblgpPVQlQr9yHnWjg9IJ2MhfwPqiYqMMrr01OY7yQoK2yA==",
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-5.0.0.tgz",
|
||||
"integrity": "sha512-bkXY9WsVpY7CvMhKSR6pZilZu9Ln5WDrKVBUXf2S443etkmEO4V58heTecXcUIsNsi4Rx8JUO4NfX1IcQl4deg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
@@ -4759,50 +4752,65 @@
|
||||
}
|
||||
},
|
||||
"node_modules/eslint-plugin-unicorn": {
|
||||
"version": "57.0.0",
|
||||
"resolved": "https://registry.npmjs.org/eslint-plugin-unicorn/-/eslint-plugin-unicorn-57.0.0.tgz",
|
||||
"integrity": "sha512-zUYYa6zfNdTeG9BISWDlcLmz16c+2Ck2o5ZDHh0UzXJz3DEP7xjmlVDTzbyV0W+XksgZ0q37WEWzN2D2Ze+g9Q==",
|
||||
"version": "59.0.1",
|
||||
"resolved": "https://registry.npmjs.org/eslint-plugin-unicorn/-/eslint-plugin-unicorn-59.0.1.tgz",
|
||||
"integrity": "sha512-EtNXYuWPUmkgSU2E7Ttn57LbRREQesIP1BiLn7OZLKodopKfDXfBUkC/0j6mpw2JExwf43Uf3qLSvrSvppgy8Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-validator-identifier": "^7.25.9",
|
||||
"@eslint-community/eslint-utils": "^4.4.1",
|
||||
"ci-info": "^4.1.0",
|
||||
"@eslint-community/eslint-utils": "^4.5.1",
|
||||
"@eslint/plugin-kit": "^0.2.7",
|
||||
"ci-info": "^4.2.0",
|
||||
"clean-regexp": "^1.0.0",
|
||||
"core-js-compat": "^3.40.0",
|
||||
"core-js-compat": "^3.41.0",
|
||||
"esquery": "^1.6.0",
|
||||
"globals": "^15.15.0",
|
||||
"find-up-simple": "^1.0.1",
|
||||
"globals": "^16.0.0",
|
||||
"indent-string": "^5.0.0",
|
||||
"is-builtin-module": "^4.0.0",
|
||||
"is-builtin-module": "^5.0.0",
|
||||
"jsesc": "^3.1.0",
|
||||
"pluralize": "^8.0.0",
|
||||
"read-package-up": "^11.0.0",
|
||||
"regexp-tree": "^0.1.27",
|
||||
"regjsparser": "^0.12.0",
|
||||
"semver": "^7.7.1",
|
||||
"strip-indent": "^4.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18.18"
|
||||
"node": "^18.20.0 || ^20.10.0 || >=21.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sindresorhus/eslint-plugin-unicorn?sponsor=1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"eslint": ">=9.20.0"
|
||||
"eslint": ">=9.22.0"
|
||||
}
|
||||
},
|
||||
"node_modules/eslint-plugin-unicorn/node_modules/globals": {
|
||||
"version": "15.15.0",
|
||||
"resolved": "https://registry.npmjs.org/globals/-/globals-15.15.0.tgz",
|
||||
"integrity": "sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==",
|
||||
"node_modules/eslint-plugin-unicorn/node_modules/@eslint/core": {
|
||||
"version": "0.13.0",
|
||||
"resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.13.0.tgz",
|
||||
"integrity": "sha512-yfkgDw1KR66rkT5A8ci4irzDysN7FRpq3ttJolR88OqQikAWqwA8j5VZyas+vjyBNFIJ7MfybJ9plMILI2UrCw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"@types/json-schema": "^7.0.15"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
"engines": {
|
||||
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/eslint-plugin-unicorn/node_modules/@eslint/plugin-kit": {
|
||||
"version": "0.2.8",
|
||||
"resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.2.8.tgz",
|
||||
"integrity": "sha512-ZAoA40rNMPwSm+AeHpCq8STiNAwzWLJuP8Xv4CHIc9wv/PSuExjMrmjfYNj682vW0OOiZ1HKxzvjQr9XZIisQA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"@eslint/core": "^0.13.0",
|
||||
"levn": "^0.4.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/eslint-scope": {
|
||||
@@ -5589,19 +5597,6 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/hosted-git-info": {
|
||||
"version": "7.0.2",
|
||||
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-7.0.2.tgz",
|
||||
"integrity": "sha512-puUZAUKT5m8Zzvs72XWy3HtvVbTWljRE66cP60bxJzAqf2DgICo7lYTY2IHUmLnNpjYvw5bvmoHvPc0QO2a62w==",
|
||||
"dev": true,
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"lru-cache": "^10.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^16.14.0 || >=18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/html-encoding-sniffer": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz",
|
||||
@@ -5744,19 +5739,6 @@
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/index-to-position": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/index-to-position/-/index-to-position-1.1.0.tgz",
|
||||
"integrity": "sha512-XPdx9Dq4t9Qk1mTMbWONJqU7boCoumEH7fRET37HX5+khDUl3J2W6PdALxhILYlIYx2amlwYcRPp28p0tSiojg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/inflight": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
|
||||
@@ -5820,13 +5802,13 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/is-builtin-module": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-4.0.0.tgz",
|
||||
"integrity": "sha512-rWP3AMAalQSesXO8gleROyL2iKU73SX5Er66losQn9rWOWL4Gef0a/xOEOVqjWGMuR2vHG3FJ8UUmT700O8oFg==",
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-5.0.0.tgz",
|
||||
"integrity": "sha512-f4RqJKBUe5rQkJ2eJEJBXSticB3hGbN9j0yxxMQFqIW89Jp9WYFtzfTcRlstDKVUTRzSOTLKRfO9vIztenwtxA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"builtin-modules": "^4.0.0"
|
||||
"builtin-modules": "^5.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18.20"
|
||||
@@ -7063,21 +7045,6 @@
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/normalize-package-data": {
|
||||
"version": "6.0.2",
|
||||
"resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-6.0.2.tgz",
|
||||
"integrity": "sha512-V6gygoYb/5EmNI+MEGrWkC+e6+Rr7mTmfHrxDbLzxQogBkgzo76rkok0Am6thgSF7Mv2nLOajAJj5vDJZEFn7g==",
|
||||
"dev": true,
|
||||
"license": "BSD-2-Clause",
|
||||
"dependencies": {
|
||||
"hosted-git-info": "^7.0.0",
|
||||
"semver": "^7.3.5",
|
||||
"validate-npm-package-license": "^3.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^16.14.0 || >=18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/normalize-range": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
|
||||
@@ -7226,24 +7193,6 @@
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/parse-json": {
|
||||
"version": "8.3.0",
|
||||
"resolved": "https://registry.npmjs.org/parse-json/-/parse-json-8.3.0.tgz",
|
||||
"integrity": "sha512-ybiGyvspI+fAoRQbIPRddCcSTV9/LsJbf0e/S85VLowVGzRmokfneg2kwVW/KU5rOXrPSbF1qAKPMgNTqqROQQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.26.2",
|
||||
"index-to-position": "^1.1.0",
|
||||
"type-fest": "^4.39.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/parse5": {
|
||||
"version": "7.2.1",
|
||||
"resolved": "https://registry.npmjs.org/parse5/-/parse5-7.2.1.tgz",
|
||||
@@ -7715,44 +7664,6 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/read-package-up": {
|
||||
"version": "11.0.0",
|
||||
"resolved": "https://registry.npmjs.org/read-package-up/-/read-package-up-11.0.0.tgz",
|
||||
"integrity": "sha512-MbgfoNPANMdb4oRBNg5eqLbB2t2r+o5Ua1pNt8BqGp4I0FJZhuVSOj3PaBPni4azWuSzEdNn2evevzVmEk1ohQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"find-up-simple": "^1.0.0",
|
||||
"read-pkg": "^9.0.0",
|
||||
"type-fest": "^4.6.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/read-pkg": {
|
||||
"version": "9.0.1",
|
||||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-9.0.1.tgz",
|
||||
"integrity": "sha512-9viLL4/n1BJUCT1NXVTdS1jtm80yDEgR5T4yCelII49Mbj0v1rZdKqj7zCiYdbB0CuCgdrvHcNogAKTFPBocFA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/normalize-package-data": "^2.4.3",
|
||||
"normalize-package-data": "^6.0.0",
|
||||
"parse-json": "^8.0.0",
|
||||
"type-fest": "^4.6.0",
|
||||
"unicorn-magic": "^0.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/readable-stream": {
|
||||
"version": "3.6.2",
|
||||
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
|
||||
@@ -7972,13 +7883,13 @@
|
||||
}
|
||||
},
|
||||
"node_modules/rollup-plugin-visualizer": {
|
||||
"version": "5.14.0",
|
||||
"resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-5.14.0.tgz",
|
||||
"integrity": "sha512-VlDXneTDaKsHIw8yzJAFWtrzguoJ/LnQ+lMpoVfYJ3jJF4Ihe5oYLAqLklIK/35lgUY+1yEzCkHyZ1j4A5w5fA==",
|
||||
"version": "6.0.3",
|
||||
"resolved": "https://registry.npmjs.org/rollup-plugin-visualizer/-/rollup-plugin-visualizer-6.0.3.tgz",
|
||||
"integrity": "sha512-ZU41GwrkDcCpVoffviuM9Clwjy5fcUxlz0oMoTXTYsK+tcIFzbdacnrr2n8TXcHxbGKKXtOdjxM2HUS4HjkwIw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"open": "^8.4.0",
|
||||
"open": "^8.0.0",
|
||||
"picomatch": "^4.0.2",
|
||||
"source-map": "^0.7.4",
|
||||
"yargs": "^17.5.1"
|
||||
@@ -7990,7 +7901,7 @@
|
||||
"node": ">=18"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"rolldown": "1.x",
|
||||
"rolldown": "1.x || ^1.0.0-beta",
|
||||
"rollup": "2.x || 3.x || 4.x"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
@@ -8449,42 +8360,6 @@
|
||||
"source-map": "^0.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/spdx-correct": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.2.0.tgz",
|
||||
"integrity": "sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"spdx-expression-parse": "^3.0.0",
|
||||
"spdx-license-ids": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/spdx-exceptions": {
|
||||
"version": "2.5.0",
|
||||
"resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
|
||||
"integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
|
||||
"dev": true,
|
||||
"license": "CC-BY-3.0"
|
||||
},
|
||||
"node_modules/spdx-expression-parse": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.1.tgz",
|
||||
"integrity": "sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"spdx-exceptions": "^2.1.0",
|
||||
"spdx-license-ids": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/spdx-license-ids": {
|
||||
"version": "3.0.21",
|
||||
"resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.21.tgz",
|
||||
"integrity": "sha512-Bvg/8F5XephndSK3JffaRqdT+gyhfqIPwDHpX80tJrF8QQRYMo8sNMeaZ2Dp5+jhwKnUmIOyFFQfHRkjJm5nXg==",
|
||||
"dev": true,
|
||||
"license": "CC0-1.0"
|
||||
},
|
||||
"node_modules/stackback": {
|
||||
"version": "0.0.2",
|
||||
"resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",
|
||||
@@ -9183,19 +9058,6 @@
|
||||
"node": ">= 0.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/type-fest": {
|
||||
"version": "4.40.0",
|
||||
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.40.0.tgz",
|
||||
"integrity": "sha512-ABHZ2/tS2JkvH1PEjxFDTUWC8dB5OsIGZP4IFLhR293GqT5Y5qB1WwL2kMPYhQW9DVgVD8Hd7I8gjwPIf5GFkw==",
|
||||
"dev": true,
|
||||
"license": "(MIT OR CC0-1.0)",
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/typescript": {
|
||||
"version": "5.8.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
|
||||
@@ -9253,19 +9115,6 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/unicorn-magic": {
|
||||
"version": "0.1.0",
|
||||
"resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz",
|
||||
"integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/universalify": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
|
||||
@@ -9335,17 +9184,6 @@
|
||||
"devOptional": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/validate-npm-package-license": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
|
||||
"integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"spdx-correct": "^3.0.0",
|
||||
"spdx-expression-parse": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "6.3.5",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
|
||||
|
||||
+2
-2
@@ -81,14 +81,14 @@
|
||||
"eslint-config-prettier": "^10.0.0",
|
||||
"eslint-p": "^0.23.0",
|
||||
"eslint-plugin-svelte": "^3.9.0",
|
||||
"eslint-plugin-unicorn": "^57.0.0",
|
||||
"eslint-plugin-unicorn": "^59.0.0",
|
||||
"factory.ts": "^1.4.1",
|
||||
"globals": "^16.0.0",
|
||||
"prettier": "^3.4.2",
|
||||
"prettier-plugin-organize-imports": "^4.0.0",
|
||||
"prettier-plugin-sort-json": "^4.1.1",
|
||||
"prettier-plugin-svelte": "^3.3.3",
|
||||
"rollup-plugin-visualizer": "^5.14.0",
|
||||
"rollup-plugin-visualizer": "^6.0.0",
|
||||
"svelte": "^5.25.3",
|
||||
"svelte-check": "^4.1.5",
|
||||
"tailwindcss": "^4.1.7",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import type { AssetAction } from '$lib/constants';
|
||||
import type { TimelineAsset } from '$lib/managers/timeline-manager/types';
|
||||
import type { AlbumResponseDto } from '@immich/sdk';
|
||||
import type { AlbumResponseDto, StackResponseDto } from '@immich/sdk';
|
||||
|
||||
type ActionMap = {
|
||||
[AssetAction.ARCHIVE]: { asset: TimelineAsset };
|
||||
@@ -14,6 +14,7 @@ type ActionMap = {
|
||||
[AssetAction.ADD_TO_ALBUM]: { asset: TimelineAsset; album: AlbumResponseDto };
|
||||
[AssetAction.UNSTACK]: { assets: TimelineAsset[] };
|
||||
[AssetAction.KEEP_THIS_DELETE_OTHERS]: { asset: TimelineAsset };
|
||||
[AssetAction.SET_STACK_PRIMARY_ASSET]: { stack: StackResponseDto };
|
||||
[AssetAction.SET_VISIBILITY_LOCKED]: { asset: TimelineAsset };
|
||||
[AssetAction.SET_VISIBILITY_TIMELINE]: { asset: TimelineAsset };
|
||||
};
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
<script lang="ts">
|
||||
import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
|
||||
|
||||
import { AssetAction } from '$lib/constants';
|
||||
import { updateStack, type AssetResponseDto, type StackResponseDto } from '@immich/sdk';
|
||||
import { mdiImageCheckOutline } from '@mdi/js';
|
||||
import { t } from 'svelte-i18n';
|
||||
import type { OnAction } from './action';
|
||||
|
||||
interface Props {
|
||||
stack: StackResponseDto;
|
||||
asset: AssetResponseDto;
|
||||
onAction: OnAction;
|
||||
}
|
||||
|
||||
let { stack, asset, onAction }: Props = $props();
|
||||
|
||||
const handleSetPrimaryAsset = async () => {
|
||||
const updatedStack = await updateStack({ id: stack.id, stackUpdateDto: { primaryAssetId: asset.id } });
|
||||
if (updatedStack) {
|
||||
onAction({ type: AssetAction.SET_STACK_PRIMARY_ASSET, stack: updatedStack });
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<MenuOption icon={mdiImageCheckOutline} onClick={handleSetPrimaryAsset} text={$t('set_stack_primary_asset')} />
|
||||
@@ -13,6 +13,7 @@
|
||||
import SetAlbumCoverAction from '$lib/components/asset-viewer/actions/set-album-cover-action.svelte';
|
||||
import SetFeaturedPhotoAction from '$lib/components/asset-viewer/actions/set-person-featured-action.svelte';
|
||||
import SetProfilePictureAction from '$lib/components/asset-viewer/actions/set-profile-picture-action.svelte';
|
||||
import SetStackPrimaryAsset from '$lib/components/asset-viewer/actions/set-stack-primary-asset.svelte';
|
||||
import SetVisibilityAction from '$lib/components/asset-viewer/actions/set-visibility-action.svelte';
|
||||
import ShareAction from '$lib/components/asset-viewer/actions/share-action.svelte';
|
||||
import ShowDetailAction from '$lib/components/asset-viewer/actions/show-detail-action.svelte';
|
||||
@@ -192,6 +193,9 @@
|
||||
{#if stack}
|
||||
<UnstackAction {stack} {onAction} />
|
||||
<KeepThisDeleteOthersAction {stack} {asset} {onAction} />
|
||||
{#if stack?.primaryAssetId !== asset.id}
|
||||
<SetStackPrimaryAsset {stack} {asset} {onAction} />
|
||||
{/if}
|
||||
{/if}
|
||||
{#if album}
|
||||
<SetAlbumCoverAction {asset} {album} />
|
||||
|
||||
@@ -338,7 +338,10 @@
|
||||
await handleGetAllAlbums();
|
||||
break;
|
||||
}
|
||||
|
||||
case AssetAction.SET_STACK_PRIMARY_ASSET: {
|
||||
stack = action.stack;
|
||||
break;
|
||||
}
|
||||
case AssetAction.KEEP_THIS_DELETE_OTHERS:
|
||||
case AssetAction.UNSTACK: {
|
||||
closeViewer();
|
||||
|
||||
@@ -67,7 +67,7 @@
|
||||
<button
|
||||
type="button"
|
||||
class="rounded-full bg-gray-100 dark:bg-gray-800 text-gray-600 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-700 hover:text-gray-700 dark:hover:text-gray-200 flex place-items-center place-content-center gap-1 px-2 py-1"
|
||||
title="Add tag"
|
||||
title={$t('add_tag')}
|
||||
onclick={handleAddTag}
|
||||
>
|
||||
<span class="text-sm px-1 flex place-items-center place-content-center gap-1"
|
||||
|
||||
@@ -19,6 +19,7 @@
|
||||
import { handleError } from '$lib/utils/handle-error';
|
||||
import { getMetadataSearchQuery } from '$lib/utils/metadata-search';
|
||||
import { fromISODateTime, fromISODateTimeUTC } from '$lib/utils/timeline-util';
|
||||
import { getParentPath } from '$lib/utils/tree-utils';
|
||||
import {
|
||||
AssetMediaSize,
|
||||
getAssetInfo,
|
||||
@@ -137,7 +138,7 @@
|
||||
const getAssetFolderHref = (asset: AssetResponseDto) => {
|
||||
const folderUrl = new URL(AppRoute.FOLDERS, globalThis.location.href);
|
||||
// Remove the last part of the path to get the parent path
|
||||
const assetParentPath = asset.originalPath.split('/').slice(0, -1).join('/');
|
||||
const assetParentPath = getParentPath(asset.originalPath);
|
||||
folderUrl.searchParams.set(QueryParameter.PATH, assetParentPath);
|
||||
return folderUrl.href;
|
||||
};
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
import { deleteAssets, updateStackedAssetInTimeline, updateUnstackedAssetInTimeline } from '$lib/utils/actions';
|
||||
import { archiveAssets, cancelMultiselect, selectAllAssets, stackAssets } from '$lib/utils/asset-utils';
|
||||
import { navigate } from '$lib/utils/navigation';
|
||||
import { type ScrubberListener, type TimelinePlainYearMonth } from '$lib/utils/timeline-util';
|
||||
import { toTimelineAsset, type ScrubberListener, type TimelinePlainYearMonth } from '$lib/utils/timeline-util';
|
||||
import { AssetVisibility, getAssetInfo, type AlbumResponseDto, type PersonResponseDto } from '@immich/sdk';
|
||||
import { DateTime } from 'luxon';
|
||||
import { onMount, type Snippet } from 'svelte';
|
||||
@@ -511,6 +511,20 @@
|
||||
updateUnstackedAssetInTimeline(assetStore, action.assets);
|
||||
break;
|
||||
}
|
||||
case AssetAction.SET_STACK_PRIMARY_ASSET: {
|
||||
//Have to unstack then restack assets in timeline in order for the currently removed new primary asset to be made visible.
|
||||
updateUnstackedAssetInTimeline(
|
||||
assetStore,
|
||||
action.stack.assets.map((asset) => toTimelineAsset(asset)),
|
||||
);
|
||||
updateStackedAssetInTimeline(assetStore, {
|
||||
stack: action.stack,
|
||||
toDeleteIds: action.stack.assets
|
||||
.filter((asset) => asset.id !== action.stack.primaryAssetId)
|
||||
.map((asset) => asset.id),
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script lang="ts">
|
||||
import ConfirmModal from '$lib/modals/ConfirmModal.svelte';
|
||||
import { DateTime } from 'luxon';
|
||||
import { DateTime, Duration } from 'luxon';
|
||||
import { t } from 'svelte-i18n';
|
||||
import DateInput from '../elements/date-input.svelte';
|
||||
import Combobox, { type ComboBoxOption } from './combobox.svelte';
|
||||
@@ -65,6 +65,9 @@
|
||||
const userTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
|
||||
|
||||
let selectedDate = $state(initialDate.toFormat("yyyy-MM-dd'T'HH:mm"));
|
||||
// Use a fixed modern date to calculate stable timezone offsets for the list
|
||||
// This ensures that the offsets shown in the combobox are always current,
|
||||
// regardless of the historical date selected by the user.
|
||||
let timezones: ZoneOption[] = knownTimezones
|
||||
.map((zone) => zoneOptionForDate(zone, selectedDate))
|
||||
.filter((zone) => zone.valid)
|
||||
@@ -73,12 +76,13 @@
|
||||
let selectedOption: ZoneOption | undefined = $state(getPreferredTimeZone(initialDate, userTimeZone, timezones));
|
||||
|
||||
function zoneOptionForDate(zone: string, date: string) {
|
||||
const dateAtZone: DateTime = DateTime.fromISO(date, { zone });
|
||||
const zoneOffsetAtDate = dateAtZone.toFormat('ZZ');
|
||||
const valid = dateAtZone.isValid && date.toString() === dateAtZone.toFormat("yyyy-MM-dd'T'HH:mm");
|
||||
const { offsetMinutes, offsetFormat: zoneOffsetAtDate } = getModernOffsetForZoneAndDate(zone, date);
|
||||
// For validity, we still need to check if the exact date/time exists in the *original* timezone (for gaps/overlaps).
|
||||
const dateForValidity = DateTime.fromISO(date, { zone });
|
||||
const valid = dateForValidity.isValid && date === dateForValidity.toFormat("yyyy-MM-dd'T'HH:mm");
|
||||
return {
|
||||
value: zone,
|
||||
offsetMinutes: dateAtZone.offset,
|
||||
offsetMinutes,
|
||||
label: zone + ' (' + zoneOffsetAtDate + ')' + (valid ? '' : ' [invalid date!]'),
|
||||
valid,
|
||||
};
|
||||
@@ -118,6 +122,24 @@
|
||||
return previousSelection ?? fromInitialTimeZone ?? sameAsUserTimeZone ?? firstWithSameOffset ?? utcFallback;
|
||||
}
|
||||
|
||||
function getModernOffsetForZoneAndDate(
|
||||
zone: string,
|
||||
dateString: string,
|
||||
): { offsetMinutes: number; offsetFormat: string } {
|
||||
const dt = DateTime.fromISO(dateString, { zone });
|
||||
|
||||
// we determine the *modern* offset for this zone based on its current rules.
|
||||
// To do this, we "move" the date to the current year, keeping the local time components.
|
||||
// This allows Luxon to apply current-year DST rules.
|
||||
const modernYearDt = dt.set({ year: DateTime.now().year });
|
||||
|
||||
// Calculate the offset at that modern year's date.
|
||||
const modernOffsetMinutes = modernYearDt.setZone(zone, { keepLocalTime: true }).offset;
|
||||
const modernOffsetFormat = modernYearDt.setZone(zone, { keepLocalTime: true }).toFormat('ZZ');
|
||||
|
||||
return { offsetMinutes: modernOffsetMinutes, offsetFormat: modernOffsetFormat };
|
||||
}
|
||||
|
||||
function sortTwoZones(zoneA: ZoneOption, zoneB: ZoneOption) {
|
||||
let offsetDifference = zoneA.offsetMinutes - zoneB.offsetMinutes;
|
||||
if (offsetDifference != 0) {
|
||||
@@ -127,9 +149,20 @@
|
||||
}
|
||||
|
||||
const handleConfirm = () => {
|
||||
const value = date.toISO();
|
||||
if (value) {
|
||||
onConfirm(value);
|
||||
if (date.isValid && selectedOption) {
|
||||
// Get the local date/time components from the selected string using neutral timezone
|
||||
const dtComponents = DateTime.fromISO(selectedDate, { zone: 'utc' });
|
||||
|
||||
// Determine the modern, DST-aware offset for the selected IANA zone
|
||||
const { offsetMinutes } = getModernOffsetForZoneAndDate(selectedOption.value, selectedDate);
|
||||
|
||||
// Construct the final ISO string with a fixed-offset zone.
|
||||
const fixedOffsetZone = `UTC${offsetMinutes >= 0 ? '+' : ''}${Duration.fromObject({ minutes: offsetMinutes }).toFormat('hh:mm')}`;
|
||||
|
||||
// Create a DateTime object in this fixed-offset zone, preserving the local time.
|
||||
const finalDateTime = DateTime.fromObject(dtComponents.toObject(), { zone: fixedOffsetZone });
|
||||
|
||||
onConfirm(finalDateTime.toISO({ includeOffset: true })!);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -48,6 +48,7 @@
|
||||
defaultFirstOption?: boolean;
|
||||
hasThumbnails?: boolean;
|
||||
onSelect?: (option: ComboBoxOption | undefined) => void;
|
||||
forceFocus?: boolean;
|
||||
}
|
||||
|
||||
let {
|
||||
@@ -60,6 +61,7 @@
|
||||
defaultFirstOption = false,
|
||||
hasThumbnails = false,
|
||||
onSelect = () => {},
|
||||
forceFocus = false,
|
||||
}: Props = $props();
|
||||
|
||||
/**
|
||||
@@ -118,6 +120,12 @@
|
||||
};
|
||||
});
|
||||
|
||||
const forceFocusInput = (el: HTMLDivElement) => {
|
||||
if (forceFocus) {
|
||||
el.focus();
|
||||
}
|
||||
};
|
||||
|
||||
const activate = () => {
|
||||
isActive = true;
|
||||
searchQuery = '';
|
||||
@@ -287,6 +295,7 @@
|
||||
role="combobox"
|
||||
type="text"
|
||||
value={searchQuery}
|
||||
use:forceFocusInput
|
||||
use:shortcuts={[
|
||||
{
|
||||
shortcut: { key: 'ArrowUp' },
|
||||
|
||||
@@ -501,7 +501,7 @@
|
||||
/>
|
||||
{#if showAssetName && !isTimelineAsset(currentAsset)}
|
||||
<div
|
||||
class="absolute text-center p-1 text-xs font-mono font-semibold w-full bottom-0 bg-linear-to-t bg-slate-50/75 overflow-clip text-ellipsis whitespace-pre-wrap"
|
||||
class="absolute text-center p-1 text-xs font-mono font-semibold w-full bottom-0 bg-linear-to-t bg-slate-50/75 dark:bg-slate-800/75 overflow-clip text-ellipsis whitespace-pre-wrap"
|
||||
>
|
||||
{currentAsset.originalFileName}
|
||||
</div>
|
||||
|
||||
@@ -1,23 +1,27 @@
|
||||
<script lang="ts">
|
||||
import Icon from '$lib/components/elements/icon.svelte';
|
||||
import { TreeNode } from '$lib/utils/tree-utils';
|
||||
import { IconButton } from '@immich/ui';
|
||||
import { mdiArrowUpLeft, mdiChevronRight } from '@mdi/js';
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
interface Props {
|
||||
pathSegments?: string[];
|
||||
node: TreeNode;
|
||||
getLink: (path: string) => string;
|
||||
title: string;
|
||||
icon: string;
|
||||
}
|
||||
|
||||
let { pathSegments = [], getLink, title, icon }: Props = $props();
|
||||
const { node, getLink, title, icon }: Props = $props();
|
||||
|
||||
let isRoot = $derived(pathSegments.length === 0);
|
||||
const rootLink = getLink('');
|
||||
const isRoot = $derived(node.parent === null);
|
||||
const parentLink = $derived(getLink(node.parent ? node.parent.path : ''));
|
||||
const parents = $derived(node.parents);
|
||||
</script>
|
||||
|
||||
<nav class="flex items-center py-2">
|
||||
{#if !isRoot}
|
||||
{#if parentLink}
|
||||
<div>
|
||||
<IconButton
|
||||
shape="round"
|
||||
@@ -25,9 +29,8 @@
|
||||
variant="ghost"
|
||||
icon={mdiArrowUpLeft}
|
||||
aria-label={$t('to_parent')}
|
||||
href={getLink(pathSegments.slice(0, -1).join('/'))}
|
||||
href={parentLink}
|
||||
class="me-2"
|
||||
onclick={() => {}}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -42,31 +45,29 @@
|
||||
color="secondary"
|
||||
variant="ghost"
|
||||
{icon}
|
||||
href={getLink('')}
|
||||
href={rootLink}
|
||||
aria-label={title}
|
||||
size="medium"
|
||||
aria-current={isRoot ? 'page' : undefined}
|
||||
onclick={() => {}}
|
||||
/>
|
||||
</li>
|
||||
{#each pathSegments as segment, index (index)}
|
||||
{@const isLastSegment = index === pathSegments.length - 1}
|
||||
{#each parents as parent (parent)}
|
||||
<li
|
||||
class="flex gap-2 items-center font-mono text-sm text-nowrap text-immich-primary dark:text-immich-dark-primary"
|
||||
>
|
||||
<Icon path={mdiChevronRight} class="text-gray-500 dark:text-gray-300" size={16} ariaHidden />
|
||||
{#if isLastSegment}
|
||||
<p class="cursor-default whitespace-pre-wrap">{segment}</p>
|
||||
{:else}
|
||||
<a
|
||||
class="underline hover:font-semibold whitespace-pre-wrap"
|
||||
href={getLink(pathSegments.slice(0, index + 1).join('/'))}
|
||||
>
|
||||
{segment}
|
||||
</a>
|
||||
{/if}
|
||||
<a class="underline hover:font-semibold whitespace-pre-wrap" href={getLink(parent.path)}>
|
||||
{parent.value}
|
||||
</a>
|
||||
</li>
|
||||
{/each}
|
||||
|
||||
<li
|
||||
class="flex gap-2 items-center font-mono text-sm text-nowrap text-immich-primary dark:text-immich-dark-primary"
|
||||
>
|
||||
<Icon path={mdiChevronRight} class="text-gray-500 dark:text-gray-300" size={16} ariaHidden />
|
||||
<p class="cursor-default whitespace-pre-wrap">{node.value}</p>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -1,29 +1,31 @@
|
||||
<script lang="ts">
|
||||
import Icon from '$lib/components/elements/icon.svelte';
|
||||
import type { TreeNode } from '$lib/utils/tree-utils';
|
||||
|
||||
interface Props {
|
||||
items?: string[];
|
||||
items: TreeNode[];
|
||||
icon: string;
|
||||
onClick: (path: string) => void;
|
||||
}
|
||||
|
||||
let { items = [], icon, onClick }: Props = $props();
|
||||
let { items, icon, onClick }: Props = $props();
|
||||
</script>
|
||||
|
||||
{#if items.length > 0}
|
||||
<div
|
||||
class="w-full grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-6 2xl:grid-cols-8 gap-2 bg-gray-50 dark:bg-immich-dark-gray/50 rounded-2xl border border-gray-100 dark:border-gray-900"
|
||||
>
|
||||
{#each items as item (item)}
|
||||
<!-- eslint-disable-next-line svelte/require-each-key -->
|
||||
{#each items as item}
|
||||
<button
|
||||
class="flex flex-col place-items-center gap-2 py-2 px-4 hover:bg-immich-primary/10 dark:hover:bg-immich-primary/40 rounded-xl"
|
||||
onclick={() => onClick(item)}
|
||||
title={item}
|
||||
onclick={() => onClick(item.value)}
|
||||
title={item.value}
|
||||
type="button"
|
||||
>
|
||||
<Icon path={icon} class="text-immich-primary dark:text-immich-dark-primary" size={64} />
|
||||
<p class="text-sm dark:text-gray-200 text-nowrap text-ellipsis overflow-clip w-full whitespace-pre-wrap">
|
||||
{item}
|
||||
{item.value}
|
||||
</p>
|
||||
</button>
|
||||
{/each}
|
||||
|
||||
@@ -1,28 +1,21 @@
|
||||
<script lang="ts">
|
||||
import Tree from '$lib/components/shared-components/tree/tree.svelte';
|
||||
import { normalizeTreePath, type RecursiveObject } from '$lib/utils/tree-utils';
|
||||
import { type TreeNode } from '$lib/utils/tree-utils';
|
||||
|
||||
interface Props {
|
||||
items: RecursiveObject;
|
||||
parent?: string;
|
||||
active?: string;
|
||||
tree: TreeNode;
|
||||
active: string;
|
||||
icons: { default: string; active: string };
|
||||
getLink: (path: string) => string;
|
||||
getColor?: (path: string) => string | undefined;
|
||||
}
|
||||
|
||||
let { items, parent = '', active = '', icons, getLink, getColor = () => undefined }: Props = $props();
|
||||
let { tree, active, icons, getLink }: Props = $props();
|
||||
</script>
|
||||
|
||||
<ul class="list-none ms-2">
|
||||
<!-- eslint-disable-next-line svelte/require-each-key -->
|
||||
{#each Object.entries(items).sort() as [path, tree]}
|
||||
{@const value = normalizeTreePath(`${parent}/${path}`)}
|
||||
{@const key = value + getColor(value)}
|
||||
{#key key}
|
||||
<li>
|
||||
<Tree {parent} value={path} {tree} {icons} {active} {getLink} {getColor} />
|
||||
</li>
|
||||
{/key}
|
||||
{#each tree.children as node (node.color ? node.path + node.color : node.path)}
|
||||
<li>
|
||||
<Tree {node} {icons} {active} {getLink} />
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
|
||||
@@ -1,25 +1,20 @@
|
||||
<script lang="ts">
|
||||
import Icon from '$lib/components/elements/icon.svelte';
|
||||
import TreeItems from '$lib/components/shared-components/tree/tree-items.svelte';
|
||||
import { normalizeTreePath, type RecursiveObject } from '$lib/utils/tree-utils';
|
||||
import { TreeNode } from '$lib/utils/tree-utils';
|
||||
import { mdiChevronDown, mdiChevronRight } from '@mdi/js';
|
||||
|
||||
interface Props {
|
||||
tree: RecursiveObject;
|
||||
parent: string;
|
||||
value: string;
|
||||
active?: string;
|
||||
node: TreeNode;
|
||||
active: string;
|
||||
icons: { default: string; active: string };
|
||||
getLink: (path: string) => string;
|
||||
getColor: (path: string) => string | undefined;
|
||||
}
|
||||
|
||||
let { tree, parent, value, active = '', icons, getLink, getColor }: Props = $props();
|
||||
let { node, active, icons, getLink }: Props = $props();
|
||||
|
||||
const path = $derived(normalizeTreePath(`${parent}/${value}`));
|
||||
const isActive = $derived(active === path || active.startsWith(`${path}/`));
|
||||
const isTarget = $derived(active === path);
|
||||
const color = $derived(getColor(path));
|
||||
const isTarget = $derived(active === node.path);
|
||||
const isActive = $derived(active === node.path || active.startsWith(node.value === '/' ? '/' : `${node.path}/`));
|
||||
let isOpen = $derived(isActive);
|
||||
|
||||
const onclick = (event: MouseEvent) => {
|
||||
@@ -29,25 +24,27 @@
|
||||
</script>
|
||||
|
||||
<a
|
||||
href={getLink(path)}
|
||||
title={value}
|
||||
href={getLink(node.path)}
|
||||
title={node.value}
|
||||
class={`flex grow place-items-center ps-2 py-1 text-sm rounded-lg hover:bg-slate-200 dark:hover:bg-slate-800 hover:font-semibold ${isTarget ? 'bg-slate-100 dark:bg-slate-700 font-semibold text-immich-primary dark:text-immich-dark-primary' : 'dark:text-gray-200'}`}
|
||||
data-sveltekit-keepfocus
|
||||
>
|
||||
<button type="button" {onclick} class={Object.values(tree).length === 0 ? 'invisible' : ''}>
|
||||
<Icon path={isOpen ? mdiChevronDown : mdiChevronRight} class="text-gray-400" size={20} />
|
||||
</button>
|
||||
<div>
|
||||
{#if node.size > 0}
|
||||
<button type="button" {onclick}>
|
||||
<Icon path={isOpen ? mdiChevronDown : mdiChevronRight} class="text-gray-400" size={20} />
|
||||
</button>
|
||||
{/if}
|
||||
<div class={node.size === 0 ? 'ml-[1.5em] ' : ''}>
|
||||
<Icon
|
||||
path={isActive ? icons.active : icons.default}
|
||||
class={isActive ? 'text-immich-primary dark:text-immich-dark-primary' : 'text-gray-400'}
|
||||
{color}
|
||||
color={node.color}
|
||||
size={20}
|
||||
/>
|
||||
</div>
|
||||
<span class="text-nowrap overflow-hidden text-ellipsis font-mono ps-1 pt-1 whitespace-pre-wrap">{value}</span>
|
||||
<span class="text-nowrap overflow-hidden text-ellipsis font-mono ps-1 pt-1 whitespace-pre-wrap">{node.value}</span>
|
||||
</a>
|
||||
|
||||
{#if isOpen}
|
||||
<TreeItems parent={path} items={tree} {icons} {active} {getLink} {getColor} />
|
||||
<TreeItems tree={node} {icons} {active} {getLink} />
|
||||
{/if}
|
||||
|
||||
@@ -10,6 +10,7 @@ export enum AssetAction {
|
||||
ADD_TO_ALBUM = 'add-to-album',
|
||||
UNSTACK = 'unstack',
|
||||
KEEP_THIS_DELETE_OTHERS = 'keep-this-delete-others',
|
||||
SET_STACK_PRIMARY_ASSET = 'set-stack-primary-asset',
|
||||
SET_VISIBILITY_LOCKED = 'set-visibility-locked',
|
||||
SET_VISIBILITY_TIMELINE = 'set-visibility-timeline',
|
||||
}
|
||||
|
||||
@@ -66,6 +66,7 @@
|
||||
defaultFirstOption
|
||||
options={allTags.map((tag) => ({ id: tag.id, label: tag.value, value: tag.id }))}
|
||||
placeholder={$t('search_tags')}
|
||||
forceFocus
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { eventManager } from '$lib/managers/event-manager.svelte';
|
||||
import { TreeNode } from '$lib/utils/tree-utils';
|
||||
import {
|
||||
getAssetsByOriginalPath,
|
||||
getUniqueOriginalPaths,
|
||||
@@ -13,47 +14,41 @@ type AssetCache = {
|
||||
};
|
||||
|
||||
class FoldersStore {
|
||||
folders = $state.raw<TreeNode | null>(null);
|
||||
private initialized = false;
|
||||
uniquePaths = $state<string[]>([]);
|
||||
assets = $state<AssetCache>({});
|
||||
private assets = $state<AssetCache>({});
|
||||
|
||||
constructor() {
|
||||
eventManager.on('auth.logout', () => this.clearCache());
|
||||
}
|
||||
|
||||
async fetchUniquePaths() {
|
||||
async fetchTree(): Promise<TreeNode> {
|
||||
if (this.initialized) {
|
||||
return;
|
||||
return this.folders!;
|
||||
}
|
||||
this.initialized = true;
|
||||
|
||||
const uniquePaths = await getUniqueOriginalPaths();
|
||||
this.uniquePaths.push(...uniquePaths);
|
||||
this.folders = TreeNode.fromPaths(await getUniqueOriginalPaths());
|
||||
this.folders.collapse();
|
||||
return this.folders;
|
||||
}
|
||||
|
||||
bustAssetCache() {
|
||||
this.assets = {};
|
||||
}
|
||||
|
||||
async refreshAssetsByPath(path: string | null) {
|
||||
if (!path) {
|
||||
return;
|
||||
}
|
||||
this.assets[path] = await getAssetsByOriginalPath({ path });
|
||||
async refreshAssetsByPath(path: string) {
|
||||
return (this.assets[path] = await getAssetsByOriginalPath({ path }));
|
||||
}
|
||||
|
||||
async fetchAssetsByPath(path: string) {
|
||||
if (this.assets[path]) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.assets[path] = await getAssetsByOriginalPath({ path });
|
||||
return (this.assets[path] ??= await getAssetsByOriginalPath({ path }));
|
||||
}
|
||||
|
||||
clearCache() {
|
||||
this.initialized = false;
|
||||
this.uniquePaths = [];
|
||||
this.assets = {};
|
||||
this.folders = null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -23,7 +23,7 @@ export const isAssetViewerRoute = (target?: NavigationTarget | null) =>
|
||||
!!(target?.route.id?.endsWith('/[[assetId=id]]') && 'assetId' in (target?.params || {}));
|
||||
|
||||
export function getAssetInfoFromParam({ assetId, key }: { assetId?: string; key?: string }) {
|
||||
return assetId && getAssetInfo({ id: assetId, key });
|
||||
return assetId ? getAssetInfo({ id: assetId, key }) : undefined;
|
||||
}
|
||||
|
||||
function currentUrlWithoutAsset() {
|
||||
|
||||
+136
-13
@@ -1,21 +1,144 @@
|
||||
export interface RecursiveObject {
|
||||
[key: string]: RecursiveObject;
|
||||
}
|
||||
/* eslint-disable @typescript-eslint/no-this-alias */
|
||||
/* eslint-disable unicorn/no-this-assignment */
|
||||
/* eslint-disable unicorn/prefer-at */
|
||||
import type { TagResponseDto } from '@immich/sdk';
|
||||
|
||||
export const normalizeTreePath = (path: string) => path.replace(/^\//, '').replace(/\/$/, '');
|
||||
export class TreeNode extends Map<string, TreeNode> {
|
||||
value: string;
|
||||
path: string;
|
||||
parent: TreeNode | null;
|
||||
hasAssets: boolean;
|
||||
id: string | undefined;
|
||||
color: string | undefined;
|
||||
private _parents: TreeNode[] | undefined;
|
||||
private _children: TreeNode[] | undefined;
|
||||
|
||||
export function buildTree(paths: string[]) {
|
||||
const root: RecursiveObject = {};
|
||||
private constructor(value: string, path: string, parent: TreeNode | null) {
|
||||
super();
|
||||
this.value = value;
|
||||
this.parent = parent;
|
||||
this.path = path;
|
||||
this.hasAssets = false;
|
||||
}
|
||||
|
||||
for (const path of paths) {
|
||||
const parts = path.split('/');
|
||||
let current = root;
|
||||
static fromPaths(paths: string[]) {
|
||||
const root = new TreeNode('', '', null);
|
||||
for (const path of paths) {
|
||||
const current = root.add(path);
|
||||
current.hasAssets = true;
|
||||
}
|
||||
return root;
|
||||
}
|
||||
|
||||
static fromTags(tags: TagResponseDto[]) {
|
||||
const root = new TreeNode('', '', null);
|
||||
for (const tag of tags) {
|
||||
const current = root.add(tag.value);
|
||||
current.hasAssets = true;
|
||||
current.id = tag.id;
|
||||
current.color = tag.color;
|
||||
}
|
||||
return root;
|
||||
}
|
||||
|
||||
traverse(path: string) {
|
||||
const parts = getPathParts(path);
|
||||
let current: TreeNode = this;
|
||||
let curPart = null;
|
||||
for (const part of parts) {
|
||||
if (!current[part]) {
|
||||
current[part] = {};
|
||||
// segments common to all subtrees can be collapsed together
|
||||
curPart = curPart === null ? part : joinPaths(curPart, part);
|
||||
const next = current.get(curPart);
|
||||
if (next) {
|
||||
current = next;
|
||||
curPart = null;
|
||||
}
|
||||
current = current[part];
|
||||
}
|
||||
return current;
|
||||
}
|
||||
|
||||
collapse() {
|
||||
if (this.size === 1 && !this.hasAssets && this.parent !== null) {
|
||||
const child = this.values().next().value!;
|
||||
child.value = joinPaths(this.value, child.value);
|
||||
child.parent = this.parent;
|
||||
this.parent.delete(this.value);
|
||||
this.parent.set(child.value, child);
|
||||
}
|
||||
|
||||
for (const child of this.values()) {
|
||||
child.collapse();
|
||||
}
|
||||
}
|
||||
return root;
|
||||
|
||||
private add(path: string) {
|
||||
let current: TreeNode = this;
|
||||
for (const part of getPathParts(path)) {
|
||||
let next = current.get(part);
|
||||
if (next === undefined) {
|
||||
next = new TreeNode(part, joinPaths(current.path, part), current);
|
||||
current.set(part, next);
|
||||
}
|
||||
current = next;
|
||||
}
|
||||
return current;
|
||||
}
|
||||
|
||||
get parents(): TreeNode[] {
|
||||
if (this._parents) {
|
||||
return this._parents;
|
||||
}
|
||||
const parents: TreeNode[] = [];
|
||||
let current: TreeNode | null = this.parent;
|
||||
while (current !== null && current.parent !== null) {
|
||||
parents.push(current);
|
||||
current = current.parent;
|
||||
}
|
||||
return (this._parents = parents.reverse());
|
||||
}
|
||||
|
||||
get children(): TreeNode[] {
|
||||
return (this._children ??= Array.from(this.values()));
|
||||
}
|
||||
}
|
||||
|
||||
export const normalizeTreePath = (path: string) =>
|
||||
path.length > 1 && path[path.length - 1] === '/' ? path.slice(0, -1) : path;
|
||||
|
||||
export function getPathParts(path: string) {
|
||||
const parts = path.split('/');
|
||||
if (path[0] === '/') {
|
||||
parts[0] = '/';
|
||||
}
|
||||
|
||||
if (path[path.length - 1] === '/') {
|
||||
parts.pop();
|
||||
}
|
||||
|
||||
return parts;
|
||||
}
|
||||
|
||||
export function joinPaths(path1: string, path2: string) {
|
||||
if (!path1) {
|
||||
return path2;
|
||||
}
|
||||
|
||||
if (!path2) {
|
||||
return path1;
|
||||
}
|
||||
|
||||
if (path1[path1.length - 1] === '/') {
|
||||
return path1 + path2;
|
||||
}
|
||||
|
||||
return path1 + '/' + path2;
|
||||
}
|
||||
|
||||
export function getParentPath(path: string) {
|
||||
const normalized = normalizeTreePath(path);
|
||||
const last = normalized.lastIndexOf('/');
|
||||
if (last > 0) {
|
||||
return normalized.slice(0, last);
|
||||
}
|
||||
return last === 0 ? '/' : normalized;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<script lang="ts">
|
||||
import { afterNavigate, goto, invalidateAll } from '$app/navigation';
|
||||
import { page } from '$app/stores';
|
||||
import SkipLink from '$lib/components/elements/buttons/skip-link.svelte';
|
||||
import UserPageLayout, { headerId } from '$lib/components/layouts/user-page-layout.svelte';
|
||||
import AddToAlbum from '$lib/components/photos-page/actions/add-to-album.svelte';
|
||||
@@ -28,10 +27,9 @@
|
||||
import { preferences } from '$lib/stores/user.store';
|
||||
import { cancelMultiselect } from '$lib/utils/asset-utils';
|
||||
import { toTimelineAsset } from '$lib/utils/timeline-util';
|
||||
import { buildTree, normalizeTreePath } from '$lib/utils/tree-utils';
|
||||
import { joinPaths } from '$lib/utils/tree-utils';
|
||||
import { IconButton } from '@immich/ui';
|
||||
import { mdiDotsVertical, mdiFolder, mdiFolderHome, mdiFolderOutline, mdiPlus, mdiSelectAll } from '@mdi/js';
|
||||
import { onMount } from 'svelte';
|
||||
import { t } from 'svelte-i18n';
|
||||
import type { PageData } from './$types';
|
||||
|
||||
@@ -43,51 +41,40 @@
|
||||
|
||||
const viewport: Viewport = $state({ width: 0, height: 0 });
|
||||
|
||||
let pathSegments = $derived(data.path ? data.path.split('/') : []);
|
||||
let tree = $derived(buildTree(foldersStore.uniquePaths));
|
||||
let currentPath = $derived($page.url.searchParams.get(QueryParameter.PATH) || '');
|
||||
let currentTreeItems = $derived(currentPath ? data.currentFolders : Object.keys(tree).sort());
|
||||
|
||||
const assetInteraction = new AssetInteraction();
|
||||
|
||||
onMount(async function initializeFolders() {
|
||||
await foldersStore.fetchUniquePaths();
|
||||
});
|
||||
const handleNavigateToFolder = (folderName: string) => navigateToView(joinPaths(data.tree.path, folderName));
|
||||
|
||||
const handleNavigateToFolder = async function handleNavigateToFolder(folderName: string) {
|
||||
await navigateToView(normalizeTreePath(`${data.path || ''}/${folderName}`));
|
||||
};
|
||||
|
||||
const getLinkForPath = function getLinkForPath(path: string) {
|
||||
function getLinkForPath(path: string) {
|
||||
const url = new URL(AppRoute.FOLDERS, globalThis.location.href);
|
||||
if (path) {
|
||||
url.searchParams.set(QueryParameter.PATH, path);
|
||||
}
|
||||
url.searchParams.set(QueryParameter.PATH, path);
|
||||
return url.href;
|
||||
};
|
||||
}
|
||||
|
||||
afterNavigate(function clearAssetSelection() {
|
||||
// Clear the asset selection when we navigate (like going to another folder)
|
||||
cancelMultiselect(assetInteraction);
|
||||
});
|
||||
|
||||
const navigateToView = function navigateToView(path: string) {
|
||||
return goto(getLinkForPath(path));
|
||||
};
|
||||
function navigateToView(path: string) {
|
||||
return goto(getLinkForPath(path), { keepFocus: true, noScroll: true });
|
||||
}
|
||||
|
||||
const triggerAssetUpdate = async function updateAssets() {
|
||||
async function triggerAssetUpdate() {
|
||||
cancelMultiselect(assetInteraction);
|
||||
await foldersStore.refreshAssetsByPath(data.path);
|
||||
if (data.tree.path) {
|
||||
await foldersStore.refreshAssetsByPath(data.tree.path);
|
||||
}
|
||||
await invalidateAll();
|
||||
};
|
||||
}
|
||||
|
||||
const handleSelectAllAssets = function handleSelectAllAssets() {
|
||||
function handleSelectAllAssets() {
|
||||
if (!data.pathAssets) {
|
||||
return;
|
||||
}
|
||||
|
||||
assetInteraction.selectAssets(data.pathAssets.map((asset) => toTimelineAsset(asset)));
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<UserPageLayout title={data.meta.title}>
|
||||
@@ -99,8 +86,8 @@
|
||||
<div class="h-full">
|
||||
<TreeItems
|
||||
icons={{ default: mdiFolderOutline, active: mdiFolder }}
|
||||
items={tree}
|
||||
active={currentPath}
|
||||
tree={foldersStore.folders!}
|
||||
active={data.tree.path}
|
||||
getLink={getLinkForPath}
|
||||
/>
|
||||
</div>
|
||||
@@ -108,10 +95,10 @@
|
||||
</Sidebar>
|
||||
{/snippet}
|
||||
|
||||
<Breadcrumbs {pathSegments} icon={mdiFolderHome} title={$t('folders')} getLink={getLinkForPath} />
|
||||
<Breadcrumbs node={data.tree} icon={mdiFolderHome} title={$t('folders')} getLink={getLinkForPath} />
|
||||
|
||||
<section class="mt-2 h-[calc(100%-(--spacing(20)))] overflow-auto immich-scrollbar">
|
||||
<TreeItemThumbnails items={currentTreeItems} icon={mdiFolder} onClick={handleNavigateToFolder} />
|
||||
<TreeItemThumbnails items={data.tree.children} icon={mdiFolder} onClick={handleNavigateToFolder} />
|
||||
|
||||
<!-- Assets -->
|
||||
{#if data.pathAssets && data.pathAssets.length > 0}
|
||||
|
||||
@@ -3,38 +3,28 @@ import { foldersStore } from '$lib/stores/folders.svelte';
|
||||
import { authenticate } from '$lib/utils/auth';
|
||||
import { getFormatter } from '$lib/utils/i18n';
|
||||
import { getAssetInfoFromParam } from '$lib/utils/navigation';
|
||||
import { buildTree, normalizeTreePath } from '$lib/utils/tree-utils';
|
||||
import type { PageLoad } from './$types';
|
||||
|
||||
export const load = (async ({ params, url }) => {
|
||||
await authenticate(url);
|
||||
const asset = await getAssetInfoFromParam(params);
|
||||
const $t = await getFormatter();
|
||||
|
||||
await foldersStore.fetchUniquePaths();
|
||||
|
||||
let pathAssets = null;
|
||||
const [, asset, $t] = await Promise.all([foldersStore.fetchTree(), getAssetInfoFromParam(params), getFormatter()]);
|
||||
|
||||
let tree = foldersStore.folders!;
|
||||
const path = url.searchParams.get(QueryParameter.PATH);
|
||||
if (path) {
|
||||
await foldersStore.fetchAssetsByPath(path);
|
||||
pathAssets = foldersStore.assets[path] || null;
|
||||
} else {
|
||||
// If no path is provided, we we're at the root level
|
||||
tree = tree.traverse(path);
|
||||
} else if (path === null) {
|
||||
// If no path is provided, we've just navigated to the folders page.
|
||||
// We should bust the asset cache of the folder store, to make sure we don't show stale data
|
||||
foldersStore.bustAssetCache();
|
||||
}
|
||||
|
||||
let tree = buildTree(foldersStore.uniquePaths);
|
||||
const parts = normalizeTreePath(path || '').split('/');
|
||||
for (const part of parts) {
|
||||
tree = tree?.[part];
|
||||
}
|
||||
// only fetch assets if the folder has assets
|
||||
const pathAssets = tree.hasAssets ? await foldersStore.fetchAssetsByPath(tree.path) : null;
|
||||
|
||||
return {
|
||||
asset,
|
||||
path,
|
||||
currentFolders: Object.keys(tree || {}).sort(),
|
||||
tree,
|
||||
pathAssets,
|
||||
meta: {
|
||||
title: $t('folders'),
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import { page } from '$app/stores';
|
||||
import SkipLink from '$lib/components/elements/buttons/skip-link.svelte';
|
||||
import UserPageLayout, { headerId } from '$lib/components/layouts/user-page-layout.svelte';
|
||||
import AssetGrid from '$lib/components/photos-page/asset-grid.svelte';
|
||||
@@ -15,9 +14,9 @@
|
||||
import Sidebar from '$lib/components/sidebar/sidebar.svelte';
|
||||
import { AppRoute, AssetAction, QueryParameter, SettingInputFieldType } from '$lib/constants';
|
||||
import { modalManager } from '$lib/managers/modal-manager.svelte';
|
||||
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
|
||||
import { AssetStore } from '$lib/managers/timeline-manager/asset-store.svelte';
|
||||
import { buildTree, normalizeTreePath } from '$lib/utils/tree-utils';
|
||||
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
|
||||
import { joinPaths, TreeNode } from '$lib/utils/tree-utils';
|
||||
import { deleteTag, getAllTags, updateTag, upsertTags, type TagResponseDto } from '@immich/sdk';
|
||||
import { Button, HStack, Modal, ModalBody, ModalFooter, Text } from '@immich/ui';
|
||||
import { mdiPencil, mdiPlus, mdiTag, mdiTagMultiple, mdiTrashCanOutline } from '@mdi/js';
|
||||
@@ -31,38 +30,24 @@
|
||||
|
||||
let { data }: Props = $props();
|
||||
|
||||
let pathSegments = $derived(data.path ? data.path.split('/') : []);
|
||||
let currentPath = $derived($page.url.searchParams.get(QueryParameter.PATH) || '');
|
||||
|
||||
const assetInteraction = new AssetInteraction();
|
||||
|
||||
const buildMap = (tags: TagResponseDto[]) => {
|
||||
return Object.fromEntries(tags.map((tag) => [tag.value, tag]));
|
||||
};
|
||||
const assetStore = new AssetStore();
|
||||
$effect(() => void assetStore.updateOptions({ deferInit: !tag, tagId }));
|
||||
$effect(() => void assetStore.updateOptions({ deferInit: !tag, tagId: tag.id }));
|
||||
onDestroy(() => assetStore.destroy());
|
||||
|
||||
let tags = $derived<TagResponseDto[]>(data.tags);
|
||||
let tagsMap = $derived(buildMap(tags));
|
||||
let tag = $derived(currentPath ? tagsMap[currentPath] : null);
|
||||
let tagId = $derived(tag?.id);
|
||||
let tree = $derived(buildTree(tags.map((tag) => tag.value)));
|
||||
const tree = $derived(TreeNode.fromTags(tags));
|
||||
const tag = $derived(tree.traverse(data.path));
|
||||
|
||||
const handleNavigation = async (tag: string) => {
|
||||
await navigateToView(normalizeTreePath(`${data.path || ''}/${tag}`));
|
||||
};
|
||||
const handleNavigation = (tag: string) => navigateToView(joinPaths(data.path, tag));
|
||||
|
||||
const getLink = (path: string) => {
|
||||
const url = new URL(AppRoute.TAGS, globalThis.location.href);
|
||||
if (path) {
|
||||
url.searchParams.set(QueryParameter.PATH, path);
|
||||
}
|
||||
url.searchParams.set(QueryParameter.PATH, path);
|
||||
return url.href;
|
||||
};
|
||||
|
||||
const getColor = (path: string) => tagsMap[path]?.color;
|
||||
|
||||
const navigateToView = (path: string) => goto(getLink(path));
|
||||
|
||||
let isNewOpen = $state(false);
|
||||
@@ -86,7 +71,7 @@
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (tag && isEditOpen && newTagColor) {
|
||||
await updateTag({ id: tag.id, tagUpdateDto: { color: newTagColor } });
|
||||
await updateTag({ id: tag.id!, tagUpdateDto: { color: newTagColor } });
|
||||
|
||||
notificationController.show({
|
||||
message: $t('tag_updated', { values: { tag: tag.value } }),
|
||||
@@ -125,12 +110,11 @@
|
||||
return;
|
||||
}
|
||||
|
||||
await deleteTag({ id: tag.id });
|
||||
await deleteTag({ id: tag.id! });
|
||||
tags = await getAllTags();
|
||||
|
||||
// navigate to parent
|
||||
const parentPath = pathSegments.slice(0, -1).join('/');
|
||||
await navigateToView(parentPath);
|
||||
await navigateToView(tag.parent ? tag.parent.path : '');
|
||||
};
|
||||
|
||||
const onsubmit = async (event: Event) => {
|
||||
@@ -146,13 +130,7 @@
|
||||
<section>
|
||||
<div class="text-xs ps-4 mb-2 dark:text-white">{$t('explorer').toUpperCase()}</div>
|
||||
<div class="h-full">
|
||||
<TreeItems
|
||||
icons={{ default: mdiTag, active: mdiTag }}
|
||||
items={tree}
|
||||
active={currentPath}
|
||||
{getLink}
|
||||
{getColor}
|
||||
/>
|
||||
<TreeItems icons={{ default: mdiTag, active: mdiTag }} {tree} active={tag.path} {getLink} />
|
||||
</div>
|
||||
</section>
|
||||
</Sidebar>
|
||||
@@ -164,7 +142,7 @@
|
||||
<Text class="hidden md:block">{$t('create_tag')}</Text>
|
||||
</Button>
|
||||
|
||||
{#if pathSegments.length > 0 && tag}
|
||||
{#if tag.path.length > 0}
|
||||
<Button leadingIcon={mdiPencil} onclick={handleEdit} size="small" variant="ghost" color="secondary">
|
||||
<Text class="hidden md:block">{$t('edit_tag')}</Text>
|
||||
</Button>
|
||||
@@ -175,17 +153,17 @@
|
||||
</HStack>
|
||||
{/snippet}
|
||||
|
||||
<Breadcrumbs {pathSegments} icon={mdiTagMultiple} title={$t('tags')} {getLink} />
|
||||
<Breadcrumbs node={tag} icon={mdiTagMultiple} title={$t('tags')} {getLink} />
|
||||
|
||||
<section class="mt-2 h-[calc(100%-(--spacing(20)))] overflow-auto immich-scrollbar">
|
||||
{#if tag}
|
||||
{#if tag.hasAssets}
|
||||
<AssetGrid enableRouting={true} {assetStore} {assetInteraction} removeAction={AssetAction.UNARCHIVE}>
|
||||
{#snippet empty()}
|
||||
<TreeItemThumbnails items={data.children} icon={mdiTag} onClick={handleNavigation} />
|
||||
<TreeItemThumbnails items={tag.children} icon={mdiTag} onClick={handleNavigation} />
|
||||
{/snippet}
|
||||
</AssetGrid>
|
||||
{:else}
|
||||
<TreeItemThumbnails items={Object.keys(tree)} icon={mdiTag} onClick={handleNavigation} />
|
||||
<TreeItemThumbnails items={tag.children} icon={mdiTag} onClick={handleNavigation} />
|
||||
{/if}
|
||||
</section>
|
||||
</UserPageLayout>
|
||||
|
||||
@@ -2,7 +2,6 @@ import { QueryParameter } from '$lib/constants';
|
||||
import { authenticate } from '$lib/utils/auth';
|
||||
import { getFormatter } from '$lib/utils/i18n';
|
||||
import { getAssetInfoFromParam } from '$lib/utils/navigation';
|
||||
import { buildTree, normalizeTreePath } from '$lib/utils/tree-utils';
|
||||
import { getAllTags } from '@immich/sdk';
|
||||
import type { PageLoad } from './$types';
|
||||
|
||||
@@ -11,20 +10,12 @@ export const load = (async ({ params, url }) => {
|
||||
const asset = await getAssetInfoFromParam(params);
|
||||
const $t = await getFormatter();
|
||||
|
||||
const path = url.searchParams.get(QueryParameter.PATH);
|
||||
const tags = await getAllTags();
|
||||
const tree = buildTree(tags.map((tag) => tag.value));
|
||||
let currentTree = tree;
|
||||
const parts = normalizeTreePath(path || '').split('/');
|
||||
for (const part of parts) {
|
||||
currentTree = currentTree?.[part];
|
||||
}
|
||||
|
||||
return {
|
||||
path: url.searchParams.get(QueryParameter.PATH) ?? '',
|
||||
tags,
|
||||
asset,
|
||||
path,
|
||||
children: Object.keys(currentTree || {}),
|
||||
meta: {
|
||||
title: $t('tags'),
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user