Navigating to relation table from class with same field name but different type can cause React exception.

[jdillick]

Make sure these boxes are checked before submitting your issue -- thanks for reporting issues back to Parse Dashboard!

• You're running version >=1.0.23 of Parse Dashboard.

• You're running version >=2.3.2 of Parse Server.

• You've searched through existing issues. Chances are that your issue has been reported or resolved before.

Pull Request

Clear state.data when setting relation to prevent column type mismatch.

Environment Setup

Class "One" schema:

myfield: { type: 'Object' }
two: { type: 'Relation', targetClass: 'Two' }

Class "Two" schema:

myfield: { type: 'String' }

Steps to reproduce

1. Create classes "One" and "Two" as above.
2. Create at least one "One" object, with an object saved for the "myfield" column.
3. From the dashboard browser, viewing class "One" click the "two" relation column button from any row.

Logs/Trace

Uncaught Error: Objects are not valid as a React child (found: object with keys {foo}). If you meant to render a collection of children, use an array instead.
    in span (created by BrowserCell)
    in BrowserCell (created by BrowserRow)
    in div (created by BrowserRow)
    in BrowserRow (created by BrowserTable)
    in div (created by BrowserTable)
    in div (created by BrowserTable)
    in BrowserTable (created by DataBrowser)
    in div (created by DataBrowser)
    in DataBrowser (created by Browser)
    in div (created by Browser)
    in div (created by Browser)
    in div (created by Browser)
    in Browser (created by subscribeTo(Browser))
    in subscribeTo(Browser) (created by BrowserRoute)
    in BrowserRoute (created by Context.Consumer)
    in Route (created by AppRoute)
    in Switch (created by AppRoute)
    in div
    in Unknown (created by AppRoute)
    in AppRoute (created by Context.Consumer)
    in Route (created by Index)
    in Switch (created by Index)
    in div (created by Index)
    in Index (created by Context.Consumer)
    in Route (created by Dashboard)
    in Switch (created by Dashboard)
    in div (created by Dashboard)
    in Router (created by Dashboard)
    in Dashboard
    at throwOnInvalidObjectType (react-dom.development.js?f8c1:13413)
    at reconcileChildFibers (react-dom.development.js?f8c1:14313)
    at reconcileChildren (react-dom.development.js?f8c1:16769)
    at updateHostComponent (react-dom.development.js?f8c1:17302)
    at beginWork (react-dom.development.js?f8c1:18627)
    at HTMLUnknownElement.callCallback (react-dom.development.js?f8c1:188)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?f8c1:237)
    at invokeGuardedCallback (react-dom.development.js?f8c1:292)
    at beginWork$1 (react-dom.development.js?f8c1:23203)
    at performUnitOfWork (react-dom.development.js?f8c1:22154)

[jdillick]

@TomWFox @davimacedo @dplewis @acinader Just mentioning some folks to note this includes a simple PR 1564. Just hoping to get a little traction.

It took me a number of hours to troubleshoot to track down the root cause, but the fix ended up being very simple.

We love the project. Cheers!