Embedded Object support. (#1298)

* POC JSON value in table view * Ensure first selected schema is not system schema or embeded. * Filtering out embedded object classes & disallowing creation in GUI. * LeftSidebar sees embedded objects as SystemClass. * Disable 'Update reference' in context menu when embedded object. * Temporarily disable creation of embedded objects with custom message. * isEmbeddedType continued * Disable double click on objects cells contain embedded object * Disable "Add existing ClassName" from context menu, in embedded objects list. * Spelling * PR suggestions (simplified const & check back in-line)
realm · Jun 4, 2020 · 6033d2c · 6033d2c
1 parent b98247f
commit 6033d2c
Show file tree

Hide file tree

Showing 16 changed files with 134 additions and 25 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,7 +3,7 @@ dist/
 node_modules/
 realm-object-server/
 .idea
-
+.vscode
 .DS_Store
 data/
 

diff --git a/src/ui/RealmBrowser/Content/Content.tsx b/src/ui/RealmBrowser/Content/Content.tsx
@@ -58,6 +58,7 @@ import { TopBar } from './TopBar';
 interface IBaseContentProps {
   contentRef: (element: HTMLElement | null) => void;
   dataVersion?: number;
+  allowCreate: boolean;
   editMode: EditMode;
   error?: Error;
   filteredSortedResults: Realm.Collection<any>;
@@ -146,6 +147,7 @@ export const Content = ({
         query={query}
         queryError={queryError}
         readOnly={props.readOnly}
+        allowCreate={props.allowCreate}
       />
 
       <div className="RealmBrowser__TableContainer">

diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/CreateObjectDialog.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/CreateObjectDialog.tsx
@@ -42,6 +42,7 @@ export interface IOpenCreateObjectDialogProps
   getClassFocus: (className: string) => IClassFocus;
   isOpen: true;
   schema: Realm.ObjectSchema;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export type ICreateObjectDialogProps =
@@ -76,6 +77,7 @@ export const CreateObjectDialog = ({
               }
               propertyName={propertyName}
               value={values[propertyName]}
+              isEmbeddedType={props.isEmbeddedType}
             />
           ))
         : null}

diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/PropertyRow.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/PropertyRow.tsx
@@ -32,6 +32,7 @@ interface IPropertyRowProps {
   property: Realm.ObjectSchemaProperty;
   propertyName: string;
   value: any;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export const PropertyRow = ({
@@ -42,6 +43,7 @@ export const PropertyRow = ({
   property,
   propertyName,
   value,
+  isEmbeddedType,
 }: IPropertyRowProps) => (
   <FormGroup className="CreateObjectDialog__PropertyRow">
     <Label
@@ -61,6 +63,7 @@ export const PropertyRow = ({
       onChange={onValueChange}
       property={property}
       value={value}
+      isEmbeddedType={isEmbeddedType}
     />
   </FormGroup>
 );
diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/index.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/index.tsx
@@ -46,6 +46,7 @@ interface IOpenCreateObjectDialogContainerProps {
   onCancel: () => void;
   onCreate: CreateObjectHandler;
   schema: Realm.ObjectSchema;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export interface ICreateObjectDialogContainerState {
@@ -161,6 +162,7 @@ class CreateObjectDialogContainer extends React.PureComponent<
       onCreate: this.onCreate,
       onValueChange: this.onValueChange,
       values: this.state.values,
+      isEmbeddedType: this.isEmbeddedType,
     };
     if (this.props.isOpen) {
       return {
@@ -196,6 +198,9 @@ class CreateObjectDialogContainer extends React.PureComponent<
     }
   };
 
+  protected isEmbeddedType = (className: string) =>
+    this.props.isOpen && this.props.isEmbeddedType(className);
+
   protected onValueChange = (propertyName: string, value: any) => {
     this.setState({
       values: {

diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/types/DefaultControl.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/types/DefaultControl.tsx
@@ -22,8 +22,11 @@ import Realm from 'realm';
 
 export interface IDefaultControlProps {
   property: Realm.ObjectSchemaProperty;
+  message?: string;
 }
 
-export const DefaultControl = ({ property }: IDefaultControlProps) => (
-  <Alert color="warning">Cannot select "{property.type}" yet</Alert>
+export const DefaultControl = ({ property, message }: IDefaultControlProps) => (
+  <Alert color="warning">
+    {message ?? `Cannot select "${property.type}" yet`}
+  </Alert>
 );
diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/types/ListControl.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/types/ListControl.tsx
@@ -28,7 +28,12 @@ import { ITypeControlProps, TypeControl } from './TypeControl';
 interface IItemProps
   extends Pick<
     ITypeControlProps,
-    'generateInitialValue' | 'getClassFocus' | 'onChange' | 'value' | 'property'
+    | 'generateInitialValue'
+    | 'getClassFocus'
+    | 'onChange'
+    | 'value'
+    | 'property'
+    | 'isEmbeddedType'
   > {
   onDelete: () => void;
 }
@@ -40,6 +45,7 @@ const Item = ({
   onChange,
   onDelete,
   value,
+  isEmbeddedType,
 }: IItemProps) => (
   <section className="CreateObjectDialog__ListControl__Item">
     <TypeControl
@@ -48,6 +54,7 @@ const Item = ({
       onChange={onChange}
       property={property}
       value={value}
+      isEmbeddedType={isEmbeddedType}
     >
       <InputGroupAddon addonType="append">
         <Button onClick={onDelete} size="sm">
@@ -63,7 +70,11 @@ const Item = ({
 interface IListProps
   extends Pick<
     ITypeControlProps,
-    'generateInitialValue' | 'getClassFocus' | 'onChange' | 'value'
+    | 'generateInitialValue'
+    | 'getClassFocus'
+    | 'onChange'
+    | 'value'
+    | 'isEmbeddedType'
   > {
   itemProperty: Realm.ObjectSchemaProperty;
 }
@@ -74,6 +85,7 @@ const List = ({
   itemProperty,
   onChange,
   value,
+  isEmbeddedType,
 }: IListProps) => (
   <section className="CreateObjectDialog__ListControl__Items">
     {Array.isArray(value) ? (
@@ -94,6 +106,7 @@ const List = ({
           }}
           property={itemProperty}
           value={value[index]}
+          isEmbeddedType={isEmbeddedType}
         />
       ))
     ) : (
@@ -129,6 +142,7 @@ export const ListControl = ({
   onChange,
   property,
   value,
+  isEmbeddedType,
 }: ITypeControlProps): React.ReactElement<ITypeControlProps> => {
   if (!property.objectType) {
     return <Alert color="danger">Expected an objectType</Alert>;
@@ -142,6 +156,7 @@ export const ListControl = ({
           itemProperty={itemProperty}
           onChange={onChange}
           value={value}
+          isEmbeddedType={isEmbeddedType}
         />
         <section className="CreateObjectDialog__ListControl__Buttons">
           <Button

diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/types/ObjectControl/index.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/types/ObjectControl/index.tsx
@@ -31,12 +31,14 @@ export interface IOpenSelectObjectDialog {
   isOptional: boolean;
   onCancel: () => void;
   onSelect: (object: any) => void;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export type ISelectObjectDialog = IOpenSelectObjectDialog | { isOpen: false };
 
 export interface IObjectControlContainerProps extends IBaseControlProps {
   getClassFocus: (className: string) => IClassFocus;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export interface IObjectControlContainerState {
@@ -84,6 +86,7 @@ class ObjectControlContainer extends React.Component<
           isOptional: this.props.property.optional || false,
           onCancel: this.onCancelSelectObjectDialog,
           onSelect: this.updateObjectReference,
+          isEmbeddedType: this.props.isEmbeddedType,
         },
       });
     }

diff --git a/src/ui/RealmBrowser/Content/CreateObjectDialog/types/TypeControl.tsx b/src/ui/RealmBrowser/Content/CreateObjectDialog/types/TypeControl.tsx
@@ -43,6 +43,7 @@ export interface IBaseControlProps<ValueType = any> {
 export interface ITypeControlProps extends IBaseControlProps {
   generateInitialValue: (property: Realm.ObjectSchemaProperty) => any;
   getClassFocus: (className: string) => IClassFocus;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export const TypeControl = ({
@@ -52,6 +53,7 @@ export const TypeControl = ({
   onChange,
   property,
   value,
+  isEmbeddedType,
 }: ITypeControlProps) => {
   if (property.type === 'object id') {
     return (
@@ -121,13 +123,24 @@ export const TypeControl = ({
       />
     );
   } else if (property.type === 'object') {
+    // TODO: implement
+    if (isEmbeddedType(property.objectType!)) {
+      return (
+        <DefaultControl
+          property={property}
+          message="Creation of embedded objects is not yet supported"
+        />
+      );
+    }
+
     return (
       <ObjectControl
         children={children}
         getClassFocus={getClassFocus}
         onChange={onChange}
         property={property}
         value={value as object}
+        isEmbeddedType={isEmbeddedType}
       />
     );
   } else if (property.type === 'list') {
@@ -139,6 +152,7 @@ export const TypeControl = ({
         onChange={onChange}
         property={property}
         value={value as any[]}
+        isEmbeddedType={isEmbeddedType}
       />
     );
   } else {

diff --git a/src/ui/RealmBrowser/Content/SelectObjectDialog/SelectObjectDialog.tsx b/src/ui/RealmBrowser/Content/SelectObjectDialog/SelectObjectDialog.tsx
@@ -45,6 +45,7 @@ interface IOpenSelectObjectDialogProps extends IBaseSelectObjectDialogProps {
     collection: Realm.Collection<any>,
   ) => void;
   multiple: boolean;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export type ISelectObjectDialogProps =
@@ -69,13 +70,15 @@ export const SelectObjectDialog = ({
       {props.isOpen ? (
         <Content
           editMode={EditMode.Disabled}
+          allowCreate={false}
           highlightMode={
             props.multiple ? HighlightMode.Multiple : HighlightMode.Single
           }
           focus={props.focus}
           onHighlightChange={props.onHighlightChange}
           readOnly={true}
           ref={props.contentRef}
+          isEmbeddedType={props.isEmbeddedType}
         />
       ) : null}
     </ModalBody>

diff --git a/src/ui/RealmBrowser/Content/SelectObjectDialog/index.tsx b/src/ui/RealmBrowser/Content/SelectObjectDialog/index.tsx
@@ -37,6 +37,7 @@ export interface IOpenSelectObjectDialogContainerProps {
   isOptional: boolean;
   multiple: boolean;
   onCancel: () => void;
+  isEmbeddedType: (className: string) => boolean;
 }
 
 export interface IOpenSelectSingleObjectDialogContainerProps
@@ -91,6 +92,7 @@ export class SelectObjectDialogContainer extends React.Component<
         contentRef: this.contentRef,
         selection: this.state.selection,
         multiple: this.props.multiple,
+        isEmbeddedType: this.props.isEmbeddedType,
       };
     } else {
       return {

diff --git a/src/ui/RealmBrowser/Content/TopBar.tsx b/src/ui/RealmBrowser/Content/TopBar.tsx
@@ -32,6 +32,7 @@ interface ITopBarProps {
   query: string;
   queryError: Error | undefined;
   readOnly: boolean;
+  allowCreate: boolean;
 }
 
 export const TopBar = ({
@@ -42,6 +43,7 @@ export const TopBar = ({
   query,
   queryError,
   readOnly,
+  allowCreate,
 }: ITopBarProps) => {
   const className = getClassName(focus);
   return (
@@ -54,7 +56,7 @@ export const TopBar = ({
         queryError={queryError}
         placeholder="Enter a query to filter the list"
       />
-      {!readOnly ? (
+      {allowCreate && !readOnly ? (
         <Button
           size="sm"
           color="secondary"
-Original file line number
+Diff line change
@@ Expand Up / @@ -3,7 +3,7 @@ dist/ @@
     node_modules/
     realm-object-server/
     .idea
+    .vscode
     .DS_Store
     data/
@@ Expand Down @@