Upload Files from the Canvas app to SharePoint document library.

There are two main ways to achieve document upload functionality in canvas apps for SharePoint libraries:

1. Using Power Automate:

This method is ideal if you’re comfortable with a low-code approach. Here’s a breakdown:

Canvas App Setup:

1. Design the App: Create a canvas app with a user interface for selecting files. Insert an Attachments control where users can browse and select documents for upload.
2. Connect to SharePoint: Establish a connection to your SharePoint site within the Power Apps studio.
3. Button Action: Add a button to trigger the upload process. Set the button’s OnSelect property to a formula that initiates a Power Automate flow. Here’s an example formula:

Navigate(UploadFlowScreen, { attachments: AttachmentsControl.Value })

This formula navigates to a separate screen (UploadFlowScreen) and passes the selected attachments from the Attachments control to the flow.

Power Automate Flow Creation:

1. Create a Flow: In Power Automate, design a new flow triggered by a Power Apps action. Choose “Power Apps” as the trigger and select your canvas app from the list.
2. Get Attachments: Within the flow, use the “Get attachments from Power Apps” action to retrieve the selected files passed from your app.
3. Create File Action: Utilize the “Create file” SharePoint action. Configure the action with these key settings:
   • Site Address: Enter the URL of your SharePoint site.
   • Document Library: Select the specific SharePoint document library where you want to upload the files.
   • File Content: Set this to the output of the “Get attachments from Power Apps” action. This ensures the flow uses the selected file for upload.
   • File Name: Define how you want to name the uploaded file. You can use dynamic content from Power Apps (e.g., attachment name) or create a custom naming structure.

2. Using Microsoft Graph API:

This method offers more control but requires coding knowledge. Here’s a step-by-step approach:

Canvas App Setup:

1. Insert Controls: Design your app with a button to trigger the upload and an optional label to display upload status.
2. Connect to Data Source: No direct connection to SharePoint is needed in this approach.
3. Button OnSelect Formula: Create a formula for the button’s OnSelect property that utilizes the Patch function and Graph API. Here’s a code snippet (replace placeholders with your details):

Patch(
  'https://graph.microsoft.com/v1.0/sites/<your_site_id>/drives/<your_drive_id>/root:/<document_library_name>/<file_name>:/content',
  Binary(AttachmentsControl.Value.First().Value),
  { '@odata.contenttype': "application/pdf" } // Replace with appropriate content type for your file
)

Explanation of the Formula:

• It uses the Patch function to send an HTTP request to the Microsoft Graph API endpoint.
• The endpoint URL is constructed with your SharePoint site ID, drive ID, document library name, and desired filename.
• The Binary function converts the selected attachment (AttachmentsControl.Value.First().Value) into a binary format suitable for upload.
• The @odata.contenttype property specifies the type of file being uploaded (replace with the appropriate content type for your specific file).

Additional Considerations:

• Error Handling: Implement error handling mechanisms in both Power Automate and Graph API approaches to gracefully handle upload failures and provide informative messages to users.
• Security: Ensure proper authentication and authorization for accessing SharePoint data using Power Apps or Graph API. Refer to Microsoft documentation for secure practices.