In this tutorial we will show you how to modify the PhotoAttachmentQueue for PDF attachments.
PhotoAttachmentQueue
class which
enables photo attachments (specifically a jpeg
) to be synced. This tutorial will guide you on the changes needed to support PDF attachments.
An overview of the required changes are:
pdf_id
column to the todos table to link a pdf to a to-do item.PdfAttachmentQueue
classPdfAttachmentQueue
classStep 1: Update app schema
Step 2: Create the `PdfAttachmentQueue` class
PdfAttachmentQueue
class below updates the existing PhotoAttachmentQueue
found in the demo app. The highlighted lines indicate which lines have been updated. For more information on attachments, see the attachments package.Step 3: Initialize the `PdfAttachmentQueue` class
PdfAttachmentQueue
and adding an attachmentPdfQueue
class variable.attachmentPdfQueue
can then be initialized in the constructor, where a new instance of PdfAttachmentQueue is created and assigned to attachmentPdfQueue
if the supabaseBucket
is configured.init
method to include the initialization of the attachmentPdfQueue
.system.ts
file can be found below with highlighted lines indicating the changes made above.attachmentPdfQueue
can now be used in a component by using the useSystem
hook created in step-3 above
The code snippet below illustrates how a pdf could be saved when pressing a button. It uses a DocumentPicker UI component
to allow the user to select a pdf. When the button is pressed, savePdf
is called.
The saveAttachment
method in the PdfAttachmentQueue
class expects a base64 encoded string. We can therefore use
react-native-fs to read the file and return the base64 encoded string which is passed to saveAttachment
.
pdf_id
column, the approach you should take strongly depends on your requirements.
An alternative approach could be to replace the photo_id
with an attachment_id
and have one AttachmentQueue
class that handles all attachment types instead of having a class per attachment type.