feat: setup asset linking

okwasniewski · Feb 10, 2025 · b8a90c4 · b8a90c4
1 parent b928179
commit b8a90c4
Show file tree

Hide file tree

Showing 5 changed files with 251 additions and 267 deletions.
diff --git a/packages/react-native/React/Base/RCTUtils.h b/packages/react-native/React/Base/RCTUtils.h
@@ -142,6 +142,9 @@ RCT_EXTERN NSString *__nullable RCTLibraryPath(void);
 // (or nil, if the URL does not specify a path within the Library directory)
 RCT_EXTERN NSString *__nullable RCTLibraryPathForURL(NSURL *__nullable URL);
 
+// Return the name of the asset in the catalog for a packager URL.
+RCT_EXTERN NSString *__nullable RCTAssetCatalogNameForURL(NSURL *__nullable URL);
+
 // Determines if a given image URL refers to a image in bundle
 RCT_EXTERN BOOL RCTIsBundleAssetURL(NSURL *__nullable imageURL);
 

diff --git a/packages/react-native/React/Base/RCTUtils.m b/packages/react-native/React/Base/RCTUtils.m
@@ -772,6 +772,62 @@ BOOL RCTIsGzippedData(NSData *__nullable data)
   return RCTRelativePathForURL(RCTHomePath(), URL);
 }
 
+static NSRegularExpression *RCTAssetURLScaleRegex()
+{
+  static dispatch_once_t onceToken;
+  static NSRegularExpression *regex;
+  dispatch_once(&onceToken, ^{
+    regex = [NSRegularExpression regularExpressionWithPattern:@"@\\dx$" options:0 error:nil];
+  });
+  return regex;
+}
+
+static NSRegularExpression *RCTAssetURLCharactersRegex()
+{
+  static dispatch_once_t onceToken;
+  static NSRegularExpression *regex;
+  dispatch_once(&onceToken, ^{
+    regex = [NSRegularExpression regularExpressionWithPattern:@"[^a-z0-9_]" options:0 error:nil];
+  });
+  return regex;
+}
+
+NSString *__nullable RCTAssetCatalogNameForURL(NSURL *__nullable URL)
+{
+  NSString *path = RCTBundlePathForURL(URL);
+  // Packager assets always start with assets/
+  if (path == nil || ![path hasPrefix:@"assets/"]) {
+    return nil;
+  }
+
+  // Remove extension
+  path = [path stringByDeletingPathExtension];
+
+  // Remove scale suffix
+  path = [RCTAssetURLScaleRegex() stringByReplacingMatchesInString:path
+                                                           options:0
+                                                             range:NSMakeRange(0, [path length])
+                                                      withTemplate:@""];
+
+  path = [path lowercaseString];
+
+  // Encode folder structure in file name
+  path = [path stringByReplacingOccurrencesOfString:@"/" withString:@"_"];
+
+  // Remove illegal chars
+  path = [RCTAssetURLCharactersRegex() stringByReplacingMatchesInString:path
+                                                                options:0
+                                                                  range:NSMakeRange(0, [path length])
+                                                           withTemplate:@""];
+
+  // Remove "assets_" prefix
+  if ([path hasPrefix:@"assets_"]) {
+    path = [path substringFromIndex:@"assets_".length];
+  }
+
+  return path;
+}
+
 static BOOL RCTIsImageAssetsPath(NSString *path)
 {
   NSString *extension = [path pathExtension];
@@ -844,6 +900,17 @@ BOOL RCTIsLocalAssetURL(NSURL *__nullable imageURL)
 
 UIImage *__nullable RCTImageFromLocalAssetURL(NSURL *imageURL)
 {
+  NSString *catalogName = RCTAssetCatalogNameForURL(imageURL);
+  if (catalogName) {
+    UIImage *image = [UIImage imageNamed:catalogName];
+    if (image) {
+      return image;
+    } else {
+      RCTLogWarn(
+        @"Image %@ not found in the asset catalog. Make sure your app template is updated correctly.", catalogName);
+    }
+  }
+
   NSString *imageName = RCTBundlePathForURL(imageURL);
 
   NSBundle *bundle = nil;

diff --git a/packages/react-native/scripts/react-native-xcode.sh b/packages/react-native/scripts/react-native-xcode.sh
@@ -151,6 +151,10 @@ else
   EXTRA_ARGS+=("--config-cmd" "'$NODE_BINARY' $NODE_ARGS '$REACT_NATIVE_DIR/cli.js' config")
 fi
 
+# PRODUCT_SETTINGS_PATH is where the target Info.plist file is. 
+# The asset catalog will be in the same folder.
+ASSET_CATALOG_DEST=${ASSET_CATALOG_DEST:-"$(dirname "$PRODUCT_SETTINGS_PATH")"}
+
 # shellcheck disable=SC2086
 "$NODE_BINARY" $NODE_ARGS "$CLI_PATH" $BUNDLE_COMMAND \
   $CONFIG_ARG \
@@ -159,6 +163,7 @@ fi
   --dev $DEV \
   --reset-cache \
   --bundle-output "$BUNDLE_FILE" \
+  --asset-catalog-dest "$ASSET_CATALOG_DEST" \
   --assets-dest "$DEST" \
   "${EXTRA_ARGS[@]}" \
   $EXTRA_PACKAGER_ARGS