This is my experiment into getting an external enumeration working.
My first port of call after searching “External Enumeration” on getA12 was the “Modelling > Basic Modelling > Form Model” docs. Here, there are some steps to add the external enumeration. They say to right click the control in the “fields view” to be presented with a dialog. In this dialog we are asked to provide a “Source URL”, a URL that will bring back XML in a specific format. XML? I’m already lost.
Through my investigation I discovered that this “Source URL” is something outdated and in fact here we only need to provide something to identify our enumeration later. In my case this was the string “favouriteMovie”.
Next, on the client side we need something to provide our external enumeration values. We add an “externalEnumerationProvider” something like the following:
export const externalEnumerationProvider: IExternalEnumerationProvider = (
source: string
): DocumentModel.ReadonlyObjectMap<DocumentModel.LocalizedTextMap> => {
switch (source) {
case "favouriteMovie": {
return getMovies();
}
default:
throw new Error("unknown external enumeration source: " + source);
}
};
Note how in the switch case when the source is equal to “favouriteMovie” we return some values. In this case, it’s a bunch of films matching the required return type.
We then need to let the application know about our “externalEnumerationProvider”.
The “Developing > Form Engine” getA12 docs suggests that the “externalEnumerationProvider” needs to be provided both as a property of the FormEngine component and the createEngineMiddlewares middleware. However, I found that doing only the former was enough to get my “externalEnumerationProvider” to work.
External enumeration provider passed as a property to the form engine:
import { externalEnumerationProvider } from "./external-enum";
const VIEWS: { [name: string]: React.ComponentType<View> | undefined } = {
ExternalEnumForm: props => (
<CRUDViews.FormEngineView {...props} externalEnumerationProvider={externalEnumerationProvider} />
)
};
Now back in the running application, the input on the form shows as in the image above.
We have an external enumeration working. However, it feels more like an “internal-external” enumeration, since I already needed to have these movies in the client to return when the form engine asked for the source of “favouriteMovie”. When I started this journey, I assumed that we would somehow be able to reach out to some external API here to get these movies. Though that is not currently supported. Nevertheless, it’s possible to think of a scenario where, as the user logs in, we fetch the movies from an external API and put them in the Redux store, then we have them already available in the client to show.
Another thing to mention is how these values appear in the overview once the form is saved.
The enumeration values I provide look something like the following:
{en: “Lord Of The Rings”, de: “Lord Of The Rings”, value: “Lord Of The Rings”}
Thus, when the form is saved the value property “Lord Of The Rings” is shown in the overview. However, should this be something like an ID for the movie e.g. 12312. Then this value would show in the overview. These values are not treated in the same way as the ‘standard’ enumeration values you can model in A12, where the localised text is shown rather than the base value. Perhaps due to the underlying field being modelled as a string. Maybe there is solution to this someone can suggest?
Localised values being used, using the movie ID as the value
Lastly, there is the “External enumerations REST API” in the data services getA12 docs. Can someone more knowledgeable about data services tell us how this fits into the bigger external enum picture?