From 727ae4ffbf7d65b76031aa1418792cdb9a49bfb8 Mon Sep 17 00:00:00 2001 From: Myzel394 <50424412+Myzel394@users.noreply.github.com> Date: Sun, 5 Mar 2023 11:14:20 +0100 Subject: [PATCH] refactor: Improve i18n for reports --- public/locales/en-US/common.json | 3 + public/locales/en-US/reports.json | 68 ++++++++++++++++ public/locales/en-US/translation.json | 81 ------------------- .../ExpandedUrlsListItem.tsx | 4 +- .../ProxiedImagesListItem.tsx | 8 +- .../SinglePixelImageTrackersListItem.tsx | 4 +- .../ReportsRoute/EmptyStateScreen.tsx | 8 +- .../ReportsRoute/ReportInformationItem.tsx | 8 +- src/routes/ReportDetailRoute.tsx | 28 +++---- src/routes/ReportsRoute.tsx | 8 +- 10 files changed, 100 insertions(+), 120 deletions(-) create mode 100644 public/locales/en-US/reports.json diff --git a/public/locales/en-US/common.json b/public/locales/en-US/common.json index 53af3f0..242d6e4 100644 --- a/public/locales/en-US/common.json +++ b/public/locales/en-US/common.json @@ -51,6 +51,9 @@ "updated": "Alias has been updated successfully!", "changedToEnabled": "Alias has been enabled", "changedToDisabled": "Alias has been disabled" + }, + "report": { + "deleted": "Report has been deleted!" } }, "general": { diff --git a/public/locales/en-US/reports.json b/public/locales/en-US/reports.json new file mode 100644 index 0000000..954a704 --- /dev/null +++ b/public/locales/en-US/reports.json @@ -0,0 +1,68 @@ +{ + "title": "Reports", + "detailsTitle": "Report Details", + "emptyState": { + "title": "Welcome to your Reports!", + "description": "Here you will find your email reports. Currently, you don't have any reports. Wait until you receive an email." + }, + "pageActions": { + "sort": { + "label": "Sorting", + "values": { + "List": "List reports by their date", + "GroupByAlias": "Group reports by their alias" + } + } + }, + "emailMeta": { + "flow": "{{from}} -> {{to}}", + "emptySubject": "" + }, + "actions": { + "delete": { + "label": "Delete Report", + "description": "Are you sure you want to delete this report?", + "continueActionLabel": "Delete Report" + } + }, + "sections": { + "information": { + "title": "Email Information", + "form": { + "from": { + "label": "From" + }, + "to": { + "label": "To" + }, + "subject": { + "label": "Subject" + } + } + }, + "trackers": { + "title": "Trackers", + "results": { + "imageTrackers": { + "text_zero": "No image trackers found", + "text_one": "Removed 1 image tracker", + "text_other": "Removed {{count}} image trackers" + }, + "proxiedImages": { + "text_zero": "No images found", + "text_one": "Forwarding 1 image", + "text_other": "Forwarding {{count}} images", + "status": { + "isStored": "Stored on Server", + "isProxying": "Being forwarded" + } + }, + "expandedUrls": { + "text_zero": "No shortened URLs found", + "text_one": "Expanded 1 URL", + "text_other": "Expanded {{count}} URLs" + } + } + } + } +} diff --git a/public/locales/en-US/translation.json b/public/locales/en-US/translation.json index cf1782d..3ade83d 100644 --- a/public/locales/en-US/translation.json +++ b/public/locales/en-US/translation.json @@ -25,76 +25,6 @@ "OverviewRoute": { "title": "Overview", "description": "Not much to see here, yet." - }, - "ReportsRoute": { - "title": "Reports", - "emptyState": { - "title": "Welcome to your Reports!", - "description": "Here you will find your email reports. Currently, you don't have any reports. Wait until you receive an email." - }, - "pageActions": { - "sort": { - "List": "List reports by their date", - "GroupByAlias": "Group reports by their alias" - } - } - }, - "ReportDetailRoute": { - "title": "Report Details", - "actions": { - "delete": { - "label": "Delete Report", - "description": "Are you sure you want to delete this report?", - "continueAction": "Delete Report" - } - }, - "sections": { - "information": { - "title": "Email Information", - "form": { - "from": { - "label": "From" - }, - "to": { - "label": "To" - }, - "subject": { - "label": "Subject" - } - } - }, - "trackers": { - "title": "Trackers", - "results": { - "imageTrackers": { - "text_zero": "No image trackers found", - "text_one": "Removed 1 image tracker", - "text_other": "Removed {{count}} image trackers" - }, - "proxiedImages": { - "text_zero": "No images found", - "text_one": "Forwarding 1 image", - "text_other": "Forwarding {{count}} images", - "status": { - "isStored": "Stored on Server", - "isProxying": "Being forwarded" - } - }, - "expandedUrls": { - "text_zero": "No shortened URLs found", - "text_one": "Expanded 1 URL", - "text_other": "Expanded {{count}} URLs" - } - } - } - } - }, - "AdminRoute": { - "serverStatus": { - "noRecentReports": "There seems to be some issues with your server. The server hasn't done its cleanup in the last few days. The last report was on {{date}}.", - "error": "There was an error during the last server cleanup job from {{relativeDescription}}. Please check the logs for more information.", - "success": "Everything okay with your server! The last cleanup job was {{relativeDescription}}." - } } }, @@ -196,16 +126,5 @@ } } }, - "report": { - "mutations": { - "success": { - "reportDeleted": "Report has been deleted!" - } - }, - "emailMeta": { - "flow": "{{from}} -> {{to}}", - "emptySubject": "" - } - } } } diff --git a/src/route-widgets/ReportDetailRoute/ExpandedUrlsListItem.tsx b/src/route-widgets/ReportDetailRoute/ExpandedUrlsListItem.tsx index d366d4a..43b48bd 100644 --- a/src/route-widgets/ReportDetailRoute/ExpandedUrlsListItem.tsx +++ b/src/route-widgets/ReportDetailRoute/ExpandedUrlsListItem.tsx @@ -12,13 +12,13 @@ export interface ExpandedUrlsListItemProps { } export default function ExpandedUrlsListItem({urls}: ExpandedUrlsListItemProps): ReactElement { - const {t} = useTranslation() + const {t} = useTranslation("reports") return ( } - title={t("routes.ReportDetailRoute.sections.trackers.results.expandedUrls.text", { + title={t("sections.trackers.results.expandedUrls.text", { count: urls.length, })} > diff --git a/src/route-widgets/ReportDetailRoute/ProxiedImagesListItem.tsx b/src/route-widgets/ReportDetailRoute/ProxiedImagesListItem.tsx index 0a03a86..f5681e0 100644 --- a/src/route-widgets/ReportDetailRoute/ProxiedImagesListItem.tsx +++ b/src/route-widgets/ReportDetailRoute/ProxiedImagesListItem.tsx @@ -17,14 +17,14 @@ export interface ProxiedImagesListItemProps { } export default function ProxiedImagesListItem({images}: ProxiedImagesListItemProps): ReactElement { - const {t} = useTranslation() + const {t} = useTranslation("reports") const serverSettings = useLoaderData() as ServerSettings return ( } - title={t("routes.ReportDetailRoute.sections.trackers.results.proxiedImages.text", { + title={t("sections.trackers.results.proxiedImages.text", { count: images.length, })} > @@ -62,11 +62,11 @@ export default function ProxiedImagesListItem({images}: ProxiedImagesListItemPro ) ) { return t( - "routes.ReportDetailRoute.sections.trackers.results.proxiedImages.status.isStored", + "sections.trackers.results.proxiedImages.status.isStored", ) } else { return t( - "routes.ReportDetailRoute.sections.trackers.results.proxiedImages.status.isProxying", + "sections.trackers.results.proxiedImages.status.isProxying", ) } })()} diff --git a/src/route-widgets/ReportDetailRoute/SinglePixelImageTrackersListItem.tsx b/src/route-widgets/ReportDetailRoute/SinglePixelImageTrackersListItem.tsx index c02e411..decc661 100644 --- a/src/route-widgets/ReportDetailRoute/SinglePixelImageTrackersListItem.tsx +++ b/src/route-widgets/ReportDetailRoute/SinglePixelImageTrackersListItem.tsx @@ -14,7 +14,7 @@ export interface SinglePixelImageTrackersListItemProps { export default function SinglePixelImageTrackersListItem({ images, }: SinglePixelImageTrackersListItemProps): ReactElement { - const {t} = useTranslation() + const {t} = useTranslation("reports") const imagesPerTracker = images.reduce((acc, value) => { acc[value.trackerName] = [...(acc[value.trackerName] || []), value] @@ -26,7 +26,7 @@ export default function SinglePixelImageTrackersListItem({ } - title={t("routes.ReportDetailRoute.sections.trackers.results.imageTrackers.text", { + title={t("sections.trackers.results.imageTrackers.text", { count: images.length, })} > diff --git a/src/route-widgets/ReportsRoute/EmptyStateScreen.tsx b/src/route-widgets/ReportsRoute/EmptyStateScreen.tsx index eb1511c..640cb41 100644 --- a/src/route-widgets/ReportsRoute/EmptyStateScreen.tsx +++ b/src/route-widgets/ReportsRoute/EmptyStateScreen.tsx @@ -5,23 +5,21 @@ import {MdTextSnippet} from "react-icons/md" import {Container, Grid, Typography} from "@mui/material" export default function EmptyStateScreen(): ReactElement { - const {t} = useTranslation() + const {t} = useTranslation("reports") return ( - {t("routes.ReportsRoute.emptyState.title")} + {t("emptyState.title")} - - {t("routes.ReportsRoute.emptyState.description")} - + {t("emptyState.description")} diff --git a/src/route-widgets/ReportsRoute/ReportInformationItem.tsx b/src/route-widgets/ReportsRoute/ReportInformationItem.tsx index aacbc66..2d423dc 100644 --- a/src/route-widgets/ReportsRoute/ReportInformationItem.tsx +++ b/src/route-widgets/ReportsRoute/ReportInformationItem.tsx @@ -11,18 +11,16 @@ export interface ReportInformationItemProps { } export default function ReportInformationItem({report}: ReportInformationItemProps): ReactElement { + const {t} = useTranslation("reports") const navigate = useNavigate() - const {t} = useTranslation() return ( navigate(`/reports/${report.id}`)}> {t("relations.report.emailMeta.emptySubject")} - ) + report.messageDetails.content.subject || {t("emailMeta.emptySubject")} } - secondary={t("relations.report.emailMeta.flow", { + secondary={t("emailMeta.flow", { from: report.messageDetails.meta.from, to: report.messageDetails.meta.to, })} diff --git a/src/routes/ReportDetailRoute.tsx b/src/routes/ReportDetailRoute.tsx index 7d4b36f..67a2dd9 100644 --- a/src/routes/ReportDetailRoute.tsx +++ b/src/routes/ReportDetailRoute.tsx @@ -21,7 +21,7 @@ import ProxiedImagesListItem from "~/route-widgets/ReportDetailRoute/ProxiedImag import SinglePixelImageTrackersListItem from "~/route-widgets/ReportDetailRoute/SinglePixelImageTrackersListItem" function ReportDetailRoute(): ReactElement { - const {t} = useTranslation() + const {t} = useTranslation(["reports", "common"]) const params = useParams() const query = useQuery(["get_report", params.id], () => @@ -30,16 +30,16 @@ function ReportDetailRoute(): ReactElement { return ( deleteReport(params.id!)} - label={t("routes.ReportDetailRoute.actions.delete.label")} - description={t("routes.ReportDetailRoute.actions.delete.description")} - continueLabel={t("routes.ReportDetailRoute.actions.delete.continueAction")} + label={t("actions.delete.label")} + description={t("delete.description")} + continueLabel={t("actions.delete.continueActionLabel")} navigateTo={"/reports"} - successMessage={t("relations.report.mutations.success.reportDeleted")} + successMessage={t("messages.report.deleted", {ns: "common"})} /> ) } @@ -52,16 +52,14 @@ function ReportDetailRoute(): ReactElement { {[ {[ { @@ -72,9 +70,7 @@ function ReportDetailRoute(): ReactElement { { (report as DecryptedReportContent) @@ -85,7 +81,7 @@ function ReportDetailRoute(): ReactElement { { @@ -99,9 +95,7 @@ function ReportDetailRoute(): ReactElement { = { [SortingView.GroupByAlias]: , } const SORTING_VIEW_NAME_MAP: Record = createEnumMapFromTranslation( - "routes.ReportsRoute.pageActions.sort", + "pageActions.sort.values", SortingView, ) function ReportsRoute(): ReactElement { - const {t} = useTranslation() + const {t} = useTranslation("reports") const query = useQuery, AxiosError>(["get_reports"], getReports) @@ -40,13 +40,13 @@ function ReportsRoute(): ReactElement { return ( 0 && ( setSortingView(event.target.value as SortingView)} - label="Sorting" + label={t("pageActions.sort.label")} id="sorting" InputProps={{ startAdornment: (