@react-native-oh/react-native-harmony 0.72.80 → 0.72.86

package/Libraries/Image/AssetSourceResolver.harmony.ts

@@ -1,11 +1,64 @@
-import {
-  getAssetDestRelativePath,
-  Asset,
-} from '@react-native-oh/react-native-harmony-cli/src/assetResolver';
-import {
-  getBasePath,
-} from '@react-native/assets-registry/path-support';
-import { Platform } from 'react-native';
+/**
+ * Copyright (c) 2024 Huawei Technologies Co., Ltd.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import type { AssetData } from 'metro';
+// @ts-ignore
+import { getBasePath } from '@react-native/assets-registry/path-support';
+import { Dimensions, Platform } from 'react-native';
+
+const ALLOWED_SCALES: number[] = [1, 2, 3, 4];
+
+function filterAssetScales(
+  scales: readonly number[],
+): readonly number[] {
+  const result = scales.filter(scale => ALLOWED_SCALES.includes(scale));
+  if (result.length === 0 && scales.length > 0) {
+    // No matching scale found, but there are some available. Ideally we don't
+    // want to be in this situation and should throw, but for now as a fallback
+    // let's just use the closest larger image
+    const maxScale = ALLOWED_SCALES[ALLOWED_SCALES.length - 1];
+    for (const scale of scales) {
+      if (scale > maxScale) {
+        result.push(scale);
+        break;
+      }
+    }
+    // There is no larger scales available, use the largest we have
+    if (result.length === 0) {
+      result.push(scales[scales.length - 1]);
+    }
+  }
+  return result;
+}
+
+function pickScale(scales: Array<number>, deviceScale?: number): number {
+  const validScales = filterAssetScales(scales);
+  if (deviceScale == null) {
+    deviceScale = Dimensions.get('window').scale;
+  }
+  // Packager guarantees that `scales` array is sorted
+  for (let i = 0; i < validScales.length; i++) {
+    if (validScales[i] >= deviceScale) {
+      return validScales[i];
+    }
+  }
+
+  // If nothing matches, device scale is larger than any available
+  // scales, so we return the biggest one. Unless the array is empty,
+  // in which case we default to 1
+  return validScales[validScales.length - 1] || 1;
+}
+
+function getScaledAssetPath(asset: AssetData): string {
+  const scale = pickScale(asset.scales);
+  const scaleSuffix = scale === 1 ? '' : '@' + scale + 'x';
+  const assetDir = getBasePath(asset);
+  return assetDir + '/' + asset.name + scaleSuffix + '.' + asset.type;
+}
 
 type ResolvedAssetSource = {
   readonly __packager_asset: boolean;
@@ -15,16 +68,11 @@ type ResolvedAssetSource = {
   readonly scale: number;
 };
 
-function getAssetPath(asset: Asset): string {
-  const assetDir = getBasePath(asset);
-  return assetDir + '/' + asset.name + '.' + asset.type;
-}
-
 class AssetSourceResolver {
   constructor(
     private serverUrl: string | undefined,
     private jsbundleUrl: string | undefined,
-    private asset: Asset
+    private asset: AssetData
   ) {}
 
   isLoadedFromServer(): boolean {
@@ -40,15 +88,17 @@ class AssetSourceResolver {
       return this.assetServerURL();
     }
 
-    const prefix = this.isLoadedFromFileSystem() ? this.jsbundleUrl : 'asset://';
+    const path = this.isLoadedFromFileSystem() ? this.jsbundleUrl : 'asset://';
 
-    return {
-      __packager_asset: this.asset.__packager_asset,
-      uri: `${prefix}${getAssetDestRelativePath(this.asset)}`,
-      scale: 1,
-      width: this.asset.width,
-      height: this.asset.height,
-    };
+    // Assets can have relative paths outside of the project root.
+    // Replace `../` with `_` to make sure they don't end up outside of
+    // the expected assets directory.
+    return this.fromSource(
+      path +
+        getScaledAssetPath(this.asset)
+          .replace(/^assets\//, '')
+          .replace(/\.\.\//g, '_')
+    );
   }
 
   /**
@@ -62,11 +112,11 @@ class AssetSourceResolver {
 
     return this.fromSource(
       this.serverUrl +
-      getAssetPath(this.asset) +
+        getScaledAssetPath(this.asset) +
         '?platform=' +
         Platform.OS +
         '&hash=' +
-        this.asset.hash,
+        this.asset.hash
     );
   }
 
@@ -76,7 +126,7 @@ class AssetSourceResolver {
       width: this.asset.width,
       height: this.asset.height,
       uri: source,
-      scale: 1,
+      scale: pickScale(this.asset.scales),
     };
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-oh/react-native-harmony",
-  "version": "0.72.80",
+  "version": "0.72.86",
   "description": "",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
@@ -49,7 +49,7 @@
     "./*.har"
   ],
   "dependencies": {
-    "@react-native-oh/react-native-harmony-cli": "^0.0.30",
+    "@react-native-oh/react-native-harmony-cli": "^0.0.36",
     "colors": "^1.4.0",
     "fs-extra": "^11.1.1",
     "metro": "^0.76.3",
@@ -63,4 +63,4 @@
     "type": "gitcode",
     "url": "https://gitcode.com/openharmony-sig/ohos_react_native"
   }
-}
+}