Add support for latest l10n implementation

lib/l10n/app_en.arb

@@ -2,18 +2,23 @@
     "appName": "Wonderous",
 	"localeSwapButton": "简体中文",
 	"animatedArrowSemanticSwipe": "Explore details about {title}.",
+	"@animatedArrowSemanticSwipe": {"placeholders": {"title": {}}},
 	"appBarTitleFactsHistory": "Facts and History",
 	"appBarTitleConstruction": "Construction",
 	"appBarTitleLocation": "Location Info",
 	"bottomScrubberSemanticScrubber": "scrubber",
 	"bottomScrubberSemanticTimeline": "Timeline Scrubber, drag horizontally to navigate the timeline.",
 	"collectionLabelDiscovered": "{percentage}% discovered",
+	"@collectionLabelDiscovered": {"placeholders": {"percentage": {}}},
 	"collectionLabelCount": "{count} of {total}",
+	"@collectionLabelCount": {"placeholders": {"count": {}, "total": {}}},
 	"collectionButtonReset": "Reset Collection",
 	"eventsListButtonOpenGlobal": "Open global timeline",
-	"newlyDiscoveredSemanticNew": "{count} new item{plural} to explore. Scroll to new item",
-	"newlyDiscoveredLabelNew": "{count} new item{plural} to explore",
-	"resultsPopupEnglishContent": "This content is provided by the Metropolitan Museum of Art Collection API, and is only available in English.",
+	"newlyDiscoveredSemanticNew": "{count} new item{suffix} to explore. Scroll to new item",
+	"@newlyDiscoveredSemanticNew": {"placeholders": {"count": {}, "suffix": {}}},
+	"newlyDiscoveredLabelNew": "{count} new item{suffix} to explore",
+	"@newlyDiscoveredLabelNew": {"placeholders": {"count": {}, "suffix": {}}},
+    "resultsPopupEnglishContent": "This content is provided by the Metropolitan Museum of Art Collection API, and is only available in English.",
 	"resultsSemanticDismiss": "dismiss message",
 	"scrollingContentSemanticYoutube": "Youtube thumbnail",
 	"scrollingContentSemanticOpen": "Open fullscreen maps view",
@@ -21,14 +26,19 @@
 	"searchInputHintSearch": "Search (ex. type or material)",
 	"searchInputSemanticClear": "clear search",
 	"timelineSemanticDate": "{fromDate} to {endDate}",
+	"@timelineSemanticDate": {"placeholders": {"fromDate": {}, "endDate": {}}},
 	"titleLabelDate": "{fromDate} to {endDate}",
+	"@titleLabelDate": {"placeholders": {"fromDate": {}, "endDate": {}}},
 	"appModalsButtonOk": "Ok",
 	"appModalsButtonCancel": "Cancel",
 	"appPageDefaultTitlePage": "page",
 	"appPageSemanticSwipe": "{pageTitle} {count} of {total}.",
+	"@appPageSemanticSwipe": {"placeholders": {"pageTitle": {}, "total": {}, "count": {}}},
 	"artifactsTitleArtifacts": "ARTIFACTS",
 	"semanticsPrevious": "Previous {title}",
+	"@semanticsPrevious": {"placeholders": {"title": {}}},
 	"semanticsNext": "Next {title}",
+	"@semanticsNext": {"placeholders": {"title": {}}},
 	"artifactsSemanticsPrevious": "Previous artifact",
 	"artifactsSemanticsNext": "Next artifact",
 	"artifactsSemanticArtifact": "Artifact",
@@ -41,11 +51,13 @@
 	"artifactDetailsLabelClassification": "Classification",
 	"artifactDetailsSemanticThumbnail": "thumbnail image",
 	"artifactDetailsErrorNotFound": "Unable to find info for artifact {artifactId} ",
+	"@artifactDetailsErrorNotFound": {"placeholders": {"artifactId": {}}},
 	"artifactsSearchTitleBrowse": "Browse Artifacts",
 	"artifactsSearchLabelNotFound": "No artifacts found",
 	"artifactsSearchButtonToggle": "Toggle Timeframe",
 	"artifactsSearchSemanticTimeframe": "timeframe",
 	"artifactsSearchLabelFound": "{numFound} artifacts found, {numResults} in ",
+	"@artifactsSearchLabelFound": {"placeholders": {"numFound": {}, "numResults": {}}},
 	"artifactsSearchLabelAdjust": "Adjust your",
 	"artifactsSearchLabelSearch": "search terms",
 	"artifactsSearchLabelTimeframe": "timeframe",
@@ -64,15 +76,20 @@
 	"homeMenuButtonAbout": "About this app",
 	"homeMenuAboutWonderous": "Wonderous is a visual showcase of eight wonders of the world. ",
 	"homeMenuAboutBuilt": "Built with {flutterUrl} by the team at {gskinnerUrl}.",
+	"@homeMenuAboutBuilt": {"placeholders": {"flutterUrl": {}, "gskinnerUrl": {}}},
 	"homeMenuAboutLearn": "Learn more at {wonderousUrl}.",
+	"@homeMenuAboutLearn": {"placeholders": {"wonderousUrl": {}}},
 	"homeMenuAboutSource": "To see the source code for this app, please visit the {githubUrl}.",
+	"@homeMenuAboutSource": {"placeholders": {"githubUrl": {}}},
 	"homeMenuAboutRepo": "Wonderous github repo",
 	"homeMenuAboutFlutter": "Flutter",
 	"homeMenuAboutGskinner": "gskinner",
 	"homeMenuAboutApp": "wonderous.app",
 	"homeMenuAboutPublic": "Public-domain artworks from {metUrl}.",
+	"@homeMenuAboutPublic": {"placeholders": {"metUrl": {}}},
 	"homeMenuAboutMet": "The Metropolitan Museum of Art, New York",
 	"homeMenuAboutPhotography": "Photography from {unsplashUrl}.",
+	"@homeMenuAboutPhotography": {"placeholders": {"unsplashUrl": {}}},
 	"homeMenuAboutUnsplash": "Unsplash",
 	"introTitleJourney": "Journey to the past",
 	"introDescriptionNavigate": "Navigate the intersection of time, art, and culture.",
@@ -87,7 +104,9 @@
 	"labelledToggleSemanticToggle": "toggle",
 	"photoGallerySemanticCollectible": "collectible!",
 	"photoGallerySemanticFocus": "Photo {photoIndex} of {photoTotal}. Tap to focus.",
+	"@photoGallerySemanticFocus": {"placeholders": {"photoIndex": {}, "photoTotal": {}}},
 	"photoGallerySemanticFullscreen": "Photo {photoIndex} of {photoTotal}. Tap to open fullscreen view.",
+	"@photoGallerySemanticFullscreen": {"placeholders": {"photoIndex": {}, "photoTotal": {}}},
 	"eraPrehistory": "Prehistory",
 	"eraClassical": "Classical Era",
 	"eraEarlyModern": "Early Modern Era",
@@ -95,8 +114,10 @@
 	"yearBCE": "BCE",
 	"yearCE": "CE",
 	"yearFormat": "{date} {era}",
+	"@yearFormat": {"placeholders": {"date": {}, "era": {}}},
 	"year": "Year",
 	"timelineLabelConstruction": "Construction of {title} begins.",
+	"@timelineLabelConstruction": {"placeholders": {"title": {}}},
 	"timelineTitleGlobalTimeline": "Global Timeline",
 	"wallpaperModalSave": "Save this poster to your photo gallery?",
 	"wallpaperModalSaving": "Saving Image. Please wait...",

lib/logic/common/string_utils.dart

@@ -46,13 +46,7 @@ class StringUtils {
 
   static String formatYr(int yr) {
     if (yr == 0) yr = 1;
-    return supplant(
-      $strings.yearFormat,
-      {
-        '{date}': yr.abs().toString(),
-        '{era}': getYrSuffix(yr),
-      },
-    );
+    return $strings.yearFormat(yr.abs().toString(), getYrSuffix(yr));
   }
 
   static String getYrSuffix(int yr) => yr < 0 ? $strings.yearBCE : $strings.yearCE;

lib/logic/met_api_logic.dart

@@ -1,12 +1,10 @@
 import 'dart:collection';
 
 import 'package:wonders/common_libs.dart';
-import 'package:wonders/logic/common/string_utils.dart';
+import 'package:wonders/logic/common/http_client.dart';
 import 'package:wonders/logic/data/artifact_data.dart';
 import 'package:wonders/logic/met_api_service.dart';
 
-import 'package:wonders/logic/common/http_client.dart';
-
 class MetAPILogic {
   final HashMap<String, ArtifactData?> _artifactCache = HashMap();
 
@@ -16,7 +14,7 @@ class MetAPILogic {
   Future<ArtifactData?> getArtifactByID(String id) async {
     if (_artifactCache.containsKey(id)) return _artifactCache[id];
     ServiceResult<ArtifactData?> result = (await service.getObjectByID(id));
-    if (!result.success) throw StringUtils.supplant($strings.artifactDetailsErrorNotFound, {'{artifactId}': id});
+    if (!result.success) throw $strings.artifactDetailsErrorNotFound(id);
     ArtifactData? artifact = result.content;
     return _artifactCache[id] = artifact;
   }

lib/logic/timeline_logic.dart

@@ -1,5 +1,4 @@
 import 'package:wonders/common_libs.dart';
-import 'package:wonders/logic/common/string_utils.dart';
 import 'package:wonders/logic/data/timeline_data.dart';
 
 class TimelineLogic {
@@ -12,7 +11,7 @@ class TimelineLogic {
       ...wondersLogic.all.map(
         (w) => TimelineEvent(
           w.startYr,
-          StringUtils.supplant($strings.timelineLabelConstruction, {'{title}': w.title}),
+          $strings.timelineLabelConstruction(w.title),
         ),
       )
     ];

lib/ui/common/controls/app_page_indicator.dart

@@ -1,6 +1,5 @@
 import 'package:smooth_page_indicator/smooth_page_indicator.dart';
 import 'package:wonders/common_libs.dart';
-import 'package:wonders/logic/common/string_utils.dart';
 
 class AppPageIndicator extends StatefulWidget {
   AppPageIndicator({
@@ -53,11 +52,11 @@ class _AppPageIndicatorState extends State<AppPageIndicator> {
                   liveRegion: true,
                   focusable: false,
                   readOnly: true,
-                  label: StringUtils.supplant($strings.appPageSemanticSwipe, {
-                    '{pageTitle}': widget.semanticPageTitle,
-                    '{count}': (_controllerPage % (widget.count) + 1).toString(),
-                    '{total}': widget.count.toString(),
-                  }),
+                  label: $strings.appPageSemanticSwipe(
+                    widget.semanticPageTitle,
+                    (_controllerPage % (widget.count) + 1),
+                    widget.count,
+                  ),
                   child: Container());
             }),
       ),

lib/ui/screens/artifact/artifact_details/artifact_details_screen.dart

@@ -79,7 +79,7 @@ class _ArtifactDetailsScreenState extends State<ArtifactDetailsScreen> {
         SizedBox(
           width: $styles.insets.xxl * 3,
           child: Text(
-            StringUtils.supplant($strings.artifactDetailsErrorNotFound, {'{artifactId}': widget.artifactId}),
+            $strings.artifactDetailsErrorNotFound(widget.artifactId),
             style: $styles.text.body.copyWith(color: $styles.colors.offWhite),
             textAlign: TextAlign.center,
           ),

lib/ui/screens/artifact/artifact_search/artifact_search_screen.dart

@@ -1,6 +1,5 @@
 import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
 import 'package:wonders/common_libs.dart';
-import 'package:wonders/logic/common/string_utils.dart';
 import 'package:wonders/logic/data/wonder_data.dart';
 import 'package:wonders/logic/data/wonders_data/search/search_data.dart';
 import 'package:wonders/ui/common/app_icons.dart';
@@ -144,13 +143,7 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> with GetItS
         child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [
           Gap($styles.insets.sm),
           Text(
-            StringUtils.supplant(
-              $strings.artifactsSearchLabelFound,
-              {
-                '{numFound}': _searchResults.length.toString(),
-                '{numResults}': _filteredResults.length.toString(),
-              },
-            ),
+            $strings.artifactsSearchLabelFound(_searchResults.length, _filteredResults.length),
             textHeightBehavior: TextHeightBehavior(applyHeightToFirstAscent: false),
             style: statusStyle,
           ),

lib/ui/screens/collection/widgets/_collection_footer.dart

@@ -44,18 +44,12 @@ class _CollectionFooter extends StatelessWidget {
   Widget _buildProgressRow(BuildContext context) {
     return Row(children: [
       Text(
-        StringUtils.supplant(
-          $strings.collectionLabelDiscovered,
-          {'{percentage}': (count / total * 100).round().toString()},
-        ),
+        $strings.collectionLabelDiscovered((count / total * 100).round()),
         style: $styles.text.body.copyWith(color: $styles.colors.accent1),
       ),
       Spacer(),
       Text(
-        StringUtils.supplant(
-          $strings.collectionLabelCount,
-          {'{count}': count.toString(), '{total}': total.toString()},
-        ),
+        $strings.collectionLabelCount(count, total),
         style: $styles.text.body.copyWith(color: $styles.colors.offWhite),
       )
     ]);

lib/ui/screens/collection/widgets/_newly_discovered_items_btn.dart

@@ -12,10 +12,7 @@ class _NewlyDiscoveredItemsBtn extends StatelessWidget {
     if (count == 0) return SizedBox.shrink();
 
     return AppBtn.basic(
-      semanticLabel: StringUtils.supplant(
-        $strings.newlyDiscoveredSemanticNew,
-        {'{count}': count.toString(), '{plural}': count == 1 ? '' : 's'},
-      ),
+      semanticLabel: $strings.newlyDiscoveredSemanticNew(count, count == 1 ? '' : 's'),
       onPressed: onPressed,
       child: Container(
         alignment: Alignment.center,
@@ -23,10 +20,7 @@ class _NewlyDiscoveredItemsBtn extends StatelessWidget {
         color: $styles.colors.black,
         padding: EdgeInsets.symmetric(vertical: $styles.insets.xs),
         child: Text(
-          StringUtils.supplant(
-            $strings.newlyDiscoveredLabelNew,
-            {'{count}': count.toString(), '{plural}': count == 1 ? '' : 's'},
-          ),
+          $strings.newlyDiscoveredLabelNew(count, count == 1 ? '' : 's'),
           textAlign: TextAlign.center,
           textHeightBehavior: TextHeightBehavior(applyHeightToFirstAscent: false),
           style: $styles.text.bodySmallBold.copyWith(color: $styles.colors.accent1),

lib/ui/screens/editorial/widgets/_title_text.dart

@@ -82,13 +82,7 @@ class _TitleText extends StatelessWidget {
 
               /// Date
               Text(
-                StringUtils.supplant(
-                  $strings.titleLabelDate,
-                  {
-                    '{fromDate}': StringUtils.formatYr(data.startYr),
-                    '{endDate}': StringUtils.formatYr(data.endYr),
-                  },
-                ),
+                $strings.titleLabelDate(StringUtils.formatYr(data.startYr), StringUtils.formatYr(data.endYr)),
                 style: $styles.text.h4,
                 textAlign: TextAlign.center,
               ),

lib/ui/screens/home/widgets/_animated_arrow_button.dart

@@ -22,7 +22,7 @@ class _AnimatedArrowButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final Duration duration = $styles.times.med;
-    final btnLbl = StringUtils.supplant($strings.animatedArrowSemanticSwipe, {'{title}': semanticTitle});
+    final btnLbl = $strings.animatedArrowSemanticSwipe(semanticTitle);
     return AppBtn.basic(
       semanticLabel: btnLbl,
       onPressed: onTap,

lib/ui/screens/home_menu/about_dialog_content.dart

@@ -48,28 +48,28 @@ class AboutDialogContent extends StatelessWidget {
             style: $styles.text.bodySmall.copyWith(color: Colors.black, fontSize: fontSize),
             children: [
               ...buildSpan($strings.homeMenuAboutWonderous),
-              ...buildSpan($strings.homeMenuAboutBuilt, linkSupplants: {
-                '{flutterUrl}': [$strings.homeMenuAboutFlutter, 'https://flutter.dev'],
-                '{gskinnerUrl}': [$strings.homeMenuAboutGskinner, 'https://gskinner.com/flutter'],
+              ...buildSpan($strings.homeMenuAboutBuilt('{flutterUrl}', '{gskinnerUrl}'), linkSupplants: {
+                'flutterUrl': [$strings.homeMenuAboutFlutter, 'https://flutter.dev'],
+                'gskinnerUrl': [$strings.homeMenuAboutGskinner, 'https://gskinner.com/flutter'],
               }),
               ...buildSpan('\n\n'),
-              ...buildSpan($strings.homeMenuAboutLearn, linkSupplants: {
-                '{wonderousUrl}': [$strings.homeMenuAboutApp, 'https://wonderous.app'],
+              ...buildSpan($strings.homeMenuAboutLearn('wonderousUrl'), linkSupplants: {
+                'wonderousUrl': [$strings.homeMenuAboutApp, 'https://wonderous.app'],
               }),
               ...buildSpan('\n\n'),
-              ...buildSpan($strings.homeMenuAboutSource, linkSupplants: {
-                '{githubUrl}': [$strings.homeMenuAboutRepo, 'https://github.com/gskinnerTeam/flutter-wonderous-app'],
+              ...buildSpan($strings.homeMenuAboutSource('githubUrl'), linkSupplants: {
+                'githubUrl': [$strings.homeMenuAboutRepo, 'https://github.com/gskinnerTeam/flutter-wonderous-app'],
               }),
               ...buildSpan('\n\n'),
-              ...buildSpan($strings.homeMenuAboutPublic, linkSupplants: {
-                '{metUrl}': [
+              ...buildSpan($strings.homeMenuAboutPublic('metUrl'), linkSupplants: {
+                'metUrl': [
                   $strings.homeMenuAboutMet,
                   'https://www.metmuseum.org/about-the-met/policies-and-documents/open-access'
                 ],
               }),
               ...buildSpan('\n\n'),
-              ...buildSpan($strings.homeMenuAboutPhotography, linkSupplants: {
-                '{unsplashUrl}': [$strings.homeMenuAboutUnsplash, 'https://unsplash.com/@gskinner/collections'],
+              ...buildSpan($strings.homeMenuAboutPhotography('unsplashUrl'), linkSupplants: {
+                'unsplashUrl': [$strings.homeMenuAboutUnsplash, 'https://unsplash.com/@gskinner/collections'],
               }),
             ],
           ),

lib/ui/screens/photo_gallery/photo_gallery.dart

@@ -2,7 +2,6 @@ import 'dart:async';
 
 import 'package:flutter/cupertino.dart';
 import 'package:wonders/common_libs.dart';
-import 'package:wonders/logic/common/string_utils.dart';
 import 'package:wonders/logic/data/unsplash_photo_data.dart';
 import 'package:wonders/ui/common/controls/app_loading_indicator.dart';
 import 'package:wonders/ui/common/controls/eight_way_swipe_detector.dart';
@@ -206,14 +205,8 @@ class _PhotoGalleryState extends State<PhotoGallery> {
             semanticLbl = $strings.collectibleItemSemanticCollectible;
           } else {
             semanticLbl = !selected
-                ? StringUtils.supplant($strings.photoGallerySemanticFocus, {
-                    '{photoIndex}': (index + 1).toString(),
-                    '{photoTotal}': _imgCount.toString(),
-                  })
-                : StringUtils.supplant($strings.photoGallerySemanticFullscreen, {
-                    '{photoIndex}': (index + 1).toString(),
-                    '{photoTotal}': _imgCount.toString(),
-                  });
+                ? $strings.photoGallerySemanticFocus(index + 1, _imgCount)
+                : $strings.photoGallerySemanticFullscreen(index + 1, _imgCount);
           }
           return MergeSemantics(
             child: Semantics(

lib/ui/screens/timeline/widgets/_timeline_section.dart

@@ -16,10 +16,10 @@ class TimelineSection extends StatelessWidget {
     fraction = fraction.clamp(0, 1);
 
     return Semantics(
-      label: '${data.title}, ${StringUtils.supplant($strings.timelineSemanticDate, {
-            '{fromDate}': StringUtils.formatYr(data.startYr),
-            '{endDate}': StringUtils.formatYr(data.endYr)
-          })}',
+      label: '${data.title}, ${$strings.timelineSemanticDate(
+        StringUtils.formatYr(data.startYr),
+        StringUtils.formatYr(data.endYr),
+      )}',
       child: IgnorePointer(
         ignoringSemantics: false,
         child: Container(

lib/ui/screens/wonder_events/widgets/_wonder_image_with_timeline.dart

@@ -96,12 +96,9 @@ class _WonderImageWithTimeline extends StatelessWidget {
       crossAxisAlignment: CrossAxisAlignment.center,
       children: [
         Text(
-          StringUtils.supplant(
-            $strings.titleLabelDate,
-            {
-              '{fromDate}': StringUtils.formatYr(data.startYr),
-              '{endDate}': StringUtils.formatYr(data.endYr),
-            },
+          $strings.titleLabelDate(
+            StringUtils.formatYr(data.startYr),
+            StringUtils.formatYr(data.endYr),
           ),
           style: textStyle,
         ),