From 011ac6c71389f0430d995396992e649fa0d5bc91 Mon Sep 17 00:00:00 2001 From: moonrailgun Date: Wed, 28 Feb 2024 22:28:12 +0800 Subject: [PATCH] feat: add telemetry feature desc --- pnpm-lock.yaml | 143 +++++++++++------- src/client/components/PageHeader.tsx | 12 ++ .../components/telemetry/TelemetryList.tsx | 31 +++- src/client/i18next-toolkit.config.cjs | 2 +- src/client/package.json | 2 +- 5 files changed, 135 insertions(+), 55 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c0eb2f4..6d89e09 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -179,8 +179,8 @@ importers: version: 4.4.1(@types/react@18.2.21)(react@18.2.0) devDependencies: '@i18next-toolkit/cli': - specifier: ^1.0.2 - version: 1.0.2(typescript@5.2.2) + specifier: ^1.0.4 + version: 1.0.4(typescript@5.2.2) '@types/leaflet': specifier: ^1.9.8 version: 1.9.8 @@ -515,7 +515,7 @@ importers: version: 3.3.5(ts-node@10.9.1) ts-node: specifier: ^10.9.1 - version: 10.9.1(@types/node@20.11.19)(typescript@4.7.4) + version: 10.9.1(@types/node@18.17.12)(typescript@4.7.4) typescript: specifier: ^4.7.4 version: 4.7.4 @@ -5111,6 +5111,7 @@ packages: engines: {node: '>=6.9.0'} dependencies: regenerator-runtime: 0.14.0 + dev: false /@babel/runtime@7.23.8: resolution: {integrity: sha512-Y7KbAP984rn1VGMbGqKmBLio9V7y5Je9GvU4rQPCPinCyNfUcToxIXl06d59URp/F3LwinvODxab5N/G6qggkw==} @@ -6112,7 +6113,7 @@ packages: peerDependencies: react: '*' dependencies: - '@types/react': 18.2.21 + '@types/react': 18.2.56 prop-types: 15.8.1 react: 17.0.2 @@ -7005,14 +7006,15 @@ packages: engines: {node: '>=10.13.0'} dev: true - /@i18next-toolkit/cli@1.0.2(typescript@5.2.2): - resolution: {integrity: sha512-U1+tJL8/RY1nzIC51O7XCNxsqcwL/dEBxndGipz6HWW2dQ4Ej6riC2bclkwA/couFqUB8wM806ttJuBo30Sl0g==} + /@i18next-toolkit/cli@1.0.4(typescript@5.2.2): + resolution: {integrity: sha512-DsiHoxk0NVs8UIJybBlvxTUCUqYW7UV5drs/CkAK2Wa4R8N9QYzvOAG+DRTKHVt+EsX5SMpqwuVJq0Hb5y84XA==} hasBin: true dependencies: - '@i18next-toolkit/extractor': 1.0.0 + '@i18next-toolkit/extractor': 1.0.1 '@i18next-toolkit/scanner': 1.0.0 cosmiconfig: 9.0.0(typescript@5.2.2) fs-extra: 11.2.0 + inquirer: 8.2.6 yargs: 17.7.2 zod: 3.22.4 transitivePeerDependencies: @@ -7020,8 +7022,8 @@ packages: - typescript dev: true - /@i18next-toolkit/extractor@1.0.0: - resolution: {integrity: sha512-lVp6OCBwK8affgmD/zaFWl0dFofL4OTJJhcZSNEJVOj/v0K8swhaVbwz+e3K6rWuflrr1vcyr0nJQK2Nzmdp+g==} + /@i18next-toolkit/extractor@1.0.1: + resolution: {integrity: sha512-lGMKMixeysKKyZlKCUWjO/Ougj1nqPzIhIFCguh6nEiyM6/rbIX/0wOa4SStlVvCJP5DZXgo+LMcZ4NcuahBRg==} dependencies: crc: 4.3.2 esbuild: 0.20.0 @@ -7029,6 +7031,7 @@ packages: gulp-sort: 2.0.0 i18next-scanner: 4.4.0 lodash.without: 4.4.0 + map-stream: 0.0.7 vinyl-fs: 4.0.0 transitivePeerDependencies: - buffer @@ -9733,12 +9736,6 @@ packages: /@types/node@18.17.12: resolution: {integrity: sha512-d6xjC9fJ/nSnfDeU0AMDsaJyb1iHsqCSOdi84w4u+SlN/UgQdY5tRhpMzaFYsI4mnpvgTivEaQd0yOUhAtOnEQ==} - /@types/node@20.11.19: - resolution: {integrity: sha512-7xMnVEcZFu0DikYjWOlRq7NTPETrm7teqUT2WkQjrTIkEgUyyGdWsj/Zg8bEJt5TNklzbPD1X3fqfsHw3SpapQ==} - dependencies: - undici-types: 5.26.5 - dev: true - /@types/nodemailer@6.4.11: resolution: {integrity: sha512-Ld2c0frwpGT4VseuoeboCXQ7UJIkK3X7Lx/4YsZEiUHtHsthWAOCYtf6PAiLhMtfwV0cWJRabLBS3+LD8x6Nrw==} dependencies: @@ -9843,7 +9840,7 @@ packages: resolution: {integrity: sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==} dependencies: '@types/history': 4.7.11 - '@types/react': 18.2.21 + '@types/react': 18.2.56 /@types/react-slick@0.23.11: resolution: {integrity: sha512-52AbNhYN7u0ATqAUvap2MXNG3znUsJslAWgebUHrovvnJ6EG6oic+TZyC82XiwwvijRMyL2V0C2wPJbzsSwllw==} @@ -11616,6 +11613,11 @@ packages: string-width: 4.2.3 dev: true + /cli-width@3.0.0: + resolution: {integrity: sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==} + engines: {node: '>= 10'} + dev: true + /cli-width@4.1.0: resolution: {integrity: sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==} engines: {node: '>= 12'} @@ -14161,6 +14163,13 @@ packages: web-streams-polyfill: 3.2.1 dev: true + /figures@3.2.0: + resolution: {integrity: sha512-yaduQFRKLXYOGgEn6AZau90j3ggSOyiqXU0F9JZfeXYhNa+Jk4X+s45A2zg5jns87GAFa34BBm2kXw4XpNcbdg==} + engines: {node: '>=8'} + dependencies: + escape-string-regexp: 1.0.5 + dev: true + /figures@5.0.0: resolution: {integrity: sha512-ej8ksPF4x6e5wvK9yevct0UCXh8TTFlWGVLlgjZuoBH1HwjIfKE/IdL5mq89sFA7zELi1VhKpmtDnrs7zWyeyg==} engines: {node: '>=14'} @@ -15639,6 +15648,27 @@ packages: fast-loops: 1.1.3 dev: false + /inquirer@8.2.6: + resolution: {integrity: sha512-M1WuAmb7pn9zdFRtQYk26ZBoY043Sse0wVDdk4Bppr+JOXyQYybdtvK+l9wUibhtjdjvtoiNy8tk+EgsYIUqKg==} + engines: {node: '>=12.0.0'} + dependencies: + ansi-escapes: 4.3.2 + chalk: 4.1.2 + cli-cursor: 3.1.0 + cli-width: 3.0.0 + external-editor: 3.1.0 + figures: 3.2.0 + lodash: 4.17.21 + mute-stream: 0.0.8 + ora: 5.4.1 + run-async: 2.4.1 + rxjs: 7.8.1 + string-width: 4.2.3 + strip-ansi: 6.0.1 + through: 2.3.8 + wrap-ansi: 6.2.0 + dev: true + /inquirer@9.2.12: resolution: {integrity: sha512-mg3Fh9g2zfuVWJn6lhST0O7x4n03k7G8Tx5nvikJkbq8/CK47WDVm+UznF0G6s5Zi0KcyUisr6DU8T67N5U+1Q==} engines: {node: '>=14.18.0'} @@ -16763,6 +16793,10 @@ packages: inversify: 5.1.1 dev: false + /map-stream@0.0.7: + resolution: {integrity: sha512-C0X0KQmGm3N2ftbTGBhSyuydQ+vV1LC3f3zPvT3RXHXNZrvfPZcoXp/N5DOa8vedX/rTMm2CjTtivFg2STJMRQ==} + dev: true + /mapbox-gl@1.13.3: resolution: {integrity: sha512-p8lJFEiqmEQlyv+DQxFAOG/XPWN0Wp7j/Psq93Zywz7qt9CcUKFYDBOoOEKzqe6gudHVJY8/Bhqw6VDpX2lSBg==} engines: {node: '>=6.4.0'} @@ -17847,6 +17881,10 @@ packages: resolution: {integrity: sha512-TvmkNhkv8yct0SVBSy+o8wYzXjE4Zz3PCesbfs8HiCXXdcTuocApFv11UWlNFWKYsP2okqrhb7JNlSm9InBhIw==} dev: false + /mute-stream@0.0.8: + resolution: {integrity: sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==} + dev: true + /mute-stream@1.0.0: resolution: {integrity: sha512-avsJQhyd+680gKXyG/sQc0nXaC6rBkPOfyHYcFb9+hdkqQkR9bdnkJ0AMZhke0oesPqIO+mFFJ+IdBc7mst4IA==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} @@ -21936,7 +21974,7 @@ packages: /regenerator-transform@0.15.2: resolution: {integrity: sha512-hfMp2BoF0qOk3uc5V20ALGDS2ddjQaLrdl7xrGXvAIow7qeWRM2VA2HuCHkUKk9slq3VwEwLNK3DFBqDfPGYtg==} dependencies: - '@babel/runtime': 7.22.11 + '@babel/runtime': 7.23.9 /regexp.prototype.flags@1.5.1: resolution: {integrity: sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==} @@ -22435,6 +22473,11 @@ packages: execa: 5.1.1 dev: true + /run-async@2.4.1: + resolution: {integrity: sha512-tvVnVv01b8c1RrA6Ep7JkStj85Guv/YrMcwqYQnwjsAS2cTmmPGBBjAjpCW7RrSodNSoE2/qg9O4bceNvUuDgQ==} + engines: {node: '>=0.12.0'} + dev: true + /run-async@3.0.0: resolution: {integrity: sha512-540WwVDOMxA6dN6We19EcT9sc3hkXPw5mzRNGM3FkdN/vtE9NFvj5lFAPNwUDmJjXidm3v7TC1cTE7t17Ulm1Q==} engines: {node: '>=0.12.0'} @@ -23964,6 +24007,37 @@ packages: code-block-writer: 12.0.0 dev: true + /ts-node@10.9.1(@types/node@18.17.12)(typescript@4.7.4): + resolution: {integrity: sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==} + hasBin: true + peerDependencies: + '@swc/core': '>=1.2.50' + '@swc/wasm': '>=1.2.50' + '@types/node': '*' + typescript: '>=2.7' + peerDependenciesMeta: + '@swc/core': + optional: true + '@swc/wasm': + optional: true + dependencies: + '@cspotcode/source-map-support': 0.8.1 + '@tsconfig/node10': 1.0.9 + '@tsconfig/node12': 1.0.11 + '@tsconfig/node14': 1.0.3 + '@tsconfig/node16': 1.0.4 + '@types/node': 18.17.12 + acorn: 8.11.3 + acorn-walk: 8.3.2 + arg: 4.1.3 + create-require: 1.1.1 + diff: 4.0.2 + make-error: 1.3.6 + typescript: 4.7.4 + v8-compile-cache-lib: 3.0.1 + yn: 3.1.1 + dev: true + /ts-node@10.9.1(@types/node@18.17.12)(typescript@5.2.2): resolution: {integrity: sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==} hasBin: true @@ -24026,37 +24100,6 @@ packages: yn: 3.1.1 dev: false - /ts-node@10.9.1(@types/node@20.11.19)(typescript@4.7.4): - resolution: {integrity: sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==} - hasBin: true - peerDependencies: - '@swc/core': '>=1.2.50' - '@swc/wasm': '>=1.2.50' - '@types/node': '*' - typescript: '>=2.7' - peerDependenciesMeta: - '@swc/core': - optional: true - '@swc/wasm': - optional: true - dependencies: - '@cspotcode/source-map-support': 0.8.1 - '@tsconfig/node10': 1.0.9 - '@tsconfig/node12': 1.0.11 - '@tsconfig/node14': 1.0.3 - '@tsconfig/node16': 1.0.4 - '@types/node': 20.11.19 - acorn: 8.11.3 - acorn-walk: 8.3.2 - arg: 4.1.3 - create-require: 1.1.1 - diff: 4.0.2 - make-error: 1.3.6 - typescript: 4.7.4 - v8-compile-cache-lib: 3.0.1 - yn: 3.1.1 - dev: true - /ts-pattern@4.3.0: resolution: {integrity: sha512-pefrkcd4lmIVR0LA49Imjf9DYLK8vtWhqBPA3Ya1ir8xCW0O2yjL9dsCVvI7pCodLC5q7smNpEtDR2yVulQxOg==} dev: true @@ -24266,10 +24309,6 @@ packages: resolution: {integrity: sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==} dev: true - /undici-types@5.26.5: - resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==} - dev: true - /unenv@1.7.4: resolution: {integrity: sha512-fjYsXYi30It0YCQYqLOcT6fHfMXsBr2hw9XC7ycf8rTG7Xxpe3ZssiqUnD0khrjiZEmkBXWLwm42yCSCH46fMw==} dependencies: diff --git a/src/client/components/PageHeader.tsx b/src/client/components/PageHeader.tsx index df35ac0..52dbd89 100644 --- a/src/client/components/PageHeader.tsx +++ b/src/client/components/PageHeader.tsx @@ -1,11 +1,23 @@ +import { QuestionCircleOutlined } from '@ant-design/icons'; +import { Tooltip } from 'antd'; import React from 'react'; export const PageHeader: React.FC<{ title: string; + desc?: React.ReactNode; action?: React.ReactNode; }> = React.memo((props) => { return (
+
+ {props.title} + {props.desc && ( + + + + )} +
+
{props.title}
{props.action}
diff --git a/src/client/components/telemetry/TelemetryList.tsx b/src/client/components/telemetry/TelemetryList.tsx index 8a3dc2e..138157c 100644 --- a/src/client/components/telemetry/TelemetryList.tsx +++ b/src/client/components/telemetry/TelemetryList.tsx @@ -1,4 +1,4 @@ -import { t } from '@i18next-toolkit/react'; +import { Trans, t } from '@i18next-toolkit/react'; import { Button, Form, Input, Modal, Table } from 'antd'; import React, { useMemo, useState } from 'react'; import { AppRouterOutput, trpc } from '../../api/trpc'; @@ -52,6 +52,35 @@ export const TelemetryList: React.FC = React.memo(() => {
+

+ + Telemetry is a technology that reports access data even on pages + that are not under your control. As long as the other website + allows the insertion of third-party images (e.g., forums, blogs, + and various rich-text editors), then the data can be collected + and used to analyze the images when they are loaded by the user. + +

+ +

+ + Generally, we will use a one-pixel blank image so that it will + not affect the user's normal use. + +

+ +

+ + At the same time, we can also use it in some client-side + application scenarios, such as collecting the frequency of cli + usage, such as collecting the installation of selfhosted apps, + and so on. + +

+
+ } action={