Start9/start-os
2
0
Fork 0
mirror of https://github.com/Start9Labs/start-os.git synced 2026-03-30 12:11:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

More FE fixes (#3056)

Browse Source 
* tell user to restart server after kiosk chnage

* remove unused import

* dont show tor address on server setup

* chore: address comments

* revert mock

* chore: remove uptime block on mobile

* utiliser le futur proche

* chore: comments

* don't show loading on authorities tab

* chore: fix mobile unions

---------

Co-authored-by: waterplea <alexander@inkin.ru>
Co-authored-by: Aiden McClelland <3732071+dr-bonez@users.noreply.github.com>
This commit is contained in:
Matt Hill
2025-11-25 16:43:19 -07:00
committed by GitHub
parent 6e8a425eb1
commit 009d76ea35
16 changed files with 224 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

154
web/package-lock.json generated
View File

@@ -25,18 +25,18 @@
"@noble/hashes": "^1.4.0", "@noble/hashes": "^1.4.0",
"@start9labs/argon2": "^0.3.0", "@start9labs/argon2": "^0.3.0",
"@start9labs/start-sdk": "file:../sdk/baseDist", "@start9labs/start-sdk": "file:../sdk/baseDist",
"@taiga-ui/addon-charts": "4.55.0", "@taiga-ui/addon-charts": "4.62.0",
"@taiga-ui/addon-commerce": "4.55.0", "@taiga-ui/addon-commerce": "4.62.0",
"@taiga-ui/addon-mobile": "4.55.0", "@taiga-ui/addon-mobile": "4.62.0",
"@taiga-ui/addon-table": "4.55.0", "@taiga-ui/addon-table": "4.62.0",
"@taiga-ui/cdk": "4.55.0", "@taiga-ui/cdk": "4.62.0",
"@taiga-ui/core": "4.55.0", "@taiga-ui/core": "4.62.0",
"@taiga-ui/dompurify": "4.1.11", "@taiga-ui/dompurify": "4.1.11",
"@taiga-ui/event-plugins": "4.7.0", "@taiga-ui/event-plugins": "4.7.0",
"@taiga-ui/experimental": "4.55.0", "@taiga-ui/experimental": "4.62.0",
"@taiga-ui/icons": "4.55.0", "@taiga-ui/icons": "4.62.0",
"@taiga-ui/kit": "4.55.0", "@taiga-ui/kit": "4.62.0",
"@taiga-ui/layout": "4.55.0", "@taiga-ui/layout": "4.62.0",
"@taiga-ui/polymorpheus": "4.9.0", "@taiga-ui/polymorpheus": "4.9.0",
"ansi-to-html": "^0.7.2", "ansi-to-html": "^0.7.2",
"base64-js": "^1.5.1", "base64-js": "^1.5.1",
@@ -3950,9 +3950,9 @@
"link": true "link": true
}, },
"node_modules/@taiga-ui/addon-charts": { "node_modules/@taiga-ui/addon-charts": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/addon-charts/-/addon-charts-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/addon-charts/-/addon-charts-4.62.0.tgz",
"integrity": "sha512-Rwgcc7NaLm75GsHYhqbO4jgNhD1bGbA7Kk0sNFE+Tgz9+V3ARXMuBw7C3cU9UxLSFnOsXz9RYLosmZ3jAVlyuQ==", "integrity": "sha512-tCysUpzEHwRhK/p9hopkt0Jw4jcgA2cF8CYK8mDntghC+fNLnqCVUcrqFIC5plGabAo00WMEz+X+KyGvwvKaVg==",
"license": "Apache-2.0", "license": "Apache-2.0",
"dependencies": { "dependencies": {
"tslib": ">=2.8.1" "tslib": ">=2.8.1"
@@ -3961,15 +3961,15 @@
"@angular/common": ">=16.0.0", "@angular/common": ">=16.0.0",
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@ng-web-apis/common": "^4.12.0", "@ng-web-apis/common": "^4.12.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0" "@taiga-ui/polymorpheus": "^4.9.0"
} }
}, },
"node_modules/@taiga-ui/addon-commerce": { "node_modules/@taiga-ui/addon-commerce": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/addon-commerce/-/addon-commerce-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/addon-commerce/-/addon-commerce-4.62.0.tgz",
"integrity": "sha512-eOOBkIJSsagtRkpRZ04xlL8ePIP01d4Xo264zSTg2SRxD6vwR/7/QJlf9108BvIJv/jfTpmFukLwSB9LazqmCw==", "integrity": "sha512-J4+bdHeDe2d7Uh8NNObLl4LzBhWLCdzxNHXPac1bMGB+3gX751Htc9px37FkVZlQGnxQATCbxAVXj7Zjveq/QQ==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@@ -3979,22 +3979,22 @@
"@angular/common": ">=16.0.0", "@angular/common": ">=16.0.0",
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@angular/forms": ">=16.0.0", "@angular/forms": ">=16.0.0",
"@maskito/angular": "^3.10.3", "@maskito/angular": "^3.11.1",
"@maskito/core": "^3.10.3", "@maskito/core": "^3.11.1",
"@maskito/kit": "^3.10.3", "@maskito/kit": "^3.11.1",
"@ng-web-apis/common": "^4.12.0", "@ng-web-apis/common": "^4.12.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/i18n": "^4.55.0", "@taiga-ui/i18n": "^4.62.0",
"@taiga-ui/kit": "^4.55.0", "@taiga-ui/kit": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }
}, },
"node_modules/@taiga-ui/addon-mobile": { "node_modules/@taiga-ui/addon-mobile": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/addon-mobile/-/addon-mobile-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/addon-mobile/-/addon-mobile-4.62.0.tgz",
"integrity": "sha512-NQRozVKcXLs9/rd/s1yI7T5rIokzwHQ5IN/c3NLBUEka1iKUr1ZTch+g9CHJf8GTVB0uAwWKNCgX5LxtiSI5zg==", "integrity": "sha512-seIBG4utgLq2xDJu+YDzksOsVi/V6vsTbm2bljgM1fIBZInbhqk95YOIFZDU9JXT1/vIShcqetavg1vHD1wdkQ==",
"license": "Apache-2.0", "license": "Apache-2.0",
"dependencies": { "dependencies": {
"tslib": ">=2.8.1" "tslib": ">=2.8.1"
@@ -4004,18 +4004,18 @@
"@angular/common": ">=16.0.0", "@angular/common": ">=16.0.0",
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@ng-web-apis/common": "^4.12.0", "@ng-web-apis/common": "^4.12.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/kit": "^4.55.0", "@taiga-ui/kit": "^4.62.0",
"@taiga-ui/layout": "^4.55.0", "@taiga-ui/layout": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }
}, },
"node_modules/@taiga-ui/addon-table": { "node_modules/@taiga-ui/addon-table": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/addon-table/-/addon-table-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/addon-table/-/addon-table-4.62.0.tgz",
"integrity": "sha512-K5qpOS0UQLDqruJXPNDic8scCRvO3oAN/ZCPQ9XOGDrcvydvo4AKUwjKRPj+pZ/z0ulxbwAAruFFFCvRNnbzaA==", "integrity": "sha512-0rolnsO1puYwUK17si5OOpzFxiziS6/OSbpLOSKrVrMkCgsWCoNDvpgPIwtwS5Mq3iF5cwLfUPbDQM8saG7wxQ==",
"license": "Apache-2.0", "license": "Apache-2.0",
"dependencies": { "dependencies": {
"tslib": ">=2.8.1" "tslib": ">=2.8.1"
@@ -4024,18 +4024,18 @@
"@angular/common": ">=16.0.0", "@angular/common": ">=16.0.0",
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@ng-web-apis/intersection-observer": "^4.12.0", "@ng-web-apis/intersection-observer": "^4.12.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/i18n": "^4.55.0", "@taiga-ui/i18n": "^4.62.0",
"@taiga-ui/kit": "^4.55.0", "@taiga-ui/kit": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }
}, },
"node_modules/@taiga-ui/cdk": { "node_modules/@taiga-ui/cdk": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/cdk/-/cdk-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/cdk/-/cdk-4.62.0.tgz",
"integrity": "sha512-vA5nGyx+YIHR1xZeq5D9gSqTRQg74qhe1AOt5FlqFOC0P4LvmLkNg3De7AeahXALNSeRz/DYcqI7WuGo6xpcLQ==", "integrity": "sha512-KWPXEbCHtRp7aIet1L3PySdXpo5Aay4L/36jDzjiFZ/bcbuD2cY/3S2l68zpgv6ZksZA94DuCuaamSEwQIAtPw==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@@ -4065,9 +4065,9 @@
} }
}, },
"node_modules/@taiga-ui/core": { "node_modules/@taiga-ui/core": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/core/-/core-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/core/-/core-4.62.0.tgz",
"integrity": "sha512-Z2ATVNmEAlHEk2cgs/tnS6qZML87IchkPDeRl6HQfBT2fjYVjh1oCzXL07t86Lv6tpvkllyUVqoBCTSvDXs9kA==", "integrity": "sha512-PQW10hFH50g8PgnJpPa/ZrGMWljhIsBHad/utvalmlv8wXQY24i8T1BjrGIOFPOjzs20NEwLOICHf7KdZUtiuA==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@@ -4082,9 +4082,9 @@
"@angular/router": ">=16.0.0", "@angular/router": ">=16.0.0",
"@ng-web-apis/common": "^4.12.0", "@ng-web-apis/common": "^4.12.0",
"@ng-web-apis/mutation-observer": "^4.12.0", "@ng-web-apis/mutation-observer": "^4.12.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/event-plugins": "^4.7.0", "@taiga-ui/event-plugins": "^4.7.0",
"@taiga-ui/i18n": "^4.55.0", "@taiga-ui/i18n": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }
@@ -4120,9 +4120,9 @@
} }
}, },
"node_modules/@taiga-ui/experimental": { "node_modules/@taiga-ui/experimental": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/experimental/-/experimental-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/experimental/-/experimental-4.62.0.tgz",
"integrity": "sha512-3zq2BTl+fE/N/tEr74TzWbyzT5OoS9YEApKobJehKivW5XxZmF/MDRWp45kSe4jDtVbJ2ueI0Jn8h0BDNykkcg==", "integrity": "sha512-EiL5wJ+9LSf0BfZcFX6ioCavLfx26v0BCOUXh52Rtczp85Uh2qTDt2feM0oBDB+0Kj74/+wqqiKi+s3B8ZV3WA==",
"license": "Apache-2.0", "license": "Apache-2.0",
"dependencies": { "dependencies": {
"tslib": ">=2.8.1" "tslib": ">=2.8.1"
@@ -4130,19 +4130,19 @@
"peerDependencies": { "peerDependencies": {
"@angular/common": ">=16.0.0", "@angular/common": ">=16.0.0",
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@taiga-ui/addon-commerce": "^4.55.0", "@taiga-ui/addon-commerce": "^4.62.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/kit": "^4.55.0", "@taiga-ui/kit": "^4.62.0",
"@taiga-ui/layout": "^4.55.0", "@taiga-ui/layout": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }
}, },
"node_modules/@taiga-ui/i18n": { "node_modules/@taiga-ui/i18n": {
"version": "4.59.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/i18n/-/i18n-4.59.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/i18n/-/i18n-4.62.0.tgz",
"integrity": "sha512-IxPzqkORJlSqagvUdmqBL9fuvfRm/Ca/W/bCDEK2GN/4QtSZ0yFzAyQdWduoIJubqyEPMXRbXZGc7WBtDgAMIQ==", "integrity": "sha512-84hD1nI26EAYd5RUhFKxbg+8WKYhc0GBHyf8wfi15xuwaT6oh2gbJx7pNTlGN3klH4CeDB9HF998tkhieevqQw==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@@ -4155,18 +4155,18 @@
} }
}, },
"node_modules/@taiga-ui/icons": { "node_modules/@taiga-ui/icons": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/icons/-/icons-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/icons/-/icons-4.62.0.tgz",
"integrity": "sha512-sYqSG9wgUcwHBrDRnMhLCMEkvAAw/SZrvvq0jdY2oWGmKwAj/6WBt+wA+jnFkDDKEZ7mjzdPIQffpVaUjSwsiw==", "integrity": "sha512-vD+bJk3Wot/+NcbdPwAJGBnqXG6T1OJVeg2IkaEE6DBixwdwDpukZWiV9asXyXiJkyEpG2Ar7SASvdCYZEVlxw==",
"license": "Apache-2.0", "license": "Apache-2.0",
"dependencies": { "dependencies": {
"tslib": "^2.3.0" "tslib": "^2.3.0"
} }
}, },
"node_modules/@taiga-ui/kit": { "node_modules/@taiga-ui/kit": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/kit/-/kit-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/kit/-/kit-4.62.0.tgz",
"integrity": "sha512-xTvi7viI+wI2ifPv2bsf8prhYWWS4g1lbx059jXV3f5Cttc0Xg6DEb6xpaQOf4loBkcrP2FzkA4njACUuiouzw==", "integrity": "sha512-tdEaXJTks1PZQJAwMiVQTZrtCpaLIYV6T9VdVPZUKAJXq7K6J2kcD0oIISjwE9rqgLVwqytMZrwHx1nSRzkb/A==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@@ -4177,25 +4177,25 @@
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@angular/forms": ">=16.0.0", "@angular/forms": ">=16.0.0",
"@angular/router": ">=16.0.0", "@angular/router": ">=16.0.0",
"@maskito/angular": "^3.10.3", "@maskito/angular": "^3.11.1",
"@maskito/core": "^3.10.3", "@maskito/core": "^3.11.1",
"@maskito/kit": "^3.10.3", "@maskito/kit": "^3.11.1",
"@maskito/phone": "^3.10.3", "@maskito/phone": "^3.11.1",
"@ng-web-apis/common": "^4.12.0", "@ng-web-apis/common": "^4.12.0",
"@ng-web-apis/intersection-observer": "^4.12.0", "@ng-web-apis/intersection-observer": "^4.12.0",
"@ng-web-apis/mutation-observer": "^4.12.0", "@ng-web-apis/mutation-observer": "^4.12.0",
"@ng-web-apis/resize-observer": "^4.12.0", "@ng-web-apis/resize-observer": "^4.12.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/i18n": "^4.55.0", "@taiga-ui/i18n": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }
}, },
"node_modules/@taiga-ui/layout": { "node_modules/@taiga-ui/layout": {
"version": "4.55.0", "version": "4.62.0",
"resolved": "https://registry.npmjs.org/@taiga-ui/layout/-/layout-4.55.0.tgz", "resolved": "https://registry.npmjs.org/@taiga-ui/layout/-/layout-4.62.0.tgz",
"integrity": "sha512-C+e4gudZwjIc46VITil5vySas1FPpfe+D4uwLRggJOTuUosZlZHBuc51v91wCCc0pL0Xfu+TD0s8W9kRd1sQHA==", "integrity": "sha512-xd8eLLeR5FE3RhnVMGl1QlC3JXXJLsLAAASpBf9DQsTt+YBBl8BQt/cXGbBcJecC2mJLZlS6zytSkMTHY7VAhw==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@@ -4204,9 +4204,9 @@
"peerDependencies": { "peerDependencies": {
"@angular/common": ">=16.0.0", "@angular/common": ">=16.0.0",
"@angular/core": ">=16.0.0", "@angular/core": ">=16.0.0",
"@taiga-ui/cdk": "^4.55.0", "@taiga-ui/cdk": "^4.62.0",
"@taiga-ui/core": "^4.55.0", "@taiga-ui/core": "^4.62.0",
"@taiga-ui/kit": "^4.55.0", "@taiga-ui/kit": "^4.62.0",
"@taiga-ui/polymorpheus": "^4.9.0", "@taiga-ui/polymorpheus": "^4.9.0",
"rxjs": ">=7.0.0" "rxjs": ">=7.0.0"
} }

20
web/package.json
View File

@@ -49,18 +49,18 @@
"@noble/hashes": "^1.4.0", "@noble/hashes": "^1.4.0",
"@start9labs/argon2": "^0.3.0", "@start9labs/argon2": "^0.3.0",
"@start9labs/start-sdk": "file:../sdk/baseDist", "@start9labs/start-sdk": "file:../sdk/baseDist",
"@taiga-ui/addon-charts": "4.55.0", "@taiga-ui/addon-charts": "4.62.0",
"@taiga-ui/addon-commerce": "4.55.0", "@taiga-ui/addon-commerce": "4.62.0",
"@taiga-ui/addon-mobile": "4.55.0", "@taiga-ui/addon-mobile": "4.62.0",
"@taiga-ui/addon-table": "4.55.0", "@taiga-ui/addon-table": "4.62.0",
"@taiga-ui/cdk": "4.55.0", "@taiga-ui/cdk": "4.62.0",
"@taiga-ui/core": "4.55.0", "@taiga-ui/core": "4.62.0",
"@taiga-ui/dompurify": "4.1.11", "@taiga-ui/dompurify": "4.1.11",
"@taiga-ui/event-plugins": "4.7.0", "@taiga-ui/event-plugins": "4.7.0",
"@taiga-ui/experimental": "4.55.0", "@taiga-ui/experimental": "4.62.0",
"@taiga-ui/icons": "4.55.0", "@taiga-ui/icons": "4.62.0",
"@taiga-ui/kit": "4.55.0", "@taiga-ui/kit": "4.62.0",
"@taiga-ui/layout": "4.55.0", "@taiga-ui/layout": "4.62.0",
"@taiga-ui/polymorpheus": "4.9.0", "@taiga-ui/polymorpheus": "4.9.0",
"ansi-to-html": "^0.7.2", "ansi-to-html": "^0.7.2",
"base64-js": "^1.5.1", "base64-js": "^1.5.1",

7
web/projects/marketplace/src/pages/show/dependencies/dependency-item.component.ts
View File

@@ -10,7 +10,12 @@ import { MarketplacePkgBase } from '../../../types'
selector: 'marketplace-dep-item', selector: 'marketplace-dep-item',
template: ` template: `
<div class="outer-container"> <div class="outer-container">
<tui-avatar class="dep-img" size="l" [src]="getImage(dep.key)" /> <tui-avatar
appearance="action-grayscale"
class="dep-img"
size="l"
[src]="getImage(dep.key)"
/>
<div> <div>
<tui-line-clamp [linesLimit]="2" [content]="titleContent" /> <tui-line-clamp [linesLimit]="2" [content]="titleContent" />
<ng-template #titleContent> <ng-template #titleContent>

5
web/projects/marketplace/src/pages/show/flavors.component.ts
View File

@@ -21,7 +21,10 @@ import { MarketplacePkg } from '../../types'
[queryParams]="{ id: pkg.id, flavor: pkg.flavor }" [queryParams]="{ id: pkg.id, flavor: pkg.flavor }"
queryParamsHandling="merge" queryParamsHandling="merge"
> >
<tui-avatar [src]="pkg.icon | trustUrl" /> <tui-avatar
appearance="action-grayscale"
[src]="pkg.icon | trustUrl"
/>
<span tuiTitle> <span tuiTitle>
{{ pkg.title }} {{ pkg.title }}
<span tuiSubtitle>{{ pkg.version }}</span> <span tuiSubtitle>{{ pkg.version }}</span>

4
web/projects/ui/src/app/routes/portal/components/form/controls/select.component.ts
View File

@@ -40,7 +40,9 @@ import { HintPipe } from '../pipes/hint.pipe'
[(ngModel)]="selected" [(ngModel)]="selected"
/> />
} }
<tui-data-list-wrapper *tuiTextfieldDropdown new [items]="items" /> @if (!mobile) {
<tui-data-list-wrapper *tuiTextfieldDropdown new [items]="items" />
}
@if (spec | hint; as hint) { @if (spec | hint; as hint) {
<tui-icon [tuiTooltip]="hint" /> <tui-icon [tuiTooltip]="hint" />
} }

31
web/projects/ui/src/app/routes/portal/components/interfaces/addresses/actions.component.ts
View File

@@ -17,6 +17,7 @@ import {
tuiButtonOptionsProvider, tuiButtonOptionsProvider,
TuiDataList, TuiDataList,
TuiDropdown, TuiDropdown,
TuiIcon,
TuiTextfield, TuiTextfield,
} from '@taiga-ui/core' } from '@taiga-ui/core'
import { PolymorpheusComponent } from '@taiga-ui/polymorpheus' import { PolymorpheusComponent } from '@taiga-ui/polymorpheus'
@@ -27,13 +28,9 @@ import { InterfaceComponent } from '../interface.component'
selector: 'td[actions]', selector: 'td[actions]',
template: ` template: `
<div class="desktop"> <div class="desktop">
<button <button tuiIconButton appearance="flat-grayscale" (click)="viewDetails()">
tuiIconButton
appearance="flat-grayscale"
iconStart="@tui.info"
(click)="viewDetails()"
>
{{ 'Address details' | i18n }} {{ 'Address details' | i18n }}
<tui-icon class="info" icon="@tui.info" background="@tui.info-filled" />
</button> </button>
@if (interface.value()?.type === 'ui') { @if (interface.value()?.type === 'ui') {
<a <a
@@ -113,6 +110,19 @@ import { InterfaceComponent } from '../interface.component'
white-space: nowrap; white-space: nowrap;
} }
:host-context(.uncommon-hidden) .desktop {
height: 0;
visibility: hidden;
}
.info {
background: var(--tui-status-info);
&::after {
mask-size: 1.5rem;
}
}
.mobile { .mobile {
display: none; display: none;
} }
@@ -127,7 +137,14 @@ import { InterfaceComponent } from '../interface.component'
} }
} }
`, `,
imports: [TuiButton, TuiDropdown, TuiDataList, i18nPipe, TuiTextfield], imports: [
TuiButton,
TuiDropdown,
TuiDataList,
i18nPipe,
TuiTextfield,
TuiIcon,
],
providers: [tuiButtonOptionsProvider({ appearance: 'icon' })], providers: [tuiButtonOptionsProvider({ appearance: 'icon' })],
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
}) })

125
web/projects/ui/src/app/routes/portal/components/interfaces/addresses/addresses.component.ts
View File

@@ -1,7 +1,8 @@
import { ChangeDetectionStrategy, Component, input } from '@angular/core' import { ChangeDetectionStrategy, Component, input } from '@angular/core'
import { i18nPipe } from '@start9labs/shared' import { i18nPipe } from '@start9labs/shared'
import { TuiButton } from '@taiga-ui/core'
import { TuiAccordion } from '@taiga-ui/experimental' import { TuiAccordion } from '@taiga-ui/experimental'
import { TuiSkeleton } from '@taiga-ui/kit' import { TuiElasticContainer, TuiSkeleton } from '@taiga-ui/kit'
import { PlaceholderComponent } from 'src/app/routes/portal/components/placeholder.component' import { PlaceholderComponent } from 'src/app/routes/portal/components/placeholder.component'
import { TableComponent } from 'src/app/routes/portal/components/table.component' import { TableComponent } from 'src/app/routes/portal/components/table.component'
@@ -12,91 +13,79 @@ import { InterfaceAddressItemComponent } from './item.component'
selector: 'section[addresses]', selector: 'section[addresses]',
template: ` template: `
<header>{{ 'Addresses' | i18n }}</header> <header>{{ 'Addresses' | i18n }}</header>
<table [appTable]="['Type', 'Access', 'Gateway', 'URL', null]"> <tui-elastic-container>
@for (address of addresses()?.common; track $index) { <table [appTable]="['Type', 'Access', 'Gateway', 'URL', null]">
<tr [address]="address" [isRunning]="isRunning()"></tr> @for (address of addresses()?.common; track $index) {
} @empty { <tr [address]="address" [isRunning]="isRunning()"></tr>
@if (addresses()) { } @empty {
<tr> @if (addresses()) {
<td colspan="5">
<app-placeholder icon="@tui.list-x">
{{ 'No addresses' | i18n }}
</app-placeholder>
</td>
</tr>
} @else {
@for (_ of [0, 1]; track $index) {
<tr> <tr>
<td colspan="6"> <td colspan="5">
<div [tuiSkeleton]="true">{{ 'Loading' | i18n }}</div> <app-placeholder icon="@tui.list-x">
{{ 'No addresses' | i18n }}
</app-placeholder>
</td> </td>
</tr> </tr>
} @else {
@for (_ of [0, 1]; track $index) {
<tr>
<td colspan="6">
<div [tuiSkeleton]="true">{{ 'Loading' | i18n }}</div>
</td>
</tr>
}
} }
} }
} <tbody [class.uncommon-hidden]="!uncommon">
</table> @if (addresses()?.uncommon?.length && uncommon) {
@if (addresses()?.uncommon?.length) { <tr [style.background]="'var(--tui-background-neutral-1)'">
<tui-accordion> <td colspan="5"></td>
<tui-expand> </tr>
<hr />
<table class="g-table">
@for (address of addresses()?.uncommon; track $index) {
<tr [address]="address" [isRunning]="isRunning()"></tr>
}
</table>
</tui-expand>
<button
appearance="secondary-grayscale"
iconEnd=""
[(tuiAccordion)]="uncommon"
>
@if (uncommon) {
Hide uncommon
} @else {
Show uncommon
} }
</button> @for (address of addresses()?.uncommon; track $index) {
</tui-accordion> <tr [address]="address" [isRunning]="isRunning()"></tr>
} }
</tbody>
@if (addresses()?.uncommon?.length) {
<caption [style.caption-side]="'bottom'">
<button
tuiButton
size="m"
appearance="secondary-grayscale"
(click)="uncommon = !uncommon"
>
@if (uncommon) {
Hide uncommon
} @else {
Show uncommon
}
</button>
</caption>
}
</table>
</tui-elastic-container>
`, `,
styles: ` styles: `
tui-accordion { .g-table:has(caption) {
border-radius: 0; border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
} }
[tuiAccordion], [tuiButton] {
tui-expand { width: 100%;
box-shadow: none; border-top-left-radius: 0;
padding: 0; border-top-right-radius: 0;
}
[tuiAccordion] {
justify-content: center;
height: 3rem;
border-radius: 0 0 var(--tui-radius-m) var(--tui-radius-m) !important;
}
hr {
margin: 0;
height: 0.25rem;
border-radius: 1rem;
}
:host-context(tui-root._mobile) {
[tuiAccordion] {
margin: 0.5rem 0;
border-radius: var(--tui-radius-m) !important;
}
} }
`, `,
host: { class: 'g-card' }, host: { class: 'g-card' },
imports: [ imports: [
TuiSkeleton,
TuiButton,
TableComponent, TableComponent,
PlaceholderComponent, PlaceholderComponent,
i18nPipe, i18nPipe,
InterfaceAddressItemComponent, InterfaceAddressItemComponent,
TuiAccordion, TuiElasticContainer,
TuiSkeleton,
], ],
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
}) })

44
web/projects/ui/src/app/routes/portal/components/interfaces/addresses/item.component.ts
View File

@@ -8,27 +8,31 @@ import { TuiBadge } from '@taiga-ui/kit'
selector: 'tr[address]', selector: 'tr[address]',
template: ` template: `
@if (address(); as address) { @if (address(); as address) {
<td>{{ address.type }}</td>
<td> <td>
@if (address.access === 'public') { <div class="wrapper">{{ address.type }}</div>
<tui-badge size="s" appearance="primary-success"> </td>
{{ 'public' | i18n }} <td>
</tui-badge> <div class="wrapper">
} @else if (address.access === 'private') { @if (address.access === 'public') {
<tui-badge size="s" appearance="primary-destructive"> <tui-badge size="s" appearance="primary-success">
{{ 'private' | i18n }} {{ 'public' | i18n }}
</tui-badge> </tui-badge>
} @else { } @else if (address.access === 'private') {
- <tui-badge size="s" appearance="primary-destructive">
} {{ 'private' | i18n }}
</tui-badge>
} @else {
-
}
</div>
</td> </td>
<td [style.order]="-1"> <td [style.order]="-1">
<div [title]="address.gatewayName"> <div class="wrapper" [title]="address.gatewayName">
{{ address.gatewayName || '-' }} {{ address.gatewayName || '-' }}
</div> </div>
</td> </td>
<td> <td>
<div [title]="address.url">{{ address.url }}</div> <div class="wrapper" [title]="address.url">{{ address.url }}</div>
</td> </td>
<td <td
actions actions
@@ -48,6 +52,18 @@ import { TuiBadge } from '@taiga-ui/kit'
} }
} }
:host-context(.uncommon-hidden) {
.wrapper {
height: 0;
visibility: hidden;
}
td {
padding-block: 0;
border: hidden;
}
}
div { div {
white-space: normal; white-space: normal;
word-break: break-all; word-break: break-all;

2
web/projects/ui/src/app/routes/portal/components/table.component.ts
View File

@@ -13,6 +13,8 @@ import { i18nKey, i18nPipe } from '@start9labs/shared'
</tr> </tr>
</thead> </thead>
<tbody><ng-content /></tbody> <tbody><ng-content /></tbody>
<ng-content select="tbody" />
<ng-content select="caption" />
`, `,
styles: ` styles: `
:host:has(app-placeholder) thead { :host:has(app-placeholder) thead {

2
web/projects/ui/src/app/routes/portal/routes/services/components/dependencies.component.ts
View File

@@ -25,7 +25,7 @@ import { ToManifestPipe } from '../../../pipes/to-manifest'
[queryParams]="services[d.key] ? {} : { search: d.key }" [queryParams]="services[d.key] ? {} : { search: d.key }"
[class.error]="getError(d.key)" [class.error]="getError(d.key)"
> >
<tui-avatar> <tui-avatar appearance="action-grayscale">
<img <img
alt="" alt=""
[src]=" [src]="

2
web/projects/ui/src/app/routes/portal/routes/services/components/task.component.ts
View File

@@ -25,7 +25,7 @@ import { getManifest } from 'src/app/utils/get-package-data'
selector: 'tr[task]', selector: 'tr[task]',
template: ` template: `
<td tuiFade class="row"> <td tuiFade class="row">
<tui-avatar size="xs"> <tui-avatar appearance="action-grayscale" size="xs">
<img [src]="pkg()?.icon || fallback()?.icon" alt="" /> <img [src]="pkg()?.icon || fallback()?.icon" alt="" />
</tui-avatar> </tui-avatar>
<span>{{ title() || fallback()?.title }}</span> <span>{{ title() || fallback()?.title }}</span>

4
web/projects/ui/src/app/routes/portal/routes/services/routes/outlet.component.ts
View File

@@ -47,7 +47,9 @@ const INACTIVE: PrimaryStatus[] = [
</div> </div>
<aside class="g-aside"> <aside class="g-aside">
<header tuiCell routerLink="./"> <header tuiCell routerLink="./">
<tui-avatar><img alt="" [src]="service()?.icon" /></tui-avatar> <tui-avatar appearance="action-grayscale">
<img alt="" [src]="service()?.icon" />
</tui-avatar>
<span tuiTitle> <span tuiTitle>
<strong tuiFade>{{ manifest()?.title }}</strong> <strong tuiFade>{{ manifest()?.title }}</strong>
<span tuiSubtitle>{{ manifest()?.version }}</span> <span tuiSubtitle>{{ manifest()?.version }}</span>

8
web/projects/ui/src/app/routes/portal/routes/system/routes/authorities/table.component.ts
View File

@@ -1,6 +1,4 @@
import { ChangeDetectionStrategy, Component, inject } from '@angular/core' import { ChangeDetectionStrategy, Component, inject } from '@angular/core'
import { i18nPipe } from '@start9labs/shared'
import { TuiSkeleton } from '@taiga-ui/kit'
import { TableComponent } from 'src/app/routes/portal/components/table.component' import { TableComponent } from 'src/app/routes/portal/components/table.component'
import { AuthorityItemComponent } from './item.component' import { AuthorityItemComponent } from './item.component'
import { AuthorityService } from './authority.service' import { AuthorityService } from './authority.service'
@@ -12,15 +10,11 @@ import { AuthorityService } from './authority.service'
<tr [authority]="{ name: 'Local Root CA' }"></tr> <tr [authority]="{ name: 'Local Root CA' }"></tr>
@for (authority of authorityService.authorities(); track $index) { @for (authority of authorityService.authorities(); track $index) {
<tr [authority]="authority"></tr> <tr [authority]="authority"></tr>
} @empty {
<td [attr.colspan]="4">
<div [tuiSkeleton]="true">{{ 'Loading' | i18n }}</div>
</td>
} }
</table> </table>
`, `,
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
imports: [TuiSkeleton, i18nPipe, TableComponent, AuthorityItemComponent], imports: [TableComponent, AuthorityItemComponent],
}) })
export class AuthoritiesTableComponent { export class AuthoritiesTableComponent {
protected readonly authorityService = inject(AuthorityService) protected readonly authorityService = inject(AuthorityService)

2
web/projects/ui/src/app/routes/portal/routes/system/routes/backups/progress.component.ts
View File

@@ -18,7 +18,7 @@ import { DataModel } from 'src/app/services/patch-db/data-model'
@for (pkg of pkgs() | keyvalue; track $index) { @for (pkg of pkgs() | keyvalue; track $index) {
@if (backupProgress()?.[pkg.key]; as progress) { @if (backupProgress()?.[pkg.key]; as progress) {
<div tuiCell> <div tuiCell>
<tui-avatar> <tui-avatar appearance="action-grayscale">
<img alt="" [src]="pkg.value.icon" /> <img alt="" [src]="pkg.value.icon" />
</tui-avatar> </tui-avatar>
<span tuiTitle> <span tuiTitle>

4
web/projects/ui/src/app/routes/portal/routes/updates/item.component.ts
View File

@@ -45,7 +45,9 @@ import UpdatesComponent from './updates.component'
<tr (click)="expanded.set(!expanded())"> <tr (click)="expanded.set(!expanded())">
<td> <td>
<div [style.gap.rem]="0.75" [style.padding-inline-end.rem]="1"> <div [style.gap.rem]="0.75" [style.padding-inline-end.rem]="1">
<tui-avatar size="s"><img alt="" [src]="item().icon" /></tui-avatar> <tui-avatar appearance="action-grayscale" size="s">
<img alt="" [src]="item().icon" />
</tui-avatar>
<span tuiTitle [style.margin]="'-0.125rem 0 0'"> <span tuiTitle [style.margin]="'-0.125rem 0 0'">
<b tuiFade>{{ item().title }}</b> <b tuiFade>{{ item().title }}</b>
<span tuiSubtitle tuiFade class="mobile"> <span tuiSubtitle tuiFade class="mobile">

2
web/projects/ui/src/app/routes/portal/routes/updates/updates.component.ts
View File

@@ -69,7 +69,7 @@ interface UpdatesData {
[class.g-secondary]="current()?.url !== registry.url" [class.g-secondary]="current()?.url !== registry.url"
(click)="current.set(registry)" (click)="current.set(registry)"
> >
<tui-avatar> <tui-avatar appearance="action-grayscale">
<store-icon [url]="registry.url" /> <store-icon [url]="registry.url" />
</tui-avatar> </tui-avatar>
<span tuiTitle> <span tuiTitle>