Admin UI: Use l10n translations everywhere (#692)

* feat: move all texts to l10n file

* fix: add trailing comma

* fix: remove fixed names

* fix: localization structure and add context translation keys

* chore: extract more context text

* chore: add space

* fix: change from camel case to underscore notation

* chore: addition to camel case to underscore fix

* fix: remove localization from assert

* fix: remove invalid state

* fix: remove signs from translation

* fix: add sign to translated text

* revert: undo the space for the app title

* fix: add trailing comma

* fix: make text translatable

* fix: remove translation within translation

* fix: remove the rest of translation within translation

* refactor:  translation names

* fix: add trailing comma

---------

Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com>

AdminUi/apps/admin_ui/lib/core/modals/add_quota_dialog.dart

@@ -82,7 +82,7 @@ class _AddQuotaDialogState extends State<_AddQuotaDialog> {
     return PopScope(
       canPop: !_saving,
       child: AlertDialog(
-        title: const Text('Add Quota'),
+        title: Text(context.l10n.addQuota),
         content: SizedBox(
           width: 500,
           child: Column(
@@ -92,37 +92,37 @@ class _AddQuotaDialogState extends State<_AddQuotaDialog> {
                 value: _selectedMetric,
                 items: widget.availableMetrics.map((metric) => DropdownMenuItem(value: metric.key, child: Text(metric.displayName))).toList(),
                 onChanged: _saving ? null : (String? selected) => setState(() => _selectedMetric = selected),
-                decoration: const InputDecoration(
-                  border: OutlineInputBorder(),
-                  labelText: 'Metric*',
+                decoration: InputDecoration(
+                  border: const OutlineInputBorder(),
+                  labelText: '${context.l10n.metric}*',
                 ),
               ),
               Gaps.h24,
               TextField(
                 controller: _maxAmountController,
                 enabled: !_saving,
-                decoration: const InputDecoration(
-                  border: OutlineInputBorder(),
-                  labelText: 'Max Amount*',
-                  helperText: 'Only numbers greater or equal to 0 are valid.',
+                decoration: InputDecoration(
+                  border: const OutlineInputBorder(),
+                  labelText: '${context.l10n.maxAmount}*',
+                  helperText: context.l10n.addQuotaDialog_maxAmount_message,
                 ),
                 inputFormatters: <TextInputFormatter>[FilteringTextInputFormatter.digitsOnly],
                 keyboardType: TextInputType.number,
               ),
               Gaps.h24,
               DropdownButtonFormField(
                 value: _selectedPeriod,
-                items: const [
-                  DropdownMenuItem(value: 'Hour', child: Text('Hour')),
-                  DropdownMenuItem(value: 'Day', child: Text('Day')),
-                  DropdownMenuItem(value: 'Week', child: Text('Week')),
-                  DropdownMenuItem(value: 'Month', child: Text('Month')),
-                  DropdownMenuItem(value: 'Year', child: Text('Year')),
+                items: [
+                  DropdownMenuItem(value: 'Hour', child: Text(context.l10n.hour)),
+                  DropdownMenuItem(value: 'Day', child: Text(context.l10n.day)),
+                  DropdownMenuItem(value: 'Week', child: Text(context.l10n.week)),
+                  DropdownMenuItem(value: 'Month', child: Text(context.l10n.month)),
+                  DropdownMenuItem(value: 'Year', child: Text(context.l10n.year)),
                 ],
                 onChanged: _saving ? null : (String? selected) => setState(() => _selectedPeriod = selected),
-                decoration: const InputDecoration(
-                  border: OutlineInputBorder(),
-                  labelText: 'Period*',
+                decoration: InputDecoration(
+                  border: const OutlineInputBorder(),
+                  labelText: '${context.l10n.period}*',
                 ),
               ),
               if (_errorMessage != null)
@@ -143,7 +143,7 @@ class _AddQuotaDialogState extends State<_AddQuotaDialog> {
           ),
           FilledButton(
             onPressed: _isValid && !_saving ? _addQuota : null,
-            child: const Text('Add'),
+            child: Text(context.l10n.add),
           ),
         ],
       ),
@@ -153,7 +153,7 @@ class _AddQuotaDialogState extends State<_AddQuotaDialog> {
   Future<void> _addQuota() async {
     setState(() => _saving = true);
 
-    assert(_selectedMetric != null && _maxAmount != null && _selectedPeriod != null, 'Invalid state');
+    assert(_selectedMetric != null && _maxAmount != null && _selectedPeriod != null, 'Invalid State');
 
     final response = await widget.addQuota(
       metricKey: _selectedMetric!,

AdminUi/apps/admin_ui/lib/core/modals/confirmation_dialog.dart

@@ -1,5 +1,7 @@
 import 'package:flutter/material.dart';
 
+import '../extensions.dart';
+
 Future<bool> showConfirmationDialog({
   required BuildContext context,
   required String title,
@@ -27,11 +29,11 @@ class _ConfirmationDialog extends StatelessWidget {
       actions: [
         OutlinedButton(
           onPressed: () => Navigator.of(context).pop(false),
-          child: const Text('Cancel'),
+          child: Text(context.l10n.cancel),
         ),
         FilledButton(
           onPressed: () => Navigator.of(context).pop(true),
-          child: const Text('Confirm'),
+          child: Text(context.l10n.confirm),
         ),
       ],
     );

AdminUi/apps/admin_ui/lib/core/modals/settings_dialog.dart

@@ -3,6 +3,7 @@ import 'package:go_router/go_router.dart';
 import 'package:watch_it/watch_it.dart';
 
 import '../constants.dart';
+import '../extensions.dart';
 import '../models/models.dart';
 
 Future<void> openSettingsDialog(BuildContext context) async {
@@ -17,26 +18,26 @@ class _SettingsDialog extends StatelessWidget with WatchItMixin {
     final themeMode = watchValue((ThemeModeModel x) => x.themeMode);
 
     return AlertDialog(
-      title: const Text('Settings'),
+      title: Text(context.l10n.settings),
       content: Column(
         mainAxisSize: MainAxisSize.min,
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          Text('Theme', style: Theme.of(context).textTheme.bodyLarge),
+          Text(context.l10n.theme, style: Theme.of(context).textTheme.bodyLarge),
           Gaps.h4,
           SegmentedButton(
             showSelectedIcon: false,
-            segments: const [
-              ButtonSegment(value: ThemeMode.light, icon: Icon(Icons.light_mode), label: Text('Light')),
-              ButtonSegment(value: ThemeMode.system, icon: Icon(Icons.settings), label: Text('System')),
-              ButtonSegment(value: ThemeMode.dark, icon: Icon(Icons.dark_mode), label: Text('Dark')),
+            segments: [
+              ButtonSegment(value: ThemeMode.light, icon: const Icon(Icons.light_mode), label: Text(context.l10n.light)),
+              ButtonSegment(value: ThemeMode.system, icon: const Icon(Icons.settings), label: Text(context.l10n.system)),
+              ButtonSegment(value: ThemeMode.dark, icon: const Icon(Icons.dark_mode), label: Text(context.l10n.dark)),
             ],
             selected: {themeMode},
             onSelectionChanged: (selected) => GetIt.I<ThemeModeModel>().setThemeMode(selected.first),
           ),
         ],
       ),
-      actions: [FilledButton(onPressed: () => context.pop(), child: const Text('Close'))],
+      actions: [FilledButton(onPressed: () => context.pop(), child: Text(context.l10n.close))],
     );
   }
 }

AdminUi/apps/admin_ui/lib/core/widgets/identities_data_table/identities_data_table.dart

@@ -2,6 +2,7 @@ import 'package:data_table_2/data_table_2.dart';
 import 'package:flutter/material.dart';
 
 import '../../constants.dart';
+import '../../extensions.dart';
 import 'identities_data_table_source.dart';
 
 export 'identities_data_table_source.dart';
@@ -36,26 +37,26 @@ class _IdentitiesDataTableState extends State<IdentitiesDataTable> {
       isVerticalScrollBarVisible: true,
       renderEmptyRowsInTheEnd: false,
       availableRowsPerPage: const [5, 10, 25, 50, 100],
-      empty: const Text('No identities found.'),
+      empty: Text(context.l10n.identitiesDataTable_noIdentitiesFound),
       errorBuilder: (error) => Center(
         child: Column(
           mainAxisSize: MainAxisSize.min,
           children: [
-            const Text('An error occurred loading the data.'),
+            Text(context.l10n.identitiesDataTable_failedToLoadData),
             Gaps.h16,
-            FilledButton(onPressed: widget.dataSource.refreshDatasource, child: const Text('Retry')),
+            FilledButton(onPressed: widget.dataSource.refreshDatasource, child: Text(context.l10n.retry)),
           ],
         ),
       ),
       columns: <DataColumn2>[
-        DataColumn2(label: const Text('Address'), size: ColumnSize.L, onSort: _sort),
-        if (!widget.hideTierColumn) const DataColumn2(label: Text('Tier'), size: ColumnSize.S),
-        DataColumn2(label: const Text('Created with Client'), onSort: _sort),
-        DataColumn2(label: const Text('Number of Devices'), onSort: _sort),
-        DataColumn2(label: const Text('Created at'), size: ColumnSize.S, onSort: _sort),
-        DataColumn2(label: const Text('Last Login at'), size: ColumnSize.S, onSort: _sort),
-        DataColumn2(label: const Text('Datawallet version'), onSort: _sort),
-        DataColumn2(label: const Text('Identity Version'), onSort: _sort),
+        DataColumn2(label: Text(context.l10n.address), size: ColumnSize.L, onSort: _sort),
+        if (!widget.hideTierColumn) DataColumn2(label: Text(context.l10n.tier), size: ColumnSize.S),
+        DataColumn2(label: Text(context.l10n.identitiesDataTable_createdWithClient), onSort: _sort),
+        DataColumn2(label: Text(context.l10n.numberOfDevices), onSort: _sort),
+        DataColumn2(label: Text(context.l10n.createdAt), size: ColumnSize.S, onSort: _sort),
+        DataColumn2(label: Text(context.l10n.lastLoginAt), size: ColumnSize.S, onSort: _sort),
+        DataColumn2(label: Text(context.l10n.datawalletVersion), onSort: _sort),
+        DataColumn2(label: Text(context.l10n.identityVersion), onSort: _sort),
       ],
     );
   }

AdminUi/apps/admin_ui/lib/core/widgets/identities_data_table/identities_filter.dart

@@ -5,6 +5,7 @@ import 'package:intl/intl.dart';
 import 'package:multi_dropdown/multiselect_dropdown.dart';
 
 import '../../constants.dart';
+import '../../extensions.dart';
 import '../filters/filters.dart';
 
 class IdentitiesFilter extends StatefulWidget {
@@ -60,7 +61,7 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
           mainAxisSize: MainAxisSize.min,
           children: [
             InputField(
-              label: 'Address',
+              label: context.l10n.address,
               onEnteredText: (String enteredText) {
                 _filter = _filter.copyWith(address: enteredText.isEmpty ? const Optional.absent() : Optional(enteredText));
                 widget.onFilterChanged(filter: _filter);
@@ -69,8 +70,8 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             if (widget.fixedTierId == null) ...[
               Gaps.w16,
               MultiSelectFilter(
-                label: 'Tiers',
-                searchLabel: 'Search Tiers',
+                label: context.l10n.tiers,
+                searchLabel: context.l10n.searchTiers,
                 controller: _tierController,
                 onOptionSelected: (List<ValueItem<String>> selectedOptions) {
                   final selectedTiers = selectedOptions.map((item) => item.value!).toList();
@@ -81,8 +82,8 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             ],
             Gaps.w16,
             MultiSelectFilter(
-              label: 'Clients',
-              searchLabel: 'Search Clients',
+              label: context.l10n.clients,
+              searchLabel: context.l10n.identitiesFilter_searchClients,
               controller: _clientController,
               onOptionSelected: (List<ValueItem<String>> selectedOptions) {
                 final selectedClients = selectedOptions.map((item) => item.value!).toList();
@@ -92,7 +93,7 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             ),
             Gaps.w16,
             NumberFilter(
-              label: 'Number of Devices',
+              label: context.l10n.numberOfDevices,
               onNumberSelected: (FilterOperator operator, String enteredValue) {
                 final numberOfDevices = FilterOperatorValue(operator, enteredValue);
                 _filter = _filter.copyWith(numberOfDevices: numberOfDevices.value.isEmpty ? const Optional.absent() : Optional(numberOfDevices));
@@ -101,7 +102,7 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             ),
             Gaps.w16,
             DateFilter(
-              label: 'Created At',
+              label: context.l10n.createdAt,
               onFilterSelected: (FilterOperator operator, DateTime? selectedDate) {
                 final createdAt = FilterOperatorValue(operator, selectedDate != null ? DateFormat('yyyy-MM-dd').format(selectedDate) : '');
                 _filter = _filter.copyWith(createdAt: createdAt.value.isEmpty ? const Optional.absent() : Optional(createdAt));
@@ -110,7 +111,7 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             ),
             Gaps.w16,
             DateFilter(
-              label: 'Last Login At',
+              label: context.l10n.lastLoginAt,
               onFilterSelected: (FilterOperator operator, DateTime? selectedDate) {
                 final lastLoginAt = FilterOperatorValue(operator, selectedDate != null ? DateFormat('yyyy-MM-dd').format(selectedDate) : '');
                 _filter = _filter.copyWith(lastLoginAt: lastLoginAt.value.isEmpty ? const Optional.absent() : Optional(lastLoginAt));
@@ -119,7 +120,7 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             ),
             Gaps.w16,
             NumberFilter(
-              label: 'Datawallet Version',
+              label: context.l10n.datawalletVersion,
               onNumberSelected: (FilterOperator operator, String enteredValue) {
                 final datawalletVersion = FilterOperatorValue(operator, enteredValue);
                 _filter =
@@ -129,7 +130,7 @@ class _IdentitiesFilterState extends State<IdentitiesFilter> {
             ),
             Gaps.w16,
             NumberFilter(
-              label: 'Identity Version',
+              label: context.l10n.identityVersion,
               onNumberSelected: (FilterOperator operator, String enteredValue) {
                 final identityVersion = FilterOperatorValue(operator, enteredValue);
                 _filter = _filter.copyWith(identityVersion: identityVersion.value.isEmpty ? const Optional.absent() : Optional(identityVersion));

AdminUi/apps/admin_ui/lib/core/widgets/quotas_button_group.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:get_it/get_it.dart';
 
 import '../constants.dart';
+import '../extensions.dart';
 import '../modals/modals.dart';
 
 class QuotasButtonGroup extends StatefulWidget {
@@ -62,9 +63,9 @@ class _QuotasButtonGroupState extends State<QuotasButtonGroup> {
   Future<void> _removeSelectedQuotas() async {
     final confirmed = await showConfirmationDialog(
       context: context,
-      title: 'Remove Quotas',
+      title: context.l10n.quotaButtonGroup_removeQuotas_title,
       message:
-          'Are you sure you want to remove the selected quotas from ${widget.identityAddress != null ? 'the identity "${widget.identityAddress}"' : 'the tier "${widget.tierId}"'}?',
+          '${context.l10n.quotaButtonGroup_deletionMessage} ${widget.identityAddress != null ? '${context.l10n.quotaButtonGroup_theIdentity} "${widget.identityAddress}"' : '${context.l10n.quotaButtonGroup_theTier} "${widget.tierId}"'}?',
     );
 
     if (!confirmed) return;
@@ -73,8 +74,8 @@ class _QuotasButtonGroupState extends State<QuotasButtonGroup> {
       final result = await _deleteQuota(quota);
       if (result.hasError && mounted) {
         ScaffoldMessenger.of(context).showSnackBar(
-          const SnackBar(
-            content: Text('An error occurred while deleting the quota(s). Please try again.'),
+          SnackBar(
+            content: Text(context.l10n.quotaButtonGroup_errorDeletingQuota),
             showCloseIcon: true,
           ),
         );
@@ -87,8 +88,8 @@ class _QuotasButtonGroupState extends State<QuotasButtonGroup> {
     widget.selectedQuotas.clear();
     if (mounted) {
       ScaffoldMessenger.of(context).showSnackBar(
-        const SnackBar(
-          content: Text('Selected quota(s) have been removed.'),
+        SnackBar(
+          content: Text(context.l10n.quotaButtonGroup_selectedQuotaRemoved),
           showCloseIcon: true,
         ),
       );

AdminUi/apps/admin_ui/lib/home/clients_overview/clients_filter.dart

@@ -123,7 +123,7 @@ class _ClientsFilterRowState extends State<ClientsFilterRow> {
           mainAxisSize: MainAxisSize.min,
           children: [
             InputField(
-              label: 'Client ID',
+              label: context.l10n.clientID,
               onEnteredText: (String enteredText) {
                 filter = filter.copyWith(clientId: enteredText.isEmpty ? const Optional.absent() : Optional(enteredText));
 
@@ -132,7 +132,7 @@ class _ClientsFilterRowState extends State<ClientsFilterRow> {
             ),
             Gaps.w16,
             InputField(
-              label: 'Display Name',
+              label: context.l10n.displayName,
               onEnteredText: (String enteredText) {
                 filter = filter.copyWith(displayName: enteredText.isEmpty ? const Optional.absent() : Optional(enteredText));
 
@@ -141,8 +141,8 @@ class _ClientsFilterRowState extends State<ClientsFilterRow> {
             ),
             Gaps.w16,
             MultiSelectFilter(
-              label: 'Default Tier',
-              searchLabel: 'Search Tiers',
+              label: context.l10n.defaultTier,
+              searchLabel: context.l10n.searchTiers,
               controller: _tierController,
               onOptionSelected: (List<ValueItem<dynamic>> selectedOptions) {
                 filter = filter.copyWith(
@@ -154,7 +154,7 @@ class _ClientsFilterRowState extends State<ClientsFilterRow> {
             ),
             Gaps.w16,
             NumberFilter(
-              label: 'Number of Identitites',
+              label: context.l10n.numberOfIdentities,
               onNumberSelected: (FilterOperator operator, String enteredValue) {
                 filter = filter.copyWith(
                   numberOfIdentities: enteredValue.isEmpty ? const Optional.absent() : Optional((operator, int.parse(enteredValue))),
@@ -165,7 +165,7 @@ class _ClientsFilterRowState extends State<ClientsFilterRow> {
             ),
             Gaps.w16,
             DateFilter(
-              label: 'Created At',
+              label: context.l10n.createdAt,
               onFilterSelected: (FilterOperator operator, DateTime? selectedDate) {
                 filter = filter.copyWith(
                   createdAt: selectedDate == null ? const Optional.absent() : Optional((operator, selectedDate)),