Refactor and cleanup for version 11.

flipper-plugin-realm/.prettierrc

@@ -1,5 +1,5 @@
 {
   "printWidth": 80,
   "singleQuote": true,
-  "trailingComma": "es5"
+  "trailingComma": "all"
 }

flipper-plugin-realm/src/CommonTypes.tsx

@@ -1,11 +1,30 @@
+// A helper interface which extends Realm.Object with
+// a string index signature and object key field for reference.
+export interface IndexableRealmObject extends Realm.Object {
+  [key: string]: unknown;
+  // Contains the object key that was sent by the device.
+  _pluginObjectKey: string;
+}
+
+// A Realm.CanonicalObjectSchema interface with a sorting order field.
+export interface SortedObjectSchema extends Realm.CanonicalObjectSchema {
+  order: string[];
+}
+
+export interface CanonicalObjectSchemaPropertyRow
+  extends Realm.CanonicalObjectSchemaProperty {
+  key: number;
+  primaryKey: boolean;
+}
+
 export type RealmPluginState = {
   deviceSerial: string;
   realms: string[];
   selectedRealm: string;
-  objects: RealmObject[];
-  schemas: SchemaObject[];
-  currentSchema: SchemaObject | null;
-  schemaHistory: SchemaObject[];
+  objects: IndexableRealmObject[];
+  schemas: SortedObjectSchema[];
+  currentSchema: SortedObjectSchema | null;
+  schemaHistory: SortedObjectSchema[];
   schemaHistoryIndex: number;
   cursor: string | null;
   totalObjects: number;
@@ -17,25 +36,6 @@ export type RealmPluginState = {
   errorMessage?: string;
 };
 
-export type RealmObject = Record<string, unknown> 
-
-export type SchemaObject = {
-  name: string;
-  embedded: boolean;
-  asymmetric: boolean;
-  primaryKey: string;
-  properties: { [key: string]: SchemaProperty };
-  order: Array<string>;
-};
-
-export type SchemaProperty = {
-  name: string;
-  indexed: boolean;
-  optional: boolean;
-  type: string;
-  mapTo: string;
-  objectType?: string;
-};
 export type Events = {
   getObjects: ObjectsMessage;
   getSchemas: SchemaMessage;
@@ -47,12 +47,12 @@ export type Events = {
   executeQuery: QueryResult;
 };
 export type Methods = {
-  executeQuery: (query: QueryObject) => Promise<RealmObject[]>;
+  executeQuery: (query: QueryObject) => Promise<Realm.Object[]>;
   getObjects: (data: getForwardsObjectsRequest) => Promise<ObjectsMessage>;
   getSchemas: (data: RealmRequest) => Promise<SchemaMessage>;
   getRealms: () => Promise<RealmsMessage>;
-  addObject: (object: AddObject) => Promise<RealmObject>;
-  modifyObject: (newObject: EditObject) => Promise<RealmObject>;
+  addObject: (object: AddObject) => Promise<Realm.Object>;
+  modifyObject: (newObject: EditObject) => Promise<Realm.Object>;
   removeObject: (object: RemoveObject) => Promise<void>;
   receivedCurrentQuery: (request: {
     schema: string | null;
@@ -73,22 +73,22 @@ type DataDownloadRequest = {
 export type EditObject = {
   schema?: string;
   realm?: string;
-  object: RealmObject;
+  object: Realm.Object;
   propsChanged?: string[];
   objectKey: string;
 };
 
 export type RemoveObject = {
   schema?: string;
   realm?: string;
-  object: RealmObject;
+  object: Realm.Object;
   objectKey: string;
 };
 
 export type AddObject = {
   schema?: string;
   realm?: string;
-  object: RealmObject;
+  object: Realm.Object;
   propsChanged?: string[];
 };
 export type RealmsMessage = {
@@ -97,17 +97,17 @@ export type RealmsMessage = {
   total: number;
 };
 export type ObjectsMessage = {
-  objects: Array<RealmObject>;
+  objects: IndexableRealmObject[];
   total: number;
   nextCursor: string;
   prev_cursor: { [sortingField: string]: number };
   hasMore: boolean;
 };
 export type ObjectMessage = {
-  object: RealmObject;
+  object: Realm.Object;
 };
 export type SchemaMessage = {
-  schemas: Array<SchemaObject>;
+  schemas: Array<Realm.CanonicalObjectSchema>;
 };
 type RealmRequest = {
   realm: string;
@@ -127,7 +127,7 @@ export type ObjectRequest = {
   primaryKey: string;
 };
 export type AddLiveObjectRequest = {
-  newObject: RealmObject;
+  newObject: IndexableRealmObject;
   index: number;
   schema: string;
   newObjectKey: string;
@@ -137,7 +137,7 @@ export type DeleteLiveObjectRequest = {
   schema: string;
 };
 export type EditLiveObjectRequest = {
-  newObject: RealmObject;
+  newObject: IndexableRealmObject;
   index: number;
   schema: string;
   newObjectKey: string;
@@ -148,5 +148,5 @@ type QueryObject = {
   realm: string;
 };
 export type QueryResult = {
-  result: Array<RealmObject> | string;
+  result: Array<Realm.Object> | string;
 };

flipper-plugin-realm/src/components/CustomDropdown.tsx

@@ -1,11 +1,11 @@
 import React, { useState } from 'react';
-import { RealmObject, SchemaObject, SchemaProperty } from '../CommonTypes';
 import { theme } from 'flipper-plugin';
+import { IndexableRealmObject } from '../CommonTypes';
 
 export type DropdownPropertyType = {
-  record: RealmObject;
-  schemaProperty: SchemaProperty | null;
-  currentSchema: SchemaObject;
+  record: IndexableRealmObject | null;
+  schemaProperty: Realm.CanonicalObjectSchemaProperty | null;
+  currentSchema: Realm.ObjectSchema;
   visible: boolean;
   pointerX: number;
   pointerY: number;
@@ -21,9 +21,9 @@ type MenuItem = {
 };
 
 export type MenuItemGenerator = (
-  row: RealmObject,
-  schemaProperty: SchemaProperty,
-  schema: SchemaObject
+  row: IndexableRealmObject,
+  schemaProperty: Realm.CanonicalObjectSchemaProperty,
+  schema: Realm.ObjectSchema,
 ) => Array<MenuItem>;
 
 const listItem = (menuItem: MenuItem) => {
@@ -54,7 +54,7 @@ const listItem = (menuItem: MenuItem) => {
         padding: '5px 12px',
         whiteSpace: 'nowrap',
         backgroundColor: hover ? theme.primaryColor : 'white',
-        zIndex: 99
+        zIndex: 99,
       }}
     >
       {' '}
@@ -72,9 +72,9 @@ export const CustomDropdown = ({
   pointerX,
   pointerY,
   scrollX,
-  scrollY
+  scrollY,
 }: DropdownPropertyType) => {
-  if (visible && schemaProperty) {
+  if (visible && schemaProperty && record) {
     const menuItems = generateMenuItems(record, schemaProperty, currentSchema);
     return (
       <ul
@@ -93,11 +93,13 @@ export const CustomDropdown = ({
           padding: 0,
           textAlign: 'left',
           overflow: 'hidden',
-          zIndex: '10'
+          zIndex: '10',
         }}
       >
         {menuItems.map((menuItem) => listItem(menuItem))}
       </ul>
     );
-  } else return <></>;
-};
+  } else {
+    return <></>;
+  }
+};

flipper-plugin-realm/src/components/DataTabHeader.tsx

@@ -1,13 +1,13 @@
 import { Col, Row, Typography } from 'antd';
-import { Layout, usePlugin } from 'flipper-plugin';
+import { usePlugin } from 'flipper-plugin';
 import React from 'react';
 import { plugin } from '..';
-import { SchemaObject } from '../CommonTypes';
+import { SortedObjectSchema } from '../CommonTypes';
 import { ObjectAdd } from './objectManipulation/ObjectAdd';
 import { RealmQueryInput } from './Query';
 
 type InputType = {
-  currentSchema: SchemaObject;
+  currentSchema: SortedObjectSchema;
   totalObjects: number;
 };