(DOCSP-26991): @realm-react-ify 'Remap a Property' (#2453)

## Pull Request Info

### Jira

- https://jira.mongodb.org/browse/DOCSP-26991

### Staged Changes

- [Remap a Property - React
Native](https://docs-mongodbcom-staging.corp.mongodb.com/realm/docsworker-xlarge/docsp-26991-remap-a-property/sdk/react-native/realm-database/schemas/remap/)

### Reminder Checklist

If your PR modifies the docs, you might need to also update some
corresponding
pages. Check if completed or N/A.

- [N/A] Create Jira ticket for corresponding docs-app-services
update(s), if any
- [N/A] Checked/updated Admin API
- [N/A] Checked/updated CLI reference

### Review Guidelines


[REVIEWING.md](https://github.com/mongodb/docs-realm/blob/master/REVIEWING.md)

Co-authored-by: Mohammad Hunan Chughtai <[email protected]>

Author: Mohammad Hunan Chughtai

examples/react-native/__tests__/js/models/Employee.js

@@ -0,0 +1,16 @@
+import Realm from 'realm';
+
+// :snippet-start: js-employee-schema
+class Employee extends Realm.Object {
+  static schema = {
+    name: 'Employee',
+    properties: {
+      _id: 'string',
+      first_name: {type: 'string', mapTo: 'firstName'},
+    },
+    primaryKey: '_id',
+  };
+}
+// :snippet-end:
+
+export default Employee;

examples/react-native/__tests__/ts/models/Employee.ts

@@ -0,0 +1,20 @@
+import Realm from 'realm';
+
+// TODO: Replace `static schema` with TS-first models + realm-babel-plugin (https://www.npmjs.com/package/@realm/babel-plugin) approach once realm-babel-plugin version 0.1.2 releases with bug fixes
+// :snippet-start: ts-employee-schema
+class Employee extends Realm.Object {
+  _id!: string;
+  first_name!: string;
+
+  static schema = {
+    name: 'Employee',
+    properties: {
+      _id: 'string',
+      first_name: {type: 'string', mapTo: 'firstName'},
+    },
+    primaryKey: '_id',
+  };
+}
+// :snippet-end:
+
+export default Employee;

source/examples/generated/react-native/js/Employee.snippet.js-employee-schema.js

@@ -0,0 +1,10 @@
+class Employee extends Realm.Object {
+  static schema = {
+    name: 'Employee',
+    properties: {
+      _id: 'string',
+      first_name: {type: 'string', mapTo: 'firstName'},
+    },
+    primaryKey: '_id',
+  };
+}

source/examples/generated/react-native/ts/Employee.snippet.ts-employee-schema.ts

@@ -0,0 +1,13 @@
+class Employee extends Realm.Object {
+  _id!: string;
+  first_name!: string;
+
+  static schema = {
+    name: 'Employee',
+    properties: {
+      _id: 'string',
+      first_name: {type: 'string', mapTo: 'firstName'},
+    },
+    primaryKey: '_id',
+  };
+}

source/sdk/react-native/realm-database/schemas/remap.txt

@@ -18,13 +18,27 @@ To use a different property name in your code than is stored in
 Realm Database, set ``mapTo`` to the name of the property as it appears in
 your code.
 
-.. example::
-   
-   A developer opens a realm using the following ``Dog`` object schema.
-   Realm Database stores each dog's first name with the snake case
-   ``first_name`` property. The schema maps the property to ``firstName`` for
-   objects used in JavaScript code.
-   
-   .. literalinclude:: /examples/Schemas/Mapped.js
-      :language: javascript
-      :emphasize-lines: 5
+Example
+~~~~~~~
+
+In the following example of an ``Employee`` class, we remap the ``first_name``
+property to ``firstName``. 
+
+.. tabs-realm-languages::
+
+    .. tab::
+       :tabid: typescript
+
+       .. literalinclude:: /examples/generated/react-native/ts/Employee.snippet.ts-employee-schema.ts
+          :language: typescript
+          :emphasize-lines: 3, 9
+          :linenos:
+
+
+    .. tab::
+       :tabid: javascript
+
+       .. literalinclude:: /examples/generated/react-native/js/Employee.snippet.js-employee-schema.js
+          :language: javascript
+          :emphasize-lines: 6
+          :linenos: