Kotlin Multiplatform vs React Native مقارنة

// وحدة KMP المشتركة (shared module) — الإضافة إلى تطبيق Android/iOS حالي
// shared/src/commonMain/kotlin/data/UserRepository.kt

package com.app.shared.data

import kotlinx.coroutines.flow.Flow
import kotlinx.serialization.Serializable

@Serializable
data class User(val id: String, val name: String, val avatarUrl: String)

// ملاحظة: kotlin.Result هو value class ولا يُصدَّر إلى Objective-C؛
// نوع الإرجاع هو User مباشرة، ومسار الخطأ يمر عبر throws/completion error.
class UserRepository(private val api: UserApi) {
    suspend fun fetchUser(id: String): User = api.getUser(id)
}

// expect/actual: الجزء الخاص بكل منصة (iOS Keychain / Android EncryptedSharedPreferences)
expect class SecureStorage {
    fun save(key: String, value: String)
    fun read(key: String): String?
}

// shared/build.gradle.kts (ملخّص)
kotlin {
    androidTarget()
    listOf(iosX64(), iosArm64(), iosSimulatorArm64()).forEach {
        it.binaries.framework { baseName = "Shared" }
    }
    sourceSets {
        commonMain.dependencies {
            implementation("io.ktor:ktor-client-core:3.6.0")
            implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:1.11.0")
        }
    }
}

// الربط في جانب iOS كـ framework في Xcode (Swift)
import Shared

let repo = UserRepository(api: UserApiImpl())
repo.fetchUser(id: "42") { user, error in
    if let user = user { print(user.name) }
}

// React Native — الدمج في تطبيق حالي؛ index.js: تسجيل الشاشة

import { AppRegistry } from 'react-native';
import ProfileScreen from './src/ProfileScreen';

AppRegistry.registerComponent('ProfileScreen', () => ProfileScreen);

// src/ProfileScreen.tsx — Strict TypeScript API (افتراضي في RN 0.87)
import { View, Text } from 'react-native';

export default function ProfileScreen({ userId }: { userId: string }) {
  return (
    <View style={{ padding: 16 }}>
      <Text style={{ fontSize: 17 }}>المستخدم {userId}</Text>
    </View>
  );
}

// android/app/build.gradle — RN Gradle Plugin (ملخّص)
apply plugin: "com.facebook.react"

react { autolinkLibrariesWithApp() }

// MyReactActivity.kt — النمط الوارد في الدليل الرسمي
import com.facebook.react.ReactActivity
import com.facebook.react.ReactActivityDelegate
import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled
import com.facebook.react.defaults.DefaultReactActivityDelegate

class MyReactActivity : ReactActivity() {
  override fun getMainComponentName(): String = "ProfileScreen"
  override fun createReactActivityDelegate(): ReactActivityDelegate =
    DefaultReactActivityDelegate(this, mainComponentName, fabricEnabled)
}

// AndroidManifest.xml: <activity android:name=".MyReactActivity"
//   android:theme="@style/Theme.AppCompat.Light.NoActionBar" />
// من الـ Activity الحالية: startActivity(Intent(this, MyReactActivity::class.java))