fix(firestore): timestamp values

[robingenz]

Pull request checklist

Please check if your PR fulfills the following requirements:

• The changes have been tested successfully.
• A changeset has been created (npm run changeset).
• I have read and followed the pull request guidelines.

Close #474

[robingenz]

Waiting for ionic-team/capacitor#7252 and ionic-team/capacitor#7253

[mamillastre]

Hi @robingenz, can I help you with this PR ?
I also need this feature.

Since we have to communicate with the native platforms throw a JSON format, I think #474 and #443 can be linked.

My idea is to pass to the native platform an object like:

import { TimeStamp, FieldValue } from "@capacitor-firebase/firestore";

{
   myTimestampField: TimeStamp.now(),
   myValueField: FieldValue.serverTimestamp()
}

That generates this JSON:

{
   "myTimestampField": {
      "_capacitorFirestoreFieldType": "timestamp",
      "_capacitorFirestoreFieldValue": {
         "seconds": 1736942400,
         "nanoseconds": 0
      }
   },
   "myValueField": {
      "_capacitorFirestoreFieldType": "fieldvalue",
      "_capacitorFirestoreFieldValue": {
         "method": "serverTimestamp"
      }
   }
}

We can imagine adding more features like these in the future with this same mechanism (like GeoPoint).

Downsides:

• We have to loop over all the object to replace the fields on the native side.
• When getting a document, we have to call a JS method to convert the native data back to the timestamps

What do you think of this approach.

[robingenz]

@mamillastre I already had the same idea. Unfortunately, I haven't come up with a better solution yet.

When getting a document, we have to call a JS method to convert the native data back to the timestamps

However, it would be important to me that this step does not have to be carried out manually by the user, but that the plugin takes care of it. For this purpose, I would wrap all plugin calls on the web layer so that the data can be processed before and after the plugin call to the native layer. I also use a web layer like this for the Capacitor Bluetooth Low Energy plugin, for example, and it works very well.

This is how it works:

index.ts:

import { registerPlugin } from '@capacitor/core';

import { BluetoothLowEnergyClient } from './client';
import type { BluetoothLowEnergyPlugin } from './definitions';

const BluetoothLowEnergy = new BluetoothLowEnergyClient(
  registerPlugin<BluetoothLowEnergyPlugin>('BluetoothLowEnergy', {
    web: () => import('./web').then(m => new m.BluetoothLowEnergyWeb()),
  }),
) as any as BluetoothLowEnergyPlugin;

export * from './definitions';
export { BluetoothLowEnergy };

client.ts:

export class BluetoothLowEnergyClient implements BluetoothLowEnergyPlugin {
  private readonly plugin: BluetoothLowEnergyPlugin;

  constructor(plugin: BluetoothLowEnergyPlugin) {
    this.plugin = plugin;
  }

  public async connect(options: ConnectOptions): Promise<void> {
    // Do your thing
    this.plugin.connect(options);
  }
}

Feel free to create a PR. Let me know if you have any questions.