I am using Typescript with Enums to create some dynamic object structure. These enums are represented as numbers in the object, not as their string value, which I want to keep as it is. When I am uploading these objects to the Firebase RTDB, the objects are misinterpreted as arrays.
Enum example in typescript
enum TableState {
Standby = 0,
Idle,
In_Game,
Maintenance,
}
Javascript object I want to upload to the Google RTDB
configuration_per_state: {
[TableState.Idle]: {
brightness: 10,
},
[TableState.In_Game]: {
brightness: 10,
duration: 20 * 60, //20 minutes,
}
}
which is the following stringified JSON:
{
"configuration_per_state": {
"1": {
"brightness": 10
},
"2": {
"brightness": 10,
"duration": 120
}
}
}
I now faced the issue that when uploading to the Firebase Real Time Database, the object gets interpreted as an array. So when I want to retrieve the data the object structure was changed by the DB.
Code to upload the object:
const createInitialConfigInDb = (
tableConfig: InitialTableState): Promise<any> => {
return new Promise((resolve, reject) => {
const userId = auth.currentUser?.uid
db.ref(`config/${userId}/general`).set(tableConfig).then((data) => {
//success callback
resolve(data)
}).catch((error) => {
//error callback
reject(error)
})
})
};
Resulting JSON after uploading to the database and downloaded from the RTDB:
{
"configuration_per_state" : [ null, {
"brightness" : 10,
}, {
"brightness" : 10,
"duration" : 1200,
} ],
}
Firstly I don't get why there is an entry "null" as the first array entry ... And secondly is there an easy way to avoid this behaviour?
Firebase interprets you data as an array, and the null it adds indicates that there's no element at index 0 in the array.
Firebase Realtime Database's array coercion/interpretation cannot be configured.
The only way to prevent it from interpreting your data as an array, is by not using numeric keys.
My common solution is to prefix such keys with a short, constant string value. For example:
{
"configuration_per_state" : {
"key_1":
"brightness" : 10,
},
"key_2": {
"brightness" : 10,
"duration" : 1200,
}
}
}